Merge pull request #747 from GeotrekCE/develop

Develop > Main / 3.10.2
GeotrekCE · Jul 13, 2022 · 686fe0a · 686fe0a
2 parents 8be39af + 045e854
commit 686fe0a
Show file tree

Hide file tree

Showing 8 changed files with 71 additions and 15 deletions.
diff --git a/docs/changelog.md b/docs/changelog.md
@@ -1,5 +1,13 @@
 # Changelog
 
+3.10.2 (2022-07-13)
+-------------------
+
+**🐛 Fixes**
+
+* Fix events date filter on map results of Search page (#743)
+* Link to detail page on images of objects cards rather than images fullscreen (#670)
+
 3.10.1 (2022-07-08)
 -------------------
 

diff --git a/frontend/package.json b/frontend/package.json
@@ -1,6 +1,6 @@
 {
   "name": "geotrek-rando-frontend",
-  "version": "3.10.1",
+  "version": "3.10.2",
   "private": true,
   "scripts": {
     "debug": "NODE_OPTIONS='--inspect' next ./src",

diff --git a/frontend/src/components/pages/details/__tests__/Details.test.tsx b/frontend/src/components/pages/details/__tests__/Details.test.tsx
@@ -120,7 +120,7 @@ describe('Details', () => {
     await component.findByText('La Motte-en-Champsaur');
     await component.findAllByText('Lagopède alpin');
     await component.findAllByText('Refuge de la Lavey');
-    await component.findByText('Auberge Gaillard');
+    await component.findAllByText('Auberge Gaillard');
     await component.findByText(
       "L'auberge propose, dans un hameau de montagne en bout de route, en pleine nature, un hébergement de séjour, nuitée, demi-pension et pension complète dans un décor de la vie d'antan et d'aujourd'hui.",
     );

diff --git a/frontend/src/components/pages/details/components/DetailsCard/DetailsCard.tsx b/frontend/src/components/pages/details/components/DetailsCard/DetailsCard.tsx
@@ -6,6 +6,7 @@ import { HtmlText } from 'components/pages/details/utils';
 import getActivityColor from 'components/pages/search/components/ResultCard/getActivityColor';
 import parse from 'html-react-parser';
 import { ListAndMapContext } from 'modules/map/ListAndMapContext';
+import { useRouter } from 'next/router';
 import { useContext } from 'react';
 import { FormattedMessage } from 'react-intl';
 import { textEllipsisAfterNLines } from 'services/cssHelpers';
@@ -55,6 +56,8 @@ export const DetailsCard: React.FC<DetailsCardProps> = ({
 
   const { setHoveredCardId } = useContext(ListAndMapContext);
 
+  const router = useRouter();
+
   return (
     <DetailsCardContainer
       height={heightState}
@@ -81,11 +84,42 @@ export const DetailsCard: React.FC<DetailsCardProps> = ({
           {({ isFullscreen, toggleFullscreen }) => (
             <>
               {isFullscreen &&
-                attachments &&
+                type === 'TOURISTIC_CONTENT' &&
+                redirectionUrl &&
+                attachments.length > 0 &&
+                typeof navigator !== 'undefined' &&
+                navigator?.onLine && (
+                  <DetailsCoverCarousel
+                    attachments={attachments}
+                    onClickImage={() => router.push(redirectionUrl)}
+                  />
+                )}
+              {!isFullscreen &&
+                type === 'TOURISTIC_CONTENT' &&
+                redirectionUrl &&
+                attachments.length > 0 &&
+                typeof navigator !== 'undefined' &&
+                navigator?.onLine && (
+                  <DetailsCoverCarousel
+                    attachments={attachments}
+                    onClickImage={() => router.push(redirectionUrl)}
+                  />
+                )}
+              {isFullscreen &&
+                type !== 'TOURISTIC_CONTENT' &&
                 attachments.length > 0 &&
                 typeof navigator !== 'undefined' &&
-                navigator?.onLine && <DetailsCoverCarousel attachments={attachments} />}
-              {!isFullscreen && (
+                navigator?.onLine && (
+                  <DetailsCoverCarousel
+                    onClickImage={
+                      typeof navigator !== 'undefined' && navigator?.onLine
+                        ? toggleFullscreen
+                        : undefined
+                    }
+                    attachments={attachments}
+                  />
+                )}
+              {!isFullscreen && type !== 'TOURISTIC_CONTENT' && (
                 <DetailsCardCarousel
                   thumbnailUris={
                     typeof navigator !== 'undefined' && navigator?.onLine

diff --git a/frontend/src/components/pages/search/Search.tsx b/frontend/src/components/pages/search/Search.tsx
@@ -83,7 +83,7 @@ export const SearchUI: React.FC<Props> = ({ language }) => {
     hideMobileMap,
   } = useTrekResults({ filtersState, textFilterState, bboxState, dateFilter }, language);
 
-  const { isMapLoading } = useMapResults({ filtersState, textFilterState }, language);
+  const { isMapLoading } = useMapResults({ filtersState, textFilterState, dateFilter }, language);
 
   const intl = useIntl();
 

diff --git a/frontend/src/components/pages/search/components/ResultCard/ResultCard.tsx b/frontend/src/components/pages/search/components/ResultCard/ResultCard.tsx
@@ -20,6 +20,7 @@ import { Clock } from 'components/Icons/Clock';
 import { CodeBrackets } from 'components/Icons/CodeBrackets';
 import { TrendingUp } from 'components/Icons/TrendingUp';
 import { ListAndMapContext } from 'modules/map/ListAndMapContext';
+import { useRouter } from 'next/router';
 
 import { Attachment } from '../../../../../modules/interface';
 import { dataUnits } from '../../../../../modules/results/adapter';
@@ -130,6 +131,7 @@ export const ResultCard: React.FC<
   const { setHoveredCardId } = useContext(ListAndMapContext);
 
   const intl = useIntl();
+  const router = useRouter();
 
   return (
     <Container
@@ -144,7 +146,7 @@ export const ResultCard: React.FC<
       asColumn={asColumn}
     >
       <Modal>
-        {({ isFullscreen, toggleFullscreen }) => (
+        {({ isFullscreen }) => (
           <>
             {isFullscreen && attachments && attachments.length > 0 && (
               <DetailsCoverCarousel attachments={attachments} />
@@ -156,7 +158,7 @@ export const ResultCard: React.FC<
                 thumbnailUris={thumbnailUris}
                 iconUri={badgeIconUri}
                 iconName={badgeName as string}
-                onClickImage={attachments ? toggleFullscreen : undefined}
+                onClickImage={() => router.push(redirectionUrl)}
               />
             )}
           </>

diff --git a/frontend/src/components/pages/search/hooks/useMapResults.ts b/frontend/src/components/pages/search/hooks/useMapResults.ts
@@ -3,7 +3,7 @@ import { useQuery } from 'react-query';
 
 import { getMapResults } from 'modules/mapResults/connector';
 import { MapResults } from 'modules/mapResults/interface';
-import { FilterState } from 'modules/filters/interface';
+import { DateFilter, FilterState } from 'modules/filters/interface';
 import { ListAndMapContext } from '../../../../modules/map/ListAndMapContext';
 import { parseFilters, parseTextFilter } from '../utils';
 
@@ -16,18 +16,20 @@ export const useMapResults = (
   filters: {
     filtersState: FilterState[];
     textFilterState: string | null;
+    dateFilter: DateFilter | null;
   },
   language: string,
 ): ReturnType => {
   const { setPoints } = useContext(ListAndMapContext);
 
-  const { filtersState, textFilterState } = filters;
+  const { filtersState, textFilterState, dateFilter } = filters;
 
   const parsedFiltersState = parseFilters(filtersState);
 
   const { data: mapResults, isLoading: isMapLoading } = useQuery<MapResults, Error>(
-    ['mapResults', parsedFiltersState, language, parseTextFilter(textFilterState)],
-    () => getMapResults({ filtersState: parsedFiltersState, textFilterState }, language),
+    ['mapResults', parsedFiltersState, language, parseTextFilter(textFilterState), dateFilter],
+    () =>
+      getMapResults({ filtersState: parsedFiltersState, textFilterState, dateFilter }, language),
   );
 
   if (mapResults) setPoints(mapResults);

diff --git a/frontend/src/modules/mapResults/connector.ts b/frontend/src/modules/mapResults/connector.ts
@@ -1,7 +1,9 @@
 import { QueryFilterState } from 'components/pages/search/utils';
 import { getActivities } from 'modules/activities/connector';
 import { CATEGORY_ID, EVENT_ID, OUTDOOR_ID, PRACTICE_ID } from 'modules/filters/constant';
+import { DateFilter } from 'modules/filters/interface';
 import {
+  formatDateFilter,
   formatOutdoorSiteFiltersToUrlParams,
   formatTextFilter,
   formatTouristicContentFiltersToUrlParams,
@@ -14,7 +16,6 @@ import { getGlobalConfig } from 'modules/utils/api.config';
 import { generatePageNumbersArray } from 'modules/utils/connector';
 import { getOutdoorPractices } from '../outdoorPractice/connector';
 import { fetchOutdoorSites } from '../outdoorSite/api';
-import { adaptTouristicEvents } from '../touristicEvent/adapter';
 import { fetchTouristicEvents } from '../touristicEvent/api';
 import { getTouristicEventTypes } from '../touristicEventType/connector';
 import {
@@ -27,10 +28,14 @@ import { fetchTouristicContentMapResults, fetchTrekMapResults } from './api';
 import { MapResults } from './interface';
 
 export const getMapResults = async (
-  filters: { filtersState: QueryFilterState[]; textFilterState: string | null },
+  filters: {
+    filtersState: QueryFilterState[];
+    textFilterState: string | null;
+    dateFilter: DateFilter | null;
+  },
   language: string,
 ): Promise<MapResults> => {
-  const { filtersState, textFilterState } = filters;
+  const { filtersState, textFilterState, dateFilter } = filters;
 
   try {
     const practiceFilter = filtersState.find(({ id }) => id === PRACTICE_ID);
@@ -65,6 +70,7 @@ export const getMapResults = async (
     const touristicEventsFilter = formatTouristicEventsFiltersToUrlParams(filtersState);
 
     const textFilter = formatTextFilter(textFilterState);
+    const newDateFilter = formatDateFilter(dateFilter);
 
     const resultsNumber = getGlobalConfig().mapResultsPageSize;
 
@@ -150,6 +156,8 @@ export const getMapResults = async (
       const rawMapResults = await fetchTouristicEvents({
         language,
         page_size: resultsNumber,
+        dates_before: newDateFilter.dates_before,
+        dates_after: newDateFilter.dates_after,
         ...touristicEventsFilter,
         ...textFilter,
       });
@@ -159,6 +167,8 @@ export const getMapResults = async (
             language,
             page_size: resultsNumber,
             page: pageNumber,
+            dates_before: newDateFilter.dates_before,
+            dates_after: newDateFilter.dates_after,
             ...touristicEventsFilter,
             ...textFilter,
           }),