diff --git a/src/activity-types/activity.constants.ts b/src/activity-types/activity.constants.ts new file mode 100644 index 000000000..05ea26d8c --- /dev/null +++ b/src/activity-types/activity.constants.ts @@ -0,0 +1,25 @@ +import { DEFI } from './defi.constants'; +import { ENIGME } from './enigme.constants'; +import { INDICE } from './indice.constants'; +import { REPORTAGE } from './reportage.constants'; +import { SYMBOL } from './symbol.constants'; +import { ActivityType } from 'types/activity.type'; + +type ActivityTypeKey = keyof typeof ActivityType; + +export const getType = (typeValue: number): string | undefined => { + const type = Object.keys(ActivityType).find((key) => ActivityType[key as ActivityTypeKey] === typeValue); + return type; +}; + +const SUBTYPE_MAPPER: Record> = { + ENIGME, + INDICE, + SYMBOL, + DEFI, + REPORTAGE, +}; +export const getSubtype = (typeName: string, subTypeValue: number): string | undefined => { + const result = Object.keys(SUBTYPE_MAPPER[typeName] || {}).find((key) => SUBTYPE_MAPPER[typeName][key] === subTypeValue); + return result; +}; diff --git a/src/activity-types/activity.constants.tsx b/src/activity-types/activity.constants.tsx new file mode 100644 index 000000000..0dd619120 --- /dev/null +++ b/src/activity-types/activity.constants.tsx @@ -0,0 +1,23 @@ +import { DEFI } from './defi.constants'; +import { ENIGME } from './enigme.constants'; +import { INDICE } from './indice.constants'; +import { REPORTAGE } from './reportage.constants'; +import { SYMBOL } from './symbol.constants'; +import { ActivityType } from 'types/activity.type'; + +export const getType = (typeValue: number): string | undefined => { + const type = Object.keys(ActivityType).find((key) => ActivityType[key] === typeValue); + return type; +}; + +const SUBTYPE_MAPPER = { + ENIGME: ENIGME, + INDICE: INDICE, + SYMBOL: SYMBOL, + DEFI: DEFI, + REPORTAGE: REPORTAGE, +}; +export const getSubtype = (typeName: string, subTypeValue: number): string | undefined => { + const result = Object.keys(SUBTYPE_MAPPER[typeName] || {}).find((key) => SUBTYPE_MAPPER[typeName][key] === subTypeValue); + return result; +}; diff --git a/src/components/accueil/Accueil.tsx b/src/components/accueil/Accueil.tsx index e4c61f4a8..536ed7533 100644 --- a/src/components/accueil/Accueil.tsx +++ b/src/components/accueil/Accueil.tsx @@ -2,8 +2,7 @@ import React from 'react'; import { Button } from '@mui/material'; -import { isGame } from 'src/activity-types/anyActivity'; -import { isMimic } from 'src/activity-types/game.constants'; +import { filterActivitiesByTerm, filterActivitiesWithLastMimicGame } from './Filters/FilterActivities'; import { Base } from 'src/components/Base'; import { KeepRatio } from 'src/components/KeepRatio'; import { WorldMap } from 'src/components/WorldMap'; @@ -14,7 +13,6 @@ import { UserContext } from 'src/contexts/userContext'; import { VillageContext } from 'src/contexts/villageContext'; import { useActivities } from 'src/services/useActivities'; import PelicoReflechit from 'src/svg/pelico/pelico_reflechit.svg'; -import type { Activity, AnyData } from 'types/activity.type'; import { UserType } from 'types/user.type'; export const Accueil = () => { @@ -35,6 +33,7 @@ export const Accueil = () => { return acc; }, {}), pelico: true, + searchTerm: '', }); const { activities } = useActivities({ @@ -46,19 +45,6 @@ export const Accueil = () => { phase: selectedPhase, }); - function filterActivitiesWithLastMimicGame(activitiesData: Activity[]): Activity[] { - const indexOfLastMimic = activitiesData.findIndex((activity) => isGame(activity) && isMimic(activity)); // Get the index of this last mimic - if (indexOfLastMimic === -1) { - return activitiesData; - } - const mostRecentMimic = activitiesData[indexOfLastMimic]; // Get the last mimic created - const activitiesWithoutMimic = activitiesData.filter((activity) => !isGame(activity) || !isMimic(activity)); // Remove all mimics in activities - const activitiesWithLastMimic = [...activitiesWithoutMimic]; - activitiesWithLastMimic.splice(indexOfLastMimic, 0, mostRecentMimic); // Put the last mimic created at the same spot in the array - - return activitiesWithLastMimic; - } - // on selected phase change, select all activities. React.useEffect(() => { setFilters((prevFilters) => ({ @@ -71,11 +57,14 @@ export const Accueil = () => { //Preload of the activities filtered only one mimic const activitiesFiltered = React.useMemo(() => { if (activities && activities.length > 0) { - return filterActivitiesWithLastMimicGame(activities); + const activitiesWithLastMimic = filterActivitiesWithLastMimicGame(activities); + const activitiesFilterBySearchTerm = + filters.searchTerm.length > 0 ? filterActivitiesByTerm(activitiesWithLastMimic, filters.searchTerm) : activitiesWithLastMimic; + return activitiesFilterBySearchTerm; } else { return []; } - }, [activities]); + }, [activities, filters.searchTerm]); if (!village) { return ; diff --git a/src/components/accueil/Filters/FilterActivities.tsx b/src/components/accueil/Filters/FilterActivities.tsx new file mode 100644 index 000000000..8a31437e8 --- /dev/null +++ b/src/components/accueil/Filters/FilterActivities.tsx @@ -0,0 +1,46 @@ +import { getSubtype, getType } from 'src/activity-types/activity.constants'; +import { isGame } from 'src/activity-types/anyActivity'; +import { isMimic } from 'src/activity-types/game.constants'; +import type { Activity, AnyData } from 'types/activity.type'; + +export function filterActivitiesWithLastMimicGame(activitiesData: Activity[]): Activity[] { + const indexOfLastMimic = activitiesData.findIndex((activity) => isGame(activity) && isMimic(activity)); // Get the index of this last mimic + if (indexOfLastMimic === -1) { + return activitiesData; + } + const mostRecentMimic = activitiesData[indexOfLastMimic]; // Get the last mimic created + const activitiesWithoutMimic = activitiesData.filter((activity) => !isGame(activity) || !isMimic(activity)); // Remove all mimics in activities + const activitiesWithLastMimic = [...activitiesWithoutMimic]; + activitiesWithLastMimic.splice(indexOfLastMimic, 0, mostRecentMimic); // Put the last mimic created at the same spot in the array + + return activitiesWithLastMimic; +} + +export function filterActivitiesByTerm(activitiesData: Activity[], searchTerm: string): Activity[] { + const activitiesFilteredBySearchTermOnType = activitiesData.filter((activity) => { + const type = getType(activity.type); + const subType = type && activity.subType !== null && activity.subType !== undefined ? getSubtype(type, activity.subType) : undefined; + return subType && subType.toLowerCase().indexOf(searchTerm.toLowerCase()) >= 0; + }); + const activitiesFilteredBySearchTerm = activitiesData.filter((activity) => filterActivityByTerm(activity, searchTerm)); + let agregatedFilters = [...activitiesFilteredBySearchTerm, ...activitiesFilteredBySearchTermOnType]; + agregatedFilters = [...new Set(agregatedFilters)]; + return agregatedFilters; +} + +// to check a given activity contains a given term +export function filterActivityByTerm(activity: Activity, term: string) { + // for cas insensivitive search + const lowerTerm = term.toLowerCase(); + if (activity.content[0].value.toLowerCase().indexOf(lowerTerm) !== -1) { + return true; + } + + const dataStr = JSON.stringify(activity.data); + + //resume if exists + if (dataStr.toLowerCase().indexOf(lowerTerm) !== -1) { + return true; + } + return false; +} diff --git a/src/components/accueil/Filters/Filters.tsx b/src/components/accueil/Filters/Filters.tsx index da1c29e42..b507296bc 100644 --- a/src/components/accueil/Filters/Filters.tsx +++ b/src/components/accueil/Filters/Filters.tsx @@ -37,6 +37,7 @@ export type FilterArgs = { status: number; countries: { [key: string]: boolean }; pelico: boolean; + searchTerm: string; }; interface FiltersProps { @@ -68,18 +69,6 @@ export const Filters = ({ filters, onChange, countries = [], phase }: FiltersPro onChange({ ...filters, types: option.value, selectedType: option.key }); }} /> - {/* { - onChange({ ...filters, status: newStatus.key }); - }} - /> */}
{countries.map((c) => (
+
+ { + onChange({ + ...filters, + searchTerm: event.target.value, + }); + }} + /> +
); }; diff --git a/src/components/activities/ActivityCard/MimicCard.tsx b/src/components/activities/ActivityCard/MimicCard.tsx index 1deb69591..f739d6bff 100644 --- a/src/components/activities/ActivityCard/MimicCard.tsx +++ b/src/components/activities/ActivityCard/MimicCard.tsx @@ -78,7 +78,7 @@ export const MimicCard = ({ activity, isSelf, noButtons, isDraft, showEditButton