Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

hide filter option condition added #2396

Merged
merged 4 commits into from
Feb 12, 2025
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Original file line number Diff line number Diff line change
Expand Up @@ -15,35 +15,51 @@ interface InterventionListProps {
setIsMenuOpen: SetState<boolean>;
selectedInterventionData: InterventionData | undefined;
hasProjectSites?: boolean
existingIntervention: string[]
}
const InterventionList = ({
interventionList,
setSelectedInterventionType,
setIsMenuOpen,
selectedInterventionData,
hasProjectSites
hasProjectSites,
existingIntervention
}: InterventionListProps) => {
const tProjectDetails = useTranslations("ProjectDetails.intervention");
const handleFilterSelection = (key: INTERVENTION_TYPE) => {
setIsMenuOpen(false);
setSelectedInterventionType(key);
};

const shouldRenderIntervention = (interventionValue: string) => {
const showAllIntervention = interventionValue === 'all';
const showExisitingIntervention = existingIntervention.includes(interventionValue);
if (showAllIntervention && existingIntervention.length === 1) {
return false;
}
return showExisitingIntervention || showAllIntervention;
};



return (
<ul className={`${styles.interventionListOptions} ${!hasProjectSites ? styles.interventionListOptionsAbove : styles.interventionListOptionsBelow}`}>
{interventionList.map((intervention, index) => {
<ul
className={`${styles.interventionListOptions} ${!hasProjectSites ? styles.interventionListOptionsAbove : styles.interventionListOptionsBelow
}`}
>
{interventionList.map((intervention) => {
if (!shouldRenderIntervention(intervention.value)) {
return null;
}

return (
<li
className={`${styles.listItem} ${intervention.value === selectedInterventionData?.value
? styles.selectedItem
: ''
className={`${styles.listItem} ${intervention.value === selectedInterventionData?.value ? styles.selectedItem : ''
}`}
onClick={() => handleFilterSelection(intervention.value)}
key={index}
key={intervention.value} // Use unique value as key
>
<p>
{tProjectDetails(intervention.value)}
</p>
<p>{tProjectDetails(intervention.value)}</p>
</li>
);
})}
Expand Down
21 changes: 17 additions & 4 deletions src/features/projectsV2/ProjectsMap/InterventionDropDown/index.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -25,6 +25,7 @@ interface Props {
enableInterventionFilter: () => void;
disableInterventionMenu: boolean;
hasProjectSites?: boolean;
existingIntervention: string[]
}

const InterventionDropdown = ({
Expand All @@ -35,6 +36,7 @@ const InterventionDropdown = ({
disableInterventionMenu,
isMobile,
hasProjectSites,
existingIntervention
}: Props) => {
const tIntervention = useTranslations('ProjectDetails.intervention');

Expand All @@ -54,20 +56,30 @@ const InterventionDropdown = ({
}
}, [disableInterventionMenu]);

const interventionData = findMatchingIntervention(selectedInterventionType);

const toggleMenu = () => {
enableInterventionFilter();
setIsMenuOpen((prev) => !prev);
};

const showVisibleOption = () => {
const interventionToCheck = existingIntervention.length === 1
? existingIntervention[0]
: selectedInterventionType;

return findMatchingIntervention(interventionToCheck);
}

const interventionData = showVisibleOption()


return (
<>
<div
className={`${styles.dropdownButton} ${
hasProjectSites
className={`${styles.dropdownButton} ${hasProjectSites
? styles.dropdownButtonAlignmentAbove
: styles.dropdownButtonAlignmentBelow
}`}
}`}
onClick={toggleMenu}
>
<div className={styles.interventionIconAndTextContainer}>
Expand Down Expand Up @@ -106,6 +118,7 @@ const InterventionDropdown = ({
setIsMenuOpen={setIsMenuOpen}
selectedInterventionData={interventionData}
hasProjectSites={hasProjectSites}
existingIntervention={existingIntervention}
/>
)}
</>
Expand Down
20 changes: 18 additions & 2 deletions src/features/projectsV2/ProjectsMap/MapControls.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@ import type { ViewMode } from '../../common/Layout/ProjectsLayout/MobileProjects
import type { SetState } from '../../common/types/common';
import type { MobileOs } from '../../../utils/projectV2';
import type { SelectedTab } from './ProjectMapTabs';

import { useMemo } from 'react';
import ProjectSiteDropdown from './ProjectSiteDropDown';
import InterventionDropDown from './InterventionDropDown';
import ProjectListControlForMobile from '../ProjectListControls/ProjectListControlForMobile';
Expand Down Expand Up @@ -54,7 +54,19 @@ const MapControls = ({
setSelectedInterventionType,
disableInterventionMenu,
setDisableInterventionMenu,
plantLocations,
} = useProjects();

const uniquePlantTypes = useMemo(() => {
if (!plantLocations) return [];

const types = new Set();
for (let i = 0; i < plantLocations.length; i++) {
types.add(plantLocations[i].type);
}
return [...types];
}, [plantLocations]);

const hasProjectSites =
singleProject?.sites?.length !== undefined &&
singleProject?.sites?.length > 1;
Expand All @@ -65,7 +77,9 @@ const MapControls = ({
) && selectedTab === 'field';
const isProjectDetailsPage = page === 'project-details';
const canShowInterventionDropdown =
isProjectDetailsPage && selectedTab === 'field';
isProjectDetailsPage &&
selectedTab === 'field' &&
uniquePlantTypes.length > 1;

const enableInterventionFilter = () => {
setDisableInterventionMenu(true);
Expand Down Expand Up @@ -146,6 +160,7 @@ const MapControls = ({
{...interventionDropDownProps}
isMobile={isMobile}
hasProjectSites={hasProjectSites}
existingIntervention={uniquePlantTypes}
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

💡 Verification agent

🧩 Analysis chain

Verify the type definition of existingIntervention prop.

The prop is consistently added, but let's verify its type definition in the InterventionDropDown component.

Also applies to: 182-182


🏁 Script executed:

#!/bin/bash
# Search for the InterventionDropDown component's prop types
ast-grep --pattern 'interface $name {
  $$$
  existingIntervention$_
  $$$
}'

Length of output: 79


I'll now run an additional shell script to locate the file(s) for the InterventionDropDown component and inspect its prop types—including the definition for the existingIntervention prop—to verify its type definition.


🏁 Script executed:

#!/bin/bash
# Find files with "InterventionDropDown" in the filename and display their contents
fd -e tsx -i "InterventionDropDown" | xargs -I {} sh -c 'echo "File: {}"; echo "------"; cat {}'

Length of output: 98


I'll now run a script to search the entire repository for the keyword "existingIntervention" to locate where and how its type is defined.


🏁 Script executed:

#!/bin/bash
# Search for occurrences of "existingIntervention" in TypeScript/TSX files
rg -n "existingIntervention" -ttsx

Length of output: 62


I'll now run a script to search for the keyword "InterventionDropDown" across the repository to locate its definition and references for further inspection of its prop types.


🏁 Script executed:

#!/bin/bash
# Search for any occurrence of "InterventionDropDown" to locate its definition or usage.
rg -n "InterventionDropDown" .

Length of output: 509


Missing or Undeclared Type for existingIntervention in InterventionDropDown

Our investigation couldn’t locate an explicit type declaration for the existingIntervention prop in the InterventionDropDown component. This suggests that the prop may currently be handled implicitly (or not declared at all) rather than through a formally defined interface or type. To improve type safety and clarity, please verify and add an appropriate type definition—such as by defining an InterventionDropDownProps interface that includes an explicit type for existingIntervention (matching the type of uniquePlantTypes) and applying it to the component’s props.

  • Location to Address: InterventionDropDown component (likely located in src/features/projectsV2/ProjectsMap/InterventionDropDown/)
  • Action: Declare an interface (e.g., InterventionDropDownProps) that includes existingIntervention with the correct type and update the component accordingly.

/>
)}
<button
Expand All @@ -164,6 +179,7 @@ const MapControls = ({
<InterventionDropDown
{...interventionDropDownProps}
hasProjectSites={hasProjectSites}
existingIntervention={uniquePlantTypes}
/>
)}
</>
Expand Down
Loading