Add a notification for "tasks" in the navigation (#1489)

* Add a notification for "tasks" in the navigation

Co-authored-by: v1b3m <vibenjamin6@gmail.com>
Co-authored-by: chiazokam <chiazokamecheta@gmail.com>

* Add a notification for "tasks" in the navigation

Co-authored-by: v1b3m <vibenjamin6@gmail.com>
Co-authored-by: chiazokam <chiazokamecheta@gmail.com>

* Fix icon import in TaskNavMenuItem

Co-authored-by: v1b3m <vibenjamin6@gmail.com>
Co-authored-by: chiazokam <chiazokamecheta@gmail.com>

* Use object destructuring

Co-authored-by: v1b3m <vibenjamin6@gmail.com>
Co-authored-by: chiazokam <chiazokamecheta@gmail.com>

* Refactor according to review

Co-authored-by: v1b3m <vibenjamin6@gmail.com>
Co-authored-by: chiazokam <chiazokamecheta@gmail.com>

* Rename dueTasks to dueTaskCount

Co-authored-by: v1b3m <vibenjamin6@gmail.com>
Co-authored-by: chiazokam <chiazokamecheta@gmail.com>

* Complete Task notification display

* Fix lint

* Fix tests

---------

Co-authored-by: v1b3m <vibenjamin6@gmail.com>
Co-authored-by: chiazokam <chiazokamecheta@gmail.com>
Co-authored-by: Charles Bochet <charles@twenty.com>
This commit is contained in:
gitstart-twenty
2023-09-13 02:16:51 +01:00
committed by GitHub
parent 92ef931d4d
commit cd946019f1
12 changed files with 187 additions and 86 deletions

View File

@ -14,6 +14,8 @@ import { TopBar } from '@/ui/top-bar/TopBar';
import { RecoilScope } from '@/ui/utilities/recoil-scope/components/RecoilScope';
import { FilterDropdownButton } from '@/ui/view-bar/components/FilterDropdownButton';
import { TasksEffect } from './TasksEffect';
const StyledTasksContainer = styled.div`
display: flex;
flex: 1;
@ -47,6 +49,7 @@ export function Tasks() {
<PageContainer>
<RecoilScope SpecificContext={DropdownRecoilScopeContext}>
<RecoilScope SpecificContext={TasksRecoilScopeContext}>
<TasksEffect />
<PageHeader title="Tasks" Icon={IconCheckbox}>
<PageAddTaskButton />
</PageHeader>

View File

@ -0,0 +1,44 @@
import { useEffect } from 'react';
import { useRecoilState } from 'recoil';
import { TasksRecoilScopeContext } from '@/activities/states/recoil-scope-contexts/TasksRecoilScopeContext';
import { currentUserState } from '@/auth/states/currentUserState';
import { useRecoilScopedState } from '@/ui/utilities/recoil-scope/hooks/useRecoilScopedState';
import { availableFiltersScopedState } from '@/ui/view-bar/states/availableFiltersScopedState';
import { filtersScopedState } from '@/ui/view-bar/states/filtersScopedState';
import { FilterOperand } from '@/ui/view-bar/types/FilterOperand';
import { tasksFilters } from './tasks-filters';
export function TasksEffect() {
const [currentUser] = useRecoilState(currentUserState);
const [, setFilters] = useRecoilScopedState(
filtersScopedState,
TasksRecoilScopeContext,
);
const [, setAvailableFilters] = useRecoilScopedState(
availableFiltersScopedState,
TasksRecoilScopeContext,
);
useEffect(() => {
setAvailableFilters(tasksFilters);
}, [setAvailableFilters]);
useEffect(() => {
if (currentUser) {
setFilters([
{
key: 'assigneeId',
type: 'entity',
value: currentUser.id,
operand: FilterOperand.Is,
displayValue: currentUser.displayName,
displayAvatarUrl: currentUser.avatarUrl ?? undefined,
},
]);
}
}, [currentUser, setFilters]);
return <></>;
}