Upcoming events page

.eslintrc.json

@@ -1,7 +1,7 @@
 {
-  // "extends": 
+  // "extends":
   "extends": [
-    "next/core-web-vitals", 
+    "next/core-web-vitals",
     "prettier",
     "airbnb",
     "airbnb/hooks",
@@ -31,4 +31,4 @@
     "react/no-array-index-key": "off",
     "object-curly-newline": "off"
   }
-}
+}

.github/workflows/nextjs.yml

@@ -7,7 +7,7 @@ name: Deploy Next.js site to Pages
 on:
   # Runs on pushes targeting the default branch
   push:
-    branches: ["master"]
+    branches: ['master']
 
   # Allows you to run this workflow manually from the Actions tab
   workflow_dispatch:
@@ -21,7 +21,7 @@ permissions:
 # Allow only one concurrent deployment, skipping runs queued between the run in-progress and latest queued.
 # However, do NOT cancel in-progress runs as we want to allow these production deployments to complete.
 concurrency:
-  group: "pages"
+  group: 'pages'
   cancel-in-progress: false
 
 jobs:
@@ -51,7 +51,7 @@ jobs:
       - name: Setup Node
         uses: actions/setup-node@v4
         with:
-          node-version: "20"
+          node-version: '20'
           cache: ${{ steps.detect-package-manager.outputs.manager }}
       - name: Setup Pages
         uses: actions/configure-pages@v5

.prettierrc

@@ -1,6 +1,6 @@
 {
-    "trailingComma": "all",
-    "tabWidth": 2,
-    "semi": true,
-    "singleQuote": true
-  }
+  "trailingComma": "all",
+  "tabWidth": 2,
+  "semi": true,
+  "singleQuote": true
+}

.vscode/settings.json

@@ -1,3 +1,3 @@
 {
-    "editor.defaultFormatter": "esbenp.prettier-vscode"
-}
+  "editor.defaultFormatter": "esbenp.prettier-vscode"
+}

README.md

@@ -1,5 +1,4 @@
-IllinoisWCS.github.io
-=====================
+# IllinoisWCS.github.io
 
 ## About
 
@@ -14,18 +13,17 @@ To install and set up locally, first run `npm i` and then `npm run dev`. The app
 
 This application is built with Next.js
 
-
 ## Pull Requests
 
 Please never commit to master, even if you have permission.
 Run all changes by the Infrastructure Chairs. Here are the steps to making a change and solving an issue:
 
-1) Make a branch off ```master```. Please give it a descriptive message.
+1. Make a branch off `master`. Please give it a descriptive message.
 
-2) Commit your changes onto your branch.
+2. Commit your changes onto your branch.
 
-3) Push your branch changes.
+3. Push your branch changes.
 
-4) Once you're ready, create a pull request with base as the ```master```.
+4. Once you're ready, create a pull request with base as the `master`.
 
-5) Write a descriptive title and comment. You can reference the associated issue with a #.
+5. Write a descriptive title and comment. You can reference the associated issue with a #.

next.config.js

@@ -1,6 +1,6 @@
 /** @type {import('next').NextConfig} */
 const nextConfig = {
   reactStrictMode: true,
-}
+};
 
-module.exports = nextConfig
+module.exports = nextConfig;

public/assets/img/favicons/manifest.json

@@ -1,41 +1,41 @@
 {
- "name": "App",
- "icons": [
-  {
-   "src": "\/android-icon-36x36.png",
-   "sizes": "36x36",
-   "type": "image\/png",
-   "density": "0.75"
-  },
-  {
-   "src": "\/android-icon-48x48.png",
-   "sizes": "48x48",
-   "type": "image\/png",
-   "density": "1.0"
-  },
-  {
-   "src": "\/android-icon-72x72.png",
-   "sizes": "72x72",
-   "type": "image\/png",
-   "density": "1.5"
-  },
-  {
-   "src": "\/android-icon-96x96.png",
-   "sizes": "96x96",
-   "type": "image\/png",
-   "density": "2.0"
-  },
-  {
-   "src": "\/android-icon-144x144.png",
-   "sizes": "144x144",
-   "type": "image\/png",
-   "density": "3.0"
-  },
-  {
-   "src": "\/android-icon-192x192.png",
-   "sizes": "192x192",
-   "type": "image\/png",
-   "density": "4.0"
-  }
- ]
-}
+  "name": "App",
+  "icons": [
+    {
+      "src": "/android-icon-36x36.png",
+      "sizes": "36x36",
+      "type": "image/png",
+      "density": "0.75"
+    },
+    {
+      "src": "/android-icon-48x48.png",
+      "sizes": "48x48",
+      "type": "image/png",
+      "density": "1.0"
+    },
+    {
+      "src": "/android-icon-72x72.png",
+      "sizes": "72x72",
+      "type": "image/png",
+      "density": "1.5"
+    },
+    {
+      "src": "/android-icon-96x96.png",
+      "sizes": "96x96",
+      "type": "image/png",
+      "density": "2.0"
+    },
+    {
+      "src": "/android-icon-144x144.png",
+      "sizes": "144x144",
+      "type": "image/png",
+      "density": "3.0"
+    },
+    {
+      "src": "/android-icon-192x192.png",
+      "sizes": "192x192",
+      "type": "image/png",
+      "density": "4.0"
+    }
+  ]
+}

public/assets/img/favicons/site.webmanifest

@@ -1,19 +1,19 @@
 {
-    "name": "",
-    "short_name": "",
-    "icons": [
-        {
-            "src": "android-chrome-192x192.png",
-            "sizes": "192x192",
-            "type": "image/png"
-        },
-        {
-            "src": "android-chrome-512x512.png",
-            "sizes": "512x512",
-            "type": "image/png"
-        }
-    ],
-    "theme_color": "#ffffff",
-    "background_color": "#ffffff",
-    "display": "standalone"
+  "name": "",
+  "short_name": "",
+  "icons": [
+    {
+      "src": "android-chrome-192x192.png",
+      "sizes": "192x192",
+      "type": "image/png"
+    },
+    {
+      "src": "android-chrome-512x512.png",
+      "sizes": "512x512",
+      "type": "image/png"
+    }
+  ],
+  "theme_color": "#ffffff",
+  "background_color": "#ffffff",
+  "display": "standalone"
 }

src/components/events/UpcomingEvent.js

@@ -6,7 +6,8 @@ import styles from '@/styles/components/UpcomingEvent.module.css';
 
 export default function UpcomingEvent({
   title,
-  date,
+  dayOfWeek,
+  dayDate,
   time,
   location,
   description,
@@ -30,7 +31,8 @@ export default function UpcomingEvent({
           <div className={styles.container}>
             <h3 className={styles.title}>{title}</h3>
             <div className={styles.dateTime}>
-              <p>{date}</p>
+              <p>{dayOfWeek},</p>
+              <p>{dayDate}</p>
               <p>{time}</p>
             </div>
           </div>
@@ -39,7 +41,8 @@ export default function UpcomingEvent({
       <EventDescriptionModal
         data={{
           title,
-          date,
+          dayOfWeek,
+          dayDate,
           time,
           location,
           description,