From c50a0602f70d986ee1f747f25da53595ac10be88 Mon Sep 17 00:00:00 2001
From: Prateek Shourya <prateekshourya29@gmail.com>
Date: Tue, 23 Apr 2024 12:51:20 +0530
Subject: [PATCH] [WEB-871] chore: update leave project modal message in
 members settings page. (#4230)

* [WEB-871] chore: update leave project modal message in members settings page.

* fix: build errors.
---
 .../project/confirm-project-member-remove.tsx | 34 ++++++++++++++-----
 1 file changed, 26 insertions(+), 8 deletions(-)

diff --git a/web/components/project/confirm-project-member-remove.tsx b/web/components/project/confirm-project-member-remove.tsx
index 10cd16f44..bc8141991 100644
--- a/web/components/project/confirm-project-member-remove.tsx
+++ b/web/components/project/confirm-project-member-remove.tsx
@@ -1,13 +1,14 @@
 import React, { useState } from "react";
 import { observer } from "mobx-react-lite";
+import { useRouter } from "next/router";
 import { AlertTriangle } from "lucide-react";
 import { Dialog, Transition } from "@headlessui/react";
-import { IUserLite } from "@plane/types";
-// hooks
-import { Button } from "@plane/ui";
-import { useUser } from "@/hooks/store";
-// ui
 // types
+import { IUserLite } from "@plane/types";
+// ui
+import { Button } from "@plane/ui";
+// hooks
+import { useProject, useUser } from "@/hooks/store";
 
 type Props = {
   data: IUserLite;
@@ -18,10 +19,14 @@ type Props = {
 
 export const ConfirmProjectMemberRemove: React.FC<Props> = observer((props) => {
   const { data, onSubmit, isOpen, onClose } = props;
+  // router
+  const router = useRouter();
+  const { projectId } = router.query;
   // states
   const [isDeleteLoading, setIsDeleteLoading] = useState(false);
   // store hooks
   const { currentUser } = useUser();
+  const { getProjectById } = useProject();
 
   const handleClose = () => {
     onClose();
@@ -36,7 +41,10 @@ export const ConfirmProjectMemberRemove: React.FC<Props> = observer((props) => {
     handleClose();
   };
 
+  if (!projectId) return <></>;
+
   const isCurrentUser = currentUser?.id === data?.id;
+  const currentProjectDetails = getProjectById(projectId.toString());
 
   return (
     <Transition.Root show={isOpen} as={React.Fragment}>
@@ -76,9 +84,19 @@ export const ConfirmProjectMemberRemove: React.FC<Props> = observer((props) => {
                       </Dialog.Title>
                       <div className="mt-2">
                         <p className="text-sm text-custom-text-200">
-                          Are you sure you want to remove member-{" "}
-                          <span className="font-bold">{data?.display_name}</span>? They will no longer have access to
-                          this project. This action cannot be undone.
+                          {isCurrentUser ? (
+                            <>
+                              Are you sure you want to leave the{" "}
+                              <span className="font-bold">{currentProjectDetails?.name}</span> project? You will be able
+                              to join the project if invited again or if it{"'"}s public.
+                            </>
+                          ) : (
+                            <>
+                              Are you sure you want to remove member-{" "}
+                              <span className="font-bold">{data?.display_name}</span>? They will no longer have access
+                              to this project. This action cannot be undone.
+                            </>
+                          )}
                         </p>
                       </div>
                     </div>