fix: enum

packages/constants/src/inbox.ts

@@ -1,5 +1,34 @@
+import { TInboxDuplicateIssueDetails, TIssue } from "@plane/types";
+
+export enum EInboxIssueCurrentTab {
+  OPEN = "open",
+  CLOSED = "closed",
+}
+
+export enum EInboxIssueStatus {
+  PENDING = -2,
+  DECLINED = -1,
+  SNOOZED = 0,
+  ACCEPTED = 1,
+  DUPLICATE = 2,
+}
+
+export type TInboxIssueCurrentTab = EInboxIssueCurrentTab;
+export type TInboxIssueStatus = EInboxIssueStatus;
+export type TInboxIssue = {
+  id: string;
+  status: TInboxIssueStatus;
+  snoozed_till: Date | null;
+  duplicate_to: string | undefined;
+  source: string;
+  issue: TIssue;
+  created_by: string;
+  duplicate_issue_detail: TInboxDuplicateIssueDetails | undefined;
+};
+
 export const INBOX_STATUS: {
   key: string;
+  status: TInboxIssueStatus;
   title: string;
   description: () => string;
   textColor: (snoozeDatePassed: boolean) => string;
@@ -8,6 +37,7 @@ export const INBOX_STATUS: {
   {
     key: "pending",
     title: "inbox_issue.status.pending.title",
+    status: EInboxIssueStatus.PENDING,
     description: () => `inbox_issue.status.pending.description`,
     textColor: (snoozeDatePassed: boolean = false) =>
       snoozeDatePassed ? "" : "text-[#AB6400]",
@@ -17,6 +47,7 @@ export const INBOX_STATUS: {
   {
     key: "declined",
     title: "inbox_issue.status.declined.title",
+    status: EInboxIssueStatus.DECLINED,
     description: () => `inbox_issue.status.declined.description`,
     textColor: (snoozeDatePassed: boolean = false) =>
       snoozeDatePassed ? "" : "text-[#CE2C31]",
@@ -26,6 +57,7 @@ export const INBOX_STATUS: {
   {
     key: "snoozed",
     title: "inbox_issue.status.snoozed.title",
+    status: EInboxIssueStatus.SNOOZED,
     description: () => `inbox_issue.status.snoozed.description`,
     textColor: (snoozeDatePassed: boolean = false) =>
       snoozeDatePassed ? "text-red-500" : "text-custom-text-400",
@@ -35,6 +67,7 @@ export const INBOX_STATUS: {
   {
     key: "accepted",
     title: "inbox_issue.status.accepted.title",
+    status: EInboxIssueStatus.ACCEPTED,
     description: () => `inbox_issue.status.accepted.description`,
     textColor: (snoozeDatePassed: boolean = false) =>
       snoozeDatePassed ? "" : "text-[#3E9B4F]",
@@ -44,6 +77,7 @@ export const INBOX_STATUS: {
   {
     key: "duplicate",
     title: "inbox_issue.status.duplicate.title",
+    status: EInboxIssueStatus.DUPLICATE,
     description: () => `inbox_issue.status.duplicate.description`,
     textColor: (snoozeDatePassed: boolean = false) =>
       snoozeDatePassed ? "" : "text-custom-text-200",

packages/types/src/inbox.d.ts

@@ -2,23 +2,6 @@ import { TPaginationInfo } from "./common";
 import { TIssuePriorities } from "./issues";
 import { TIssue } from "./issues/base";
 
-enum EInboxIssueCurrentTab {
-  OPEN = "open",
-  CLOSED = "closed",
-}
-
-enum EInboxIssueStatus {
-  PENDING = -2,
-  DECLINED = -1,
-  SNOOZED = 0,
-  ACCEPTED = 1,
-  DUPLICATE = 2,
-}
-
-export type TInboxIssueCurrentTab = EInboxIssueCurrentTab;
-
-export type TInboxIssueStatus = EInboxIssueStatus;
-
 // filters
 export type TInboxIssueFilterMemberKeys = "assignees" | "created_by";
 
@@ -75,17 +58,6 @@ export type TInboxDuplicateIssueDetails = {
   name: string;
 };
 
-export type TInboxIssue = {
-  id: string;
-  status: TInboxIssueStatus;
-  snoozed_till: Date | null;
-  duplicate_to: string | undefined;
-  source: string;
-  issue: TIssue;
-  created_by: string;
-  duplicate_issue_detail: TInboxDuplicateIssueDetails | undefined;
-};
-
 export type TInboxIssuePaginationInfo = TPaginationInfo & {
   total_results: number;
 };

web/core/components/inbox/inbox-filter/applied-filters/status.tsx

@@ -1,13 +1,13 @@
 import { FC } from "react";
 import { observer } from "mobx-react";
 import { X } from "lucide-react";
+import { INBOX_STATUS, TInboxIssueStatus } from "@plane/constants";
 import { useTranslation } from "@plane/i18n";
-import { TInboxIssueStatus } from "@plane/types";
 // constants
 import { Tag } from "@plane/ui";
 // hooks
-import { INBOX_STATUS } from "@/helpers/inbox.helper";
 import { useProjectInbox } from "@/hooks/store";
+import { InboxStatusIcon } from "../../inbox-status-icon";
 
 export const InboxIssueAppliedFiltersStatus: FC = observer(() => {
   // hooks
@@ -30,7 +30,7 @@ export const InboxIssueAppliedFiltersStatus: FC = observer(() => {
         return (
           <div key={value} className="relative flex items-center gap-1 rounded bg-custom-background-80 p-1 text-xs">
             <div className="w-3 h-3 flex-shrink-0 relative flex justify-center items-center overflow-hidden">
-              <optionDetail.icon className={`w-3 h-3 ${optionDetail?.textColor(false)}`} />
+              <InboxStatusIcon type={optionDetail?.status} className={`w-3 h-3 ${optionDetail?.textColor(false)}`} />
             </div>
             <div className="text-xs truncate">{t(optionDetail?.title)}</div>
             {handleFilterValue(optionDetail?.status).length >= 1 && (

web/core/components/inbox/inbox-filter/filters/status.tsx

@@ -1,14 +1,14 @@
 import { FC, useState } from "react";
 import { observer } from "mobx-react";
 // types
+import { INBOX_STATUS, TInboxIssueStatus } from "@plane/constants";
 import { useTranslation } from "@plane/i18n";
-import { TInboxIssueStatus } from "@plane/types";
 // components
 import { FilterHeader, FilterOption } from "@/components/issues";
 // constants
 // hooks
-import { INBOX_STATUS } from "@/helpers/inbox.helper";
 import { useProjectInbox } from "@/hooks/store/use-project-inbox";
+import { InboxStatusIcon } from "../../inbox-status-icon";
 
 type Props = {
   searchQuery: string;
@@ -54,7 +54,7 @@ export const FilterStatus: FC<Props> = observer((props) => {
                 key={status.key}
                 isChecked={filterValue?.includes(status.status) ? true : false}
                 onClick={() => handleStatusFilterSelect(status.status)}
-                icon={<status.icon className={`h-3.5 w-3.5 ${status?.textColor(false)}`} />}
+                icon={<InboxStatusIcon type={status.status} className={`h-3.5 w-3.5 ${status?.textColor(false)}`} />}
                 title={t(status.title)}
               />
             ))

web/core/components/inbox/inbox-issue-status.tsx

@@ -2,12 +2,13 @@ import React from "react";
 import { observer } from "mobx-react";
 // constants
 // helpers
+import { INBOX_STATUS } from "@plane/constants";
 import { useTranslation } from "@plane/i18n";
 import { cn } from "@/helpers/common.helper";
 import { findHowManyDaysLeft } from "@/helpers/date-time.helper";
 // store
-import { INBOX_STATUS } from "@/helpers/inbox.helper";
 import { IInboxIssueStore } from "@/store/inbox/inbox-issue.store";
+import { InboxStatusIcon } from "./inbox-status-icon";
 
 type Props = {
   inboxIssue: IInboxIssueStore;
@@ -38,7 +39,7 @@ export const InboxIssueStatus: React.FC<Props> = observer((props) => {
       )}
     >
       <div className={`flex items-center gap-1`}>
-        <inboxIssueStatusDetail.icon size={iconSize} className="flex-shrink-0" />
+        <InboxStatusIcon type={inboxIssue?.status} size={iconSize} className="flex-shrink-0" />
         <div className="font-medium text-xs whitespace-nowrap">
           {inboxIssue?.status === 0 && inboxIssue?.snoozed_till ? description : t(inboxIssueStatusDetail.title)}
         </div>

web/core/components/inbox/inbox-status-icon.tsx

@@ -0,0 +1,24 @@
+import { AlertTriangle, CheckCircle2, Clock, Copy, XCircle } from "lucide-react";
+import { TInboxIssueStatus, EInboxIssueStatus } from "@plane/constants";
+
+export const InboxStatusIcon = ({
+  type,
+  size,
+  className,
+}: {
+  type: TInboxIssueStatus;
+  size?: number;
+  className?: string;
+}) => {
+  const icons = {
+    [EInboxIssueStatus.PENDING]: AlertTriangle,
+    [EInboxIssueStatus.DECLINED]: XCircle,
+    [EInboxIssueStatus.SNOOZED]: Clock,
+    [EInboxIssueStatus.ACCEPTED]: CheckCircle2,
+    [EInboxIssueStatus.DUPLICATE]: Copy,
+  };
+
+  if (type === undefined) return null;
+  const Icon = icons[type];
+  return <Icon size={size} className={className} />;
+};

web/core/components/inbox/sidebar/root.tsx

@@ -2,7 +2,7 @@
 
 import { FC, useCallback, useEffect, useRef, useState } from "react";
 import { observer } from "mobx-react";
-import { TInboxIssueCurrentTab } from "@plane/types";
+import { TInboxIssueCurrentTab } from "@plane/constants";
 import { Header, Loader, EHeaderVariant } from "@plane/ui";
 // components
 import { EmptyState } from "@/components/empty-state";

web/core/services/inbox/inbox-issue.service.ts

@@ -1,5 +1,6 @@
 // types
-import type { TInboxIssue, TIssue, TInboxIssueWithPagination, TInboxForm } from "@plane/types";
+import { TInboxIssue } from "@plane/constants";
+import type { TIssue, TInboxIssueWithPagination, TInboxForm } from "@plane/types";
 import { API_BASE_URL } from "@/helpers/common.helper";
 import { APIService } from "@/services/api.service";
 // helpers

web/core/store/inbox/inbox-issue.store.ts

@@ -1,7 +1,8 @@
 import clone from "lodash/clone";
 import set from "lodash/set";
 import { makeObservable, observable, runInAction, action } from "mobx";
-import { TIssue, TInboxIssue, TInboxIssueStatus, TInboxDuplicateIssueDetails } from "@plane/types";
+import { TInboxIssue, TInboxIssueStatus } from "@plane/constants";
+import { TIssue, TInboxDuplicateIssueDetails } from "@plane/types";
 // helpers
 import { EInboxIssueStatus } from "@/helpers/inbox.helper";
 // local db

web/core/store/inbox/project-inbox.store.ts

@@ -5,9 +5,8 @@ import set from "lodash/set";
 import { action, computed, makeObservable, observable, runInAction } from "mobx";
 import { computedFn } from "mobx-utils";
 // types
+import { TInboxIssue, TInboxIssueCurrentTab } from "@plane/constants";
 import {
-  TInboxIssue,
-  TInboxIssueCurrentTab,
   TInboxIssueFilter,
   TInboxIssueSorting,
   TInboxIssuePaginationInfo,

web/helpers/inbox.helper.ts

@@ -1,7 +1,4 @@
 import { subDays } from "date-fns";
-import { AlertTriangle, CheckCircle2, Clock, Copy, LucideIcon, XCircle } from "lucide-react";
-import { INBOX_STATUS as INBOX_STATUS_CONSTANTS } from "@plane/constants";
-import { TInboxIssueStatus } from "@plane/types";
 import { renderFormattedPayloadDate } from "./date-time.helper";
 
 export enum EInboxIssueCurrentTab {
@@ -74,33 +71,3 @@ export const PAST_DURATION_FILTER_OPTIONS: {
     value: EPastDurationFilters.LAST_30_DAYS,
   },
 ];
-
-const INBOX_STATUS_ICONS = {
-  pending: AlertTriangle,
-  declined: XCircle,
-  snoozed: Clock,
-  accepted: CheckCircle2,
-  duplicate: Copy,
-};
-
-const INBOX_STATUS_KEYS = {
-  pending: EInboxIssueStatus.PENDING,
-  declined: EInboxIssueStatus.DECLINED,
-  snoozed: EInboxIssueStatus.SNOOZED,
-  accepted: EInboxIssueStatus.ACCEPTED,
-  duplicate: EInboxIssueStatus.DUPLICATE,
-};
-
-export const INBOX_STATUS: {
-  key: string;
-  status: TInboxIssueStatus;
-  icon: LucideIcon;
-  title: string;
-  description: () => string;
-  textColor: (snoozeDatePassed: boolean) => string;
-  bgColor: (snoozeDatePassed: boolean) => string;
-}[] = INBOX_STATUS_CONSTANTS.map((s) => ({
-  ...s,
-  icon: INBOX_STATUS_ICONS[s.key as keyof typeof INBOX_STATUS_ICONS],
-  status: INBOX_STATUS_KEYS[s.key as keyof typeof INBOX_STATUS_KEYS],
-}));