diff --git a/client/src/modules/dashboard/Events/components/EventForm.tsx b/client/src/modules/dashboard/Events/components/EventForm.tsx index 3c83e427ef..9d96198d39 100644 --- a/client/src/modules/dashboard/Events/components/EventForm.tsx +++ b/client/src/modules/dashboard/Events/components/EventForm.tsx @@ -23,6 +23,10 @@ import { fields, formatValue, EventFormData, + sponsorTypes, + getAllowedSponsors, + getAllowedSponsorTypes, + getAllowedSponsorsForType, } from './EventFormUtils'; const EventForm: React.FC = (props) => { @@ -79,8 +83,6 @@ const EventForm: React.FC = (props) => { const watchSponsorsArray = watch('sponsors'); const inviteOnly = watch('invite_only'); - const firstSponsorType = sponsorData?.sponsors[0]?.type as string | undefined; - const firstSponsorId = sponsorData?.sponsors[0]?.id as number | undefined; return (
= (props) => { @@ -165,27 +181,45 @@ const EventForm: React.FC = (props) => { Sponsor Type - + {loadingSponsors ? ( +
loading sponsors
+ ) : errorSponsor || !sponsorData ? ( +
Error loading sponsors
+ ) : ( + + )}
@@ -204,29 +238,16 @@ const EventForm: React.FC = (props) => { valueAsNumber: true, })} > - {sponsorData.sponsors - ?.filter((sponsor) => { - const isRightSponsorType = - sponsor.type === - watchSponsorsArray[sponsorFieldId]?.type; - if (!isRightSponsorType) { - return false; - } - const selectedSponsorId = - watchSponsorsArray.findIndex( - (selectedSponsor) => - selectedSponsor.id === sponsor.id, - ); - const sponsorNotSelectedElsewhere = - selectedSponsorId === -1 || - selectedSponsorId === sponsorFieldId; - return sponsorNotSelectedElsewhere; - }) - .map((s) => ( - - ))} + {getAllowedSponsorsForType( + sponsorData, + watchSponsorsArray[sponsorFieldId].type, + watchSponsorsArray, + sponsorFieldId, + ).map((s) => ( + + ))} )} diff --git a/client/src/modules/dashboard/Events/components/EventFormUtils.ts b/client/src/modules/dashboard/Events/components/EventFormUtils.ts index 61953ab349..de4f51efe2 100644 --- a/client/src/modules/dashboard/Events/components/EventFormUtils.ts +++ b/client/src/modules/dashboard/Events/components/EventFormUtils.ts @@ -1,4 +1,4 @@ -import { Event, Venue } from '../../../../generated/graphql'; +import { Event, Venue, SponsorsQuery } from '../../../../generated/graphql'; export interface Field { key: keyof EventFormData; @@ -9,6 +9,34 @@ export interface Field { isRequired: boolean; } +export type sponsorType = { + name: string; + logo_path: string; + website: string; + type: string; + id: number; +}; + +export interface EventSponsorTypeInput { + name: string; + type: string; +} + +export const sponsorTypes: EventSponsorTypeInput[] = [ + { + name: 'Food', + type: 'FOOD', + }, + { + name: 'Venue', + type: 'VENUE', + }, + { + name: 'Other', + type: 'OTHER', + }, +]; + export interface EventSponsorInput { id: number; type: string; @@ -133,3 +161,64 @@ export const formatValue = (field: Field, store?: IEventData): any => { return store[key]; }; + +export const getAllowedSponsorTypes = ( + sponsorData: SponsorsQuery, + sponsorTypes: EventSponsorTypeInput[], + watchSponsorsArray: EventSponsorInput[], + sponsorFieldId: number, +) => + sponsorTypes.filter( + ({ type }) => + getAllowedSponsorsForType( + sponsorData, + type, + watchSponsorsArray, + sponsorFieldId, + ).length, + ); + +export const getAllowedSponsorsForType = ( + sponsorData: SponsorsQuery, + sponsorType: string, + watchSponsorsArray: EventSponsorInput[], + sponsorFieldId?: number, +) => + sponsorData.sponsors.filter( + (sponsor) => + sponsor.type === sponsorType && + !isSponsorSelectedElsewhere(sponsor, watchSponsorsArray, sponsorFieldId), + ); + +export const getAllowedSponsors = ( + sponsorData: SponsorsQuery, + watchSponsorsArray: EventSponsorInput[], + sponsorFieldId?: number, +) => + sponsorData.sponsors.filter( + (sponsor) => + !isSponsorSelectedElsewhere(sponsor, watchSponsorsArray, sponsorFieldId), + ); + +const getSelectedFieldIdForSponsor = ( + sponsor: EventSponsorInput, + watchSponsorsArray: EventSponsorInput[], +) => + watchSponsorsArray.findIndex( + (selectedSponsor) => selectedSponsor.id === sponsor.id, + ); + +const isSponsorSelectedElsewhere = ( + sponsor: EventSponsorInput, + watchSponsorsArray: EventSponsorInput[], + sponsorFieldId?: number, +) => { + const selectedFieldId = getSelectedFieldIdForSponsor( + sponsor, + watchSponsorsArray, + ); + return ( + selectedFieldId !== -1 && + (sponsorFieldId === undefined || selectedFieldId !== sponsorFieldId) + ); +}; diff --git a/client/src/modules/dashboard/Events/components/EventSponsorCard.tsx b/client/src/modules/dashboard/Events/components/EventSponsorCard.tsx index fdcf23fd83..a08aeeb64b 100644 --- a/client/src/modules/dashboard/Events/components/EventSponsorCard.tsx +++ b/client/src/modules/dashboard/Events/components/EventSponsorCard.tsx @@ -1,12 +1,6 @@ import { Box, Heading, Flex, Spacer, Link, Badge } from '@chakra-ui/react'; import React from 'react'; -type sponsorType = { - name: string; - logo_path: string; - website: string; - type: string; - id: number; -}; +import { sponsorType } from './EventFormUtils'; interface SponsorProps { sponsor: sponsorType;