Updated LandingPage component to display only current year's landing …

…pages, fixed landing page scaling
UofT-Frosh-Orientation · Jun 4, 2024 · 889cc8e · 889cc8e
1 parent f0e3705
commit 889cc8e
Show file tree

Hide file tree

Showing 2 changed files with 54 additions and 38 deletions.
diff --git a/client/src/pages/Initial/AshLanding/AshLanding.scss b/client/src/pages/Initial/AshLanding/AshLanding.scss
@@ -73,7 +73,7 @@ hr.line {
   display: flex;
   justify-content: center;
   align-items: center;
-  width: 420px;
+  width: 405px;
   margin: 0 auto;
   padding: 10px 20px;
   border-radius: 100px;
@@ -189,6 +189,10 @@ a:active {
     grid-template-columns: 1fr;
   }
 
+  .button-text {
+    font-size: 10px;
+  }
+
   .footer-text {
     font-size: 8px;
     letter-spacing: 0.1em;

diff --git a/client/src/pages/Initial/LandingPage.jsx b/client/src/pages/Initial/LandingPage.jsx
@@ -5,62 +5,74 @@ import { TanuLanding } from './TanuLanding/TanuLanding';
 import { UzmaLanding } from './UzmaLanding/UzmaLanding';
 import { NatLanding } from './NatLanding/NatLanding';
 import { SherryLanding } from './SherryLanding/SherryLanding';
-import { AshLanding } from './AshLanding/AshLanding';
 
 // F!rosh 2T4 Landing Pages
+import { AshLanding } from './AshLanding/AshLanding';
+
+const currentYear = '2T4';
 
 const landingPages = [
   {
     key: 0,
+    component: <TanuLanding />,
+    year: '2T3',
+  },
+  {
+    key: 1,
+    component: <UzmaLanding />,
+    year: '2T3',
+  },
+  {
+    key: 2,
+    component: <NatLanding />,
+    year: '2T3',
+  },
+  {
+    key: 3,
+    component: <SherryLanding />,
+    year: '2T3',
+  },
+  {
+    key: 4,
     component: <AshLanding />,
+    year: '2T4',
   },
-  // {
-  //   key: 1,
-  //   component: <TanuLanding />,
-  // },
-  // {
-  //   key: 2,
-  //   component: <UzmaLanding />,
-  // },
-  // {
-  //   key: 3,
-  //   component: <NatLanding />,
-  // },
-  // {
-  //   key: 4,
-  //   component: <SherryLanding />,
-  // },
 ];
 
+// Change this logic to determine which landing pages to show
+const landingPagesFiltered = landingPages.filter((page) => page.year === currentYear);
+
 function randomNumber(min, max) {
   return Math.floor(Math.random() * (max - min + 1) + min);
 }
 
 export const LandingPage = () => {
-  // const [pageIndex, setPageIndex] = useState(null);
+  const [pageIndex, setPageIndex] = useState(null);
+  useEffect(() => {
+    if (landingPagesFiltered.length !== 1) {
+      let randIdx = randomNumber(0, landingPagesFiltered.length - 1);
+      const localIdx = window.localStorage.getItem('landing_page_idx');
 
-  // useEffect(() => {
-  //   let randIdx = randomNumber(0, landingPages.length - 1);
-  //   const localIdx = window.localStorage.getItem('landing_page_idx');
-
-  //   if (localIdx !== null) {
-  //     while (randIdx === JSON.parse(localIdx)) {
-  //       randIdx = randomNumber(0, landingPages.length - 1);
-  //     }
-  //   }
-  //   window.localStorage.setItem('landing_page_idx', JSON.stringify(randIdx));
-
-  //   setPageIndex(JSON.parse(randIdx));
-  // }, []);
+      if (localIdx !== null) {
+        while (randIdx === JSON.parse(localIdx)) {
+          randIdx = randomNumber(0, landingPagesFiltered.length - 1);
+        }
+      }
+      window.localStorage.setItem('landing_page_idx', JSON.stringify(randIdx));
+      setPageIndex(JSON.parse(randIdx));
+    }
+  }, []);
 
   return (
     <>
-      {/* {landingPages.map((item) => {
-        if (item.key == pageIndex) {
-          return <div key={item.key}>{item.component}</div>;
-        }
-      })} */}
-      <AshLanding />
+      {landingPagesFiltered.length === 1
+        ? landingPagesFiltered[0].component
+        : landingPagesFiltered.map((item) => {
+            if (item.key === pageIndex) {
+              return <div key={item.key}>{item.component}</div>;
+            }
+            return null;
+          })}
     </>
   );
 };