From d396a186fa84ad496e91db3a602bfc0227e42ab4 Mon Sep 17 00:00:00 2001
From: Alessandro Amantini <ale.amantini1997@gmail.com>
Date: Tue, 26 Nov 2024 17:27:52 +0000
Subject: [PATCH] ISSUE #5257 - allow to create only new filters

---
 .../tickets/ticketFiltersSelection.component.tsx           | 7 ++++---
 .../viewer/cards/tickets/ticketFiltersContext.tsx          | 7 ++++++-
 2 files changed, 10 insertions(+), 4 deletions(-)

diff --git a/frontend/src/v5/ui/components/viewer/cards/cardFilters/filtersSelection/tickets/ticketFiltersSelection.component.tsx b/frontend/src/v5/ui/components/viewer/cards/cardFilters/filtersSelection/tickets/ticketFiltersSelection.component.tsx
index 236231fa0d..51cac387f1 100644
--- a/frontend/src/v5/ui/components/viewer/cards/cardFilters/filtersSelection/tickets/ticketFiltersSelection.component.tsx
+++ b/frontend/src/v5/ui/components/viewer/cards/cardFilters/filtersSelection/tickets/ticketFiltersSelection.component.tsx
@@ -36,7 +36,7 @@ import { CardFilterActionMenu } from '../../filterForm/filterForm.styles';
 import { TicketFiltersContext } from '@components/viewer/cards/tickets/ticketFiltersContext';
 
 export const FilterSelection = () => {
-	const { upsertFilter } = useContext(TicketFiltersContext);
+	const { upsertFilter, hasFilter } = useContext(TicketFiltersContext);
 	const [active, setActive] = useState(false);
 	const [selectedItem, setSelectedItem] = useState<TicketFilterListItemType>(null);
 	const { containerOrFederation } = useParams<ViewerParams>();
@@ -44,6 +44,7 @@ export const FilterSelection = () => {
 	const usedTemplates = uniq(tickets.map((t) => t.type));
 	const templates = usedTemplates.map((t) => selectTemplateById(getState(), containerOrFederation, t));
 	const filterElements = templatesToFilters(templates);
+	const unusedFilters = filterElements.filter((f) => !hasFilter(f));
 	const showFiltersList = !selectedItem?.property;
 
 	const onOpen = () => setActive(true);
@@ -58,7 +59,7 @@ export const FilterSelection = () => {
 			TriggerButton={(
 				<Tooltip title={formatMessage({ id: 'viewer.card.tickets.addFilter', defaultMessage: 'Add Filter' })}>
 					<div>
-						<CardAction disabled={!filterElements.length} $active={active}>
+						<CardAction disabled={!unusedFilters.length} $active={active}>
 							<FennelIcon />
 						</CardAction>
 					</div>
@@ -67,7 +68,7 @@ export const FilterSelection = () => {
 			onOpen={onOpen}
 			onClose={onClose}
 		>
-			<SearchContextComponent items={filterElements}>
+			<SearchContextComponent items={unusedFilters}>
 				<DrillDownList $visibleIndex={showFiltersList ? 0 : 1}>
 					<DrillDownItem $visible={showFiltersList}>
 						<SearchInput
diff --git a/frontend/src/v5/ui/components/viewer/cards/tickets/ticketFiltersContext.tsx b/frontend/src/v5/ui/components/viewer/cards/tickets/ticketFiltersContext.tsx
index 34cd7ced1f..30d90b65c1 100644
--- a/frontend/src/v5/ui/components/viewer/cards/tickets/ticketFiltersContext.tsx
+++ b/frontend/src/v5/ui/components/viewer/cards/tickets/ticketFiltersContext.tsx
@@ -15,7 +15,7 @@
  *  along with this program.  If not, see <http://www.gnu.org/licenses/>.
  */
 
-import { get, isEmpty, set, unset } from 'lodash';
+import { get, has, isEmpty, set, unset } from 'lodash';
 import { createContext, useState } from 'react';
 import { CardFilter } from '../cardFilters/cardFilters.types';
 
@@ -24,6 +24,7 @@ export interface TicketFiltersContextType {
 	upsertFilter: (filter: CardFilter) => void;
 	deleteFilter: (filter: Omit<CardFilter, 'filter'>) => void;
 	deleteAllFilters: () => void;
+	hasFilter: (filter: Omit<CardFilter, 'filter'>) => boolean;
 }
 
 const defaultValue: TicketFiltersContextType = {
@@ -31,6 +32,7 @@ const defaultValue: TicketFiltersContextType = {
 	upsertFilter: () => {},
 	deleteFilter: () => {},
 	deleteAllFilters: () => {},
+	hasFilter: () => false,
 };
 export const TicketFiltersContext = createContext(defaultValue);
 TicketFiltersContext.displayName = 'TicketFiltersContext';
@@ -67,12 +69,15 @@ export const TicketFiltersContextComponent = ({ filters: initialFilters, childre
 		
 	const deleteAllFilters = () => setFilters({});
 
+	const hasFilter = ({ module, property, type }: CardFilter) => has(filters, [module, property, type]);
+
 	return (
 		<TicketFiltersContext.Provider value={{
 			filters,
 			upsertFilter,
 			deleteFilter,
 			deleteAllFilters,
+			hasFilter,
 		}}>
 			{children}
 		</TicketFiltersContext.Provider>