Strikethrough nomination if dropped out

Signed-off-by: miam-miam100 <[email protected]>
ecss-soton · Mar 2, 2024 · 756782a · 756782a
1 parent 6ec4921
commit 756782a
Show file tree

Hide file tree

Showing 3 changed files with 35 additions and 7 deletions.
diff --git a/src/app/(pages)/elections/page.tsx b/src/app/(pages)/elections/page.tsx
@@ -78,6 +78,7 @@ export default async function Elections() {
               positions={positions}
               electionId={id}
               canCreateNominations={canCreateNomination}
+              user={user}
             />
           </Fragment>
         )

diff --git a/src/app/_components/Nominations/index.tsx b/src/app/_components/Nominations/index.tsx
@@ -24,8 +24,9 @@ import classes from './index.module.scss'
 export const Nominations: React.FC<{
   positionId?: string
   electionId?: string
+  user?: User
 }> = props => {
-  const { positionId, electionId } = props
+  const { positionId, electionId, user } = props
 
   let [nominations, setNominations] = useState<Nomination[] | null>(null)
 
@@ -37,7 +38,14 @@ export const Nominations: React.FC<{
           where: {
             and: [
               {
-                droppedOut: { equals: false },
+                or: [
+                  {
+                    droppedOut: { equals: false },
+                  },
+                  {
+                    nominees: { contains: user.id },
+                  },
+                ],
               },
               { election: { equals: electionId } },
               { position: { equals: positionId } },
@@ -61,17 +69,28 @@ export const Nominations: React.FC<{
       }
     }
     getPositions().then(setNominations)
-  }, [positionId, electionId])
+  }, [user, positionId, electionId])
+  // underline nickname when the nomination has dropped out
   return (
     <div>
       {nominations?.map((nomination, index) => {
         const { id, supporters, populatedNominees, nickname } = nomination
         const nomineeNames = populatedNominees.map(n => n.name).join(' & ')
         const usernames = populatedNominees.map(n => n.username).join(', ')
+        const droppedOut = nomination.droppedOut
         return (
           <Fragment key={id}>
             <h5>
-              {nickname ?? nomineeNames} ({usernames}){' '}
+              {droppedOut && (
+                <s>
+                  {nickname ?? nomineeNames} ({usernames}){' '}
+                </s>
+              )}
+              {!droppedOut && (
+                <span>
+                  {nickname ?? nomineeNames} ({usernames}){' '}
+                </span>
+              )}
               <SupportNomination nominationId={id} supporters={supporters} />
             </h5>
           </Fragment>

diff --git a/src/app/_components/Positions/index.tsx b/src/app/_components/Positions/index.tsx
@@ -3,7 +3,14 @@ import React, { Fragment, useEffect, useState } from 'react'
 import Link from 'next/link'
 import qs from 'qs'
 
-import { Election, Media, Nomination, Position, Sponsor } from '../../../payload/payload-types'
+import {
+  Election,
+  Media,
+  Nomination,
+  Position,
+  Sponsor,
+  User,
+} from '../../../payload/payload-types'
 import { Button } from '../Button'
 import { Gutter } from '../Gutter'
 import { CMSLinkType } from '../Link'
@@ -18,8 +25,9 @@ export const Positions: React.FC<{
   positions?: Position[]
   electionId?: string
   canCreateNominations?: boolean
+  user?: User
 }> = props => {
-  const { positions, electionId, canCreateNominations } = props
+  const { user, positions, electionId, canCreateNominations } = props
 
   // const { slug, title, categories, meta } = doc || {}
   // const { description, image: metaImage } = meta || {}
@@ -45,7 +53,7 @@ export const Positions: React.FC<{
                 label={'Create Nomination'}
               ></Button>
             )}
-            <Nominations positionId={position.id} electionId={electionId} />
+            <Nominations positionId={position.id} electionId={electionId} user={user} />
           </Fragment>
         )
       })}