Skip to content

Commit

Permalink
changes in
Browse files Browse the repository at this point in the history
  • Loading branch information
Akash Kumar authored and Akash Kumar committed Jun 9, 2024
1 parent cd3c506 commit 1aac258
Show file tree
Hide file tree
Showing 12 changed files with 237 additions and 218 deletions.
22 changes: 10 additions & 12 deletions frontend/react-app/src/App.jsx
View file
Original file line number Diff line number Diff line change
@@ -1,19 +1,17 @@
import Header from "./components/Header"
import Main from "./components/DynamicList"
import SearchBar from "./components/SearchBar"
import useRedirectToLogin from "./components/RedirectToLogin"
import TabsComponent from './components/Tabs';
import Layout from "./components/Layout";
import Main from "./components/DynamicList";
import SearchBar from "./components/SearchBar";
import useRedirectToLogin from "./components/RedirectToLogin";

function App() {
useRedirectToLogin()
useRedirectToLogin();

return (
<div className="max-w-[800px] min-w-min bg-white mx-auto m-0">
<Header />
<Layout>
<SearchBar />
<TabsComponent />
<Main />
</div>
)
</Layout>
);
}

export default App
export default App;
88 changes: 38 additions & 50 deletions frontend/react-app/src/auth/LoginPage.jsx
View file
Original file line number Diff line number Diff line change
@@ -1,86 +1,75 @@
import { useRef, useState, useEffect } from "react"
import { Link, useNavigate } from "react-router-dom"
import { useRef, useState, useEffect } from "react";
import { Link, useNavigate } from "react-router-dom";
import axios from "../api/api";
import "./LoginPage.css";

import axios from "../api/api"
import "./LoginPage.css"

const LOGIN_URL = "/login"
const LOGIN_URL = "/login"; // Ensure this matches your backend endpoint

const LoginPage = () => {
const navigate = useNavigate()

const userRef = useRef()
const errRef = useRef()
const navigate = useNavigate();
const userRef = useRef();
const errRef = useRef();

const [user, setUser] = useState("")
const [pwd, setPwd] = useState("")
const [errMsg, setErrMsg] = useState("")
const [user, setUser] = useState("");
const [pwd, setPwd] = useState("");
const [errMsg, setErrMsg] = useState("");

useEffect(() => {
userRef.current.focus()
}, [])
userRef.current.focus();
}, []);

useEffect(() => {
setErrMsg("")
}, [user, pwd])
setErrMsg("");
}, [user, pwd]);

const handleSubmit = async (e) => {
e.preventDefault()
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)
localStorage.setItem("preferences", response.data.preferences)
console.log(localStorage.getItem("appToken"))
console.log(JSON.stringify(response?.data))
});
localStorage.setItem("token", response.data.token);
localStorage.setItem("userEmail", response.data.username);
localStorage.setItem("preferences", JSON.stringify(response.data.preferences));
console.log(localStorage.getItem("token"));
console.log(JSON.stringify(response?.data));

setUser("")
setPwd("")
navigate("/", { replace: true })
setUser("");
setPwd("");
navigate("/", { replace: true });
} catch (err) {
console.log(err) // Log the entire error object
console.log(err); // Log the entire error object
if (!err.response) {
setErrMsg("No Server Response")
setErrMsg("No Server Response");
} else if (err.response.status === 400) {
setErrMsg("Missing Username or Password")
setErrMsg("Missing Username or Password");
} else if (err.response.status === 401) {
setErrMsg("Unauthorized")
setErrMsg("Unauthorized");
} else {
setErrMsg("Login Failed")
setErrMsg("Login Failed");
}
errRef.current.focus()
errRef.current.focus();
}
}
};

