From 2ef8d8b41dd21423df85f9269c1c6cbfb53331c1 Mon Sep 17 00:00:00 2001 From: Johannes Andersson Date: Sun, 10 Mar 2024 09:08:10 +0000 Subject: [PATCH 1/3] Update todo --- README.md | 22 +++++++--------- client/package.json | 3 ++- client/src/App.tsx | 2 -- client/src/components/ImageGrid.tsx | 4 +-- client/src/components/ImageGridItem.tsx | 3 ++- client/src/components/Logotype.tsx | 2 +- client/src/components/Navbar.tsx | 35 ------------------------- client/src/components/NavbarSignIn.tsx | 17 ------------ client/src/components/SaveImage.tsx | 6 ++--- client/src/components/SearchBar.tsx | 23 +++++++--------- client/src/components/SidebarSignIn.tsx | 2 +- client/src/contexts/ThemeContext.ts | 2 +- client/src/models/ImageItem.ts | 14 ++++++++++ client/src/pages/SearchPage.tsx | 6 ++--- client/src/services/search.service.ts | 13 +-------- package.json | 5 +--- 16 files changed, 49 insertions(+), 110 deletions(-) delete mode 100644 client/src/components/Navbar.tsx delete mode 100644 client/src/components/NavbarSignIn.tsx diff --git a/README.md b/README.md index 8a519b2..ba46fd3 100644 --- a/README.md +++ b/README.md @@ -54,10 +54,6 @@ ``` ## API Endpoints - -### Search - -- `GET /api/search`: Search for images. ### User @@ -90,21 +86,23 @@ This project is licensed under the [MIT License](LICENSE). Checklist for System Support and Integration 3-Part System - ImageSearch: +[ ] Create scripts to run both server and client + **Klient (Client):** -1. [ ] Implement login functionality with Google or GitHub account using Auth0. -2. [ ] Enable searching for images with a maximum of 10 results when the user is logged in (Google Custom Search). -3. [ ] Implement a suggestion feature ("Menade du…") for misspelled search terms, allowing users to click on the corrected term for a new search. +1. [x] Implement login functionality with Google or GitHub account using Auth0. +2. [x] Enable searching for images with a maximum of 10 results when the user is logged in (Google Custom Search). +3. [x] Implement a suggestion feature ("Menade du…") for misspelled search terms, allowing users to click on the corrected term for a new search. 4. [x] Display the duration of the search process. -5. [ ] Allow users, when logged in, to save an image to their list of favorite pictures. -6. [ ] Provide a section on the page where users can view their list of favorite images. -7. [ ] Ensure that each user has a unique list of favorite images. +5. [x] Allow users, when logged in, to save an image to their list of favorite pictures. +6. [x] Provide a section on the page where users can view their list of favorite images. +7. [x] Ensure that each user has a unique list of favorite images. **Server:** 1. [x] Create a JSON file on the server to store a list of users and their favorite images. 2. [x] Implement a server endpoint to save a favorite image, validating the data using Joi before saving. -3. [ ] Develop a server endpoint that responds with a list of favorite images for a specific user. +3. [x] Develop a server endpoint that responds with a list of favorite images for a specific user. 4. [ ] Define the data structure for the JSON file as specified: ```json @@ -125,7 +123,7 @@ Checklist for System Support and Integration 3-Part System - ImageSearch: **Allmänt (General):** 1. [ ] Submit the task on time. -2. [ ] Utilize Git and GitHub for version control. +2. [x] Utilize Git and GitHub for version control. 3. [ ] Include a Readme with information on how to build the projects. 4. [ ] Ensure that `node_modules` is not included in the submission. diff --git a/client/package.json b/client/package.json index 1feb78d..9ac43e1 100644 --- a/client/package.json +++ b/client/package.json @@ -7,7 +7,8 @@ "dev": "vite", "build": "tsc && vite build", "lint": "eslint . --ext ts,tsx --report-unused-disable-directives --max-warnings 0", - "preview": "vite preview" + "preview": "vite preview", + "start": "npm run build && npm run preview" }, "dependencies": { "@auth0/auth0-react": "^2.2.4", diff --git a/client/src/App.tsx b/client/src/App.tsx index 195666c..5be6ea7 100644 --- a/client/src/App.tsx +++ b/client/src/App.tsx @@ -1,11 +1,9 @@ import { RouterProvider } from "react-router-dom"; -import { Md5 } from "ts-md5"; import { router } from "./routers/Router"; const App = () => { return ( <> - {console.log(Md5.hashStr("john.doe@example.com"))} ); diff --git a/client/src/components/ImageGrid.tsx b/client/src/components/ImageGrid.tsx index 85a5ff3..13ec269 100644 --- a/client/src/components/ImageGrid.tsx +++ b/client/src/components/ImageGrid.tsx @@ -3,11 +3,11 @@ import ImageGridItem from "./ImageGridItem"; type Props = { images: ImageItem[] }; -const ImageGrid = ({ images: results }: Props) => { +const ImageGrid = ({ images }: Props) => { return ( <>
- {results.map((item, i) => ( + {images.map((item, i) => ( ))}
diff --git a/client/src/components/ImageGridItem.tsx b/client/src/components/ImageGridItem.tsx index d385e57..8639043 100644 --- a/client/src/components/ImageGridItem.tsx +++ b/client/src/components/ImageGridItem.tsx @@ -11,7 +11,7 @@ interface ImageGridItemProps { const ImageGridItem = ({ image, index }: ImageGridItemProps) => { return (
{
+ {/* TODO make image component with broken image display */} {image.title} { return (

Picterest

diff --git a/client/src/components/Navbar.tsx b/client/src/components/Navbar.tsx deleted file mode 100644 index c96850e..0000000 --- a/client/src/components/Navbar.tsx +++ /dev/null @@ -1,35 +0,0 @@ -import { useAuth0 } from "@auth0/auth0-react"; -import { NavLink } from "react-router-dom"; -import NavbarSignIn from "./NavbarSignIn"; -import SidebarSignOut from "./SidebarSignOut"; - -const Navbar = () => { - const { isAuthenticated } = useAuth0(); - - return ( - - ); -}; - -export default Navbar; diff --git a/client/src/components/NavbarSignIn.tsx b/client/src/components/NavbarSignIn.tsx deleted file mode 100644 index 227d02e..0000000 --- a/client/src/components/NavbarSignIn.tsx +++ /dev/null @@ -1,17 +0,0 @@ -import { useAuth0 } from "@auth0/auth0-react"; - -const NavbarSignIn = () => { - const { loginWithRedirect } = useAuth0(); - - const handleLogin = async () => { - await loginWithRedirect({ - appState: { - returnTo: "/search", - }, - }); - }; - - return ; -}; - -export default NavbarSignIn; diff --git a/client/src/components/SaveImage.tsx b/client/src/components/SaveImage.tsx index 4ebad56..ebcb761 100644 --- a/client/src/components/SaveImage.tsx +++ b/client/src/components/SaveImage.tsx @@ -6,7 +6,7 @@ import { ImageItem } from "../models/ImageItem"; import { FavoritesActionType } from "../reducers/FavoritesReducer"; import { createFavorite, removeFavorite } from "../services/favorites.service"; type Props = { image: ImageItem }; - +// TODO rename const SaveImage = ({ image }: Props) => { const { user } = useAuth0(); const { favorites, dispatch } = useFavoritesContext(); @@ -47,8 +47,8 @@ const SaveImage = ({ image }: Props) => { +
diff --git a/client/src/components/SidebarSignIn.tsx b/client/src/components/SidebarSignIn.tsx index 1f4ec35..125e265 100644 --- a/client/src/components/SidebarSignIn.tsx +++ b/client/src/components/SidebarSignIn.tsx @@ -14,7 +14,7 @@ const SidebarSignIn = () => { return (