Balancer/309/login

frontend/src/api/apiClient.ts

@@ -31,7 +31,7 @@ const handleSubmitFeedback = async (
   message: FormValues["message"],
 ) => {
   try {
-    const response = await api.post(`/v1/api/feedback/`, {
+    const response = await publicApi.post(`/v1/api/feedback/`, {
       feedbacktype: feedbackType,
       name,
       email,
@@ -49,10 +49,8 @@ const handleSendDrugSummary = async (
   guid: string,
 ) => {
   try {
-    const endpoint = guid
-      ? `/v1/api/embeddings/ask_embeddings?guid=${guid}`
-      : "/v1/api/embeddings/ask_embeddings";
-    const response = await api.post(endpoint, {
+    const endpoint = guid ? `/v1/api/embeddings/ask_embeddings?guid=${guid}` : '/v1/api/embeddings/ask_embeddings';
+    const response = await adminApi.post(endpoint, {
       message,
     });
     console.log("Response data:", JSON.stringify(response.data, null, 2));
@@ -65,9 +63,7 @@ const handleSendDrugSummary = async (
 
 const handleRuleExtraction = async (guid: string) => {
   try {
-    const response = await api.get(
-      `/v1/api/rule_extraction_openai?guid=${guid}`,
-    );
+    const response = await adminApi.get(`/v1/api/rule_extraction_openai?guid=${guid}`);
     // console.log("Rule extraction response:", JSON.stringify(response.data, null, 2));
     return response.data;
   } catch (error) {
@@ -81,7 +77,7 @@ const fetchRiskDataWithSources = async (
   source: "include" | "diagnosis" | "diagnosis_depressed" = "include",
 ) => {
   try {
-    const response = await api.post(`/v1/api/riskWithSources`, {
+    const response = await publicApi.post(`/v1/api/riskWithSources`, {
       drug: medication,
       source: source,
     });
@@ -210,7 +206,7 @@ const handleSendDrugSummaryStreamLegacy = async (
 
 const fetchConversations = async (): Promise<Conversation[]> => {
   try {
-    const response = await api.get(`/chatgpt/conversations/`);
+    const response = await publicApi.get(`/chatgpt/conversations/`);
     return response.data;
   } catch (error) {
     console.error("Error(s) during getConversations: ", error);
@@ -220,7 +216,7 @@ const fetchConversations = async (): Promise<Conversation[]> => {
 
 const fetchConversation = async (id: string): Promise<Conversation> => {
   try {
-    const response = await api.get(`/chatgpt/conversations/${id}/`);
+    const response = await publicApi.get(`/chatgpt/conversations/${id}/`);
     return response.data;
   } catch (error) {
     console.error("Error(s) during getConversation: ", error);
@@ -230,7 +226,7 @@ const fetchConversation = async (id: string): Promise<Conversation> => {
 
 const newConversation = async (): Promise<Conversation> => {
   try {
-    const response = await api.post(`/chatgpt/conversations/`, {
+    const response = await adminApi.post(`/chatgpt/conversations/`, {
       messages: [],
     });
     return response.data;
@@ -246,7 +242,7 @@ const continueConversation = async (
   page_context?: string,
 ): Promise<{ response: string; title: Conversation["title"] }> => {
   try {
-    const response = await api.post(
+    const response = await adminApi.post(
       `/chatgpt/conversations/${id}/continue_conversation/`,
       {
         message,
@@ -262,7 +258,7 @@ const continueConversation = async (
 
 const deleteConversation = async (id: string) => {
   try {
-    const response = await api.delete(`/chatgpt/conversations/${id}/`);
+    const response = await adminApi.delete(`/chatgpt/conversations/${id}/`);
     return response.data;
   } catch (error) {
     console.error("Error(s) during deleteConversation: ", error);
@@ -277,12 +273,9 @@ const updateConversationTitle = async (
   { status: string; title: Conversation["title"] } | { error: string }
 > => {
   try {
-    const response = await api.patch(
-      `/chatgpt/conversations/${id}/update_title/`,
-      {
-        title: newTitle,
-      },
-    );
+    const response = await adminApi.patch(`/chatgpt/conversations/${id}/update_title/`, {
+      title: newTitle,
+    });
     return response.data;
   } catch (error) {
     console.error("Error(s) during getConversation: ", error);

frontend/src/components/Header/FeatureMenuDropDown.tsx

@@ -4,13 +4,13 @@ export const FeatureMenuDropDown = () => {
   const location = useLocation();
   const currentPath = location.pathname;
   return (
-    <div className="h-50 absolute top-full mb-2 mt-2 flex  flex-row items-center rounded-lg border-2 bg-white font-inter text-sm sm:px-6 md:px-8 lg:px-8 xl:px-6 ">
-      <div className="mx-3 my-5 ">
+    <div className="h-50 absolute top-full mb-2 mt-2 flex flex-row items-center rounded-lg border-2 bg-white font-satoshi text-sm">
+      <div className="">
         <Link to="/AdminPortal">
           <ul className={currentPath === "/AdminPortal" ? "subheader-nav-item subheader-nav-item-selected" : "subheader-nav-item"}>
             <span className="font-bold">Manage files</span>
 
-            <div className="mt-1 font-satoshi text-sm text-gray-400">
+            <div className="font-normal mt-1 text-gray-600">
               Manage and chat with files
             </div>
           </ul>
@@ -19,7 +19,7 @@ export const FeatureMenuDropDown = () => {
           <ul className={currentPath === "/rulesmanager" ? "subheader-nav-item subheader-nav-item-selected" : "subheader-nav-item"}>
             <span className="font-bold">Manage rules</span>
 
-            <div className="mt-1 font-satoshi text-sm text-gray-400">
+            <div className="font-normal mt-1 text-gray-600">
               Manage list of rules
             </div>
           </ul>
@@ -28,7 +28,7 @@ export const FeatureMenuDropDown = () => {
           <ul className={currentPath === "/ManageMeds" ? "subheader-nav-item subheader-nav-item-selected" : "subheader-nav-item"}>
             <span className="font-bold">Manage meds</span>
 
-            <div className="mt-1 font-satoshi text-sm text-gray-400">
+            <div className="font-normal mt-1 text-gray-600">
               Manage list of meds
             </div>
           </ul>

frontend/src/components/Header/Header.tsx

@@ -1,16 +1,12 @@
-import { useState, useRef, useEffect, Fragment } from "react";
-// import { useState, Fragment } from "react";
-import accountLogo from "../../assets/account.svg";
+import { useState, useRef, useEffect } from "react";
 import { Link, useNavigate, useLocation } from "react-router-dom";
-import LoginMenuDropDown from "./LoginMenuDropDown";
 import "../../components/Header/header.css";
 import Chat from "./Chat";
 import { FeatureMenuDropDown } from "./FeatureMenuDropDown";
 import MdNavBar from "./MdNavBar";
-import { connect, useDispatch } from "react-redux";
+import { connect } from "react-redux";
 import { RootState } from "../../services/actions/types";
-import { logout, AppDispatch } from "../../services/actions/auth";
-import { HiChevronDown } from "react-icons/hi";
+import { FaChevronDown, FaSignOutAlt } from "react-icons/fa";
 import { useGlobalContext } from "../../contexts/GlobalContext.tsx";
 
 interface LoginFormProps {
@@ -24,44 +20,16 @@ const Header: React.FC<LoginFormProps> = ({ isAuthenticated, isSuperuser }) => {
   const dropdownRef = useRef(null);
   let delayTimeout: number | null = null;
   const [showChat, setShowChat] = useState(false);
-  const [showLoginMenu, setShowLoginMenu] = useState(false);
-  const [redirect, setRedirect] = useState(false);
   const { setShowSummary, setEnterNewPatient, triggerFormReset, setIsEditing } =
     useGlobalContext();
 
-  const dispatch = useDispatch<AppDispatch>();
-
-  const logout_user = () => {
-    dispatch(logout());
-    setRedirect(false);
-  };
-
-  const guestLinks = () => (
-    <nav onClick={handleLoginMenu} className="flex cursor-pointer items-center">
-      <img
-        src={accountLogo}
-        alt="logo"
-        className="mr-5 h-5  object-contain lg:h-4 "
-      />
-      <span className=" text-black hover:border-b-2 hover:border-blue-600 hover:text-black hover:no-underline lg:text-sm xl:text-lg">
-        Sign in
-      </span>
-    </nav>
-  );
-
   const authLinks = () => (
-    <nav onClick={logout_user} className="flex cursor-pointer items-center">
-      <img src={accountLogo} alt="logo" className="mr-5 h-5  object-contain " />
-      <span className=" text-black hover:border-b-2 hover:border-blue-600 hover:text-black hover:no-underline lg:text-sm xl:text-lg">
-        Sign out
-      </span>
-    </nav>
+    <Link to="/logout" className="font-satoshi flex cursor-pointer items-center text-black hover:text-blue-600">
+        Sign Out
+        <FaSignOutAlt className="ml-2 inline-block" />
+    </Link>
   );
 
-  const handleLoginMenu = () => {
-    setShowLoginMenu(!showLoginMenu);
-  };
-
   const handleMouseEnter = () => {
     if (delayTimeout !== null) {
       clearTimeout(delayTimeout);
@@ -126,7 +94,7 @@ const Header: React.FC<LoginFormProps> = ({ isAuthenticated, isSuperuser }) => {
             Balancer
           </span>
         </Link>
-        <nav className=" flex space-x-2 font-satoshi lg:space-x-3 xl:gap-3 xl:font-bold ">
+        <nav className="flex space-x-2 font-satoshi lg:space-x-3 xl:gap-3 xl:font-bold ">
           <Link
             to="/"
             onClick={() => handleForm()}
@@ -186,7 +154,7 @@ const Header: React.FC<LoginFormProps> = ({ isAuthenticated, isSuperuser }) => {
             >
               Donate
             </a>
-            {isSuperuser && (
+            {(isAuthenticated && isSuperuser) && (
               <div
                 onMouseEnter={handleMouseEnter}
                 onMouseLeave={handleMouseLeave}
@@ -210,25 +178,20 @@ const Header: React.FC<LoginFormProps> = ({ isAuthenticated, isSuperuser }) => {
                         : "absolute ml-1.5 "
                     }`}
                   >
-                    <HiChevronDown className="inline-block" />
+                    <FaChevronDown className="inline-block" />
                   </span>
                 </span>
                 {showFeaturesMenu && <FeatureMenuDropDown />}
               </div>
             )}
-
-            {redirect ? navigate("/") : <Fragment></Fragment>}
           </>
         </nav>
-        <LoginMenuDropDown
-          showLoginMenu={showLoginMenu}
-          handleLoginMenu={handleLoginMenu}
-        />
         {isAuthenticated && (
-          <Chat showChat={showChat} setShowChat={setShowChat} />
+          <>
+            <Chat showChat={showChat} setShowChat={setShowChat} />
+          </>
         )}
-        {/* <Chat showChat={showChat} setShowChat={setShowChat} /> */}
-        {isAuthenticated ? authLinks() : guestLinks()}
+        {isAuthenticated && authLinks()}
       </div>
       <MdNavBar handleForm={handleForm} isAuthenticated={isAuthenticated} />
     </header>

frontend/src/components/Header/MdNavBar.tsx

@@ -5,8 +5,6 @@ import Chat from "./Chat";
 // import logo from "../../assets/balancer.png";
 import closeLogo from "../../assets/close.svg";
 import hamburgerLogo from "../../assets/hamburger.svg";
-import {useDispatch} from "react-redux";
-import {logout, AppDispatch} from "../../services/actions/auth";
 
 interface LoginFormProps {
     isAuthenticated: boolean;
@@ -22,13 +20,6 @@ const MdNavBar = (props: LoginFormProps) => {
         setNav(!nav);
     };
 
-    const dispatch = useDispatch<AppDispatch>();
-
-    const logout_user = () => {
-        dispatch(logout());
-    };
-
-
     return (
         <div
             className={
@@ -131,20 +122,19 @@ const MdNavBar = (props: LoginFormProps) => {
                     <li className="border-b border-gray-300 p-4">
                         <a href="https://www.flipcause.com/secure/cause_pdetails/MjMyMTIw"
                           target="_blank"
-                          className="text-black hover:border-blue-600 hover:text-blue-600 hover:no-underline"
+                          className="mr-9 text-black hover:border-b-2 hover:border-blue-600 hover:text-black hover:no-underline"
                         >
                           Donate
                         </a>
                     </li>
                     {isAuthenticated &&
-                        <li className="border-b border-gray-300 p-4">
-                            <a
-                                onClick={logout_user}
-                                className="mr-9 text-black hover:border-b-2 hover:border-blue-600 hover:text-black hover:no-underline"
-                            >
-                                Sign Out
-                            </a>
-                        </li>
+                      <li className="border-b border-gray-300 p-4">
+                        <Link
+                              to="/logout"
+                              className="mr-9 text-black hover:border-b-2 hover:border-blue-600 hover:text-black hover:no-underline"
+                          >Sign Out
+                        </Link>
+                      </li>
                     }
                 </ul>
             </div>