fix: consistent icons and modal fixes (#216)

* fix: consistent icons and modal fixes

* fix: total worspace members

* fix: sub issue mutation

apps/app/components/project/cycles/stats-view/single-stat.tsx

@@ -1,19 +1,19 @@
-// react
 import React from "react";
-// next
+
 import Link from "next/link";
 import Image from "next/image";
 import { useRouter } from "next/router";
+
 // swr
 import useSWR from "swr";
 // services
-import { CalendarDaysIcon } from "@heroicons/react/20/solid";
-import { ArrowPathIcon, UserIcon } from "@heroicons/react/24/outline";
 import cyclesService from "services/cycles.service";
-// hooks
 // ui
 import { Button, CustomMenu } from "components/ui";
 // icons
+import { CalendarDaysIcon } from "@heroicons/react/20/solid";
+import { UserIcon } from "@heroicons/react/24/outline";
+import { CyclesIcon } from "components/icons";
 // helpers
 import { renderShortNumericDateFormat } from "helpers/date-time.helper";
 import { groupBy } from "helpers/array.helper";
@@ -120,7 +120,7 @@ const SingleStat: React.FC<TSingleStatProps> = (props) => {
                   router.push(`/${workspaceSlug}/projects/${projectId}/cycles/${cycle.id}`)
                 }
               >
-                <ArrowPathIcon className="h-3 w-3" />
+                <CyclesIcon className="h-3 w-3" />
                 Open Cycle
               </Button>
             </div>

apps/app/components/project/issues/issue-detail/add-as-sub-issue.tsx

@@ -11,7 +11,7 @@ import { RectangleStackIcon, MagnifyingGlassIcon } from "@heroicons/react/24/out
 // services
 import issuesServices from "services/issues.service";
 // types
-import { IIssue } from "types";
+import { IIssue, IssueResponse } from "types";
 // constants
 import { PROJECT_ISSUES_LIST, SUB_ISSUES } from "constants/fetch-keys";
 
@@ -54,6 +54,22 @@ const AddAsSubIssue: React.FC<Props> = ({ isOpen, setIsOpen, parent }) => {
       .patchIssue(workspaceSlug as string, projectId as string, issueId, { parent: parent?.id })
       .then((res) => {
         mutate(SUB_ISSUES(parent?.id ?? ""));
+        mutate<IssueResponse>(
+          PROJECT_ISSUES_LIST(workspaceSlug as string, projectId as string),
+          (prevData) => ({
+            ...(prevData as IssueResponse),
+            results: (prevData?.results ?? []).map((p) => {
+              if (p.id === res.id)
+                return {
+                  ...p,
+                  ...res,
+                };
+
+              return p;
+            }),
+          }),
+          false
+        );
       })
       .catch((e) => {
         console.log(e);

apps/app/components/project/issues/issue-detail/comment/issue-comment-card.tsx

@@ -1,6 +1,5 @@
-// react
 import React, { useEffect, useState } from "react";
-// next
+
 import Image from "next/image";
 import dynamic from "next/dynamic";
 
@@ -8,14 +7,14 @@ import dynamic from "next/dynamic";
 import { useForm } from "react-hook-form";
 // icons
 import { CheckIcon, XMarkIcon } from "@heroicons/react/24/outline";
-// types
-import type { IIssueComment } from "types";
 // hooks
 import useUser from "hooks/use-user";
 // ui
 import { CustomMenu } from "components/ui";
 // helpers
 import { timeAgo } from "helpers/date-time.helper";
+// types
+import type { IIssueComment } from "types";
 
 const RemirrorRichTextEditor = dynamic(() => import("components/rich-text-editor"), { ssr: false });
 
@@ -76,7 +75,7 @@ const CommentCard: React.FC<Props> = ({ comment, onSubmit, handleCommentDeletion
             </span>
             <span>{timeAgo(comment.created_at)}</span>
           </p>
-          <div>
+          <div className="issue-comments-section">
             {isEditing ? (
               <form className="flex flex-col gap-2" onSubmit={handleSubmit(onEnter)}>
                 <RemirrorRichTextEditor

apps/app/components/project/issues/issue-detail/comment/issue-comment-section.tsx

@@ -5,15 +5,15 @@ import dynamic from "next/dynamic";
 
 // react-hook-form
 import { useForm, Controller } from "react-hook-form";
-// types
-import type { IIssueActivity, IIssueComment } from "types";
-import type { KeyedMutator } from "swr";
 // services
 import issuesServices from "services/issues.service";
 // ui
 import { Loader } from "components/ui";
 // helpers
 import { debounce } from "helpers/functions.helper";
+// types
+import type { IIssueActivity, IIssueComment } from "types";
+import type { KeyedMutator } from "swr";
 
 const RemirrorRichTextEditor = dynamic(() => import("components/rich-text-editor"), {
   ssr: false,
@@ -83,7 +83,7 @@ const AddIssueComment: React.FC<{
   return (
     <div className="space-y-5">
       <form onSubmit={handleSubmit(onSubmit)}>
-        <div className="issue-comments-section rounded-md p-2 pt-3">
+        <div className="issue-comments-section">
           <Controller
             name="comment_html"
             control={control}

apps/app/components/project/issues/issue-detail/issue-detail-sidebar/select-cycle.tsx

@@ -1,21 +1,21 @@
-// react
 import React from "react";
 
 import { useRouter } from "next/router";
 
 import useSWR, { mutate } from "swr";
 
+// react-hook-form
 import { UseFormWatch } from "react-hook-form";
-// constants
-import { ArrowPathIcon } from "@heroicons/react/24/outline";
 // services
 import issuesService from "services/issues.service";
 import cyclesService from "services/cycles.service";
 // ui
 import { Spinner, CustomSelect } from "components/ui";
 // icons
+import { CyclesIcon } from "components/icons";
 // types
 import { ICycle, IIssue } from "types";
+// fetch-keys
 import { CYCLE_ISSUES, CYCLE_LIST, ISSUE_DETAILS } from "constants/fetch-keys";
 
 type Props = {
@@ -55,7 +55,7 @@ const SelectCycle: React.FC<Props> = ({ issueDetail, handleCycleChange }) => {
   return (
     <div className="flex flex-wrap items-center py-2">
       <div className="flex items-center gap-x-2 text-sm sm:basis-1/2">
-        <ArrowPathIcon className="h-4 w-4 flex-shrink-0" />
+        <CyclesIcon className="h-4 w-4 flex-shrink-0" />
         <p>Cycle</p>
       </div>
       <div className="space-y-1 sm:basis-1/2">