From 3825257a6bcacaa17d7a9f5a3cab506f5de4689e Mon Sep 17 00:00:00 2001 From: Naren Rohan Date: Fri, 7 Jun 2024 21:27:48 +1200 Subject: [PATCH] configured cms locally for exec screen --- web/.gitignore | 1 + web/package.json | 1 + web/src/components/ExecInfo.tsx | 3 +-- web/src/hooks/useFetch.ts | 2 +- web/src/main.tsx | 5 ++--- web/src/screens/ExecScreen.tsx | 29 +++++++++++++++++++++++++---- web/tsconfig.json | 2 +- web/yarn.lock | 12 ++++++++++++ 8 files changed, 44 insertions(+), 11 deletions(-) diff --git a/web/.gitignore b/web/.gitignore index 088739f8..aa99e7a2 100644 --- a/web/.gitignore +++ b/web/.gitignore @@ -12,6 +12,7 @@ node_modules dist dist-ssr *.local +*.env # Editor directories and files .vscode/* diff --git a/web/package.json b/web/package.json index 7bfea1da..e87e808a 100644 --- a/web/package.json +++ b/web/package.json @@ -29,6 +29,7 @@ "@testing-library/dom": "^10.1.0", "@testing-library/jest-dom": "^6.4.5", "@testing-library/react": "^16.0.0", + "@types/node": "^20.14.2", "@types/react": "^18.2.43", "@types/react-dom": "^18.2.17", "@typescript-eslint/eslint-plugin": "^6.14.0", diff --git a/web/src/components/ExecInfo.tsx b/web/src/components/ExecInfo.tsx index a98755c9..48ea181b 100644 --- a/web/src/components/ExecInfo.tsx +++ b/web/src/components/ExecInfo.tsx @@ -1,10 +1,9 @@ -import { execs } from "../data/data"; import ExecCard from "../screens/ExecScreen"; function ExecScreen() { return (
- +
); } diff --git a/web/src/hooks/useFetch.ts b/web/src/hooks/useFetch.ts index d9d6373c..987e4cbb 100644 --- a/web/src/hooks/useFetch.ts +++ b/web/src/hooks/useFetch.ts @@ -1,7 +1,7 @@ import { useEffect, useState } from "react"; const useFetch = (url: string) => { - const [data, setData] = useState(null); + const [data, setData] = useState([]); const [error, setError] = useState(null); const [loading, setLoading] = useState(true); diff --git a/web/src/main.tsx b/web/src/main.tsx index cdaa71b7..97322534 100644 --- a/web/src/main.tsx +++ b/web/src/main.tsx @@ -17,8 +17,7 @@ import LoginScreen from "./screens/LoginScreen.tsx"; import SignUpScreen from "./screens/SignUpScreen.tsx"; import PhotosScreen from "./screens/PhotosScreen.tsx"; import PPVScreen from "./screens/PPVScreen.tsx"; -import CreditsScreen from './screens/CreditsScreen.tsx'; -import { execs } from "./data/data.ts"; +import CreditsScreen from "./screens/CreditsScreen.tsx"; //Add any routes for screens below const router = createBrowserRouter( @@ -26,7 +25,7 @@ const router = createBrowserRouter( }> } /> } /> - } /> + } /> } /> } /> } /> diff --git a/web/src/screens/ExecScreen.tsx b/web/src/screens/ExecScreen.tsx index 90b4d791..132526ac 100644 --- a/web/src/screens/ExecScreen.tsx +++ b/web/src/screens/ExecScreen.tsx @@ -1,8 +1,17 @@ -import { Props } from "../types/types"; +import LoadingSpinner from "@components/LoadingSpinner"; +import useFetch from "../hooks/useFetch"; +import { Exec } from "../types/types"; + +function ExecScreen() { + const { loading, data, error } = useFetch( + `${import.meta.env.VITE_STRAPI_URL}/api/execs?populate=*` + ); + if (loading) return ; + if (error) return
{error}
; + const execs: Exec[] = mapToExec(data); -function ExecScreen({ execs }: Props) { return ( -
+

Meet the Execs

{execs.map((exec) => ( @@ -10,7 +19,7 @@ function ExecScreen({ execs }: Props) {
exec image
@@ -27,3 +36,15 @@ function ExecScreen({ execs }: Props) { } export default ExecScreen; + +const mapToExec = (data: any): Exec[] => { + return data.data.map((item: any) => { + return { + id: item.id, + name: item.attributes.name, + bio: item.attributes.bio, + position: item.attributes.position, + image: item.attributes.image.data.attributes.url, + }; + }); +}; diff --git a/web/tsconfig.json b/web/tsconfig.json index f15b6a65..bf7f36c2 100644 --- a/web/tsconfig.json +++ b/web/tsconfig.json @@ -5,7 +5,7 @@ "lib": ["ES2020", "DOM", "DOM.Iterable"], "module": "ESNext", "skipLibCheck": true, - "types": ["vitest/globals"], + "types": ["vitest/globals", "node"], "paths": { "@utils/*": ["./src/utils/*"], diff --git a/web/yarn.lock b/web/yarn.lock index 3cec006a..074efa12 100644 --- a/web/yarn.lock +++ b/web/yarn.lock @@ -718,6 +718,13 @@ resolved "https://registry.npmjs.org/@types/json-schema/-/json-schema-7.0.15.tgz" integrity sha512-5+fP8P8MFNC+AyZCDxrB2pkZFPGzqQWUzpSeuuVLvm8VMcorNYavBqoFcxK8bQz4Qsbn4oUEEem4wDLfcysGHA== +"@types/node@^20.14.2": + version "20.14.2" + resolved "https://registry.yarnpkg.com/@types/node/-/node-20.14.2.tgz#a5f4d2bcb4b6a87bffcaa717718c5a0f208f4a18" + integrity sha512-xyu6WAMVwv6AKFLB+e/7ySZVr/0zLCzOa7rSpq6jNwpqOrUbcACDWC+53d4n2QHOnDou0fbIsg8wZu/sxrnI4Q== + dependencies: + undici-types "~5.26.4" + "@types/prop-types@*": version "15.7.11" resolved "https://registry.npmjs.org/@types/prop-types/-/prop-types-15.7.11.tgz" @@ -2942,6 +2949,11 @@ ufo@^1.5.3: resolved "https://registry.yarnpkg.com/ufo/-/ufo-1.5.3.tgz#3325bd3c977b6c6cd3160bf4ff52989adc9d3344" integrity sha512-Y7HYmWaFwPUmkoQCUIAYpKqkOf+SbVj/2fJJZ4RJMCfZp0rTGwRbzQD+HghfnhKOjL9E01okqz+ncJskGYfBNw== +undici-types@~5.26.4: + version "5.26.5" + resolved "https://registry.yarnpkg.com/undici-types/-/undici-types-5.26.5.tgz#bcd539893d00b56e964fd2657a4866b221a65617" + integrity sha512-JlCMO+ehdEIKqlFxk6IfVoAUVmgz7cU7zD/h9XZ0qzeosSHmUJVOzSQvvYSYWXkFXC+IfLKSIffhv0sVZup6pA== + universal-cookie@^7.0.2: version "7.0.2" resolved "https://registry.npmjs.org/universal-cookie/-/universal-cookie-7.0.2.tgz"