From c49e65212493527cf301016432583358e7d8efe3 Mon Sep 17 00:00:00 2001
From: Dakshesh Jain <dakshesh.jain14@gmail.com>
Date: Mon, 5 Dec 2022 11:27:14 +0530
Subject: [PATCH] feat: added glassmorphism in issue view, made constant file
 for constant values, fix: using descending order to display issues

---
 .../issues/CreateUpdateIssueModal/SelectPriority.tsx   |  4 ++--
 apps/app/components/project/issues/ListView/index.tsx  |  3 +--
 apps/app/constants/index.ts                            |  1 +
 apps/app/lib/hooks/useIssuesFilter.tsx                 | 10 ++++++----
 apps/app/pages/projects/[projectId]/issues/index.tsx   |  4 ++--
 5 files changed, 12 insertions(+), 10 deletions(-)
 create mode 100644 apps/app/constants/index.ts

diff --git a/apps/app/components/project/issues/CreateUpdateIssueModal/SelectPriority.tsx b/apps/app/components/project/issues/CreateUpdateIssueModal/SelectPriority.tsx
index 2452908cd..75c888153 100644
--- a/apps/app/components/project/issues/CreateUpdateIssueModal/SelectPriority.tsx
+++ b/apps/app/components/project/issues/CreateUpdateIssueModal/SelectPriority.tsx
@@ -5,6 +5,8 @@ import { Controller } from "react-hook-form";
 import { Listbox, Transition } from "@headlessui/react";
 // icons
 import { CheckIcon } from "@heroicons/react/20/solid";
+// constants
+import { PRIORITIES } from "constants/";
 
 // types
 import type { IIssue } from "types";
@@ -15,8 +17,6 @@ type Props = {
   control: Control<IIssue, any>;
 };
 
-const PRIORITIES = ["high", "medium", "low"];
-
 const SelectPriority: React.FC<Props> = ({ control }) => {
   return (
     <Controller
diff --git a/apps/app/components/project/issues/ListView/index.tsx b/apps/app/components/project/issues/ListView/index.tsx
index ff6fc68d9..4bfc9470f 100644
--- a/apps/app/components/project/issues/ListView/index.tsx
+++ b/apps/app/components/project/issues/ListView/index.tsx
@@ -14,6 +14,7 @@ import { IIssue, IssueResponse, IState, NestedKeyOf, Properties, WorkspaceMember
 // hooks
 import useUser from "lib/hooks/useUser";
 // fetch keys
+import { PRIORITIES } from "constants/";
 import { PROJECT_ISSUES_LIST, WORKSPACE_MEMBERS } from "constants/fetch-keys";
 // services
 import issuesServices from "lib/services/issues.services";
@@ -36,8 +37,6 @@ type Props = {
   handleDeleteIssue: React.Dispatch<React.SetStateAction<string | undefined>>;
 };
 
-const PRIORITIES = ["high", "medium", "low"];
-
 const ListView: React.FC<Props> = ({
   properties,
   groupedByIssues,
diff --git a/apps/app/constants/index.ts b/apps/app/constants/index.ts
new file mode 100644
index 000000000..60f9994db
--- /dev/null
+++ b/apps/app/constants/index.ts
@@ -0,0 +1 @@
+export const PRIORITIES = ["urgent", "high", "medium", "low"];
diff --git a/apps/app/lib/hooks/useIssuesFilter.tsx b/apps/app/lib/hooks/useIssuesFilter.tsx
index 797cc29dd..4573f0214 100644
--- a/apps/app/lib/hooks/useIssuesFilter.tsx
+++ b/apps/app/lib/hooks/useIssuesFilter.tsx
@@ -4,12 +4,11 @@ import useTheme from "./useTheme";
 import useUser from "./useUser";
 // commons
 import { groupBy, orderArrayBy } from "constants/common";
-
+// constants
+import { PRIORITIES } from "constants/";
 // types
 import type { IssueResponse, IIssue, NestedKeyOf } from "types";
 
-const PRIORITIES = ["high", "medium", "low"];
-
 const useIssuesFilter = (projectIssues?: IssueResponse) => {
   const { issueView, setIssueView, groupByProperty, setGroupByProperty } = useTheme();
 
@@ -44,7 +43,10 @@ const useIssuesFilter = (projectIssues?: IssueResponse) => {
 
   if (orderBy !== null) {
     groupedByIssues = Object.fromEntries(
-      Object.entries(groupedByIssues).map(([key, value]) => [key, orderArrayBy(value, orderBy)])
+      Object.entries(groupedByIssues).map(([key, value]) => [
+        key,
+        orderArrayBy(value, orderBy, "descending"),
+      ])
     );
   }
 
diff --git a/apps/app/pages/projects/[projectId]/issues/index.tsx b/apps/app/pages/projects/[projectId]/issues/index.tsx
index 9bef5dcca..e47a1bdb8 100644
--- a/apps/app/pages/projects/[projectId]/issues/index.tsx
+++ b/apps/app/pages/projects/[projectId]/issues/index.tsx
@@ -193,7 +193,7 @@ const ProjectIssues: NextPage = () => {
                         leaveFrom="opacity-100 translate-y-0"
                         leaveTo="opacity-0 translate-y-1"
                       >
-                        <Popover.Panel className="absolute mr-5 right-1/2 z-10 mt-3 w-screen max-w-xs translate-x-1/2 transform px-2 sm:px-0 bg-white rounded-lg shadow-lg overflow-hidden">
+                        <Popover.Panel className="absolute mr-5 right-1/2 z-10 mt-3 w-screen max-w-xs translate-x-1/2 transform px-2 sm:px-0 bg-gray-0 backdrop-filter backdrop-blur-xl bg-opacity-100 rounded-lg shadow-lg overflow-hidden">
                           <div className="overflow-hidden py-8 px-4">
                             <div className="relative flex flex-col gap-1 gap-y-4">
                               <div className="flex justify-between">
@@ -251,7 +251,7 @@ const ProjectIssues: NextPage = () => {
                                 </CustomMenu>
                               </div>
                               <div className="border-b-2"></div>
-                              <div className="relative bg-white flex flex-col gap-1">
+                              <div className="relative flex flex-col gap-1">
                                 <h4 className="text-base text-gray-600">Properties</h4>
                                 <div>
                                   {Object.keys(properties).map((key) => (