return (
<div className="flex justify-center items-center h-[100vh] bg-gradient-to-tr from-slate-50 to-blue-100">
<div className="border-2 bg-white border-gray-200 p-10 rounded-lg shadow-md">
<section id="login-section">
<p
ref={errRef}
className={errMsg ? "errmsg" : "offscreen"}
aria-live="assertive">
<p ref={errRef} className={errMsg ? "errmsg" : "offscreen"} aria-live="assertive">
{errMsg}
</p>
<div className="flex justify-center items-center">
<svg
xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 24 24"
fill="currentColor"
className="w-10 h-10">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor" className="w-10 h-10">
<path d="M11.7 2.805a.75.75 0 0 1 .6 0A60.65 60.65 0 0 1 22.83 8.72a.75.75 0 0 1-.231 1.337 49.948 49.948 0 0 0-9.902 3.912l-.003.002c-.114.06-.227.119-.34.18a.75.75 0 0 1-.707 0A50.88 50.88 0 0 0 7.5 12.173v-.224c0-.131.067-.248.172-.311a54.615 54.615 0 0 1 4.653-2.52.75.75 0 0 0-.65-1.352 56.123 56.123 0 0 0-4.78 2.589 1.858 1.858 0 0 0-.859 1.228 49.803 49.803 0 0 0-4.634-1.527.75.75 0 0 1-.231-1.337A60.653 60.653 0 0 1 11.7 2.805Z" />
<path d="M13.06 15.473a48.45 48.45 0 0 1 7.666-3.282c.134 1.414.22 2.843.255 4.284a.75.75 0 0 1-.46.711 47.87 47.87 0 0 0-8.105 4.342.75.75 0 0 1-.832 0 47.87 47.87 0 0 0-8.104-4.342.75.75 0 0 1-.461-.71c.035-1.442.121-2.87.255-4.286.921.304 1.83.634 2.726.99v1.27a1.5 1.5 0 0 0-.14 2.508c-.09.38-.222.753-.397 1.11.452.213.901.434 1.346.66a6.727 6.727 0 0 0 .551-1.607 1.5 1.5 0 0 0 .14-2.67v-.645a48.549 48.549 0 0 1 3.44 1.667 2.25 2.25 0 0 0 2.12 0Z" />
<path d="M4.462 19.462c.42-.419.753-.89 1-1.395.453.214.902.435 1.347.662a6.742 6.742 0 0 1-1.286 1.794.75.75 0 0 1-1.06-1.06Z" />
</svg>
</div>
<h1 className="text-2xl font-semibold text-black text-center">{`Welcome Back`}</h1>
<p className="text-sm text-center text-slate-500">Please provide your details</p>
<form
onSubmit={handleSubmit}
className="login-form">
<form onSubmit={handleSubmit} className="login-form">
<label htmlFor="username">Username:</label>
<input
type="text"
Expand All @@ -92,7 +81,6 @@ const LoginPage = () => {
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"
/>

<label htmlFor="password">Password:</label>
<input
type="password"
Expand All @@ -112,7 +100,7 @@ const LoginPage = () => {
</section>
</div>
</div>
)
}
);
};

export default LoginPage
export default LoginPage;
79 changes: 39 additions & 40 deletions frontend/react-app/src/components/DynamicList.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -4,40 +4,42 @@ import axios from "axios";

import ExpandableText from "./ExpandableText";
import SearchBar from "./SearchBar";
import Loading from "./Loading"
import Loading from "./Loading";

function Main() {
const [arxivData, setArxivData] = useState([])
const [searchResults, setSearchResults] = useState([])
const [loading, setLoading] = useState(true)
function MainComponent() {
const [arxivData, setArxivData] = useState([]);
const [searchResults, setSearchResults] = useState([]);
const [loading, setLoading] = useState(true);

async function fetchUsers() {
try {
setLoading(true) // Set loading to true before fetching data
setLoading(true); // Set loading to true before fetching data
const { data } = await axios.get("http://127.0.0.1:8000/recommend", {
params: {
// localStorage.getItem("preferences")
query: "CV LLM",
},
headers: {
Accept: "application/json",
Authorization: `Bearer ${localStorage.getItem("appToken")}`,
Authorization: `Bearer ${localStorage.getItem("token")}`,
},
})
console.log(data)
setArxivData(data)
setLoading(false) // Set loading to false when fetching is done
});
console.log(data);
setArxivData(data);
setLoading(false); // Set loading to false when fetching is done
} catch (error) {
console.error(error)
console.error(error);
}
}

useEffect(() => {
fetchUsers()
}, [])
fetchUsers();
}, []);

