[WEB-2294] fix: remove 'Add Project' button from archives route and remove it from the dropdown in header (#5469)

* fix: remove 'Add Project' button from archives route and remove it from the dropdown in header

* Improved Code Logic

* Fixed Clear All Button and UI Fixes

web/core/components/project/card-list.tsx

@@ -45,7 +45,7 @@ export const ProjectCardList = observer(() => {
           <p className="whitespace-pre-line text-base text-custom-text-400">
             {searchQuery.trim() === ""
               ? "Remove the filters to see all projects"
-              : "No projects detected with the matching\ncriteria. Create a new project instead"}
+              : "No projects detected with the matching criteria.\nCreate a new project instead"}
           </p>
         </div>
       </div>

web/core/components/project/dropdowns/filters/root.tsx

@@ -51,15 +51,6 @@ export const ProjectFiltersSelection: React.FC<Props> = observer((props) => {
             }
             title="My projects"
           />
-          <FilterOption
-            isChecked={!!displayFilters.archived_projects}
-            onClick={() =>
-              handleDisplayFiltersUpdate({
-                archived_projects: !displayFilters.archived_projects,
-              })
-            }
-            title="Archived"
-          />
         </div>
 
         {/* access */}

web/core/components/project/header.tsx

@@ -177,7 +177,7 @@ export const ProjectsBaseHeader = observer(() => {
             />
           </FiltersDropdown>
         </div>
-        {isAuthorizedUser && (
+        {isAuthorizedUser && !isArchived && (
           <Button
             size="sm"
             onClick={() => {

web/core/components/project/root.tsx

@@ -30,6 +30,12 @@ const Root = observer(() => {
   // derived values
   const pageTitle = currentWorkspace?.name ? `${currentWorkspace?.name} - Projects` : undefined;
 
+  const isArchived = pathname.includes("/archives");
+
+  const allowedDisplayFilters = currentWorkspaceAppliedDisplayFilters?.filter(
+    (filter) => filter !== "archived_projects"
+  ) ?? [];
+
   const handleRemoveFilter = useCallback(
     (key: keyof TProjectFilters, value: string | null) => {
       if (!workspaceSlug) return;
@@ -55,25 +61,24 @@ const Root = observer(() => {
     if (!workspaceSlug) return;
     clearAllFilters(workspaceSlug.toString());
     clearAllAppliedDisplayFilters(workspaceSlug.toString());
+    if (isArchived) updateDisplayFilters(workspaceSlug.toString(), { archived_projects: true });
   }, [clearAllFilters, clearAllAppliedDisplayFilters, workspaceSlug]);
 
   useEffect(() => {
-    if (pathname.includes("/archives")) {
+    isArchived ? updateDisplayFilters(workspaceSlug.toString(), { archived_projects: true }) :
-      updateDisplayFilters(workspaceSlug.toString(), { archived_projects: true });
+    updateDisplayFilters(workspaceSlug.toString(), { archived_projects: false });
-    } else {
-      updateDisplayFilters(workspaceSlug.toString(), { archived_projects: false });
-    }
   }, [pathname]);
+
   return (
     <>
       <PageHead title={pageTitle} />
       <div className="flex h-full w-full flex-col">
         {(calculateTotalFilters(currentWorkspaceFilters ?? {}) !== 0 ||
-          currentWorkspaceAppliedDisplayFilters?.length !== 0) && (
+          (allowedDisplayFilters.length>0)) && (
           <div className="border-b border-custom-border-200 px-5 py-3">
             <ProjectAppliedFiltersList
               appliedFilters={currentWorkspaceFilters ?? {}}
-              appliedDisplayFilters={currentWorkspaceAppliedDisplayFilters ?? []}
+              appliedDisplayFilters={allowedDisplayFilters}
               handleClearAllFilters={handleClearAllFilters}
               handleRemoveFilter={handleRemoveFilter}
               handleRemoveDisplayFilter={handleRemoveDisplayFilter}