From 76b3472f99eca8bc6920ccdc2f39bb44fb2e46cc Mon Sep 17 00:00:00 2001 From: Justin Edmund Date: Tue, 4 Jul 2023 02:18:49 -0700 Subject: [PATCH] Final nuclear option of getting raids to populate No matter what I do, raids won't populate from state specifically in production. I will have to investigate this more, but for now we are going with the nuclear option of passing raids down from the context object we get from SSR through all components into RaidCombobox --- components/filters/FilterBar/index.tsx | 2 ++ components/party/EditPartyModal/index.tsx | 3 ++ components/party/Party/index.tsx | 3 ++ components/party/PartyFooter/index.tsx | 2 ++ components/party/PartyHeader/index.tsx | 2 ++ components/raids/RaidCombobox/index.tsx | 41 +++++++++-------------- pages/[username].tsx | 1 + pages/new/index.tsx | 1 + pages/p/[party].tsx | 1 + pages/saved.tsx | 1 + pages/teams.tsx | 1 + 11 files changed, 33 insertions(+), 25 deletions(-) diff --git a/components/filters/FilterBar/index.tsx b/components/filters/FilterBar/index.tsx index aea4ed38..8be8e831 100644 --- a/components/filters/FilterBar/index.tsx +++ b/components/filters/FilterBar/index.tsx @@ -22,6 +22,7 @@ interface Props { scrolled: boolean element?: number raid?: string + raidGroups: RaidGroup[] recency?: number onFilter: (filters: FilterSet) => void onAdvancedFilter: (filters: FilterSet) => void @@ -147,6 +148,7 @@ const FilterBar = (props: Props) => { void updateParty: (details: DetailsObject) => Promise } const EditPartyModal = ({ open, + raidGroups, updateParty, onOpenChange, ...props @@ -425,6 +427,7 @@ const EditPartyModal = ({ ) diff --git a/components/party/Party/index.tsx b/components/party/Party/index.tsx index 80072c51..b6206b75 100644 --- a/components/party/Party/index.tsx +++ b/components/party/Party/index.tsx @@ -28,6 +28,7 @@ interface Props { new?: boolean team?: Party selectedTab: GridType + raidGroups: RaidGroup[] handleTabChanged: (value: string) => void pushHistory?: (path: string) => void } @@ -440,6 +441,7 @@ const Party = (props: Props) => { party={props.team} new={props.new || false} editable={props.new ? true : party.editable} + raidGroups={props.raidGroups} deleteCallback={deleteTeam} remixCallback={remixTeam} updateCallback={updateDetails} @@ -453,6 +455,7 @@ const Party = (props: Props) => { party={props.team} new={props.new || false} editable={party.editable} + raidGroups={props.raidGroups} remixCallback={remixTeam} updateCallback={updateDetails} /> diff --git a/components/party/PartyFooter/index.tsx b/components/party/PartyFooter/index.tsx index 8195fc04..5b05a218 100644 --- a/components/party/PartyFooter/index.tsx +++ b/components/party/PartyFooter/index.tsx @@ -33,6 +33,7 @@ interface Props { party?: Party new: boolean editable: boolean + raidGroups: RaidGroup[] remixCallback: () => void updateCallback: (details: DetailsObject) => Promise } @@ -225,6 +226,7 @@ const PartyFooter = (props: Props) => { diff --git a/components/party/PartyHeader/index.tsx b/components/party/PartyHeader/index.tsx index 56de24c7..d394894d 100644 --- a/components/party/PartyHeader/index.tsx +++ b/components/party/PartyHeader/index.tsx @@ -33,6 +33,7 @@ interface Props { party?: Party new: boolean editable: boolean + raidGroups: RaidGroup[] deleteCallback: () => void remixCallback: () => void updateCallback: (details: DetailsObject) => Promise @@ -383,6 +384,7 @@ const PartyHeader = (props: Props) => { diff --git a/components/raids/RaidCombobox/index.tsx b/components/raids/RaidCombobox/index.tsx index 382e2938..045846d3 100644 --- a/components/raids/RaidCombobox/index.tsx +++ b/components/raids/RaidCombobox/index.tsx @@ -1,4 +1,4 @@ -import { createRef, useCallback, useEffect, useState, useRef } from 'react' +import { createRef, useCallback, useEffect, useState } from 'react' import { useRouter } from 'next/router' import { useTranslation } from 'react-i18next' import classNames from 'classnames' @@ -10,20 +10,6 @@ import Segment from '~components/common/Segment' import RaidItem from '~components/raids/RaidItem' import Tooltip from '~components/common/Tooltip' -import api from '~utils/api' -import { appState } from '~utils/appState' - -interface Props { - showAllRaidsOption: boolean - currentRaid?: Raid - defaultRaid?: Raid - minimal?: boolean - tabIndex?: number - size?: 'small' | 'medium' | 'large' - onChange?: (raid?: Raid) => void - onBlur?: (event: React.ChangeEvent) => void -} - import Button from '~components/common/Button' import ArrowIcon from '~public/icons/Arrow.svg' import CrossIcon from '~public/icons/Cross.svg' @@ -67,6 +53,18 @@ const allRaidsOption: Raid = { element: 0, } +interface Props { + showAllRaidsOption: boolean + currentRaid?: Raid + defaultRaid?: Raid + raidGroups: RaidGroup[] + minimal?: boolean + tabIndex?: number + size?: 'small' | 'medium' | 'large' + onChange?: (raid?: Raid) => void + onBlur?: (event: React.ChangeEvent) => void +} + const RaidCombobox = (props: Props) => { // Set up router for locale const router = useRouter() @@ -114,12 +112,12 @@ const RaidCombobox = (props: Props) => { useEffect(() => { const sections: [RaidGroup[], RaidGroup[], RaidGroup[]] = [[], [], []] - appState.raidGroups.forEach((group) => { + props.raidGroups.forEach((group) => { if (group.section > 0) sections[group.section - 1].push(group) }) - if (appState.raidGroups[0]) { - setFarmingRaid(appState.raidGroups[0].raids[0]) + if (props.raidGroups[0]) { + setFarmingRaid(props.raidGroups[0].raids[0]) } setSections(sections) @@ -521,13 +519,6 @@ const RaidCombobox = (props: Props) => { // ---------------------------------------------- // Methods: Utility // ---------------------------------------------- - function slugToRaid(slug: string) { - return appState.raidGroups - .filter((group) => group.section > 0) - .flatMap((group) => group.raids) - .find((raid) => raid.slug === slug) - } - const linkClass = classNames({ wind: currentRaid && currentRaid.element == 1, fire: currentRaid && currentRaid.element == 2, diff --git a/pages/[username].tsx b/pages/[username].tsx index 0f39a677..d462e2b6 100644 --- a/pages/[username].tsx +++ b/pages/[username].tsx @@ -278,6 +278,7 @@ const ProfileRoute: React.FC = ({ scrolled={scrolled} element={element} raid={raid} + raidGroups={context.raidGroups} recency={recency} > diff --git a/pages/new/index.tsx b/pages/new/index.tsx index b0ecbc0e..61ee0ebe 100644 --- a/pages/new/index.tsx +++ b/pages/new/index.tsx @@ -150,6 +150,7 @@ const NewRoute: React.FC = ({ new={true} pushHistory={callback} selectedTab={selectedTab} + raidGroups={context.raidGroups} handleTabChanged={handleTabChange} /> diff --git a/pages/p/[party].tsx b/pages/p/[party].tsx index e9018904..10b08b75 100644 --- a/pages/p/[party].tsx +++ b/pages/p/[party].tsx @@ -128,6 +128,7 @@ const PartyRoute: React.FC = ({ diff --git a/pages/saved.tsx b/pages/saved.tsx index 4e1d8cc6..80d2fc4e 100644 --- a/pages/saved.tsx +++ b/pages/saved.tsx @@ -318,6 +318,7 @@ const SavedRoute: React.FC = ({ scrolled={scrolled} element={element} raid={raid} + raidGroups={context.raidGroups} recency={recency} >

{t('saved.title')}

diff --git a/pages/teams.tsx b/pages/teams.tsx index 4cb1e840..cd21d70a 100644 --- a/pages/teams.tsx +++ b/pages/teams.tsx @@ -329,6 +329,7 @@ const TeamsRoute: React.FC = ({ scrolled={scrolled} element={element} raid={raid} + raidGroups={context.raidGroups} recency={recency} >

{t('teams.title')}