fix: small fixes

package.json

@@ -8,7 +8,9 @@
   "scripts": {
     "dev": "vite",
     "build": "tsc && vite build",
-    "lint": "eslint . --ext ts,tsx --report-unused-disable-directives --max-warnings 0 --fix",
+    "lint": "yarn lint:eslint && yarn lint:ts",
+    "lint:eslint": "eslint . --ext ts,tsx --report-unused-disable-directives --max-warnings 0 --fix",
+    "lint:ts": "eslint . --ext ts,tsx --report-unused-disable-directives --max-warnings 0 --fix",
     "preview": "vite preview",
     "compile:gql": "graphql-codegen"
   },

src/components/Footer/Footer.tsx

@@ -5,7 +5,9 @@ export function Footer() {
   return (
     <footer className="flex w-full items-center justify-center gap-4 bg-white p-4">
       <img src="/images/mtc-logo.svg" alt="Planet Earth" className="h-[34px] w-[38px] md:h-[44px] md:w-[48px]" />
-      <Typography color="gray">© {format(new Date(), "yyyy")} Meet The Countries</Typography>
+      <Typography color="gray" className="font-thin">
+        © {format(new Date(), "yyyy")} Meet The Countries
+      </Typography>
     </footer>
   );
 }

src/components/Layout/Layout.tsx

@@ -1,10 +1,11 @@
 import { useEffect } from "react";
 import Modal from "react-modal";
-import { Outlet } from "react-router-dom";
+import { Outlet, useLocation } from "react-router-dom";
 import { Footer } from "@components/Footer/Footer.tsx";
 import { Header } from "@components/Header/Header.tsx";
 
 export function Layout() {
+  const location = useLocation();
   useEffect(() => {
     Modal.setAppElement("#root");
   }, []);
@@ -15,7 +16,7 @@ export function Layout() {
       <main className="relative flex h-screen w-full flex-col items-center">
         <Outlet />
       </main>
-      <Footer />
+      {location && location.pathname !== "/" && <Footer />}
     </>
   );
 }

src/components/Quiz/QuizForm.tsx

@@ -17,7 +17,7 @@ import { CREATE_QUIZ } from "@utils/queries/CreateQuiz.ts";
 import { GET_QUIZ_BY_ID } from "@utils/queries/QuizById.ts";
 import { UPDATE_QUIZ } from "@utils/queries/UpdateQuiz.ts";
 
-const getDefaultValues = (quiz?: QuizByIdQuery["quizList"][0]) => ({
+const getDefaultValues = (quiz?: QuizByIdQuery["quizById"]) => ({
   title: quiz?.title || "",
   description: quiz?.description || "",
   country: quiz?.country || "",
@@ -35,7 +35,7 @@ export function QuizForm() {
   const { quizId } = useParams();
 
   const [fetchQuiz, { data, loading }] = useLazyQuery(GET_QUIZ_BY_ID, { variables: { quizId: quizId || "" } });
-  const quiz = data?.quizList[0];
+  const quiz = data?.quizById;
 
   const {
     user: { role },

src/pages/Game/CountryQuizList.tsx

@@ -9,7 +9,7 @@ import { useUserStore } from "@state/userStore.ts";
 import { useCountryDetails } from "@utils/hooks/useCountryDetails.ts";
 
 interface CountryQuizListProps {
-  quizList: CountryQuizzesQuery["quizList"];
+  quizList: CountryQuizzesQuery["quizzesByCountry"];
   isLoadingCountryQuizList: boolean;
 }
 

src/pages/Game/index.tsx

@@ -20,7 +20,7 @@ export function Component() {
     <div className="flex w-full flex-col items-center overflow-y-auto px-4 pb-4 pt-20 md:px-12 md:pt-24">
       <MapChart />
 
-      <CountryQuizList quizList={data?.quizList || []} isLoadingCountryQuizList={isLoadingCountryQuizList} />
+      <CountryQuizList quizList={data?.quizzesByCountry || []} isLoadingCountryQuizList={isLoadingCountryQuizList} />
     </div>
   );
 }

src/pages/Quiz/index.tsx

@@ -29,7 +29,7 @@ export function Component() {
   const { isAttemptRunning, quizAccordion, handleQuizAccordion } = useAttemptStore();
 
   const { data, loading, error } = useQuery(GET_QUIZ_BY_ID, { variables: { quizId: quizId || "" } });
-  const quiz = data?.quizList[0];
+  const quiz = data?.quizById;
 
   const countryDetails = useCountryDetails(quiz?.country || "");
 

src/pages/QuizResult/index.tsx

@@ -99,7 +99,7 @@ export function Component() {
         </Button>
       </div>
       <div className="flex w-full flex-col items-center md:flex-row md:items-start md:gap-5">
-        <section className="flex w-full flex-grow flex-col gap-4">
+        <section className="flex w-full flex-grow flex-col gap-4 md:w-3/5">
           <Typography variant="h2" className="mt-8 text-xl md:text-3xl">
             Review your answers
           </Typography>
@@ -128,7 +128,7 @@ export function Component() {
           </div>
         </section>
 
-        <section className="flex flex-col gap-3">
+        <section className="flex w-full flex-col gap-3 md:w-auto">
           <Typography variant="h2" className="mt-8 text-xl md:text-3xl">
             How are other users doing?
           </Typography>