diff --git a/src/components/AuthComponents/Login.js b/src/components/AuthComponents/Login.js index 65c1f1c..8287da6 100644 --- a/src/components/AuthComponents/Login.js +++ b/src/components/AuthComponents/Login.js @@ -1,9 +1,11 @@ import React, { useState } from 'react'; -import { useNavigate} from 'react-router-dom'; +import { Navigate, Link, useNavigate } from 'react-router-dom'; import { doSignInWithEmailAndPassword, doSignInWithGoogle } from '../../firebase/auth'; - +import { useAuth } from '../../contexts/authContext'; +import { getApiUrl } from '../pages/createsteps helpers/CreateStepsUtils'; const Login = () => { + const { userLoggedIn } = useAuth(); const [email, setEmail] = useState(''); const [password, setPassword] = useState(''); const [isSigningIn, setIsSigningIn] = useState(false); @@ -44,21 +46,32 @@ const Login = () => { is_creator: true }; - const backendApiUrl = 'http://localhost:8000/users/' - - const response = await fetch(backendApiUrl, { - method: 'POST', - headers: { - 'Content-Type': 'application/json', - }, - body: JSON.stringify(backendUserData), - }); - - const responseData = await response.json(); - if (!response.ok && response.status !== 400) { - throw new Error(responseData.detail || "Failed to sync user with backend."); + // If the user is created successfully, we also need to create a user profile in our backend + if (result.user) { + try { + const response = await fetch(`${getApiUrl()}/users/`, { + method: 'POST', + headers: { + 'Content-Type': 'application/json', + }, + body: JSON.stringify(backendUserData), + }); + + const responseData = await response.json(); + if (!response.ok && response.status !== 400) { + throw new Error(responseData.detail || "Failed to sync user with backend."); + } + navigate('/home'); // Redirect to home after successful sign-in + } catch (error) { + setErrorMessage(handleFirebaseError(error)); + setIsSigningIn(false); + } finally { + setIsSigningIn(false); + setIsSyncing(false); // End sync process, allowing navigation to proceed if user is logged in + } + } else { + throw new Error("Could not get user details from Google Sign-In."); } - navigate('/home'); // Redirect to home after successful sign-in } else { throw new Error("Could not get user details from Google Sign-In."); } @@ -88,42 +101,49 @@ const Login = () => { return (
+ {userLoggedIn && ()} +
-
+

Welcome Back

-
+
- + { setEmail(e.target.value) }} - className="w-full mt-2 px-3 py-2 text-gray-500 bg-transparent outline-none border focus:border-indigo-600 shadow-sm rounded-lg transition duration-300" + className="w-full mt-2 px-3 py-2 text-gray-500 bg-transparent outline-none border focus:border-indigo-600 shadow-sm rounded-lg" />
- + { setPassword(e.target.value) }} - className="w-full mt-2 px-3 py-2 text-gray-500 bg-transparent outline-none border focus:border-indigo-600 shadow-sm rounded-lg transition duration-300" + className="w-full mt-2 px-3 py-2 text-gray-500 bg-transparent outline-none border focus:border-indigo-600 shadow-sm rounded-lg" />
{errorMessage && ( -
- {errorMessage} -
+ {errorMessage} )}
- {/*

Don't have an account? Sign up

*/} +

Don't have an account? Sign up

