Place campaign detail fixes 01/03 (#99)

AtelierdeParis · Mar 1, 2024 · 885ba20 · 885ba20
1 parent f61eb7d
commit 885ba20
Show file tree

Hide file tree

Showing 13 changed files with 83 additions and 55 deletions.
diff --git a/back/extensions/documentation/documentation/1.0.0/full_documentation.json b/back/extensions/documentation/documentation/1.0.0/full_documentation.json
@@ -14,7 +14,7 @@
       "name": "Apache 2.0",
       "url": "https://www.apache.org/licenses/LICENSE-2.0.html"
     },
-    "x-generation-date": "03/01/2024 1:25:41 PM"
+    "x-generation-date": "03/01/2024 1:43:19 PM"
   },
   "x-strapi-config": {
     "path": "/documentation",

diff --git a/web/components/Campaign/Places/Application/CampaignApplicationScheduleItem.tsx b/web/components/Campaign/Places/Application/CampaignApplicationScheduleItem.tsx
@@ -77,30 +77,32 @@ const CampaignApplicationScheduleItem = ({
     [selected, disponibility],
   )
 
-  const handleClick = (e) => {
-    if (isSelected) {
-      setSelected(
-        //@ts-expect-error
-        selected.filter((el) => el.extendedProps.id !== disponibility.id),
-      )
-    } else {
-      setSelected([
-        ...selected,
-        {
-          ...event,
-          extendedProps: { ...event?.extendedProps, isCampaignEvent: true },
-        },
-      ])
-    }
-  }
-
   const isDisabled =
     !!user &&
     (!canApply ||
       applications?.find(
         (application) => application?.disponibility === disponibility.id,
       ))
 
+  const handleClick = (e) => {
+    if (!isDisabled) {
+      if (isSelected) {
+        setSelected(
+          //@ts-expect-error
+          selected.filter((el) => el.extendedProps.id !== disponibility.id),
+        )
+      } else {
+        setSelected([
+          ...selected,
+          {
+            ...event,
+            extendedProps: { ...event?.extendedProps, isCampaignEvent: true },
+          },
+        ])
+      }
+    }
+  }
+
   return (
     <HStack
       p={4}
@@ -111,12 +113,12 @@ const CampaignApplicationScheduleItem = ({
       border={isSelected ? '2px solid #6EAE7F' : '2px solid transparent'}
       borderRadius="8px"
       opacity={isDisabled ? 0.5 : 1}
-      cursor="pointer"
+      cursor={isDisabled ? 'not-allowed' : 'pointer'}
       onClick={(e) => {
         e.stopPropagation()
         handleClick(e)
       }}
-      _hover={{ border: '2px solid #6EAE7F' }}
+      _hover={!isDisabled && { border: '2px solid #6EAE7F' }}
       transition="border 0.3s ease-in-out"
     >
       <Checkbox

diff --git a/web/components/Campaign/Places/Detail/CampaignDetailSwitcher.tsx b/web/components/Campaign/Places/Detail/CampaignDetailSwitcher.tsx
@@ -34,7 +34,7 @@ const CampaignDetailSwitcher = ({
             { title: currentCampaign?.title },
           )}
         </Text>
-        <Text as="span">
+        <Text as="span" pl={1}>
           {t(
             `detail.campaign.${
               isCampaignTab

diff --git a/web/components/Campaign/Places/Detail/CampaignDetailTabs.tsx b/web/components/Campaign/Places/Detail/CampaignDetailTabs.tsx
@@ -5,7 +5,11 @@ import { useRouter } from 'next/router'
 import { useContext, useEffect, useState } from 'react'
 import BookingScheduleContext from '~components/Place/Booking/BookingScheduleContext'
 
-const CampaignDetailTabs = () => {
+const CampaignDetailTabs = ({
+  hasSolidarityDispo,
+}: {
+  hasSolidarityDispo: boolean
+}) => {
   const { currentCampaign } = useCampaignContext()
   const { t } = useTranslation('place')
   const router = useRouter()
@@ -34,15 +38,17 @@ const CampaignDetailTabs = () => {
       borderRadius="18px"
       padding={2}
     >
-      <Button
-        height="auto"
-        variant={isCampaignTab ? 'unSelected' : 'blueFill'}
-        onClick={() => handleTabClick('0')}
-        padding="9px 15px 9px 15px"
-        borderRadius="12px"
-      >
-        {t('detail.campaign.solidarity_slot')}
-      </Button>
+      {hasSolidarityDispo && (
+        <Button
+          height="auto"
+          variant={isCampaignTab ? 'unSelected' : 'blueFill'}
+          onClick={() => handleTabClick('0')}
+          padding="9px 15px 9px 15px"
+          borderRadius="12px"
+        >
+          {t('detail.campaign.solidarity_slot')}
+        </Button>
+      )}
       <Button
         height="auto"
         variant={isCampaignTab ? 'campaign' : 'unSelected'}

diff --git a/web/components/Campaign/Places/Detail/CampaignPlaceDetail.tsx b/web/components/Campaign/Places/Detail/CampaignPlaceDetail.tsx
@@ -40,7 +40,9 @@ const CampaignPlaceDetail = ({ place }: Props) => {
     )
   }, [place])
 
-  const { campaignDispos } = useCampaignDispo(place?.disponibilities)
+  const { campaignDispos, solidarityDisposNum } = useCampaignDispo(
+    place?.disponibilities,
+  )
 
   return (
     <Box>
@@ -60,7 +62,9 @@ const CampaignPlaceDetail = ({ place }: Props) => {
           </Box>
 
           <VStack spacing={2}>
-            <CampaignDetailTabs />
+            <CampaignDetailTabs
+              hasSolidarityDispo={Boolean(solidarityDisposNum)}
+            />
             <PlaceDetailMainInfo
               place={place}
               displayPrecise={displayPrecise}

diff --git a/web/components/Home/HomePlacesCampaign.tsx b/web/components/Home/HomePlacesCampaign.tsx
@@ -19,11 +19,7 @@ import Tag from '~components/Tag'
 import useCampaignContext from '~components/Campaign/useCampaignContext'
 import HomeHelperCampaign from '~components/Campaign/HomeHelperCampaign'
 
-interface Props {
-  isCampaignListing?: boolean
-}
-
-const HomePlacesCampaign = ({ isCampaignListing }: Props) => {
+const HomePlacesCampaign = () => {
   const isLgOrSm = useBreakpointValue({
     base: false,
     sm: true,

diff --git a/web/components/Home/HomePlacesSolidarity.tsx b/web/components/Home/HomePlacesSolidarity.tsx
@@ -33,7 +33,14 @@ const HomePlacesSolidarity = () => {
     _sort: 'dispoAsc',
   })
 
-  if (!places || places.length === 0) return null
+  // We should only display places that have solidarity slots available
+  const filteredPlaces = places?.filter((place) =>
+    place.disponibilities.some((disponibility) => {
+      return disponibility.campaign === null
+    }),
+  )
+
+  if (!filteredPlaces || filteredPlaces.length === 0) return null
 
   return (
     <Box py={4} w="100%">
@@ -51,7 +58,7 @@ const HomePlacesSolidarity = () => {
       {currentCampaign?.mode === 'applications' && <HomeHelperSolidarity />}
 
       <PlaceGrid
-        places={places.slice(0, isLgOrSm ? 4 : 3)}
+        places={filteredPlaces.slice(0, isLgOrSm ? 4 : 3)}
         gridMode={
           currentCampaign?.mode === 'applications' ? 'solidarity' : null
         }

diff --git a/web/components/Place/OtherPlaces.tsx b/web/components/Place/OtherPlaces.tsx
@@ -5,6 +5,7 @@ import Arrow from 'public/assets/img/arrow-bottom.svg'
 import { useUser } from '~hooks/useUser'
 import PlaceGrid from '~components/Place/PlaceGrid'
 import { useRouter } from 'next/router'
+import { usePlaces } from '~hooks/usePlaces'
 
 interface Props {
   userId: string
@@ -14,13 +15,18 @@ const OtherPlaces = ({ userId }: Props) => {
   const router = useRouter()
   const { t } = useTranslation('place')
   const { data: user } = useUser(userId)
+  const { tab, id } = router?.query
 
-  const places = useMemo(() => {
-    if (!user?.espaces || user?.espaces.length === 0) return null
-    return user?.espaces.filter(
-      (place) => place.slug !== router.query.id && place.published,
-    )
-  }, [user?.espaces, router.query.placeId])
+  const { data: places } = usePlaces(
+    {
+      published_eq: true,
+      users_permissions_user: userId,
+      slug_ne: id,
+      _limit: 20,
+      _sort: 'dispoAsc',
+    },
+    'otherPlaces',
+  )
 
   if (!places || places.length === 0) return null
 
@@ -34,7 +40,7 @@ const OtherPlaces = ({ userId }: Props) => {
           {t('detail.otherPlaces', { name: user?.structureName })}
         </Text>
       </Flex>
-      <PlaceGrid places={places} />
+      <PlaceGrid places={places} gridMode={tab ? 'solidarity' : null} />
     </Box>
   )
 }

diff --git a/web/components/Place/PlaceGridCard.tsx b/web/components/Place/PlaceGridCard.tsx
@@ -66,7 +66,7 @@ const PlaceGridCard = ({ place, searchParams, gridMode }: Props) => {
             id: place?.slug,
             ...(gridMode === 'campaign'
               ? { tab: 1 }
-              : gridMode === 'solidarity'
+              : gridMode === 'solidarity' && hasCampaignDispo
               ? { tab: 0 }
               : {}),
           },

diff --git a/web/components/Place/PlaceHeader.tsx b/web/components/Place/PlaceHeader.tsx
@@ -15,10 +15,6 @@ const BackSearch = ({ hasSearch }) => {
   const { t } = useTranslation('place')
   const prevPath = sessionStorage.getItem('sd-prevPath')
 
-  if (!hasSearch) {
-    return <Spacer />
-  }
-
   const sentence = useMemo(() => {
     const url = new URL(prevPath, process.env.NEXT_PUBLIC_FRONT_URL)
     const words = []
@@ -52,6 +48,10 @@ const BackSearch = ({ hasSearch }) => {
     return words.length > 0 ? words.join(' ') : ''
   }, [prevPath])
 
+  if (!hasSearch) {
+    return <Spacer />
+  }
+
   return (
     <Flex alignItems="center">
       <Button

diff --git a/web/hooks/useCampaignDispo.tsx b/web/hooks/useCampaignDispo.tsx
@@ -15,9 +15,16 @@ const useCampaignDispo = (disponibilities?: Disponibility[]) => {
     [disponibilities, currentCampaign],
   )
 
+  const solidarityDispos = useMemo(
+    () => disponibilities?.filter((d) => !d?.campaign),
+    [disponibilities, currentCampaign],
+  )
+
   return {
     campaignDispos,
-    campaignDisposNum: campaignDispos?.length,
+    campaignDisposNum: campaignDispos?.length || 0,
+    solidarityDispos,
+    solidarityDisposNum: solidarityDispos?.length || 0,
   }
 }
 

diff --git a/web/hooks/usePlaces.ts b/web/hooks/usePlaces.ts
@@ -2,7 +2,7 @@ import { useQuery } from 'react-query'
 import { client } from '~api/client-api'
 
 export const usePlaces = (query: Record<string, any> = {}, name = 'places') => {
-  return useQuery(['places', query], () =>
+  return useQuery([name, query], () =>
     client.espaces.espacesList(query).then((res) => res.data),
   )
 }
diff --git a/web/public/locales/fr/place.json b/web/public/locales/fr/place.json
@@ -335,7 +335,7 @@
       "campaign_about": "À propos du dispositif {{title}}",
       "eligibility": "Conditions d’éligibilité :",
       "switch_campaign_title": "Cet espace propose également des créneaux {{title}} :",
-      "switch_campaign_content": "lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent rutrum vulputate lectus. Sed et arcu nunc. Morbi sollicitudin quam arcu, quis tempor ligula ornare vitae.",
+      "switch_campaign_content": "ces créneaux sont proposés sur candidature par des lieux partenaires lors d'appels à projets. Découvrez-les et n'hésitez pas à candidater si votre compagnie respecte les règles d'éligibilité.",
       "switch_campaign_cta": "Basculer vers les créneaux solidaires",
       "switch_solidarity_title": "Cet espace propose également des créneaux solidaires : ",
       "switch_solidarity_content": "ces créneaux sont proposés par les lieux inscrits sur la plateforme et sont réservables toute l'année selon les disponibilités proposées. La réservation est ouverte à toute compagnie inscrite sur Studio D.",