project list

src/config/Pages.ts

@@ -173,6 +173,6 @@ export const Pages = {
     createWorkspace: "/workspace/create",
     updateWorkspace: "/workspace/update/",
     createProject: "/project/create",
-    projectList: "/project/list",
+    projectList: "/project/list/",
   },
 };

src/pages/taskmanager/project/Create.tsx

@@ -38,7 +38,7 @@ const CreateProject: FC = () => {
     createProject.mutate(values, {
       onSuccess: () => {
         toast.success(t("success"));
-        navigate(Pages.taskmanager.projectList);
+        navigate(`${Pages.taskmanager.projectList}${workspaceId}`);
       },
       onError: (error: ErrorType) => {
         toast.error(error.response?.data?.error.message[0]);

src/pages/taskmanager/project/List.tsx

@@ -1,29 +1,47 @@
-import { useState } from "react";
-import projectsData from "./data/projects.json";
+import { FC, useState } from "react";
+import { useParams } from "react-router-dom";
+import PageLoading from "../../../components/PageLoading";
+import { useGetWorkspaceDetail } from "../workspace/hooks/useWorkspaceData";
+import { WorkspaceDetailType } from "../workspace/types/WorkspaceTypes";
 import ProjectGrid from "./components/ProjectGrid";
 import ProjectListHeader from "./components/ProjectListHeader";
 import WorkspaceInfoBanner from "./components/WorkspaceInfoBanner";
-import type { ProjectItem, WorkspaceInfo } from "./types/ProjectTypes";
+import { useGetProjectsByWorkspace } from "./hooks/useProjectData";
+import type { ProjectItem } from "./types/ProjectTypes";
 
-const List = () => {
-  const { workspace, projects: initialProjects } = projectsData as {
-    workspace: WorkspaceInfo;
-    projects: ProjectItem[];
-  };
+const List: FC = () => {
+  const { workspaceId = "" } = useParams();
+  const getProjects = useGetProjectsByWorkspace(workspaceId);
+  const getWorkspaceDetail = useGetWorkspaceDetail(workspaceId);
 
-  const [projects, setProjects] = useState<ProjectItem[]>(initialProjects);
+  const workspace: WorkspaceDetailType | undefined =
+    getWorkspaceDetail.data?.data?.workspace ?? getWorkspaceDetail.data?.data;
+
+  const apiProjects: ProjectItem[] =
+    getProjects.data?.data?.projects ?? getProjects.data?.data ?? [];
+
+  const [deletedIds, setDeletedIds] = useState<string[]>([]);
+  const projects = apiProjects.filter((project) => !deletedIds.includes(project.id));
 
   const handleDelete = (id: string) => {
-    setProjects((prev) => prev.filter((project) => project.id !== id));
+    setDeletedIds((prev) => [...prev, id]);
   };
 
+  const isLoading = getProjects.isPending || getWorkspaceDetail.isPending;
+
   return (
     <div className="w-full mt-4">
-      <ProjectListHeader title={workspace.name} />
+      <ProjectListHeader title={workspace?.name ?? ""} workspaceId={workspaceId} />
 
-      <WorkspaceInfoBanner description={workspace.description} />
+      {workspace?.description ? (
+        <WorkspaceInfoBanner description={workspace.description} />
+      ) : null}
 
-      <ProjectGrid projects={projects} onDelete={handleDelete} />
+      {isLoading ? (
+        <PageLoading />
+      ) : (
+        <ProjectGrid projects={projects} onDelete={handleDelete} />
+      )}
     </div>
   );
 };

src/pages/taskmanager/project/components/ProjectCard.tsx

@@ -1,4 +1,4 @@
-import { FC } from "react";
+import { CSSProperties, FC } from "react";
 import { Link } from "react-router-dom";
 import { Pages } from "../../../../config/Pages";
 import type { ProjectItem } from "../types/ProjectTypes";
@@ -17,10 +17,20 @@ const hexToRgba = (hex: string, alpha: number) => {
   return `rgba(${r}, ${g}, ${b}, ${alpha})`;
 };
 
-const getCardBackground = (background: string) => {
-  const color = /^#[0-9A-Fa-f]{6}$/i.test(background) ? background : (background.match(/#[0-9A-Fa-f]{6}/i)?.[0] ?? "#A8E6CF");
+const getCardBackgroundStyle = (project: ProjectItem): CSSProperties => {
+  if (project.backgroundPicture) {
+    return {
+      backgroundImage: `url(${project.backgroundPicture})`,
+      backgroundSize: "cover",
+      backgroundPosition: "center",
+    };
+  }
 
-  return `linear-gradient(135deg, ${color}, ${hexToRgba(color, 0.5)})`;
+  const color = project.backgroundColor ?? "#A8E6CF";
+
+  return {
+    background: `linear-gradient(135deg, ${color}, ${hexToRgba(color, 0.5)})`,
+  };
 };
 
 const ProjectCard: FC<Props> = ({ project, onDelete }) => {
@@ -31,7 +41,7 @@ const ProjectCard: FC<Props> = ({ project, onDelete }) => {
   return (
     <div className="bg-white rounded-[20px] overflow-hidden shadow-sm border border-border/40 p-3">
       <Link to={Pages.taskmanager.workspace + project.id}>
-        <div className="h-[84px] w-full rounded-[16px]" style={{ background: getCardBackground(project.background) }} />
+        <div className="h-[84px] w-full rounded-[16px]" style={getCardBackgroundStyle(project)} />
       </Link>
 
       <div className="flex items-center justify-between mt-3.5">

src/pages/taskmanager/project/components/ProjectListHeader.tsx

@@ -7,11 +7,15 @@ import { Pages } from "../../../../config/Pages";
 
 type Props = {
   title: string;
+  workspaceId?: string;
   onSettingsClick?: () => void;
 };
 
-const ProjectListHeader: FC<Props> = ({ title, onSettingsClick }) => {
+const ProjectListHeader: FC<Props> = ({ title, workspaceId, onSettingsClick }) => {
   const { t } = useTranslation("global");
+  const createProjectLink = workspaceId
+    ? `${Pages.taskmanager.createProject}?workspaceId=${workspaceId}`
+    : Pages.taskmanager.createProject;
 
   return (
     <div className="flex w-full justify-between items-center">
@@ -23,7 +27,7 @@ const ProjectListHeader: FC<Props> = ({ title, onSettingsClick }) => {
           <span>{t("sidebar.setting")}</span>
         </Button>
 
-        <Link to={Pages.taskmanager.createProject}>
+        <Link to={createProjectLink}>
           <Button onClick={onSettingsClick} className="flex items-center gap-2 whitespace-nowrap px-4">
             <Add size={18} color="white" />
             <span>{t("taskmanager.new_project")}</span>

src/pages/taskmanager/project/hooks/useProjectData.ts

@@ -1,15 +1,23 @@
-import { useMutation, useQueryClient } from "@tanstack/react-query";
+import { useMutation, useQuery, useQueryClient } from "@tanstack/react-query";
 import * as api from "../service/ProjectService";
 import { CreateProjectType } from "../types/ProjectTypes";
 
+export const useGetProjectsByWorkspace = (workspaceId: string) => {
+  return useQuery({
+    queryKey: ["projects", workspaceId],
+    queryFn: () => api.getProjectsByWorkspace(workspaceId),
+    enabled: !!workspaceId,
+  });
+};
+
 export const useCreateProject = () => {
   const queryClient = useQueryClient();
 
   return useMutation({
     mutationFn: (variables: CreateProjectType) => api.createProject(variables),
-    onSuccess: () => {
+    onSuccess: (_data, variables) => {
       queryClient.invalidateQueries({
-        queryKey: ["projects"],
+        queryKey: ["projects", variables.workspaceId],
       });
     },
   });

src/pages/taskmanager/project/service/ProjectService.ts

@@ -1,6 +1,13 @@
 import axios from "../../../../config/axios";
 import { CreateProjectType } from "../types/ProjectTypes";
 
+export const getProjectsByWorkspace = async (workspaceId: string) => {
+  const { data } = await axios.get(
+    `/task-manager/projects/user/workspace/${workspaceId}`,
+  );
+  return data;
+};
+
 export const createProject = async (params: CreateProjectType) => {
   const { data } = await axios.post(`/task-manager/projects`, params);
   return data;

src/pages/taskmanager/project/types/ProjectTypes.ts

@@ -1,12 +1,8 @@
 export type ProjectItem = {
   id: string;
   name: string;
-  background: string;
-};
-
-export type WorkspaceInfo = {
-  name: string;
-  description: string;
+  backgroundColor?: string;
+  backgroundPicture?: string;
 };
 
 export type CreateProjectType = {

src/pages/taskmanager/workspace/List.tsx

@@ -1,5 +1,5 @@
-import { FC } from "react";
 import { Add, Edit } from "iconsax-react";
+import { FC } from "react";
 import { useTranslation } from "react-i18next";
 import { Link } from "react-router-dom";
 import { toast } from "react-toastify";
@@ -9,10 +9,7 @@ import Td from "../../../components/Td";
 import TrashWithConfrim from "../../../components/TrashWithConfrim";
 import { Pages } from "../../../config/Pages";
 import { ErrorType } from "../../../helpers/types";
-import {
-  useDeleteWorkspace,
-  useGetWorkspaces,
-} from "./hooks/useWorkspaceData";
+import { useDeleteWorkspace, useGetWorkspaces } from "./hooks/useWorkspaceData";
 import { WorkspaceItemType } from "./types/WorkspaceTypes";
 
 const WorkspaceList: FC = () => {
@@ -20,10 +17,7 @@ const WorkspaceList: FC = () => {
   const getWorkspaces = useGetWorkspaces();
   const deleteWorkspace = useDeleteWorkspace();
 
-  const workspaces: WorkspaceItemType[] =
-    getWorkspaces.data?.data?.workspaces ??
-    getWorkspaces.data?.data ??
-    [];
+  const workspaces: WorkspaceItemType[] = getWorkspaces.data?.data?.workspaces ?? getWorkspaces.data?.data ?? [];
 
   const handleDelete = (id: string) => {
     deleteWorkspace.mutate(id, {
@@ -43,7 +37,10 @@ const WorkspaceList: FC = () => {
         <Link to={Pages.taskmanager.createWorkspace}>
           <Button className="px-5">
             <div className="flex gap-2">
-              <Add className="size-5" color="#fff" />
+              <Add
+                className="size-5"
+                color="#fff"
+              />
               <div>{t("taskmanager.new_workspace")}</div>
             </div>
           </Button>
@@ -60,12 +57,16 @@ const WorkspaceList: FC = () => {
                 <Td text={t("taskmanager.workspacename")} />
                 <Td text={t("taskmanager.workspace_description")} />
                 <Td text={t("taskmanager.workspace_status")} />
+                <Td text={t("taskmanager.projects")} />
                 <Td text="" />
               </tr>
             </thead>
             <tbody>
               {workspaces.map((item) => (
-                <tr key={item.id} className="tr">
+                <tr
+                  key={item.id}
+                  className="tr"
+                >
                   <Td text="">
                     <div className="flex items-center gap-3">
                       <div
@@ -81,15 +82,22 @@ const WorkspaceList: FC = () => {
                     </div>
                   </Td>
                   <Td text={item.description ?? ""} />
-                  <Td
-                    text={
-                      item.isActive ? t("slider.active") : t("slider.inactive")
-                    }
-                  />
+                  <Td text={item.isActive ? t("slider.active") : t("slider.inactive")} />
+                  <Td text="">
+                    <Link to={Pages.taskmanager.projectList + item.id}>
+                      <Button
+                        label="مدیریت پروژه ها"
+                        className="bg-blue-400 w-fit px-3"
+                      />
+                    </Link>
+                  </Td>
                   <Td text="">
                     <div className="flex items-center gap-2">
                       <Link to={Pages.taskmanager.updateWorkspace + item.id}>
-                        <Edit size={20} color="#8C90A3" />
+                        <Edit
+                          size={20}
+                          color="#8C90A3"
+                        />
                       </Link>
                       <TrashWithConfrim
                         onDelete={() => handleDelete(item.id)}

src/router/Main.tsx

@@ -82,8 +82,8 @@ import CreateProject from "../pages/taskmanager/project/Create.tsx";
 import ProjectList from "../pages/taskmanager/project/List.tsx";
 import Workspace from "../pages/taskmanager/workspace.tsx";
 import CreateWorkspace from "../pages/taskmanager/workspace/Create.tsx";
-import UpdateWorkspace from "../pages/taskmanager/workspace/Update.tsx";
 import WorkspaceList from "../pages/taskmanager/workspace/List.tsx";
+import UpdateWorkspace from "../pages/taskmanager/workspace/Update.tsx";
 import TicketCategory from "../pages/ticket/Category";
 import CreateTicket from "../pages/ticket/CreateTicket";
 import TicketDetail from "../pages/ticket/Detail";
@@ -113,117 +113,400 @@ const MainRouter: FC = () => {
       {!isWorkspace && <SideBar />}
       <Header />
       <div className={clx("flex-1 mt-[68px] xl:mt-[81px]", !isWorkspace && "xl:ms-[269px]", !isWorkspace && hasSubMenu && "xl:ms-[305px]")}>
-        <div
-          className={clx(
-            "flex flex-col",
-            isWorkspace ? "h-[calc(100dvh-68px)] xl:h-[calc(100dvh-97px)] overflow-hidden" : "overflow-auto h-[calc(100vh-113px)]",
-          )}
-        >
+        <div className={clx("flex flex-col", isWorkspace ? "h-[calc(100dvh-68px)] xl:h-[calc(100dvh-97px)] overflow-hidden" : "overflow-auto h-[calc(100vh-113px)]")}>
           <div className={clx("flex-1 min-h-0", isWorkspace && "overflow-hidden")}>
             <Routes>
-              <Route path={Pages.dashboard} element={<Home />} />
-              <Route path={Pages.services.mine} element={<MyServices />} />
-              <Route path={Pages.services.other} element={<OtherServices />} />
-              <Route path={Pages.services.detail + ":id"} element={<DetailService />} />
-              <Route path={Pages.services.add} element={<AddService />} />
-              <Route path={Pages.services.list} element={<ListService />} />
-              <Route path={Pages.services.update + ":id"} element={<UpdateService />} />
-              <Route path={Pages.services.category} element={<Category />} />
-              <Route path={Pages.services.plan + ":id"} element={<Plans />} />
-              <Route path={Pages.services.review} element={<Reviews />} />
-              <Route path={Pages.ticket.list} element={<TicketList />} />
-              <Route path={Pages.ticket.create} element={<CreateTicket />} />
-              <Route path={Pages.ticket.category} element={<TicketCategory />} />
-              <Route path={Pages.ticket.detail + ":id"} element={<TicketDetail />} />
-              <Route path={Pages.ads.list} element={<AdsList />} />
-              <Route path={Pages.ads.create} element={<CreateAds />} />
-              <Route path={Pages.ads.update + ":id"} element={<UpdateAds />} />
-              <Route path={Pages.discount.list} element={<DiscountsList />} />
-              <Route path={Pages.discount.create} element={<CreateDiscount />} />
-              <Route path={Pages.discount.detail + ":id"} element={<UpdateDiscount />} />
-              <Route path={Pages.blog.list} element={<BlogList />} />
-              <Route path={Pages.blog.create} element={<CreateBlog />} />
-              <Route path={Pages.blog.category} element={<BlogCategory />} />
-              <Route path={Pages.blog.detail + ":id"} element={<UpdateBlog />} />
-              <Route path={Pages.transactions} element={<TransactionList />} />
-              <Route path={Pages.receipts.index} element={<ReceiptsList />} />
-              <Route path={Pages.receipts.detail + ":id"} element={<ReceiptsDetail />} />
-              <Route path={Pages.receipts.create} element={<CreateReceipt />} />
-              <Route path={Pages.announcement.list} element={<AnnouncementtList />} />
-              <Route path={Pages.announcement.detail + ":id"} element={<Update />} />
-              <Route path={Pages.announcement.create} element={<Create />} />
-              <Route path={Pages.criticisms.list} element={<CriticismsList />} />
-              <Route path={Pages.criticisms.detail + ":id"} element={<CriticismsDetail />} />
-              <Route path={Pages.learning.list} element={<LearningList />} />
-              <Route path={Pages.learning.create} element={<CreateLearning />} />
-              <Route path={Pages.learning.category} element={<LearningCategory />} />
-              <Route path={Pages.setting} element={<Setting />} />
-              <Route path={Pages.wallet} element={<Wallet />} />
-              <Route path={Pages.profile} element={<Profile />} />
-              <Route path={Pages.customer.list} element={<CustomerList />} />
-              <Route path={Pages.customer.create} element={<CreateCustomer />} />
-              <Route path={Pages.customer.update + ":id"} element={<UpdateCustomer />} />
-              <Route path={Pages.messages.list} element={<MessagesList />} />
-              <Route path={Pages.messages.detail + ":id"} element={<MessageDetail />} />
-              <Route path={Pages.users.list} element={<UsersList />} />
-              <Route path={Pages.users.create} element={<CreateUser />} />
-              <Route path={Pages.users.detail + ":id"} element={<UpdateUser />} />
-              <Route path={Pages.users.roleList} element={<RolesList />} />
-              <Route path={Pages.users.roleCreate} element={<RoleCreate />} />
-              <Route path={Pages.users.roleUpdate + ":id"} element={<RoleUpdate />} />
-              <Route path={Pages.users.groupAdd} element={<GroupCreate />} />
-              <Route path={Pages.users.groupList} element={<GroupList />} />
-              <Route path={Pages.cardBank.create} element={<CreateBankCard />} />
-              <Route path={Pages.cardBank.list} element={<CardBankList />} />
-              <Route path={Pages.cardBank.detail + ":id"} element={<EditBankCard />} />
-              <Route path={Pages.payment.list} element={<PaymentList />} />
-              <Route path={Pages.sliders.create} element={<CreateSlider />} />
-              <Route path={Pages.sliders.list} element={<SliderList />} />
-              <Route path={Pages.sliders.detail + ":id"} element={<UpdateSlider />} />
-              <Route path={Pages.blog.comments} element={<Comments />} />
-              <Route path={Pages.support.create} element={<CreatePlan />} />
-              <Route path={Pages.support.list} element={<SupportList />} />
-              <Route path={Pages.support.detail + ":id"} element={<UpdateSupport />} />
-              <Route path={Pages.support.planUsers + ":id"} element={<PlanUsers />} />
-              <Route path={Pages.services.guide + ":id"} element={<List />} />
-              <Route path={Pages.services.guide + ":id/create"} element={<CreateGuide />} />
-              <Route path={Pages.services.guide + ":id/:guideId"} element={<UpdateGuide />} />
-              <Route path={Pages.feedback.list} element={<ListFeedback />} />
-              <Route path={Pages.accessLogs.list} element={<AccessLogsList />} />
-              <Route path={Pages.accessLogs.stats} element={<AccessLogsStats />} />
-              <Route path={Pages.accessLogs.errors} element={<ErrorLogs />} />
-              <Route path={Pages.accessLogs.permissions} element={<PermissionLogs />} />
+              <Route
+                path={Pages.dashboard}
+                element={<Home />}
+              />
+              <Route
+                path={Pages.services.mine}
+                element={<MyServices />}
+              />
+              <Route
+                path={Pages.services.other}
+                element={<OtherServices />}
+              />
+              <Route
+                path={Pages.services.detail + ":id"}
+                element={<DetailService />}
+              />
+              <Route
+                path={Pages.services.add}
+                element={<AddService />}
+              />
+              <Route
+                path={Pages.services.list}
+                element={<ListService />}
+              />
+              <Route
+                path={Pages.services.update + ":id"}
+                element={<UpdateService />}
+              />
+              <Route
+                path={Pages.services.category}
+                element={<Category />}
+              />
+              <Route
+                path={Pages.services.plan + ":id"}
+                element={<Plans />}
+              />
+              <Route
+                path={Pages.services.review}
+                element={<Reviews />}
+              />
+              <Route
+                path={Pages.ticket.list}
+                element={<TicketList />}
+              />
+              <Route
+                path={Pages.ticket.create}
+                element={<CreateTicket />}
+              />
+              <Route
+                path={Pages.ticket.category}
+                element={<TicketCategory />}
+              />
+              <Route
+                path={Pages.ticket.detail + ":id"}
+                element={<TicketDetail />}
+              />
+              <Route
+                path={Pages.ads.list}
+                element={<AdsList />}
+              />
+              <Route
+                path={Pages.ads.create}
+                element={<CreateAds />}
+              />
+              <Route
+                path={Pages.ads.update + ":id"}
+                element={<UpdateAds />}
+              />
+              <Route
+                path={Pages.discount.list}
+                element={<DiscountsList />}
+              />
+              <Route
+                path={Pages.discount.create}
+                element={<CreateDiscount />}
+              />
+              <Route
+                path={Pages.discount.detail + ":id"}
+                element={<UpdateDiscount />}
+              />
+              <Route
+                path={Pages.blog.list}
+                element={<BlogList />}
+              />
+              <Route
+                path={Pages.blog.create}
+                element={<CreateBlog />}
+              />
+              <Route
+                path={Pages.blog.category}
+                element={<BlogCategory />}
+              />
+              <Route
+                path={Pages.blog.detail + ":id"}
+                element={<UpdateBlog />}
+              />
+              <Route
+                path={Pages.transactions}
+                element={<TransactionList />}
+              />
+              <Route
+                path={Pages.receipts.index}
+                element={<ReceiptsList />}
+              />
+              <Route
+                path={Pages.receipts.detail + ":id"}
+                element={<ReceiptsDetail />}
+              />
+              <Route
+                path={Pages.receipts.create}
+                element={<CreateReceipt />}
+              />
+              <Route
+                path={Pages.announcement.list}
+                element={<AnnouncementtList />}
+              />
+              <Route
+                path={Pages.announcement.detail + ":id"}
+                element={<Update />}
+              />
+              <Route
+                path={Pages.announcement.create}
+                element={<Create />}
+              />
+              <Route
+                path={Pages.criticisms.list}
+                element={<CriticismsList />}
+              />
+              <Route
+                path={Pages.criticisms.detail + ":id"}
+                element={<CriticismsDetail />}
+              />
+              <Route
+                path={Pages.learning.list}
+                element={<LearningList />}
+              />
+              <Route
+                path={Pages.learning.create}
+                element={<CreateLearning />}
+              />
+              <Route
+                path={Pages.learning.category}
+                element={<LearningCategory />}
+              />
+              <Route
+                path={Pages.setting}
+                element={<Setting />}
+              />
+              <Route
+                path={Pages.wallet}
+                element={<Wallet />}
+              />
+              <Route
+                path={Pages.profile}
+                element={<Profile />}
+              />
+              <Route
+                path={Pages.customer.list}
+                element={<CustomerList />}
+              />
+              <Route
+                path={Pages.customer.create}
+                element={<CreateCustomer />}
+              />
+              <Route
+                path={Pages.customer.update + ":id"}
+                element={<UpdateCustomer />}
+              />
+              <Route
+                path={Pages.messages.list}
+                element={<MessagesList />}
+              />
+              <Route
+                path={Pages.messages.detail + ":id"}
+                element={<MessageDetail />}
+              />
+              <Route
+                path={Pages.users.list}
+                element={<UsersList />}
+              />
+              <Route
+                path={Pages.users.create}
+                element={<CreateUser />}
+              />
+              <Route
+                path={Pages.users.detail + ":id"}
+                element={<UpdateUser />}
+              />
+              <Route
+                path={Pages.users.roleList}
+                element={<RolesList />}
+              />
+              <Route
+                path={Pages.users.roleCreate}
+                element={<RoleCreate />}
+              />
+              <Route
+                path={Pages.users.roleUpdate + ":id"}
+                element={<RoleUpdate />}
+              />
+              <Route
+                path={Pages.users.groupAdd}
+                element={<GroupCreate />}
+              />
+              <Route
+                path={Pages.users.groupList}
+                element={<GroupList />}
+              />
+              <Route
+                path={Pages.cardBank.create}
+                element={<CreateBankCard />}
+              />
+              <Route
+                path={Pages.cardBank.list}
+                element={<CardBankList />}
+              />
+              <Route
+                path={Pages.cardBank.detail + ":id"}
+                element={<EditBankCard />}
+              />
+              <Route
+                path={Pages.payment.list}
+                element={<PaymentList />}
+              />
+              <Route
+                path={Pages.sliders.create}
+                element={<CreateSlider />}
+              />
+              <Route
+                path={Pages.sliders.list}
+                element={<SliderList />}
+              />
+              <Route
+                path={Pages.sliders.detail + ":id"}
+                element={<UpdateSlider />}
+              />
+              <Route
+                path={Pages.blog.comments}
+                element={<Comments />}
+              />
+              <Route
+                path={Pages.support.create}
+                element={<CreatePlan />}
+              />
+              <Route
+                path={Pages.support.list}
+                element={<SupportList />}
+              />
+              <Route
+                path={Pages.support.detail + ":id"}
+                element={<UpdateSupport />}
+              />
+              <Route
+                path={Pages.support.planUsers + ":id"}
+                element={<PlanUsers />}
+              />
+              <Route
+                path={Pages.services.guide + ":id"}
+                element={<List />}
+              />
+              <Route
+                path={Pages.services.guide + ":id/create"}
+                element={<CreateGuide />}
+              />
+              <Route
+                path={Pages.services.guide + ":id/:guideId"}
+                element={<UpdateGuide />}
+              />
+              <Route
+                path={Pages.feedback.list}
+                element={<ListFeedback />}
+              />
+              <Route
+                path={Pages.accessLogs.list}
+                element={<AccessLogsList />}
+              />
+              <Route
+                path={Pages.accessLogs.stats}
+                element={<AccessLogsStats />}
+              />
+              <Route
+                path={Pages.accessLogs.errors}
+                element={<ErrorLogs />}
+              />
+              <Route
+                path={Pages.accessLogs.permissions}
+                element={<PermissionLogs />}
+              />
 
-              <Route path={Pages.dmenu.icons.list} element={<IconsList />} />
-              <Route path={Pages.dmenu.icons.groupList} element={<GroupIconList />} />
-              <Route path={Pages.dmenu.warnings.list} element={<WarningsList />} />
-              <Route path={Pages.dmenu.restaurants.list} element={<RestaurantsList />} />
-              <Route path={Pages.dmenu.restaurants.smsCountList} element={<SmsCountList />} />
-              <Route path={Pages.dmenu.restaurants.update + ":id"} element={<UpdateRestaurant />} />
+              <Route
+                path={Pages.dmenu.icons.list}
+                element={<IconsList />}
+              />
+              <Route
+                path={Pages.dmenu.icons.groupList}
+                element={<GroupIconList />}
+              />
+              <Route
+                path={Pages.dmenu.warnings.list}
+                element={<WarningsList />}
+              />
+              <Route
+                path={Pages.dmenu.restaurants.list}
+                element={<RestaurantsList />}
+              />
+              <Route
+                path={Pages.dmenu.restaurants.smsCountList}
+                element={<SmsCountList />}
+              />
+              <Route
+                path={Pages.dmenu.restaurants.update + ":id"}
+                element={<UpdateRestaurant />}
+              />
 
-              <Route path={Pages.dkala.icons.list} element={<DkalaIconsList />} />
-              <Route path={Pages.dkala.icons.groupList} element={<DkalaGroupIconList />} />
-              <Route path={Pages.dkala.warnings.list} element={<DkalaWarningsList />} />
-              <Route path={Pages.dkala.shops.list} element={<ShopsList />} />
-              <Route path={Pages.dkala.shops.smsCountList} element={<DkalaSmsCountList />} />
-              <Route path={Pages.dkala.shops.update + ":id"} element={<UpdateShop />} />
+              <Route
+                path={Pages.dkala.icons.list}
+                element={<DkalaIconsList />}
+              />
+              <Route
+                path={Pages.dkala.icons.groupList}
+                element={<DkalaGroupIconList />}
+              />
+              <Route
+                path={Pages.dkala.warnings.list}
+                element={<DkalaWarningsList />}
+              />
+              <Route
+                path={Pages.dkala.shops.list}
+                element={<ShopsList />}
+              />
+              <Route
+                path={Pages.dkala.shops.smsCountList}
+                element={<DkalaSmsCountList />}
+              />
+              <Route
+                path={Pages.dkala.shops.update + ":id"}
+                element={<UpdateShop />}
+              />
 
-              <Route path={Pages.dpage.stickers.list} element={<DpageStickersList />} />
+              <Route
+                path={Pages.dpage.stickers.list}
+                element={<DpageStickersList />}
+              />
 
-              <Route path={Pages.subscriptions.list} element={<SubscriptionsList />} />
+              <Route
+                path={Pages.subscriptions.list}
+                element={<SubscriptionsList />}
+              />
 
-              <Route path={Pages.dmail.list} element={<Domains />} />
+              <Route
+                path={Pages.dmail.list}
+                element={<Domains />}
+              />
 
-              <Route path={Pages.reseller.list} element={<ResellerList />} />
-              <Route path={Pages.reseller.create} element={<CreateReseller />} />
-              <Route path={Pages.reseller.withdraw} element={<Withdraw />} />
+              <Route
+                path={Pages.reseller.list}
+                element={<ResellerList />}
+              />
+              <Route
+                path={Pages.reseller.create}
+                element={<CreateReseller />}
+              />
+              <Route
+                path={Pages.reseller.withdraw}
+                element={<Withdraw />}
+              />
 
-              <Route path={Pages.taskmanager.workspace + ":slug"} element={<Workspace />} />
-              <Route path={Pages.taskmanager.workspaceList} element={<WorkspaceList />} />
-              <Route path={Pages.taskmanager.createWorkspace} element={<CreateWorkspace />} />
-              <Route path={Pages.taskmanager.updateWorkspace + ":id"} element={<UpdateWorkspace />} />
-              <Route path={Pages.taskmanager.createProject} element={<CreateProject />} />
-              <Route path={Pages.taskmanager.projectList} element={<ProjectList />} />
+              <Route
+                path={Pages.taskmanager.workspace + ":slug"}
+                element={<Workspace />}
+              />
+              <Route
+                path={Pages.taskmanager.workspaceList}
+                element={<WorkspaceList />}
+              />
+              <Route
+                path={Pages.taskmanager.createWorkspace}
+                element={<CreateWorkspace />}
+              />
+              <Route
+                path={Pages.taskmanager.updateWorkspace + ":id"}
+                element={<UpdateWorkspace />}
+              />
+              <Route
+                path={Pages.taskmanager.createProject}
+                element={<CreateProject />}
+              />
+              <Route
+                path={Pages.taskmanager.projectList + ":workspaceId"}
+                element={<ProjectList />}
+              />
             </Routes>
           </div>
           {!isWorkspace && <div className="h-20 shrink-0 xl:hidden" />}

src/shared/SideBar.tsx

@@ -502,21 +502,6 @@ const SideBar: FC = () => {
               activeName=""
             />
 
-            <SideBarItem
-              icon={
-                <Category
-                  variant={location.pathname === Pages.taskmanager.projectList ? "Bold" : "Outline"}
-                  color={location.pathname === Pages.taskmanager.projectList ? "black" : "#8C90A3"}
-                  size={iconSizeSideBar}
-                />
-              }
-              title={t("submenu.taskmanager_project_list")}
-              isActive={location.pathname === Pages.taskmanager.projectList}
-              link={Pages.taskmanager.projectList}
-              name="taskmanager"
-              activeName=""
-            />
-
             <SideBarItem
               icon={
                 <Add