Fontend supertokens, authprovider.

frontend/src/App.tsx

@@ -1,6 +1,19 @@
 import type { Component } from "solid-js";
 import AppRouter from "./routes";
 
+import SuperTokens from "supertokens-web-js";
+import EmailPass from "supertokens-web-js/recipe/emailpassword";
+import Session from "supertokens-web-js/recipe/session";
+
+SuperTokens.init({
+  appInfo: {
+    apiDomain: "http://localhost:3300",
+    apiBasePath: "/auth/api",
+    appName: "Fluxem",
+  },
+  recipeList: [EmailPass.init(), Session.init()],
+});
+
 const App: Component = () => {
   return <AppRouter />;
 };

frontend/src/context/AuthContext.tsx

@@ -0,0 +1,22 @@
+import { useLocation, useNavigate } from "@solidjs/router";
+import { createContext } from "solid-js";
+import { createStore } from "solid-js/store";
+
+const AuthStateContext = createContext();
+const AuthDispatchContext = createContext();
+
+const initialState = {
+  isAuthenticated: false,
+  isLoading: true,
+  currentUser: null,
+  currentAccount: null,
+};
+
+const AuthProvider = (props: any) => {
+  const [store, setStore] = createStore(initialState);
+  const navigate = useNavigate();
+  const location = useLocation();
+
+};
+
+export default AuthProvider;

frontend/src/hooks/auth/login.hook.ts

@@ -1,19 +1,33 @@
 import { createSignal } from "solid-js";
 import { createStore } from "solid-js/store";
 
+import EmailPassRecipe from "supertokens-web-js/recipe/emailpassword";
+
 const useLogin = () => {
   const [loading, setLoading] = createSignal(false);
   const [form, setForm] = createStore({
-    username: "",
+    email: "",
     password: "",
   });
   const handleInput = (ev: any) => {
     setForm([ev.currentTarget.name], ev.currentTarget.value);
   };
-  const handleLogin = (ev: any) => {
+  const handleLogin = async (ev: any) => {
     ev.preventDefault();
     setLoading(true);
-    
+    try {
+      const login = await EmailPassRecipe.signIn({
+        formFields: [
+          { id: "email", value: form.email },
+          { id: "password", value: form.password },
+        ],
+      });
+      console.log(login);
+    } catch (error) {
+      console.error(error);
+    } finally {
+      setLoading(false);
+    }
   };
 
   return { handleInput, loading, handleLogin, form };

frontend/src/hooks/auth/register.hook.ts

@@ -0,0 +1,34 @@
+import { createSignal } from "solid-js";
+import { createStore } from "solid-js/store";
+import EmailPassRecipe from "supertokens-web-js/recipe/emailpassword";
+
+const useRegister = () => {
+  const [loading, setLoading] = createSignal(false);
+  const [form, setForm] = createStore({
+    email: "",
+    password: "",
+  });
+  const handleInput = (ev: any) => {
+    setForm([ev.currentTarget.name], ev.currentTarget.value);
+  };
+
+  const handleRegister = async (ev: any) => {
+    ev.preventDefault();
+    setLoading(true);
+    try {
+      const login = await EmailPassRecipe.signUp({
+        formFields: [
+          { id: "email", value: form.email },
+          { id: "password", value: form.password },
+        ],
+      });
+    } catch (error) {
+      console.error(error);
+    } finally {
+      setLoading(false);
+    }
+  };
+  return { handleInput, loading, handleRegister, form };
+};
+
+export default useRegister;

frontend/src/routes/views/auth/Login.tsx

@@ -9,9 +9,9 @@ const Login: Component = () => {
           {/* <label for="name">Username or Email</label> */}
           <input
             type="text"
-            name="username"
+            name="email"
             placeholder="Email/Username"
-            value={form.username}
+            value={form.email}
             onInput={handleInput}
           />
         </div>