Feature/95/archive project

app/core/components/ArchiveProject/index.tsx

@@ -0,0 +1,86 @@
+import { Archive } from "@mui/icons-material";
+import {
+  Button,
+  CircularProgress,
+  Dialog,
+  DialogActions,
+  DialogContent,
+  DialogTitle,
+  IconButton,
+  Tooltip,
+} from "@mui/material";
+import { Form, useTransition } from "@remix-run/react";
+import { useEffect, useState } from "react";
+
+export const ArchiveProject = ({ projectId }: { projectId?: string }) => {
+  const [open, setOpen] = useState(false);
+  const [isButtonDisabled, setisButtonDisabled] = useState(true);
+
+  const handleClickOpen = () => {
+    setOpen(true);
+
+    setTimeout(() => setisButtonDisabled(false), 5000);
+  };
+
+  const handleClose = () => {
+    setisButtonDisabled(true);
+    setOpen(false);
+  };
+
+  const transition = useTransition();
+  useEffect(() => {
+    if (transition.type == "actionRedirect") {
+      setOpen(false);
+    }
+  }, [transition]);
+
+  return (
+    <>
+      <Tooltip title="Archive project">
+        <IconButton
+          onClick={handleClickOpen}
+          aria-label="Archive-project-button"
+        >
+          <Archive />
+        </IconButton>
+      </Tooltip>
+
+      <Dialog onClose={handleClose} open={open}>
+        <DialogTitle>
+          Are you sure you want to archive this proposal?
+        </DialogTitle>
+        <Form action={`/projects/archive`} method="post">
+          <DialogContent>
+            You can unarchive the project later.
+            <input type="hidden" name="projectId" value={projectId} />
+          </DialogContent>
+          <DialogActions>
+            <Button className="primary" onClick={handleClose}>
+              Cancel
+            </Button>
+
+            <Button
+              disabled={isButtonDisabled}
+              type="submit"
+              variant="contained"
+              color="warning"
+            >
+              Yes, archive it
+            </Button>
+            {isButtonDisabled && (
+              <CircularProgress
+                size={24}
+                sx={{
+                  position: "absolute",
+                  left: "80%",
+                  marginTop: "-1px",
+                  marginLeft: "-1px",
+                }}
+              />
+            )}
+          </DialogActions>
+        </Form>
+      </Dialog>
+    </>
+  );
+};

app/core/components/ProposalCard/index.tsx

