Migrate to a monorepo structure (#2909)

2023-12-10 18:10:54 +01:00
parent a70a9281eb
commit 5bdca9de6c
2304 changed files with 37152 additions and 25869 deletions
--- a/packages/twenty-front/src/modules/activities/tasks/components/TaskGroups.tsx
+++ b/packages/twenty-front/src/modules/activities/tasks/components/TaskGroups.tsx
@ -0,0 +1,147 @@
+import styled from '@emotion/styled';
+
+import { useOpenCreateActivityDrawer } from '@/activities/hooks/useOpenCreateActivityDrawer';
+import { TasksRecoilScopeContext } from '@/activities/states/recoil-scope-contexts/TasksRecoilScopeContext';
+import { useTasks } from '@/activities/tasks/hooks/useTasks';
+import { ActivityTargetableEntity } from '@/activities/types/ActivityTargetableEntity';
+import { IconPlus } from '@/ui/display/icon';
+import { Button } from '@/ui/input/button/components/Button';
+import { activeTabIdScopedState } from '@/ui/layout/tab/states/activeTabIdScopedState';
+import { useRecoilScopedState } from '@/ui/utilities/recoil-scope/hooks/useRecoilScopedState';
+
+import { AddTaskButton } from './AddTaskButton';
+import { TaskList } from './TaskList';
+
+type TaskGroupsProps = {
+  filterDropdownId?: string;
+  entity?: ActivityTargetableEntity;
+  showAddButton?: boolean;
+};
+
+const StyledTaskGroupEmptyContainer = styled.div`
+  align-items: center;
+  align-self: stretch;
+  display: flex;
+  flex: 1 0 0;
+  flex-direction: column;
+  gap: ${({ theme }) => theme.spacing(2)};
+  justify-content: center;
+  padding-bottom: ${({ theme }) => theme.spacing(16)};
+  padding-left: ${({ theme }) => theme.spacing(4)};
+  padding-right: ${({ theme }) => theme.spacing(4)};
+  padding-top: ${({ theme }) => theme.spacing(3)};
+`;
+
+const StyledEmptyTaskGroupTitle = styled.div`
+  color: ${({ theme }) => theme.font.color.secondary};
+  font-size: ${({ theme }) => theme.font.size.xxl};
+  font-weight: ${({ theme }) => theme.font.weight.semiBold};
+  line-height: ${({ theme }) => theme.text.lineHeight.md};
+`;
+
+const StyledEmptyTaskGroupSubTitle = styled.div`
+  color: ${({ theme }) => theme.font.color.extraLight};
+  font-size: ${({ theme }) => theme.font.size.xxl};
+  font-weight: ${({ theme }) => theme.font.weight.semiBold};
+  line-height: ${({ theme }) => theme.text.lineHeight.md};
+  margin-bottom: ${({ theme }) => theme.spacing(2)};
+`;
+
+const StyledContainer = styled.div`
+  display: flex;
+  flex-direction: column;
+`;
+
+export const TaskGroups = ({
+  filterDropdownId,
+  entity,
+  showAddButton,
+}: TaskGroupsProps) => {
+  const {
+    todayOrPreviousTasks,
+    upcomingTasks,
+    unscheduledTasks,
+    completedTasks,
+  } = useTasks({ filterDropdownId: filterDropdownId, entity });
+
+  const openCreateActivity = useOpenCreateActivityDrawer();
+
+  const [activeTabId] = useRecoilScopedState(
+    activeTabIdScopedState,
+    TasksRecoilScopeContext,
+  );
+
+  if (entity?.type === 'Custom') {
+    return <></>;
+  }
+
+  if (
+    (activeTabId !== 'done' &&
+      todayOrPreviousTasks?.length === 0 &&
+      upcomingTasks?.length === 0 &&
+      unscheduledTasks?.length === 0) ||
+    (activeTabId === 'done' && completedTasks?.length === 0)
+  ) {
+    return (
+      <StyledTaskGroupEmptyContainer>
+        <StyledEmptyTaskGroupTitle>No task yet</StyledEmptyTaskGroupTitle>
+        <StyledEmptyTaskGroupSubTitle>Create one:</StyledEmptyTaskGroupSubTitle>
+        <Button
+          Icon={IconPlus}
+          title="New task"
+          variant={'secondary'}
+          onClick={() =>
+            openCreateActivity({
+              type: 'Task',
+              targetableEntities: entity ? [entity] : undefined,
+            })
+          }
+        />
+      </StyledTaskGroupEmptyContainer>
+    );
+  }
+
+  return (
+    <StyledContainer>
+      {activeTabId === 'done' ? (
+        <TaskList
+          tasks={completedTasks ?? []}
+          button={
+            showAddButton && <AddTaskButton activityTargetEntity={entity} />
+          }
+        />
+      ) : (
+        <>
+          <TaskList
+            title="Today"
+            tasks={todayOrPreviousTasks ?? []}
+            button={
+              showAddButton && <AddTaskButton activityTargetEntity={entity} />
+            }
+          />
+          <TaskList
+            title="Upcoming"
+            tasks={upcomingTasks ?? []}
+            button={
+              showAddButton &&
+              !todayOrPreviousTasks?.length && (
+                <AddTaskButton activityTargetEntity={entity} />
+              )
+            }
+          />
+          <TaskList
+            title="Unscheduled"
+            tasks={unscheduledTasks ?? []}
+            button={
+              showAddButton &&
+              !todayOrPreviousTasks?.length &&
+              !upcomingTasks?.length && (
+                <AddTaskButton activityTargetEntity={entity} />
+              )
+            }
+          />
+        </>
+      )}
+    </StyledContainer>
+  );
+};