Update

apps/intermediate-next/index.d.ts

@@ -1,6 +1,7 @@
 /* eslint-disable @typescript-eslint/no-explicit-any */
-declare module '*.svg' {
-  const content: any
-  export const ReactComponent: any
-  export default content
-}
+// not required for this project...
+// declare module '*.svg' {
+//   const content: any
+//   export const ReactComponent: any
+//   export default content
+// }

apps/intermediate-next/src/app/dashboard/@events/page.tsx

@@ -2,14 +2,15 @@ import { getEventsForDashboard } from '../../../utils/events'
 import { getCurrentUser } from '../../../utils/users'
 import { Chip } from '@nextui-org/react'
 import Link from 'next/link'
+import { type StatusColours } from '../types/dashboard.types'
 
 const statusColors = {
   draft: 'warning',
   live: 'success',
   started: 'primary',
-  ended: 'disabled',
+  ended: 'secondary',
   canceled: 'danger',
-}
+} satisfies StatusColours
 
 const EventsRsvp = async () => {
   const user = await getCurrentUser()

apps/intermediate-next/src/app/dashboard/@rsvps/page.tsx

@@ -2,12 +2,14 @@ import { getRsvpsForDashboard } from '../../../utils/rsvps'
 import { getCurrentUser } from '../../../utils/users'
 import { Chip } from '@nextui-org/react'
 import Link from 'next/link'
+import { type StatusColours } from '../types/dashboard.types'
 
 const statusColors = {
   going: 'primary',
   maybe: 'warning',
   'not-going': 'danger',
-}
+} satisfies StatusColours
+
 const RsvpsSlot = async () => {
   const user = await getCurrentUser()
   const data = await getRsvpsForDashboard(user.id)
@@ -17,26 +19,33 @@ const RsvpsSlot = async () => {
       <div className="w-full">
         <h2 className="text-center text-xl">{`RSVPs`}</h2>
         <div className="rounded-md border border-default-100 my-8">
-          {data.map(({ rsvps, events, attendees }) => (
-            <div
-              key={rsvps.id}
-              className="border-b border-default-100 p-2 flex gap-2"
-            >
-              <span>{attendees.name}</span>
-              <span>
-                <Chip size="sm" color={statusColors[rsvps?.status]}>
-                  {rsvps?.status}
-                </Chip>
-              </span>
-              <span>
-                <Link href={`/dashboard/events/${events.id}`}>
-                  <Chip size="sm" variant="faded">
-                    {events?.name}
-                  </Chip>
-                </Link>
-              </span>
-            </div>
-          ))}
+          {data.map(
+            ({ rsvps, events, attendees }) =>
+              rsvps &&
+              events && (
+                <div
+                  key={rsvps.id}
+                  className="border-b border-default-100 p-2 flex gap-2"
+                >
+                  <span>{attendees.name}</span>
+                  <span>
+                    <Chip
+                      size="sm"
+                      color={rsvps?.status && statusColors[rsvps.status]}
+                    >
+                      {rsvps?.status}
+                    </Chip>
+                  </span>
+                  <span>
+                    <Link href={`/dashboard/events/${events.id}`}>
+                      <Chip size="sm" variant="faded">
+                        {events?.name}
+                      </Chip>
+                    </Link>
+                  </span>
+                </div>
+              )
+          )}
         </div>
       </div>
     </div>

apps/intermediate-next/src/app/dashboard/types/dashboard.types.ts

@@ -0,0 +1,10 @@
+export type StatusColours = {
+  [key: string]:
+    | 'primary'
+    | 'warning'
+    | 'danger'
+    | 'default'
+    | 'secondary'
+    | 'success'
+    | undefined
+}

apps/intermediate-next/tsconfig.json

@@ -16,10 +16,7 @@
         "name": "next"
       }
     ],
-    "types": [
-      "jest",
-      "node"
-    ]
+    "types": ["jest", "node"]
   },
   "include": [
     "**/*.ts",
@@ -29,12 +26,8 @@
     "../../apps/intermediate-next/.next/types/**/*.ts",
     "../../dist/apps/intermediate-next/.next/types/**/*.ts",
     "next-env.d.ts",
-    ".next/types/**/*.ts"
+    ".next/types/**/*.ts",
+    "postcss.config.mjs"
   ],
-  "exclude": [
-    "node_modules",
-    "jest.config.ts",
-    "**/*.spec.ts",
-    "**/*.test.ts"
-  ]
+  "exclude": ["node_modules", "jest.config.ts", "**/*.spec.ts", "**/*.test.ts"]
 }