diff --git a/web/components/Campaign/Places/Detail/CampaignPlaceDetail.tsx b/web/components/Campaign/Places/Detail/CampaignPlaceDetail.tsx index 739cec83..ffe0e223 100644 --- a/web/components/Campaign/Places/Detail/CampaignPlaceDetail.tsx +++ b/web/components/Campaign/Places/Detail/CampaignPlaceDetail.tsx @@ -83,7 +83,7 @@ const CampaignPlaceDetail = ({ place }: Props) => { )} - {Boolean(solidarityDisposNum && campaignDispos) && ( + {Boolean(solidarityDisposNum && campaignDisposNum) && ( )} diff --git a/web/components/Place/PlacesCampaignTabs.tsx b/web/components/Place/PlacesCampaignTabs.tsx new file mode 100644 index 00000000..be46fcb0 --- /dev/null +++ b/web/components/Place/PlacesCampaignTabs.tsx @@ -0,0 +1,123 @@ +import React, { useEffect, useState } from 'react' +import { + Tabs, + TabPanels, + TabPanel, + TabList, + Tab, + HStack, + Text, + Box, +} from '@chakra-ui/react' +import { format } from '~utils/date' +import Tag from '~components/Tag' +import { useTranslation } from 'next-i18next' +import PlacesPage from '~components/Place/PlacesPage' +import useCampaignContext from '~components/Campaign/useCampaignContext' +import { useRouter } from 'next/router' + +const PlacesCampaignTabs = () => { + const router = useRouter() + const { currentCampaign } = useCampaignContext() + const { t } = useTranslation('common') + const [selectedTab, setSelectedTab] = useState(0) + + useEffect(() => { + if (router.query.tab) { + setSelectedTab(parseInt(router.query.tab as string, 10) || 0) + } + }, [router.query.tab]) + + return ( + { + setSelectedTab(index) + router.push({ + pathname: router.pathname, + query: { ...router.query, tab: index }, + }) + }} + variant="enclosed" + index={selectedTab} + > + + + + + + {t('solidarity.title')} + + + + + + {currentCampaign?.title} + + + + {t('campaign.open', { + date: format( + new Date(currentCampaign?.limitDate), + 'd MMMM yyyy', + ), + })} + + + + + + + + + + + + + + + + + + ) +} + +export default PlacesCampaignTabs diff --git a/web/components/Place/PlacesPage.tsx b/web/components/Place/PlacesPage.tsx index f6f65d7b..59e7dae5 100644 --- a/web/components/Place/PlacesPage.tsx +++ b/web/components/Place/PlacesPage.tsx @@ -66,7 +66,7 @@ const PlacesPage = () => { useEffect(() => { setSearchParams({ ...initialFilters, ...formatSearch(router.query) }) - }, []) + }, [hasActiveCampaign, isCampaignTab]) const queryClient = useQueryClient() const { @@ -83,7 +83,10 @@ const PlacesPage = () => { isCampaignTab ? 'campaignPlaces' : 'solidarityPlaces', !campaignLoading, ) - const nbPlaces = useMemo(() => places?.pages?.flat().length, [places?.pages]) + const nbPlaces = useMemo(() => places?.pages?.flat().length, [ + places?.pages, + searchParams, + ]) const isPlural = useMemo(() => nbPlaces > 1, [nbPlaces]) useEffect(() => { diff --git a/web/components/Place/PlacesTab.tsx b/web/components/Place/PlacesTab.tsx deleted file mode 100644 index a538cddc..00000000 --- a/web/components/Place/PlacesTab.tsx +++ /dev/null @@ -1,114 +0,0 @@ -import React, { useEffect, useState } from 'react' -import { - Tabs, - TabPanels, - TabPanel, - TabList, - Tab, - HStack, - Text, -} from '@chakra-ui/react' -import { format } from '~utils/date' -import Tag from '~components/Tag' -import { useTranslation } from 'next-i18next' -import PlacesPage from '~components/Place/PlacesPage' -import useCampaignContext from '~components/Campaign/useCampaignContext' -import { useRouter } from 'next/router' - -const PlacesTabs = () => { - const router = useRouter() - const { currentCampaign } = useCampaignContext() - const { t } = useTranslation('common') - const [selectedTab, setSelectedTab] = useState(0) - - useEffect(() => { - if (router.query.tab) { - setSelectedTab(parseInt(router.query.tab as string, 10) || 0) - } - }, [router.query.tab]) - - return ( - { - setSelectedTab(index) - router.push({ - pathname: router.pathname, - query: { ...router.query, tab: index }, - }) - }} - variant="enclosed" - index={selectedTab} - > - - - - {t('solidarity.title')} - - - - - - {currentCampaign?.title} - - - - {t('campaign.open', { - date: format( - new Date(currentCampaign?.limitDate), - 'd MMMM yyyy', - ), - })} - - - - - - - - - - - - - - - ) -} - -export default PlacesTabs diff --git a/web/pages/espaces/index.tsx b/web/pages/espaces/index.tsx index 09c1700c..22722d6a 100644 --- a/web/pages/espaces/index.tsx +++ b/web/pages/espaces/index.tsx @@ -6,7 +6,7 @@ import { serverSideTranslations } from 'next-i18next/serverSideTranslations' import useCampaignContext from '~components/Campaign/useCampaignContext' import PlacesPage from '~components/Place/PlacesPage' -import PlacesTabs from '~components/Place/PlacesTab' +import PlacesCampaignTabs from '~components/Place/PlacesCampaignTabs' const Places = () => { const { currentCampaign } = useCampaignContext() @@ -14,7 +14,7 @@ const Places = () => { if (!currentCampaign || currentCampaign?.mode !== 'applications') return - return + return } export const getServerSideProps: GetServerSideProps = async ({