diff --git a/client/src/components/EmptyState.tsx b/client/src/components/EmptyState.tsx new file mode 100644 index 0000000..dac0940 --- /dev/null +++ b/client/src/components/EmptyState.tsx @@ -0,0 +1,15 @@ +import { Grid, Typography } from "@mui/material"; +import { ReactNode } from "react"; + +type EmptySateProps = { + mini?: boolean; + children: ReactNode; +}; + +export const EmptySate = ({ children, mini = false }: EmptySateProps) => { + return ( + + {children} + + ); +}; diff --git a/client/src/pages/Projects/Projects.tsx b/client/src/pages/Projects/Projects.tsx index 40454d1..1a3370f 100644 --- a/client/src/pages/Projects/Projects.tsx +++ b/client/src/pages/Projects/Projects.tsx @@ -1,5 +1,6 @@ import { Box } from "@mui/material"; import useSWR from "swr"; +import { EmptySate } from "../../components/EmptyState"; import { useAuth } from "../../hooks/useAuth"; import { createSWRFetcher } from "../../utils/swrFetcher"; import { NewProjectAction } from "./components/NewProjectAction"; @@ -26,6 +27,9 @@ export const Projects = () => { gridAutoColumns: "repeat(auto-fit, minmax(250px, 1fr))", }} > + {(!!data?.data.length) ? null : ( + You didn't have any project yet + )} {data?.data.map((project) => ( ))} diff --git a/client/src/pages/Projects/components/Project/TaskList/TasksList.tsx b/client/src/pages/Projects/components/Project/TaskList/TasksList.tsx index 70ee387..eca69f2 100644 --- a/client/src/pages/Projects/components/Project/TaskList/TasksList.tsx +++ b/client/src/pages/Projects/components/Project/TaskList/TasksList.tsx @@ -1,4 +1,5 @@ import { List, ListSubheader } from "@mui/material"; +import { EmptySate } from "../../../../../components/EmptyState"; import { useAuth } from "../../../../../hooks/useAuth"; import { useProject } from "../../../../../hooks/useProject"; import { Task, TasksListItem } from "./TasksListItem"; @@ -35,6 +36,9 @@ export const TasksList = ({ title, tasks }: TaskListProps) => { } > + {tasks.length ? null : ( + You didn't have any task on '{title}' yet + )} {tasks.map((task) => (