Now uses DateElement component.

Student-Chapter-CSE · Aug 19, 2023 · a4924c0 · a4924c0
1 parent 8f035b6
commit a4924c0
Show file tree

Hide file tree

Showing 2 changed files with 6 additions and 38 deletions.
diff --git a/client/component/Event/index.jsx b/client/component/Event/index.jsx
@@ -1,27 +1,11 @@
 import styles from '../../styles/Event.module.css';
 import Image from 'next/image';
 import { useEffect, useRef } from 'react';
+import DateElement from '../Date/date';
 
 const Event = ({ img, heading, content, date, category, registrationLink }) => {
     const descRef = useRef()
 
-    function nth(d) {
-        const dString = String(d)
-        const last = +dString.slice(-2)
-        if (last > 3 && last < 21) return 'th'
-        switch (last % 10) {
-            case 1: return "st"
-            case 2: return "nd"
-            case 3: return "rd"
-            default: return "th"
-        }
-    }
-
-    function dateToText(date) {
-        const months = ["January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December"]
-        return `${date.getDate()}${nth(date.getDate())}  ${months[date.getMonth()]}, ${date.getFullYear()}`
-    }
-
     useEffect(() => {
         // I know this is bad but I don't have any
         // other option T_T
@@ -40,7 +24,7 @@ const Event = ({ img, heading, content, date, category, registrationLink }) => {
                         <h2 className={styles.contentHeader}>{heading}</h2>
 
                         <div className={styles.date}>
-                            <h3>{dateToText(date)}</h3>
+                            <h3><DateElement date={date} /></h3>
                         </div>
 
                         <div className={styles.contentContent} ref={descRef}>

diff --git a/client/component/Upcoming/index.jsx b/client/component/Upcoming/index.jsx
@@ -3,6 +3,7 @@ import Link from 'next/link';
 import useMediaQuery from '../../hooks/useMediaQuery';
 import { SponsorList } from '../Sponsor';
 import { useEffect, useRef } from 'react';
+import DateElement from '../Date/date';
 
 export default function UpcomingEvents({ events }) {
     return (
@@ -45,32 +46,15 @@ function Card({ details, descriptionMaxLength = 200 }) {
     useEffect(() => {
         contentRef.current.innerHTML = details.content
     })
-
-    function nth(d) {
-        const dString = String(d)
-        const last = +dString.slice(-2)
-        if (last > 3 && last < 21) return 'th'
-        switch (last % 10) {
-            case 1: return "st"
-            case 2: return "nd"
-            case 3: return "rd"
-            default: return "th"
-        }
-    }
-
-    function dateToText(date) {
-        const months = ["January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December"]
-        return `${date.getDate()}${nth(date.getDate())}  ${months[date.getMonth()]}, ${date.getFullYear()}`
-    }
-
+
     function gotoLink(link) {
         /* TODO */
     }
 
     return (
         <div className={styles.card}>
             <div className={styles.cardImg}>
-                <img src='/static/assets/ih_1.png'></img>
+                <img src={details.bannerImgUrl}></img>
             </div>
             <div className={styles.cardContent}>
                 <div className={styles.cardContent_Left}>
@@ -79,7 +63,7 @@ function Card({ details, descriptionMaxLength = 200 }) {
                             {details && details.heading}
                         </div>
                         <div className={styles.cardDate}>{
-                            details && details.date && dateToText(details.date)
+                            details && details.date && <DateElement date={details.date}/>
                         }</div>
                     </div>
                     {