clean-up: removed labels in the filters and handled redirection issue from peek overview and ui changes (#3002)

space/components/issues/board-views/kanban/block.tsx

@@ -18,17 +18,25 @@ export const IssueKanBanBlock = observer(({ issue }: { issue: IIssue }) => {
 
   // router
   const router = useRouter();
-  const { workspace_slug, project_slug, board } = router.query;
+  const { workspace_slug, project_slug, board, priorities, states, labels } = router.query as {
+    workspace_slug: string;
+    project_slug: string;
+    board: string;
+    priorities: string;
+    states: string;
+    labels: string;
+  };
 
   const handleBlockClick = () => {
     issueDetailStore.setPeekId(issue.id);
+    const params: any = { board: board, peekId: issue.id };
+    if (states && states.length > 0) params.states = states;
+    if (priorities && priorities.length > 0) params.priorities = priorities;
+    if (labels && labels.length > 0) params.labels = labels;
     router.push(
       {
-        pathname: `/${workspace_slug?.toString()}/${project_slug}`,
+        pathname: `/${workspace_slug}/${project_slug}`,
-        query: {
+        query: { ...params },
-          board: board?.toString(),
-          peekId: issue.id,
-        },
       },
       undefined,
       { shallow: true }

space/components/issues/board-views/list/block.tsx

@@ -19,17 +19,25 @@ export const IssueListBlock: FC<{ issue: IIssue }> = observer((props) => {
   const { project: projectStore, issueDetails: issueDetailStore }: RootStore = useMobxStore();
   // router
   const router = useRouter();
-  const { workspace_slug, project_slug, board } = router.query;
+  const { workspace_slug, project_slug, board, priorities, states, labels } = router.query as {
+    workspace_slug: string;
+    project_slug: string;
+    board: string;
+    priorities: string;
+    states: string;
+    labels: string;
+  };
 
   const handleBlockClick = () => {
     issueDetailStore.setPeekId(issue.id);
+    const params: any = { board: board, peekId: issue.id };
+    if (states && states.length > 0) params.states = states;
+    if (priorities && priorities.length > 0) params.priorities = priorities;
+    if (labels && labels.length > 0) params.labels = labels;
     router.push(
       {
-        pathname: `/${workspace_slug?.toString()}/${project_slug}`,
+        pathname: `/${workspace_slug}/${project_slug}`,
-        query: {
+        query: { ...params },
-          board: board?.toString(),
-          peekId: issue.id,
-        },
       },
       undefined,
       { shallow: true }

space/components/issues/filters/applied-filters/filters-list.tsx

@@ -40,13 +40,13 @@ export const AppliedFiltersList: React.FC<Props> = (props) => {
                 <AppliedPriorityFilters handleRemove={(val) => handleRemoveFilter("priority", val)} values={value} />
               )}
 
-              {filterKey === "labels" && labels && (
+              {/* {filterKey === "labels" && labels && (
                 <AppliedLabelsFilters
                   handleRemove={(val) => handleRemoveFilter("labels", val)}
                   labels={labels}
                   values={value}
                 />
-              )}
+              )} */}
 
               {filterKey === "state" && states && (
                 <AppliedStateFilters

space/components/issues/filters/helpers/dropdown.tsx

@@ -31,14 +31,7 @@ export const FiltersDropdown: React.FC<Props> = (props) => {
         return (
           <>
             <Popover.Button as={React.Fragment}>
-              <Button
+              <Button ref={setReferenceElement} variant="neutral-primary" size="sm">
-                ref={setReferenceElement}
-                variant="neutral-primary"
-                size="sm"
-                appendIcon={
-                  <ChevronUp className={`transition-all ${open ? "" : "rotate-180"}`} size={14} strokeWidth={2} />
-                }
-              >
                 <div className={`${open ? "text-custom-text-100" : "text-custom-text-200"}`}>
                   <span>{title}</span>
                 </div>

space/components/issues/filters/root.tsx

@@ -62,7 +62,7 @@ export const IssueFiltersDropdown: FC = observer(() => {
   );
 
   return (
-    <div className="w-full h-full flex flex-col z-50">
+    <div className="w-full h-full flex flex-col z-10">
       <FiltersDropdown title="Filters" placement="bottom-end">
         <FilterSelection
           filters={issueFilters?.filters ?? {}}

space/components/issues/filters/selection.tsx

@@ -70,7 +70,7 @@ export const FilterSelection: React.FC<Props> = observer((props) => {
         )}
 
         {/* labels */}
-        {isFilterEnabled("labels") && (
+        {/* {isFilterEnabled("labels") && (
           <div className="py-2">
             <FilterLabels
               appliedFilters={filters.labels ?? null}
@@ -79,7 +79,7 @@ export const FilterSelection: React.FC<Props> = observer((props) => {
               searchQuery={filtersSearchQuery}
             />
           </div>
-        )}
+        )} */}
       </div>
     </div>
   );

space/components/issues/navbar/index.tsx

@@ -39,9 +39,10 @@ const IssueNavbar = observer(() => {
   }: RootStore = useMobxStore();
   // router
   const router = useRouter();
-  const { workspace_slug, project_slug, board, states, priorities, labels } = router.query as {
+  const { workspace_slug, project_slug, board, peekId, states, priorities, labels } = router.query as {
     workspace_slug: string;
     project_slug: string;
+    peekId: string;
     board: string;
     states: string;
     priorities: string;
@@ -84,6 +85,7 @@ const IssueNavbar = observer(() => {
       if (currentBoard) {
         if (projectStore?.activeBoard === null || projectStore?.activeBoard !== currentBoard) {
           let params: any = { board: currentBoard };
+          if (peekId && peekId.length > 0) params = { ...params, peekId: peekId };
           if (priorities && priorities.length > 0) params = { ...params, priorities: priorities };
           if (states && states.length > 0) params = { ...params, states: states };
           if (labels && labels.length > 0) params = { ...params, labels: labels };

space/components/issues/peek-overview/layout.tsx

@@ -19,7 +19,15 @@ export const IssuePeekOverview: React.FC<Props> = observer(() => {
   const [isModalPeekOpen, setIsModalPeekOpen] = useState(false);
   // router
   const router = useRouter();
-  const { workspace_slug, project_slug, peekId, board } = router.query;
+  const { workspace_slug, project_slug, peekId, board, priorities, states, labels } = router.query as {
+    workspace_slug: string;
+    project_slug: string;
+    peekId: string;
+    board: string;
+    priorities: string;
+    states: string;
+    labels: string;
+  };
   // store
   const { issueDetails: issueDetailStore, issue: issueStore } = useMobxStore();
   const issueDetails = issueDetailStore.peekId && peekId ? issueDetailStore.details[peekId.toString()] : undefined;
@@ -34,16 +42,15 @@ export const IssuePeekOverview: React.FC<Props> = observer(() => {
 
   const handleClose = () => {
     issueDetailStore.setPeekId(null);
-    router.replace(
+
-      {
+    const params: any = { board: board };
-        pathname: `/${workspace_slug?.toString()}/${project_slug}`,
+    if (states && states.length > 0) params.states = states;
-        query: {
+    if (priorities && priorities.length > 0) params.priorities = priorities;
-          board,
+    if (labels && labels.length > 0) params.labels = labels;
-        },
+
-      },
+    router.replace({ pathname: `/${workspace_slug?.toString()}/${project_slug}`, query: { ...params } }, undefined, {
-      undefined,
+      shallow: true,
-      { shallow: true }
+    });
-    );
   };
 
   useEffect(() => {
@@ -91,7 +98,7 @@ export const IssuePeekOverview: React.FC<Props> = observer(() => {
             leaveFrom="opacity-100"
             leaveTo="opacity-0"
           >
-            <div className="fixed inset-0 bg-custom-backdrop bg-opacity-50 transition-opacity" />
+            <div className="fixed inset-0 bg-custom-backdrop bg-opacity-50 transition-opacity z-20" />
           </Transition.Child>
           <Transition.Child
             as={React.Fragment}