feat: implement session_jwt and enhance auth

frontend/src/modals/JWTModal.tsx

@@ -3,30 +3,23 @@ import { useDispatch } from 'react-redux';
 
 import Input from '../components/Input';
 import { ActiveState } from '../models/misc';
-import { setToken } from '../preferences/preferenceSlice';
 import WrapperModal from './WrapperModal';
 
 type JWTModalProps = {
   modalState: ActiveState;
-  setModalState: (state: ActiveState) => void;
+  handleTokenSubmit: (enteredToken: string) => void;
 };
 
-export default function JWTModal({ modalState, setModalState }: JWTModalProps) {
-  const dispatch = useDispatch();
+export default function JWTModal({
+  modalState,
+  handleTokenSubmit,
+}: JWTModalProps) {
   const [jwtToken, setJwtToken] = useState<string>('');
 
-  const handleSaveToken = () => {
-    if (jwtToken) {
-      localStorage.setItem('authToken', jwtToken);
-      dispatch(setToken(jwtToken));
-      setModalState('INACTIVE');
-    }
-  };
-
   if (modalState !== 'ACTIVE') return null;
 
   return (
-    <WrapperModal close={() => setModalState('INACTIVE')} className="p-4">
+    <WrapperModal className="p-4" isPerformingTask={true} close={() => {}}>
       <div className="mb-6">
         <span className="text-lg text-jet dark:text-bright-gray">
           Add JWT Token
@@ -44,7 +37,7 @@ export default function JWTModal({ modalState, setModalState }: JWTModalProps) {
       </div>
       <button
         disabled={jwtToken.length === 0}
-        onClick={handleSaveToken}
+        onClick={handleTokenSubmit.bind(null, jwtToken)}
         className="float-right mt-4 rounded-full bg-purple-30 px-5 py-2 text-sm text-white hover:bg-[#6F3FD1] disabled:opacity-50"
       >
         Save Token