diff --git a/web/components/issues/issue-layouts/filters/applied-filters/date.tsx b/web/components/issues/issue-layouts/filters/applied-filters/date.tsx index c1e7b8cec..722579e9b 100644 --- a/web/components/issues/issue-layouts/filters/applied-filters/date.tsx +++ b/web/components/issues/issue-layouts/filters/applied-filters/date.tsx @@ -11,10 +11,11 @@ import { DATE_FILTER_OPTIONS } from "constants/filters"; type Props = { handleRemove: (val: string) => void; values: string[]; + disableClearOption?: boolean; }; export const AppliedDateFilters: React.FC = observer((props) => { - const { handleRemove, values } = props; + const { handleRemove, values, disableClearOption } = props; const getDateLabel = (value: string): string => { let dateLabel = ""; @@ -40,13 +41,15 @@ export const AppliedDateFilters: React.FC = observer((props) => { {values.map((date) => (
{getDateLabel(date)} - + {!disableClearOption && ( + + )}
))} diff --git a/web/components/issues/issue-layouts/filters/applied-filters/filters-list.tsx b/web/components/issues/issue-layouts/filters/applied-filters/filters-list.tsx index 5d1868a8a..9b7e3bab3 100644 --- a/web/components/issues/issue-layouts/filters/applied-filters/filters-list.tsx +++ b/web/components/issues/issue-layouts/filters/applied-filters/filters-list.tsx @@ -24,13 +24,23 @@ type Props = { members?: IUserLite[] | undefined; projects?: IProject[] | undefined; states?: IState[] | undefined; + disableClearFilterOptions?: (keyof IIssueFilterOptions)[]; }; const membersFilters = ["assignees", "mentions", "created_by", "subscriber"]; const dateFilters = ["start_date", "target_date"]; export const AppliedFiltersList: React.FC = observer((props) => { - const { appliedFilters, handleClearAllFilters, handleRemoveFilter, labels, members, projects, states } = props; + const { + appliedFilters, + handleClearAllFilters, + handleRemoveFilter, + labels, + members, + projects, + states, + disableClearFilterOptions, + } = props; if (!appliedFilters) return null; @@ -52,16 +62,22 @@ export const AppliedFiltersList: React.FC = observer((props) => {
{membersFilters.includes(filterKey) && ( handleRemoveFilter(filterKey, val)} members={members} values={value} /> )} {dateFilters.includes(filterKey) && ( - handleRemoveFilter(filterKey, val)} values={value} /> + handleRemoveFilter(filterKey, val)} + values={value} + /> )} {filterKey === "labels" && ( handleRemoveFilter("labels", val)} labels={labels} values={value} @@ -69,12 +85,14 @@ export const AppliedFiltersList: React.FC = observer((props) => { )} {filterKey === "priority" && ( handleRemoveFilter("priority", val)} values={value} /> )} {filterKey === "state" && states && ( handleRemoveFilter("state", val)} states={states} values={value} @@ -82,36 +100,42 @@ export const AppliedFiltersList: React.FC = observer((props) => { )} {filterKey === "state_group" && ( handleRemoveFilter("state_group", val)} values={value} /> )} {filterKey === "project" && ( handleRemoveFilter("project", val)} projects={projects} values={value} /> )} - + {!disableClearFilterOptions?.includes(filterKey) && ( + + )}
); })} - - + {(!disableClearFilterOptions || disableClearFilterOptions.length === 0) && ( + + )} + ); }); diff --git a/web/components/issues/issue-layouts/filters/applied-filters/label.tsx b/web/components/issues/issue-layouts/filters/applied-filters/label.tsx index 9cec9b2f7..5d300a32f 100644 --- a/web/components/issues/issue-layouts/filters/applied-filters/label.tsx +++ b/web/components/issues/issue-layouts/filters/applied-filters/label.tsx @@ -9,10 +9,11 @@ type Props = { handleRemove: (val: string) => void; labels: IIssueLabel[] | undefined; values: string[]; + disableClearOption?: boolean; }; export const AppliedLabelsFilters: React.FC = observer((props) => { - const { handleRemove, labels, values } = props; + const { handleRemove, labels, values, disableClearOption } = props; return ( <> @@ -30,13 +31,15 @@ export const AppliedLabelsFilters: React.FC = observer((props) => { }} /> {labelDetails.name} - + {!disableClearOption && ( + + )} ); })} diff --git a/web/components/issues/issue-layouts/filters/applied-filters/members.tsx b/web/components/issues/issue-layouts/filters/applied-filters/members.tsx index bfa7e9a29..de24d0361 100644 --- a/web/components/issues/issue-layouts/filters/applied-filters/members.tsx +++ b/web/components/issues/issue-layouts/filters/applied-filters/members.tsx @@ -9,10 +9,11 @@ type Props = { handleRemove: (val: string) => void; members: IUserLite[] | undefined; values: string[]; + disableClearOption?: boolean; }; export const AppliedMembersFilters: React.FC = observer((props) => { - const { handleRemove, members, values } = props; + const { handleRemove, members, values, disableClearOption } = props; return ( <> @@ -25,13 +26,15 @@ export const AppliedMembersFilters: React.FC = observer((props) => {
{memberDetails.display_name} - + {!disableClearOption && ( + + )}
); })} diff --git a/web/components/issues/issue-layouts/filters/applied-filters/priority.tsx b/web/components/issues/issue-layouts/filters/applied-filters/priority.tsx index e00d0d829..b5f8e60fb 100644 --- a/web/components/issues/issue-layouts/filters/applied-filters/priority.tsx +++ b/web/components/issues/issue-layouts/filters/applied-filters/priority.tsx @@ -9,10 +9,11 @@ import { TIssuePriorities } from "types"; type Props = { handleRemove: (val: string) => void; values: string[]; + disableClearOption?: boolean; }; export const AppliedPriorityFilters: React.FC = observer((props) => { - const { handleRemove, values } = props; + const { handleRemove, values, disableClearOption } = props; return ( <> @@ -20,13 +21,15 @@ export const AppliedPriorityFilters: React.FC = observer((props) => {
{priority} - + {!disableClearOption && ( + + )}
))} diff --git a/web/components/issues/issue-layouts/filters/applied-filters/project.tsx b/web/components/issues/issue-layouts/filters/applied-filters/project.tsx index 018309861..3e967cb23 100644 --- a/web/components/issues/issue-layouts/filters/applied-filters/project.tsx +++ b/web/components/issues/issue-layouts/filters/applied-filters/project.tsx @@ -10,10 +10,11 @@ type Props = { handleRemove: (val: string) => void; projects: IProject[] | undefined; values: string[]; + disableClearOption?: boolean; }; export const AppliedProjectFilters: React.FC = observer((props) => { - const { handleRemove, projects, values } = props; + const { handleRemove, projects, values, disableClearOption } = props; return ( <> @@ -34,13 +35,15 @@ export const AppliedProjectFilters: React.FC = observer((props) => { )} {projectDetails.name} - + {!disableClearOption && ( + + )} ); })} diff --git a/web/components/issues/issue-layouts/filters/applied-filters/roots/global-view-root.tsx b/web/components/issues/issue-layouts/filters/applied-filters/roots/global-view-root.tsx index 543d18645..bf76a7f5e 100644 --- a/web/components/issues/issue-layouts/filters/applied-filters/roots/global-view-root.tsx +++ b/web/components/issues/issue-layouts/filters/applied-filters/roots/global-view-root.tsx @@ -1,3 +1,4 @@ +import React from "react"; import { useRouter } from "next/router"; import { observer } from "mobx-react-lite"; @@ -9,10 +10,16 @@ import { AppliedFiltersList } from "components/issues"; import { IIssueFilterOptions } from "types"; import { EFilterType } from "store/issues/types"; -export const GlobalViewsAppliedFiltersRoot = observer(() => { +type Props = { + disableClearFilterOptions?: (keyof IIssueFilterOptions)[]; +}; + +export const GlobalViewsAppliedFiltersRoot: React.FC = observer((props) => { + const { disableClearFilterOptions } = props; + // router const router = useRouter(); const { workspaceSlug } = router.query as { workspaceSlug: string; globalViewId: string }; - + // mobx store const { project: { workspaceProjects }, workspace: { workspaceLabels }, @@ -83,6 +90,7 @@ export const GlobalViewsAppliedFiltersRoot = observer(() => { appliedFilters={appliedFilters ?? {}} handleClearAllFilters={handleClearAllFilters} handleRemoveFilter={handleRemoveFilter} + disableClearFilterOptions={disableClearFilterOptions} /> {/* {storedFilters && viewDetails && areFiltersDifferent(storedFilters, viewDetails.query_data.filters ?? {}) && ( diff --git a/web/components/issues/issue-layouts/filters/applied-filters/state-group.tsx b/web/components/issues/issue-layouts/filters/applied-filters/state-group.tsx index 64f95983e..ac4ceaa0d 100644 --- a/web/components/issues/issue-layouts/filters/applied-filters/state-group.tsx +++ b/web/components/issues/issue-layouts/filters/applied-filters/state-group.tsx @@ -8,10 +8,11 @@ import { TStateGroups } from "types"; type Props = { handleRemove: (val: string) => void; values: string[]; + disableClearOption?: boolean; }; export const AppliedStateGroupFilters: React.FC = observer((props) => { - const { handleRemove, values } = props; + const { handleRemove, values, disableClearOption } = props; return ( <> @@ -19,13 +20,15 @@ export const AppliedStateGroupFilters: React.FC = observer((props) => {
{stateGroup} - + {!disableClearOption && ( + + )}
))} diff --git a/web/components/issues/issue-layouts/filters/applied-filters/state.tsx b/web/components/issues/issue-layouts/filters/applied-filters/state.tsx index 8e7592505..1f43613ac 100644 --- a/web/components/issues/issue-layouts/filters/applied-filters/state.tsx +++ b/web/components/issues/issue-layouts/filters/applied-filters/state.tsx @@ -10,10 +10,11 @@ type Props = { handleRemove: (val: string) => void; states: IState[]; values: string[]; + disableClearOption: boolean | undefined; }; export const AppliedStateFilters: React.FC = observer((props) => { - const { handleRemove, states, values } = props; + const { handleRemove, states, values, disableClearOption } = props; return ( <> @@ -26,13 +27,15 @@ export const AppliedStateFilters: React.FC = observer((props) => {
{stateDetails.name} - + {!disableClearOption && ( + + )}
); })} diff --git a/web/components/issues/issue-layouts/roots/all-issue-layout-root.tsx b/web/components/issues/issue-layouts/roots/all-issue-layout-root.tsx index 7ab5621b8..8aa75c911 100644 --- a/web/components/issues/issue-layouts/roots/all-issue-layout-root.tsx +++ b/web/components/issues/issue-layouts/roots/all-issue-layout-root.tsx @@ -110,7 +110,17 @@ export const AllIssueLayoutRoot: React.FC = observer((props) => { ) : ( <> - + {Object.keys(getIssues ?? {}).length == 0 ? ( <>{/* */}