@@ -19,16 +19,18 @@ interface IProps {
   votesCount?: number | null;
   skills?: { name: string }[];
   isOwner?: boolean;
+  isArchived?: boolean;
   tierName: String;
   projectMembers?: number | null;
 }
 
 export const ProposalCard = (props: IProps) => {
   const stopEvent = (event: React.MouseEvent<HTMLElement>) =>
     event.stopPropagation();
+
   return (
     <>
-      <Card>
+      <Card variant={props?.isArchived ? "outlined" : "elevation"}>
         <CardActionArea sx={{ height: "100%" }} href={`/projects/${props.id}`}>
           <CardContent>
             <ProposalCardWrap>
@@ -48,6 +50,7 @@ export const ProposalCard = (props: IProps) => {
                 <div className="ProposalCard__head__description">
                   <div className="ProposalCard__head__description--title">
                     {props.title}
+                    {props.isArchived && <p>(Archived)</p>}
                   </div>
                   <div className="ProposalCard__head__description--date">
                     {props.date}

app/core/components/UnarchiveProject/index.tsx

@@ -0,0 +1,85 @@
+import { Unarchive } from "@mui/icons-material";
+import {
+  Button,
+  CircularProgress,
+  Dialog,
+  DialogActions,
+  DialogContent,
+  DialogTitle,
+  IconButton,
+  Tooltip,
+} from "@mui/material";
+import { Form, useTransition } from "@remix-run/react";
+import { useEffect, useState } from "react";
+
+export const UnarchiveProject = ({ projectId }: { projectId?: string }) => {
+  const [open, setOpen] = useState(false);
+  const [isButtonDisabled, setisButtonDisabled] = useState(true);
+
+  const handleClickOpen = () => {
+    setOpen(true);
+
+    setTimeout(() => setisButtonDisabled(false), 5000);
+  };
+
+  const handleClose = () => {
+    setisButtonDisabled(true);
+    setOpen(false);
+  };
+
+  const transition = useTransition();
+  useEffect(() => {
+    if (transition.type == "actionRedirect") {
+      setOpen(false);
+    }
+  }, [transition]);
+
+  return (
+    <>
+      <Tooltip title="Unarchive project">
+        <IconButton
+          onClick={handleClickOpen}
+          aria-label="Unarchive-project-button"
+        >
+          <Unarchive color="secondary" />
+        </IconButton>
+      </Tooltip>
+
+      <Dialog onClose={handleClose} open={open}>
+        <DialogTitle>
+          Are you sure you want to unarchive this proposal?
+        </DialogTitle>
+        <Form action={`/projects/unarchive`} method="post">
+          <DialogContent>
+            This action will unarchive the project and will be available again.
+            <input type="hidden" name="projectId" value={projectId} />
+          </DialogContent>
+          <DialogActions>
+            <Button className="primary" onClick={handleClose}>
+              Cancel
+            </Button>
+            <Button
+              disabled={isButtonDisabled}
+              type="submit"
+              variant="contained"
+              color="warning"
+            >
+              Unarchive it
+            </Button>
+            {isButtonDisabled && (
+              <CircularProgress
+                size={24}
+                sx={{
+                  position: "absolute",
+                  left: "85%",
+                  marginTop: "-1px",
+                  marginLeft: "-1px",
+                }}
+              />
+            )}
+          </DialogActions>
+        </Form>
+      </Dialog>
+    </>
+  );
+};

app/models/project.server.ts

@@ -1,8 +1,10 @@
+import { CompressOutlined } from "@mui/icons-material";
 import type { Profiles, Projects } from "@prisma/client";
 import { Prisma } from "@prisma/client";
 import { defaultStatus } from "~/constants";
 
 import { joinCondition, prisma as db } from "~/db.server";
+import { log } from "console";
 
 interface SearchProjectsInput {
   profileId: Profiles["id"];
@@ -36,6 +38,7 @@ interface SearchProjectsOutput {
   projectMembers: number;
   owner: string;
   tierName: string;
+  isArchived: boolean;
 }
 
 interface ProjectWhereInput {
@@ -520,13 +523,18 @@ export async function searchProjects({
   skip = 0,
   take = 50,
 }: SearchProjectsInput) {
-  let where = Prisma.sql`WHERE p.id IS NOT NULL`;
+  let where = Prisma.sql`WHERE p.id IS NOT NULL AND p."isArchived" = false`;
   let having = Prisma.empty;
   if (search && search !== "") {
-    search === "myProposals"
-      ? (where = Prisma.sql`WHERE pm."profileId" = ${profileId}`)
-      : (where = Prisma.sql`WHERE "tsColumn" @@ websearch_to_tsquery('english', ${search})`);
+    if (search === "myProposals") {
+      where = Prisma.sql`WHERE pm."profileId" = ${profileId}`;
+    } else if (search === "archivedProjects") {
+      where = Prisma.sql`WHERE p."isArchived" = true`;
+    } else {
+      where = Prisma.sql`WHERE "tsColumn" @@ websearch_to_tsquery('english', ${search})`;
+    }
   }
+  console.log(where);
 
   if (status.length > 0) {
     where = Prisma.sql`${where} AND p.status IN (${Prisma.join(status)})`;
@@ -644,6 +652,7 @@ export async function searchProjects({
       p."updatedAt",
       p."ownerId",
       p."tierName",
+      p."isArchived",
     COUNT(DISTINCT pm."profileId") as "projectMembers"
     FROM "Projects" p
     INNER JOIN "ProjectStatus" s on s.name = p.status
@@ -771,3 +780,86 @@ export async function deleteProject(projectId: string, isAdmin: boolean) {
   }
   return true;
 }
+
+export async function archiveProject(
+  projectId: string,
+  profileId: string,
+  isAdmin: boolean
+) {
+  const currentProject = await db.projects.findUniqueOrThrow({
+    where: { id: projectId },
+    select: {
+      ownerId: true,
+    },
+  });
+
+  const projectMembers = await db.projectMembers.findMany({
+    where: { projectId },
+    select: {
+      profileId: true,
+    },
+  });
+
+  if (!isAdmin)
+    validateIsTeamMember(profileId, projectMembers, currentProject.ownerId);
+
+  const project = await db.projects.update({
+    where: { id: projectId },
+    data: {
+      updatedAt: new Date(),
+      isArchived: true,
+    },
+    include: {
+      projectStatus: true,
+    },
+  });
+
+  return project;
+}
+
+export async function unarchiveProject(
+  projectId: string,
+  profileId: string,
+  isAdmin: boolean
+) {
+  const currentProject = await db.projects.findUniqueOrThrow({
+    where: { id: projectId },
+    select: {
+      ownerId: true,
+    },
+  });
+
+  const projectMembers = await db.projectMembers.findMany({
+    where: { projectId },
+    select: {
+      profileId: true,
+    },
+  });
+
+  if (!isAdmin)
+    validateIsTeamMember(profileId, projectMembers, currentProject.ownerId);
+
+  const project = await db.projects.update({
+    where: { id: projectId },
+    data: {
+      updatedAt: new Date(),
+      isArchived: false,
+    },
+    include: {
+      projectStatus: true,
+    },
+  });
+
+  return project;
+}
+
+export async function existArchivedProjects() {
+  const archiveProjects = await db.projects.findMany({
+    where: { isArchived: true },
+  });
+  if (archiveProjects.length > 0) {
+    return true;
+  } else {
+    return false;
+  }
+}

app/routes/manager/filter-tags/test/labels.test.tsx

@@ -43,10 +43,6 @@ describe("Labels test", () => {
   });
 
   test("Path loader", async () => {
-    let request = new Request(
-      "http://localhost:3000/manager/filter-tags/labels"
-    );
-
     const response = await loader();
 
     expect(response).toBeInstanceOf(Response);