diff --git a/dashboard/src/scenes/action/list.js b/dashboard/src/scenes/action/list.js index 3a2a64fac..96c124e1b 100644 --- a/dashboard/src/scenes/action/list.js +++ b/dashboard/src/scenes/action/list.js @@ -271,9 +271,7 @@ const List = () => {
{ - setSelectedTeamIds(teamIds); - }} + onChange={setSelectedTeamIds} value={selectedTeamIds} colored isDisabled={viewAllOrganisationData || viewNoTeamData} diff --git a/dashboard/src/scenes/person/components/Actions.js b/dashboard/src/scenes/person/components/Actions.js index d76be2e94..0df94059a 100644 --- a/dashboard/src/scenes/person/components/Actions.js +++ b/dashboard/src/scenes/person/components/Actions.js @@ -15,14 +15,16 @@ import { FullScreenIcon } from './FullScreenIcon'; import UserName from '../../../components/UserName'; import { itemsGroupedByPersonSelector } from '../../../recoil/selectors'; import DescriptionIcon from '../../../components/DescriptionIcon'; +import SelectTeamMultiple from '../../../components/SelectTeamMultiple'; const filteredPersonActionsSelector = selectorFamily({ key: 'filteredPersonActionsSelector', get: - ({ personId, filterCategories, filterStatus }) => + ({ personId, filterCategories, filterStatus, filterTeamIds }) => ({ get }) => { const person = get(itemsGroupedByPersonSelector)[personId]; let actionsToSet = person?.actions || []; + if (filterCategories.length) { actionsToSet = actionsToSet.filter((a) => filterCategories.some((c) => (c === '-- Aucune --' ? a.categories?.length === 0 : a.categories?.includes(c))) @@ -31,6 +33,16 @@ const filteredPersonActionsSelector = selectorFamily({ if (filterStatus.length) { actionsToSet = actionsToSet.filter((a) => filterStatus.some((s) => a.status === s)); } + if (filterTeamIds.length) { + actionsToSet = actionsToSet.filter((action) => { + if (Array.isArray(action.teams)) { + if (!filterTeamIds.some((t) => action.teams.includes(t))) return false; + } else { + if (!filterTeamIds.includes(action.team)) return false; + } + return true; + }); + } return [...actionsToSet] .sort((p1, p2) => ((p1.completedAt || p1.dueAt) > (p2.completedAt || p2.dueAt) ? -1 : 1)) .map((a) => (a.urgent ? { ...a, style: { backgroundColor: '#fecaca99' } } : a)); @@ -42,11 +54,12 @@ export const Actions = ({ person }) => { const [fullScreen, setFullScreen] = useState(false); const [filterCategories, setFilterCategories] = useState([]); const [filterStatus, setFilterStatus] = useState([]); - const filteredData = useRecoilValue(filteredPersonActionsSelector({ personId: person._id, filterCategories, filterStatus })); + const [filterTeamIds, setFilterTeamIds] = useState([]); + const filteredData = useRecoilValue(filteredPersonActionsSelector({ personId: person._id, filterCategories, filterStatus, filterTeamIds })); const history = useHistory(); return ( -
+

Actions {filteredData.length ? `(${filteredData.length})` : ''}

@@ -73,22 +86,24 @@ export const Actions = ({ person }) => {
setFullScreen(false)}>
@@ -116,7 +131,7 @@ export const Actions = ({ person }) => { ); }; -const ActionsFilters = ({ data, filteredData, setFilterCategories, setFilterStatus, filterStatus, filterCategories }) => { +const ActionsFilters = ({ data, setFilterCategories, setFilterTeamIds, setFilterStatus, filterStatus, filterTeamIds, filterCategories }) => { const categories = useRecoilValue(flattenedActionsCategoriesSelector); const catsSelect = ['-- Aucune --', ...(categories || [])]; @@ -124,22 +139,28 @@ const ActionsFilters = ({ data, filteredData, setFilterCategories, setFilterStat return ( <> {data.length ? ( -
-
+
+
- ({ value: _option, label: _option }))} - value={filterCategories?.map((_option) => ({ value: _option, label: _option })) || []} - getOptionValue={(i) => i.value} - getOptionLabel={(i) => i.label} - onChange={(values) => setFilterCategories(values.map((v) => v.value))} - inputId="action-select-categories-filter" - name="categories" - isClearable - isMulti - /> +
+ ({ value: _option, label: _option }))} + value={filterCategories?.map((_option) => ({ value: _option, label: _option })) || []} + getOptionValue={(i) => i.value} + getOptionLabel={(i) => i.label} + onChange={(values) => setFilterCategories(values.map((v) => v.value))} + inputId="action-select-categories-filter" + name="categories" + isClearable + isMulti + /> +
+
+
+ + setFilterTeamIds(teamIds)} value={filterTeamIds} colored inputId="action-team-select" />
-
+
{ const enabledFields = fields.filter((f) => f.enabled || f.enabledTeams?.includes(team._id)); return ( - <> +

{name}

@@ -75,7 +75,7 @@ export function SummaryPrint({ person }: { person: PersonPopulated }) { ); })}
- + ); })}