return (
<div>
<SearchBar setSearchResults={setSearchResults} />(
<main className="min-h-screen flex flex-col flex-grow my-40">
<SearchBar setSearchResults={setSearchResults} />
<main className="min-h-screen flex flex-col flex-grow my-20">
{searchResults.length > 0 ? (
loading ? (
<Loading />
Expand All @@ -46,23 +48,23 @@ function Main() {
return (
<div
key={data?.id}
className="text-start mx-4 mt-4 p-3 bg-gradient-to-bl from-white via-white to bg-blue-50 border-blue-50 border-2 rounded-md shadow-lg">
className="text-start mx-4 mt-4 p-3 bg-gradient-to-bl from-white via-white to bg-blue-50 border-blue-50 border-2 rounded-md shadow-lg"
>
<div className="mb-1 text-base font-semibold text-black">{data?.title}</div>
<div className="text-sm text-black">
<ExpandableText title={data?.summary}></ExpandableText>
</div>
<div className="flex justify-center">
<Link
to={data?.id}
target="_blank">
<Link to={data?.id} target="_blank">
<button className="bg-slate-100 rounded-full h-10 w-10 mr-2 hover:bg-slate-200 flex justify-center items-center">
<svg
xmlns="http://www.w3.org/2000/svg"
fill="none"
viewBox="0 0 24 24"
strokeWidth={1.5}
stroke="currentColor"
className="w-6 h-6 flex justify-center items-center">
className="w-6 h-6 flex justify-center items-center"
>
<path
strokeLinecap="round"
strokeLinejoin="round"
Expand All @@ -71,17 +73,16 @@ function Main() {
</svg>
</button>
</Link>
<Link
to={data?.pdf_link}
target="_blank">
<Link to={data?.pdf_link} target="_blank">
<button className="bg-slate-100 rounded-full h-10 w-10 mr-2 hover:bg-slate-200 flex justify-center items-center">
<svg
xmlns="http://www.w3.org/2000/svg"
fill="none"
viewBox="0 0 24 24"
strokeWidth={1.5}
stroke="currentColor"
className="w-6 h-6">
className="w-6 h-6"
>
<path
strokeLinecap="round"
strokeLinejoin="round"
Expand All @@ -92,7 +93,7 @@ function Main() {
</Link>
</div>
</div>
)
);
})
)
) : loading ? (
Expand All @@ -102,23 +103,23 @@ function Main() {
return (
<div
key={data?.id}
className="text-start mx-4 mt-4 p-3 bg-gradient-to-bl from-white via-white to bg-blue-50 border-blue-50 border-2 rounded-md shadow-lg">
className="text-start mx-4 mt-4 p-3 bg-gradient-to-bl from-white via-white to bg-blue-50 border-blue-50 border-2 rounded-md shadow-lg"
>
<div className="mb-1 text-base font-semibold text-black">{data?.title}</div>
<div className="text-sm text-black">
<ExpandableText title={data?.summary}></ExpandableText>
</div>
<div className="flex justify-center">
<Link
to={data?.id}
target="_blank">
<Link to={data?.id} target="_blank">
<button className="bg-slate-100 rounded-full h-10 w-10 mr-2 hover:bg-slate-200 flex justify-center items-center">
<svg
xmlns="http://www.w3.org/2000/svg"
fill="none"
viewBox="0 0 24 24"
strokeWidth={1.5}
stroke="currentColor"
className="w-6 h-6 flex justify-center items-center">
className="w-6 h-6 flex justify-center items-center"
>
<path
strokeLinecap="round"
strokeLinejoin="round"
Expand All @@ -127,17 +128,16 @@ function Main() {
</svg>
</button>
</Link>
<Link
to={data?.pdf_link}
target="_blank">
<button className=" bg-slate-100 rounded-full h-10 w-10 mr-2 hover:bg-slate-200 flex justify-center items-center">
<Link to={data?.pdf_link} target="_blank">
<button className="bg-slate-100 rounded-full h-10 w-10 mr-2 hover:bg-slate-200 flex justify-center items-center">
<svg
xmlns="http://www.w3.org/2000/svg"
fill="none"
viewBox="0 0 24 24"
strokeWidth={1.5}
stroke="currentColor"
className="w-6 h-6">
className="w-6 h-6"
>
<path
strokeLinecap="round"
strokeLinejoin="round"
Expand All @@ -148,13 +148,12 @@ function Main() {
</Link>
</div>
</div>
)
);
})
)}
</main>
)
</div>
)
);
}

export default Main;
export default MainComponent;
Loading

0 comments on commit 1aac258

Please sign in to comment.