feat: added glassmorphism in issue view, made constant file for constant values, fix: using descending order to display issues

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

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,

apps/app/constants/index.ts

@@ -0,0 +1 @@
+export const PRIORITIES = ["urgent", "high", "medium", "low"];

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"),
+      ])
     );
   }
 

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) => (