chore: removed minor bugs (#273)

apps/app/components/account/email-code-form.tsx

@@ -34,8 +34,8 @@ export const EmailCodeForm = ({ onSuccess }: any) => {
     reValidateMode: "onChange",
   });
 
-  const onSubmit = ({ email }: EmailCodeFormValues) => {
+  const onSubmit = async ({ email }: EmailCodeFormValues) => {
-    authenticationService
+    await authenticationService
       .emailCode({ email })
       .then((res) => {
         setValue("key", res.key);
@@ -46,8 +46,8 @@ export const EmailCodeForm = ({ onSuccess }: any) => {
       });
   };
 
-  const handleSignin = (formData: EmailCodeFormValues) => {
+  const handleSignin = async (formData: EmailCodeFormValues) => {
-    authenticationService
+    await authenticationService
       .magicSignIn(formData)
       .then((response) => {
         onSuccess(response);
@@ -68,10 +68,7 @@ export const EmailCodeForm = ({ onSuccess }: any) => {
 
   return (
     <>
-      <form
+      <form className="mt-5 space-y-5">
-        className="mt-5 space-y-5"
-        onSubmit={codeSent ? handleSubmit(handleSignin) : handleSubmit(onSubmit)}
-      >
         {codeSent && (
           <div className="rounded-md bg-green-50 p-4">
             <div className="flex">
@@ -117,16 +114,37 @@ export const EmailCodeForm = ({ onSuccess }: any) => {
               error={errors.token}
               placeholder="Enter code"
             />
+            {/* <span
+              className="text-xs outline-none hover:text-theme"
+              onClick={() => {
+                console.log("Triggered");
+                handleSubmit(onSubmit);
+              }}
+            >
+              Resend code
+            </span> */}
           </div>
         )}
         <div>
+          {codeSent ? (
             <Button
-            disabled={isSubmitting || (!isValid && isDirty)}
-            className="w-full text-center"
               type="submit"
+              className="w-full text-center"
+              onClick={handleSubmit(handleSignin)}
+              disabled={isSubmitting || (!isValid && isDirty)}
             >
-            {isSubmitting ? "Signing in..." : codeSent ? "Sign In" : "Continue with Email ID"}
+              {isSubmitting ? "Signing in..." : "Sign in"}
             </Button>
+          ) : (
+            <Button
+              type="submit"
+              className="w-full text-center"
+              onClick={handleSubmit(onSubmit)}
+              disabled={isSubmitting || (!isValid && isDirty)}
+            >
+              {isSubmitting ? "Sending code..." : "Send code"}
+            </Button>
+          )}
         </div>
       </form>
     </>

apps/app/components/core/board-view/single-board.tsx

@@ -69,6 +69,8 @@ export const SingleBoard: React.FC<Props> = ({
       ? (bgColor = "#22c55e")
       : (bgColor = "#ff0000");
 
+  const isNotAllowed = userAuth.isGuest || userAuth.isViewer;
+
   return (
     <div className={`h-full flex-shrink-0 rounded ${!isCollapsed ? "" : "w-80 border bg-gray-50"}`}>
       <div className={`${!isCollapsed ? "" : "flex h-full flex-col space-y-3 overflow-y-auto"}`}>
@@ -95,7 +97,7 @@ export const SingleBoard: React.FC<Props> = ({
                   key={issue.id}
                   draggableId={issue.id}
                   index={index}
-                  isDragDisabled={selectedGroup === "created_by"}
+                  isDragDisabled={isNotAllowed || selectedGroup === "created_by"}
                 >
                   {(provided, snapshot) => (
                     <SingleBoardIssue

apps/app/components/issues/view-select/state.tsx

@@ -28,11 +28,13 @@ export const ViewStateSelect: React.FC<Props> = ({
   isNotAllowed,
 }) => {
   const router = useRouter();
-  const { workspaceSlug, projectId } = router.query;
+  const { workspaceSlug } = router.query;
 
   const { data: stateGroups } = useSWR(
-    workspaceSlug && projectId ? STATE_LIST(issue.project) : null,
+    workspaceSlug && issue ? STATE_LIST(issue.project) : null,
-    workspaceSlug ? () => stateService.getStates(workspaceSlug as string, issue.project) : null
+    workspaceSlug && issue
+      ? () => stateService.getStates(workspaceSlug as string, issue.project)
+      : null
   );
   const states = getStatesList(stateGroups ?? {});
 

apps/app/components/project/card.tsx

@@ -12,13 +12,14 @@ import {
   ClipboardDocumentListIcon,
 } from "@heroicons/react/24/outline";
 // types
-import type { IProject } from "types";
 // ui
 import { Button } from "components/ui";
 // hooks
 import useProjectMembers from "hooks/use-project-members";
 // helpers
 import { renderShortNumericDateFormat } from "helpers/date-time.helper";
+// types
+import type { IProject } from "types";
 
 export type ProjectCardProps = {
   workspaceSlug: string;
@@ -85,6 +86,14 @@ export const ProjectCard: React.FC<ProjectCardProps> = (props) => {
         </div>
         <div className="mt-3 flex h-full items-end justify-between">
           <div className="flex gap-2">
+            <Button
+              theme="secondary"
+              className="flex items-center gap-1"
+              onClick={() => router.push(`/${workspaceSlug}/projects/${project.id}/issues`)}
+            >
+              <ClipboardDocumentListIcon className="h-3 w-3" />
+              Open Project
+            </Button>
             {!isMember ? (
               <button
                 type="button"
@@ -97,19 +106,11 @@ export const ProjectCard: React.FC<ProjectCardProps> = (props) => {
                 <span>Select to Join</span>
               </button>
             ) : (
-              <Button theme="secondary" className="flex items-center gap-1" disabled>
+              <div className="flex items-center gap-1 text-xs">
                 <CheckIcon className="h-3 w-3" />
                 Member
-              </Button>
+              </div>
             )}
-            <Button
-              theme="secondary"
-              className="flex items-center gap-1"
-              onClick={() => router.push(`/${workspaceSlug}/projects/${project.id}/issues`)}
-            >
-              <ClipboardDocumentListIcon className="h-3 w-3" />
-              Open Project
-            </Button>
           </div>
           <div className="mb-1 flex items-center gap-1 text-xs">
             <CalendarDaysIcon className="h-4 w-4" />

apps/app/components/project/cycles/confirm-cycle-deletion.tsx

@@ -36,10 +36,6 @@ const ConfirmCycleDeletion: React.FC<TConfirmCycleDeletionProps> = ({
 
   const { setToastAlert } = useToast();
 
-  useEffect(() => {
-    data && setIsOpen(true);
-  }, [data, setIsOpen]);
-
   const handleClose = () => {
     setIsOpen(false);
     setIsDeleteLoading(false);

apps/app/components/project/cycles/cycle-detail-sidebar/index.tsx

@@ -18,6 +18,7 @@ import {
   ChartPieIcon,
   LinkIcon,
   Squares2X2Icon,
+  TrashIcon,
   UserIcon,
 } from "@heroicons/react/24/outline";
 // ui
@@ -28,6 +29,8 @@ import useToast from "hooks/use-toast";
 import cyclesService from "services/cycles.service";
 // components
 import { SidebarProgressStats } from "components/core";
+import ProgressChart from "components/core/sidebar/progress-chart";
+import ConfirmCycleDeletion from "components/project/cycles/confirm-cycle-deletion";
 // helpers
 import { copyTextToClipboard } from "helpers/string.helper";
 import { groupBy } from "helpers/array.helper";
@@ -36,7 +39,7 @@ import { renderDateFormat, renderShortNumericDateFormat } from "helpers/date-tim
 import { CycleIssueResponse, ICycle, IIssue } from "types";
 // fetch-keys
 import { CYCLE_DETAILS } from "constants/fetch-keys";
-import ProgressChart from "components/core/sidebar/progress-chart";
+// constants
 import { CYCLE_STATUS } from "constants/cycle";
 
 type Props = {
@@ -47,6 +50,8 @@ type Props = {
 };
 
 const CycleDetailSidebar: React.FC<Props> = ({ issues, cycle, isOpen, cycleIssues }) => {
+  const [cycleDeleteModal, setCycleDeleteModal] = useState(false);
+
   const router = useRouter();
   const { workspaceSlug, projectId, cycleId } = router.query;
 
@@ -103,7 +108,14 @@ const CycleDetailSidebar: React.FC<Props> = ({ issues, cycle, isOpen, cycleIssue
 
   const isStartValid = new Date(`${cycle?.start_date}`) <= new Date();
   const isEndValid = new Date(`${cycle?.end_date}`) >= new Date(`${cycle?.start_date}`);
+
   return (
+    <>
+      <ConfirmCycleDeletion
+        isOpen={cycleDeleteModal}
+        setIsOpen={setCycleDeleteModal}
+        data={cycle}
+      />
       <div
         className={`fixed top-0 ${
           isOpen ? "right-0" : "-right-[24rem]"
@@ -222,6 +234,13 @@ const CycleDetailSidebar: React.FC<Props> = ({ issues, cycle, isOpen, cycleIssue
                 >
                   <LinkIcon className="h-3.5 w-3.5" />
                 </button>
+                <button
+                  type="button"
+                  className="rounded-md border border-red-500 p-2 text-red-500 shadow-sm duration-300 hover:bg-red-50 focus:border-indigo-500 focus:outline-none focus:ring-1 focus:ring-indigo-500"
+                  onClick={() => setCycleDeleteModal(true)}
+                >
+                  <TrashIcon className="h-3.5 w-3.5" />
+                </button>
               </div>
             </div>
             <div className="divide-y-2 divide-gray-100 text-xs">
@@ -309,6 +328,7 @@ const CycleDetailSidebar: React.FC<Props> = ({ issues, cycle, isOpen, cycleIssue
           </Loader>
         )}
       </div>
+    </>
   );
 };
 

apps/app/components/states/single-state.tsx

@@ -148,9 +148,7 @@ export const SingleState: React.FC<Props> = ({
             backgroundColor: state.color,
           }}
         />
-        <h6 className="text-sm">
+        <h6 className="text-sm">{addSpaceIfCamelCase(state.name)}</h6>
-          {addSpaceIfCamelCase(state.name)} {state.sequence}
-        </h6>
       </div>
       <div className="flex items-center gap-2">
         {index !== 0 && (

apps/app/components/workspace/home-cards-list.tsx

@@ -16,7 +16,7 @@ export const WorkspaceHomeCardsList: FC<WorkspaceHomeCardsListProps> = (props) =
     },
     {
       title: "Issues pending",
-      number: myIssues?.length ?? 0 - groupedIssues.completed.length,
+      number: myIssues.length - groupedIssues.completed.length,
     },
     {
       title: "Projects",

apps/app/pages/[workspaceSlug]/me/my-issues.tsx

@@ -58,6 +58,7 @@ const MyIssuesPage: NextPage = () => {
         }
         right={
           <div className="flex items-center gap-2">
+            {myIssues && myIssues.length > 0 && (
               <Popover className="relative">
                 {({ open }) => (
                   <>
@@ -106,6 +107,7 @@ const MyIssuesPage: NextPage = () => {
                   </>
                 )}
               </Popover>
+            )}
             <HeaderButton
               Icon={PlusIcon}
               label="Add Issue"