OR
@@ -142,14 +162,14 @@ const Login = () => {
@@ -165,4 +185,4 @@ const Login = () => { ) } -export default Login; \ No newline at end of file +export default Login \ No newline at end of file diff --git a/src/components/AuthComponents/Register.js b/src/components/AuthComponents/Register.js index ae7e47f..3ec3d06 100644 --- a/src/components/AuthComponents/Register.js +++ b/src/components/AuthComponents/Register.js @@ -1,10 +1,11 @@ import React, { useState } from 'react'; import { Navigate, Link} from 'react-router-dom'; import { useAuth } from '../../contexts/authContext'; -import { doCreateUserWithEmailAndPassword } from '../../firebase/auth'; +import { doCreateUserWithEmailAndPassword, doSignInWithGoogle } from '../../firebase/auth'; +import { getApiUrl } from '../pages/createsteps helpers/CreateStepsUtils'; const Register = () => { - const { userLoggedIn } = useAuth(); + const { userLoggedIn, currentUser } = useAuth(); const [email, setEmail] = useState(''); const [password, setPassword] = useState(''); @@ -49,7 +50,6 @@ const Register = () => { console.log('Sending user data to backend:', backendUserData); // Use consistent API URL helper - const getApiUrl = () => process.env.REACT_APP_API_URL || 'http://localhost:8000'; const backendApiUrl = `${getApiUrl()}/users/`; const response = await fetch(backendApiUrl, { diff --git a/src/components/Layout/Sidebar.js b/src/components/Layout/Sidebar.js index 839aef2..60ef3e6 100644 --- a/src/components/Layout/Sidebar.js +++ b/src/components/Layout/Sidebar.js @@ -4,6 +4,7 @@ import { useAuth } from '../../contexts/authContext'; import { doSignOut } from '../../firebase/auth'; import { AiOutlineMenu, AiOutlineLogout, AiFillTool, AiOutlineVideoCamera as AiOutlineVideo, AiOutlineEye, AiOutlineArrowLeft, AiOutlineCheck, AiOutlineUser, AiOutlineDatabase, AiOutlineFolder, AiOutlineBarChart } from 'react-icons/ai'; import logo from '../../assets/trvise_logo.png'; +import { getApiUrl } from '../pages/createsteps helpers/CreateStepsUtils'; // Chrome detection const isChrome = typeof window !== 'undefined' && /Chrome/.test(navigator.userAgent) && /Google Inc/.test(navigator.vendor); @@ -51,7 +52,8 @@ const Sidebar = ({ isCollapsed, toggleSidebar, animateLogo }) => { if (!currentUser?.uid) return; try { - const response = await fetch(`${process.env.REACT_APP_API_URL || 'http://localhost:8000'}/users/${currentUser.uid}`); + const apiUrl = getApiUrl(); + const response = await fetch(`${apiUrl}/users/${currentUser.uid}`); if (response.ok) { const data = await response.json(); setProfileData(data); diff --git a/src/components/authoring/MaterialsAndFilesTab.js b/src/components/authoring/MaterialsAndFilesTab.js index cc10fc5..69a6838 100644 --- a/src/components/authoring/MaterialsAndFilesTab.js +++ b/src/components/authoring/MaterialsAndFilesTab.js @@ -1,17 +1,15 @@ -import React, { useState, useEffect, useCallback } from 'react'; +import React, { useState, useEffect, useCallback, useMemo } from 'react'; import { useAuth } from '../../contexts/authContext'; import { storage } from '../../firebase/firebase'; // Fixed import path import { ref, uploadBytes } from 'firebase/storage'; // Added import for Firebase storage functions import { COMPONENTS, TYPOGRAPHY, LAYOUT, getListItemBorder } from './shared/styles'; import { AiOutlineSearch, AiOutlinePlus } from 'react-icons/ai'; +import { getApiUrl } from '../pages/createsteps helpers/CreateStepsUtils'; -// Import the getApiUrl function to match the existing codebase pattern -const getApiUrl = () => { - return process.env.REACT_APP_API_URL || 'http://localhost:8000'; -}; +// No local getApiUrl function -const MaterialsAndToolsTab = ({ +const MaterialsAndFilesTab = ({ // Tools props currentStepTools, currentStepToolName, @@ -1203,4 +1201,4 @@ const MaterialsAndToolsTab = ({ ); }; -export default MaterialsAndToolsTab; \ No newline at end of file +export default MaterialsAndFilesTab; \ No newline at end of file diff --git a/src/components/authoring/RepositoryPanel.js b/src/components/authoring/RepositoryPanel.js index 7535845..de978fa 100644 --- a/src/components/authoring/RepositoryPanel.js +++ b/src/components/authoring/RepositoryPanel.js @@ -1,13 +1,10 @@ import React, { useState, useEffect, useCallback } from 'react'; import { useAuth } from '../../contexts/authContext'; import { AiOutlinePlus, AiOutlineSearch, AiOutlineEdit, AiOutlineDelete, AiOutlineClose, AiOutlineUpload } from 'react-icons/ai'; -import { uploadFileToFirebase } from '../pages/createsteps helpers/CreateStepsUtils'; +import { uploadFileToFirebase, getApiUrl } from '../pages/createsteps helpers/CreateStepsUtils'; import { repositoryStyles } from '../pages/Repository.styles'; -// Import the getApiUrl function to match the existing codebase pattern -const getApiUrl = () => { - return process.env.REACT_APP_API_URL || 'http://localhost:8000'; -}; +// No local getApiUrl function const RepositoryPanel = ({ contextType = 'main', onAddToStep, onAddToBuyList }) => { const { currentUser } = useAuth(); diff --git a/src/components/authoring/RepositoryTab.js b/src/components/authoring/RepositoryTab.js index e7be7fa..7939aee 100644 --- a/src/components/authoring/RepositoryTab.js +++ b/src/components/authoring/RepositoryTab.js @@ -1,11 +1,8 @@ import React, { useState, useEffect, useCallback } from 'react'; import { useAuth } from '../../contexts/authContext'; import { AiOutlinePlus, AiOutlineSearch, AiOutlineClose } from 'react-icons/ai'; +import { getApiUrl } from '../pages/createsteps helpers/CreateStepsUtils.js'; -// Import the getApiUrl function to match the existing codebase pattern -const getApiUrl = () => { - return process.env.REACT_APP_API_URL || 'http://localhost:8000'; -}; const RepositoryTab = () => { const { currentUser } = useAuth(); diff --git a/src/components/pages/MyProjects.js b/src/components/pages/MyProjects.js index a401a29..fcf3244 100644 --- a/src/components/pages/MyProjects.js +++ b/src/components/pages/MyProjects.js @@ -1,7 +1,7 @@ import React, { useState, useEffect, useCallback } from 'react'; import { useAuth } from '../../contexts/authContext'; import { useNavigate, useLocation } from 'react-router-dom'; -import { isImageUrl, isVideoUrl, formatDate, createApiCall } from './createsteps helpers/CreateStepsUtils'; +import { isImageUrl, isVideoUrl, formatDate, createApiCall, getApiUrl } from './createsteps helpers/CreateStepsUtils'; import { LazyImage, VideoThumbnail } from './createsteps helpers/CommonComponents'; const responsiveGridCSS = ` diff --git a/src/components/pages/createsteps helpers/CreateStepsUtils.js b/src/components/pages/createsteps helpers/CreateStepsUtils.js index 7af690f..9a8358c 100644 --- a/src/components/pages/createsteps helpers/CreateStepsUtils.js +++ b/src/components/pages/createsteps helpers/CreateStepsUtils.js @@ -31,7 +31,8 @@ export const formatDate = (dateString) => { // API utility functions export const getApiUrl = () => { - return process.env.REACT_APP_API_URL || 'http://localhost:8000'; + // Always return the production URL, ignoring any local environment variables. + return 'https://pbsggxqwqp.us-east-1.awsapprunner.com'; }; export const createApiCall = async (endpoint, options = {}) => {