From 713ce3e17f007b029d340c3913bc340e8c2ff3ed Mon Sep 17 00:00:00 2001 From: Subrata Mondal Date: Mon, 18 Mar 2024 16:34:10 +0530 Subject: [PATCH] Cleaned up the Entry Module: main.jsx --- frontend/react-app/index.html | 3 +- frontend/react-app/src/App.jsx | 5 +- .../react-app/src/components/DynamicList.jsx | 4 +- frontend/react-app/src/components/Login.css | 2 +- .../react-app/src/components/LoginPage.jsx | 186 +++++++++--------- .../react-app/src/components/LogoutButton.jsx | 16 -- .../react-app/src/components/RequireAuth.jsx | 25 --- .../react-app/src/components/TestRegister.jsx | 64 ------ frontend/react-app/src/components/Users.jsx | 53 ----- .../react-app/src/context/AuthProvider.jsx | 2 +- .../react-app/src/dashboard/DashBoard.jsx | 24 --- frontend/react-app/src/hooks/useAuth.jsx | 2 +- frontend/react-app/src/main.jsx | 56 ++---- frontend/react-app/src/pages/Form.jsx | 28 --- frontend/react-app/src/pages/Login.jsx | 30 +-- frontend/react-app/src/pages/LoginSignup.jsx | 134 ------------- frontend/react-app/src/routes/index.jsx | 27 ++- src/logics/arxiv_recommender.py | 15 +- src/utils/__init__.py | 0 src/utils/convert_pkl_to_json.py | 7 + 20 files changed, 158 insertions(+), 525 deletions(-) delete mode 100644 frontend/react-app/src/components/LogoutButton.jsx delete mode 100644 frontend/react-app/src/components/RequireAuth.jsx delete mode 100644 frontend/react-app/src/components/TestRegister.jsx delete mode 100644 frontend/react-app/src/components/Users.jsx delete mode 100644 frontend/react-app/src/dashboard/DashBoard.jsx delete mode 100644 frontend/react-app/src/pages/Form.jsx delete mode 100644 frontend/react-app/src/pages/LoginSignup.jsx create mode 100644 src/utils/__init__.py create mode 100644 src/utils/convert_pkl_to_json.py diff --git a/frontend/react-app/index.html b/frontend/react-app/index.html index 0c589ec..e292a02 100644 --- a/frontend/react-app/index.html +++ b/frontend/react-app/index.html @@ -7,7 +7,8 @@ Vite + React -
+
+
diff --git a/frontend/react-app/src/App.jsx b/frontend/react-app/src/App.jsx index fcb063c..f63857a 100644 --- a/frontend/react-app/src/App.jsx +++ b/frontend/react-app/src/App.jsx @@ -2,16 +2,17 @@ import Header from "./components/Header"; import Main from "./components/DynamicList"; import SearchBar from "./components/SearchBar"; import useRedirectToLogin from "./components/RedirectToLogin"; +import { useEffect } from "react" function App() { - useRedirectToLogin(); + useRedirectToLogin() return (
- ); + ) } export default App; \ No newline at end of file diff --git a/frontend/react-app/src/components/DynamicList.jsx b/frontend/react-app/src/components/DynamicList.jsx index 71fa4cd..b98f52e 100644 --- a/frontend/react-app/src/components/DynamicList.jsx +++ b/frontend/react-app/src/components/DynamicList.jsx @@ -12,13 +12,13 @@ function Main() { try { const { data } = await axios.get("http://127.0.0.1:8000/recommend", { params: { - query: "LLM, Attention, GPT", + query: "LLM Attention GPT", }, headers: { Accept: "application/json", Authorization: `Bearer ${localStorage.getItem("appToken")}`, }, - }); + }) console.log(data); setArxivData(data); } catch (error) { diff --git a/frontend/react-app/src/components/Login.css b/frontend/react-app/src/components/Login.css index 7009adb..6a4e10d 100644 --- a/frontend/react-app/src/components/Login.css +++ b/frontend/react-app/src/components/Login.css @@ -16,7 +16,7 @@ body { min-height: 100vh; background-color: dodgerblue; } */ - + .App { display: flex; flex-direction: column; diff --git a/frontend/react-app/src/components/LoginPage.jsx b/frontend/react-app/src/components/LoginPage.jsx index e365915..ea878a5 100644 --- a/frontend/react-app/src/components/LoginPage.jsx +++ b/frontend/react-app/src/components/LoginPage.jsx @@ -28,103 +28,103 @@ const LoginPage = () => { useEffect(() => { setErrMsg(""); }, [user, pwd]); - -const handleSubmit = async (e) => { - e.preventDefault(); - try { - const response = await axios.post(LOGIN_URL, JSON.stringify({ username: user, password: pwd }), { - headers: { "Content-Type": "application/json" }, - withCredentials: true, - }); - localStorage.setItem("appToken", response.data.token); - localStorage.setItem("userEmail", response.data.username); - // const extractDisplayName = (email) => { - // const indexOfAt = email.indexOf("@"); - // const displayName = email.slice(0, indexOfAt); - // return displayName; - // }; - // localStorage.setItem("displayName", extractDisplayName(response.data.username)); - console.log(localStorage.getItem("appToken")); - console.log(JSON.stringify(response?.data)); - // const accessToken = response?.data?.accessToken; - // const roles = response?.data?.roles; - // setAuth({ user, pwd, roles, accessToken }); - setUser(""); - setPwd(""); - navigate("/", { replace: true }); - } catch (err) { - console.log(err); // Log the entire error object - if (!err.response) { - setErrMsg("No Server Response"); - } else if (err.response.status === 400) { - setErrMsg("Missing Username or Password"); - } else if (err.response.status === 401) { - setErrMsg("Unauthorized"); - } else { - setErrMsg("Login Failed"); + + const handleSubmit = async (e) => { + e.preventDefault(); + try { + const response = await axios.post(LOGIN_URL, JSON.stringify({ username: user, password: pwd }), { + headers: { "Content-Type": "application/json" }, + withCredentials: true, + }); + localStorage.setItem("appToken", response.data.token); + localStorage.setItem("userEmail", response.data.username); + // const extractDisplayName = (email) => { + // const indexOfAt = email.indexOf("@"); + // const displayName = email.slice(0, indexOfAt); + // return displayName; + // }; + // localStorage.setItem("displayName", extractDisplayName(response.data.username)); + console.log(localStorage.getItem("appToken")); + console.log(JSON.stringify(response?.data)); + // const accessToken = response?.data?.accessToken; + // const roles = response?.data?.roles; + // setAuth({ user, pwd, roles, accessToken }); + setUser(""); + setPwd(""); + navigate("/", { replace: true }); + } catch (err) { + console.log(err); // Log the entire error object + if (!err.response) { + setErrMsg("No Server Response"); + } else if (err.response.status === 400) { + setErrMsg("Missing Username or Password"); + } else if (err.response.status === 401) { + setErrMsg("Unauthorized"); + } else { + setErrMsg("Login Failed"); + } + errRef.current.focus(); } - errRef.current.focus(); - } -}; + }; -return ( -
-
-
-

- {errMsg} -

-
- - - - - -
-

{`Welcome Back`}

-

Please provide your details

-
- - setUser(e.target.value)} - value={user} - required - className="px-10 py-2 rounded-full bg-slate-200 text-gray-600 focus:outline-none focus:ring-2 focus:ring-slate-500 focus:ring-opacity-60" - /> + return ( +
+
+
+

+ {errMsg} +

+
+ + + + + +
+

{`Welcome Back`}

+

Please provide your details

+ + + setUser(e.target.value)} + value={user} + required + className="px-10 py-2 rounded-full bg-slate-200 text-gray-600 focus:outline-none focus:ring-2 focus:ring-slate-500 focus:ring-opacity-60" + /> - - setPwd(e.target.value)} - value={pwd} - required - className="px-10 py-2 rounded-full bg-slate-200 text-gray-600 focus:outline-none focus:ring-2 focus:ring-slate-500 focus:ring-opacity-60" - /> - - -
- -

New user? Register instead

- -
-
+ + setPwd(e.target.value)} + value={pwd} + required + className="px-10 py-2 rounded-full bg-slate-200 text-gray-600 focus:outline-none focus:ring-2 focus:ring-slate-500 focus:ring-opacity-60" + /> + + +
+ +

New user? Register instead

+ +
+
+
- -); + ) }; export default LoginPage; diff --git a/frontend/react-app/src/components/LogoutButton.jsx b/frontend/react-app/src/components/LogoutButton.jsx deleted file mode 100644 index a99b5af..0000000 --- a/frontend/react-app/src/components/LogoutButton.jsx +++ /dev/null @@ -1,16 +0,0 @@ -import { useAuth0 } from "@auth0/auth0-react"; - -const LogoutButton = () => { - const { logout } = useAuth0(); - - return ( - - ); -}; - -export default LogoutButton; diff --git a/frontend/react-app/src/components/RequireAuth.jsx b/frontend/react-app/src/components/RequireAuth.jsx deleted file mode 100644 index 9e57968..0000000 --- a/frontend/react-app/src/components/RequireAuth.jsx +++ /dev/null @@ -1,25 +0,0 @@ -import { useLocation, Navigate, Outlet } from "react-router-dom"; -import useAuth from "../hooks/useAuth"; - -const RequireAuth = ({ allowedRoles }) => { - const { auth } = useAuth(); - const location = useLocation(); - - return auth?.roles?.find((role) => allowedRoles?.includes(role)) ? ( - - ) : auth?.user ? ( - - ) : ( - - ); -}; - -export default RequireAuth; diff --git a/frontend/react-app/src/components/TestRegister.jsx b/frontend/react-app/src/components/TestRegister.jsx deleted file mode 100644 index b0299c2..0000000 --- a/frontend/react-app/src/components/TestRegister.jsx +++ /dev/null @@ -1,64 +0,0 @@ -import React, { useState } from "react"; - -function LoginForm({ onLoginSuccess }) { - const [username, setUsername] = useState(""); - const [password, setPassword] = useState(""); - const [message, setMessage] = useState(""); - - const handleSubmit = async (event) => { - event.preventDefault(); - - if (!username || !password) { - setMessage("Please fill in all required fields."); - return; - } - - try { - const response = await fetch("http://127.0.0.1:8000/login", { - method: "POST", - headers: { - Accept: "application/json", - "Content-Type": "application/json", - }, - body: JSON.stringify({ - username, - password, - }), - }); - - if (!response.ok) { - setMessage("Invalid username or password."); - throw new Error(`HTTP error! status: ${response.status}`); - } - - const data = await response.json(); - setMessage(data.message || "Login successful!"); - onLoginSuccess(data.token); // Pass token to parent component - } catch (error) { - console.error("Error:", error); - setMessage("An error occurred. Please try again later."); - } - }; - - return ( -
- {/* Form fields for username and password */} - setUsername(e.target.value)} - required - /> - setPassword(e.target.value)} - required - /> - - {message &&

{message}

} -
- ); -} - -export default LoginForm; diff --git a/frontend/react-app/src/components/Users.jsx b/frontend/react-app/src/components/Users.jsx deleted file mode 100644 index 2f2f77a..0000000 --- a/frontend/react-app/src/components/Users.jsx +++ /dev/null @@ -1,53 +0,0 @@ -import { useState, useEffect } from "react"; -import useAxiosPrivate from "../hooks/useAxiosPrivate"; -import { useNavigate, useLocation } from "react-router-dom"; -import axios from "../api/api"; - -const Users = () => { - const [users, setUsers] = useState(); - const axiosPrivate = useAxiosPrivate(); - const navigate = useNavigate(); - const location = useLocation(); - - useEffect(() => { - let isMounted = true; - const controller = new AbortController(); - - const getUsers = async () => { - try { - const response = await axiosPrivate.get("/users", { - signal: controller.signal, - }); - console.log(response.data); - isMounted && setUsers(response.data); - } catch (err) { - console.error(err); - navigate("/login", { state: { from: location }, replace: true }); - } - }; - - getUsers(); - - return () => { - isMounted = false; - controller.abort(); - }; - }, []); - - return ( -
-

Users List

- {users?.length ? ( -
    - {users.map((user, i) => ( -
  • {user?.username}
    • - ))} -
- ) : ( -

No users to display

- )} -
- ); -}; - -export default Users; diff --git a/frontend/react-app/src/context/AuthProvider.jsx b/frontend/react-app/src/context/AuthProvider.jsx index 563bf3d..765e963 100644 --- a/frontend/react-app/src/context/AuthProvider.jsx +++ b/frontend/react-app/src/context/AuthProvider.jsx @@ -8,4 +8,4 @@ export const AuthProvider = ({ children }) => { return {children}; }; -export default AuthContext; +export default AuthContext; \ No newline at end of file diff --git a/frontend/react-app/src/dashboard/DashBoard.jsx b/frontend/react-app/src/dashboard/DashBoard.jsx deleted file mode 100644 index 7c6052e..0000000 --- a/frontend/react-app/src/dashboard/DashBoard.jsx +++ /dev/null @@ -1,24 +0,0 @@ -import { - SignedIn, - SignedOut, - SignInButton, - UserButton, -} from "@clerk/clerk-react"; - -const DashBoard = () => { - return ( -
-

Dashboard

-
- - - - - - -
-
- ); -}; - -export default DashBoard; diff --git a/frontend/react-app/src/hooks/useAuth.jsx b/frontend/react-app/src/hooks/useAuth.jsx index f7df6fd..98b4265 100644 --- a/frontend/react-app/src/hooks/useAuth.jsx +++ b/frontend/react-app/src/hooks/useAuth.jsx @@ -7,4 +7,4 @@ const useAuth = () => { return useContext(AuthContext); }; -export default useAuth; +export default useAuth; \ No newline at end of file diff --git a/frontend/react-app/src/main.jsx b/frontend/react-app/src/main.jsx index 3c90872..287d554 100644 --- a/frontend/react-app/src/main.jsx +++ b/frontend/react-app/src/main.jsx @@ -1,37 +1,19 @@ import ReactDOM from "react-dom/client"; -import App from "./App.jsx"; -import "./index.css"; -import { createBrowserRouter, RouterProvider } from "react-router-dom"; -import LoginSignup from "./pages/LoginSignup.jsx"; -import NotFoundPage from "./pages/NotFoundPage.jsx"; -import Form from "./pages/Form.jsx"; -import UserProfile from "./pages/UserProfile.jsx"; -import Register from "./components/Register.jsx"; -import TestRegister from "./components/TestRegister.jsx"; -import Login from "./components/Login.jsx"; -import DashBoard from "./dashboard/DashBoard.jsx"; -import { ToastContainer } from "react-toastify"; -import "react-toastify/ReactToastify.min.css"; -import { Auth0Provider } from "@auth0/auth0-react"; -import RegisterPage from "./pages/RegisterPage.jsx"; -import LoginPage from "./components/LoginPage.jsx"; -import AuthProvider from "./provider/authProvider.jsx"; -import Routes from "./routes/index.jsx"; +import { createBrowserRouter, RouterProvider } from "react-router-dom" + +import "./index.css" +import App from "./App.jsx" +import NotFoundPage from "./pages/NotFoundPage.jsx" +import UserProfile from "./pages/UserProfile.jsx" +import RegisterPage from "./pages/RegisterPage.jsx" +import LoginPage from "./components/LoginPage.jsx" + +const token = localStorage.getItem("appToken") const router = createBrowserRouter([ { path: "/", - element: , - errorElement: , - }, - { - path: "/auth", - element: , - errorElement: , - }, - { - path: "/form", - element:
, + element: token ? : , errorElement: , }, { @@ -44,23 +26,11 @@ const router = createBrowserRouter([ element: , errorElement: , }, - { - path: "/testregister", - element: , - errorElement: , - }, { path: "/login", element: , errorElement: , }, - { - path: "/dashboard", - element: , - errorElement: , - }, -]); - -ReactDOM.createRoot(document.getElementById("root")).render(); - +]) +ReactDOM.createRoot(document.getElementById("root")).render() \ No newline at end of file diff --git a/frontend/react-app/src/pages/Form.jsx b/frontend/react-app/src/pages/Form.jsx deleted file mode 100644 index 3ff89d6..0000000 --- a/frontend/react-app/src/pages/Form.jsx +++ /dev/null @@ -1,28 +0,0 @@ -import FormInput from "../components/FormInput"; -import { useState, useRef } from "react"; - -function Form() { - // const [username, setUsername] = useState(""); - const usernameRef = useRef(); - const handleSubmit = (event) => { - event.preventDefault(); - console.log(usernameRef); - }; - return ( -
-
- - - - - -
-
- ); -} - -export default Form; diff --git a/frontend/react-app/src/pages/Login.jsx b/frontend/react-app/src/pages/Login.jsx index 4cab473..3625ce2 100644 --- a/frontend/react-app/src/pages/Login.jsx +++ b/frontend/react-app/src/pages/Login.jsx @@ -1,20 +1,20 @@ -import { useNavigate } from "react-router-dom"; -import { useAuth } from "../provider/authProvider"; +// import { useNavigate } from "react-router-dom"; +// import { useAuth } from "../provider/authProvider"; -const Login = () => { - const { setToken } = useAuth(); - const navigate = useNavigate(); +// const Login = () => { +// const { setToken } = useAuth(); +// const navigate = useNavigate(); - const handleLogin = () => { - setToken("this is a test token"); - navigate("/", { replace: true }); - }; +// const handleLogin = () => { +// setToken("this is a test token"); +// navigate("/", { replace: true }); +// }; - setTimeout(() => { - handleLogin(); - }, 3 * 1000); +// setTimeout(() => { +// handleLogin(); +// }, 3 * 1000); - return <>Login Page; -}; +// return <>Login Page; +// }; -export default Login; +// export default Login; diff --git a/frontend/react-app/src/pages/LoginSignup.jsx b/frontend/react-app/src/pages/LoginSignup.jsx deleted file mode 100644 index ae28a9f..0000000 --- a/frontend/react-app/src/pages/LoginSignup.jsx +++ /dev/null @@ -1,134 +0,0 @@ -import { useState } from "react"; -import { useForm } from "react-hook-form"; -import { z } from "zod"; -import { zodResolver } from "@hookform/resolvers/zod"; - -const schema = z.object({ - firstname: z.string().min(3), - lastname: z.string().min(3), - email: z.string().email(), - password: z.string().min(8), -}); - -function LoginSignup() { - const { - register, - handleSubmit, - setError, - formState: { errors, isSubmitting }, - } = useForm({ - resolver: zodResolver(schema), - }); - const onSubmit = async (data) => { - try { - await new Promise((resolve) => setTimeout(resolve, 1000)); - console.log(data); - throw new Error(); - } catch (error) { - setError("root", { - message: "This email is already in use.", - }); - } - }; - const [action, setAction] = useState("Sign Up"); - const loginMsg = "Welcome back"; - const signupMsg = "Create account"; - const inputBar = - "p-4 my-2 rounded-full bg-blue-100 hover:shadow-md font-bold focus:outline-blue-500 focus:ring-2 focus:ring-blue-500"; - const displayFullName = ( -
- - {errors.firstname && ( -
{errors.firstname.message}
- )} - - {errors.lastname && ( -
{errors.lastname.message}
- )} -
- ); - const loginInfo = ( -
- - -
- ); - - const signupInfo = ( - - ); - - return ( -
-
-
-
-
-
-

- {action === "Log In" && loginMsg} - {action === "Sign Up" && signupMsg} -

-

Please enter your details

-
- {action === "Sign Up" && displayFullName} - - {errors.email && ( -
{errors.email.message}
- )} - - {errors.password && ( -
{errors.password.message}
- )} - {action === "Log In" && loginInfo} - {action === "Sign Up" && signupInfo} - - - {errors.root && ( -
{errors.root.message}
- )} -
-
-
-
-
- ); -} - -export default LoginSignup; diff --git a/frontend/react-app/src/routes/index.jsx b/frontend/react-app/src/routes/index.jsx index dd2795e..b004b7a 100644 --- a/frontend/react-app/src/routes/index.jsx +++ b/frontend/react-app/src/routes/index.jsx @@ -1,14 +1,13 @@ import { RouterProvider, createBrowserRouter } from "react-router-dom"; import { useAuth } from "../provider/authProvider"; -import { ProtectedRoute } from "./ProtectedRoute"; -import Login from "../pages/Login"; -import Logout from "../pages/Logout"; -import Register from "../pages/RegisterPage"; -import LoginPage from "../components/LoginPage"; -import App from "../App"; +import { ProtectedRoute } from "./ProtectedRoute" +import Logout from "../pages/Logout" +import Register from "../pages/RegisterPage" +import LoginPage from "../components/LoginPage" +import App from "../App" const Routes = () => { - const { token } = useAuth(); + const { token } = useAuth() // Define public routes accessible to all users const routesForPublic = [ @@ -20,7 +19,7 @@ const Routes = () => { path: "/login", element: , }, - ]; + ] // Define routes accessible only to authenticated users const routesForAuthenticatedOnly = [ @@ -42,7 +41,7 @@ const Routes = () => { }, ], }, - ]; + ] // Define routes accessible only to non-authenticated users const routesForNotAuthenticatedOnly = [ @@ -52,15 +51,15 @@ const Routes = () => { }, { path: "/login", - element: , + element: , }, - ]; + ] // Combine and conditionally include routes based on authentication status - const router = createBrowserRouter([...routesForPublic, ...(!token ? routesForNotAuthenticatedOnly : []), ...routesForAuthenticatedOnly]); + const router = createBrowserRouter([...routesForPublic, ...(!token ? routesForNotAuthenticatedOnly : []), ...routesForAuthenticatedOnly]) // Provide the router configuration using RouterProvider - return ; -}; + return +} export default Routes; diff --git a/src/logics/arxiv_recommender.py b/src/logics/arxiv_recommender.py index a59381a..91ed375 100644 --- a/src/logics/arxiv_recommender.py +++ b/src/logics/arxiv_recommender.py @@ -98,18 +98,17 @@ def recommend(self, query: str): # return the top 10 results return result - if __name__ == "__main__": - # vocabulary = LearnTransformVocabulary( - # json_data = "data/master_data.json" - # ) + vocabulary = LearnTransformVocabulary( + json_data = "data/master_data.json" + ) recommender = Recommender( - vectorizer_path="data/vectorizer.pkl", - vocabulary_path="data/transformed_data.pkl", + vectorizer_path="/data/vectorizer.pkl", + vocabulary_path="/data/transformed_data.pkl", ) - # recommender.recommend(query="LLM , Attention, Mechanism, GPT, Mamba, Model") + print(recommender.recommend(query="LLM , Attention, Mechanism, GPT, Mamba, Model")) - pdb.set_trace() + # pdb.set_trace() # # Create a parser object # parser = argparse.ArgumentParser( diff --git a/src/utils/__init__.py b/src/utils/__init__.py new file mode 100644 index 0000000..e69de29 diff --git a/src/utils/convert_pkl_to_json.py b/src/utils/convert_pkl_to_json.py new file mode 100644 index 0000000..57cf6a6 --- /dev/null +++ b/src/utils/convert_pkl_to_json.py @@ -0,0 +1,7 @@ +import pandas as pd + +df:pd.DataFrame = pd.read_pickle("../../data/master_data3.pkl") +df.to_json("../../data/master_data.json") + +new_df = pd.read_json("../../data/master_data.json") +print(new_df.shape) \ No newline at end of file