fix: minor pages bugs (#786)

* fix: dashboard workspace activity mutation

* fix/minor_pages_bugs

apps/app/pages/[workspaceSlug]/projects/[projectId]/pages/[pageId].tsx

@@ -1,4 +1,4 @@
-import React, { useEffect, useRef, useState } from "react";
+import React, { useCallback, useEffect, useRef, useState } from "react";
 
 import { useRouter } from "next/router";
 
@@ -34,7 +34,7 @@ import {
   LockOpenIcon,
   PlusIcon,
   StarIcon,
-  LinkIcon
+  LinkIcon,
 } from "@heroicons/react/24/outline";
 import { ColorPalletteIcon, ClipboardIcon } from "components/icons";
 // helpers
@@ -161,7 +161,7 @@ const SinglePage: NextPage = () => {
         title: "Success",
         message: "Added to favorites",
       });
-    });;
+    });
 
     pagesService.addPageToFavorites(workspaceSlug as string, projectId as string, {
       page: pageId as string,
@@ -184,10 +184,13 @@ const SinglePage: NextPage = () => {
         title: "Success",
         message: "Removed from favorites",
       });
-    });;
+    });
 
-    pagesService
-      .removePageFromFavorites(workspaceSlug as string, projectId as string, pageId as string);
+    pagesService.removePageFromFavorites(
+      workspaceSlug as string,
+      projectId as string,
+      pageId as string
+    );
   };
 
   const handleOnDragEnd = (result: DropResult) => {
@@ -249,12 +252,12 @@ const SinglePage: NextPage = () => {
     );
   };
 
-  const handleNewBlock = () => {
+  const handleNewBlock = useCallback(() => {
     setCreateBlockForm(true);
     scrollToRef.current?.scrollIntoView({
       behavior: "smooth",
     });
-  };
+  }, [setCreateBlockForm, scrollToRef]);
 
   const options =
     labels?.map((label) => ({
@@ -281,6 +284,18 @@ const SinglePage: NextPage = () => {
     });
   }, [reset, pageDetails]);
 
+  useEffect(() => {
+    const openCreateBlockForm = (e: KeyboardEvent) => {
+      if (e.shiftKey && e.key === "Enter") handleNewBlock();
+    };
+
+    window.addEventListener("keydown", openCreateBlockForm);
+
+    return () => {
+      window.removeEventListener("keydown", openCreateBlockForm);
+    };
+  }, [handleNewBlock, createBlockForm]);
+
   return (
     <ProjectAuthorizationWrapper
       meta={{
@@ -465,7 +480,7 @@ const SinglePage: NextPage = () => {
               onBlur={handleSubmit(updatePage)}
               onChange={(e) => setValue("name", e.target.value)}
               required={true}
-              className="min-h-10 block w-full resize-none overflow-hidden placeholder:text-[#858E96] rounded border-none bg-transparent px-3 py-2 text-3xl font-semibold outline-none ring-0 "
+              className="min-h-10 block w-full resize-none overflow-hidden placeholder:text-[#858E96] rounded border-none bg-transparent px-3 py-2 text-2xl font-semibold outline-none ring-0 "
               role="textbox"
             />
           </div>
@@ -483,7 +498,6 @@ const SinglePage: NextPage = () => {
                               block={block}
                               projectDetails={projectDetails}
                               index={index}
-                              handleNewBlock={handleNewBlock}
                             />
                           ))}
                           {provided.placeholder}

apps/app/pages/[workspaceSlug]/projects/[projectId]/pages/index.tsx

@@ -177,21 +177,17 @@ const ProjectPages: NextPage = () => {
         <div className="space-y-4">
           <form
             onSubmit={handleSubmit(createPage)}
-            className="flex relative justify-between gap-2 mb-12 rounded-[6px] h-[80px] border border-gray-200 bg-white p-2 shadow-md"
+            className="flex items-center relative justify-between gap-2 mb-12 rounded-[6px] border border-gray-200 bg-white p-2 shadow"
           >
             <Input
               type="text"
               name="name"
               register={register}
-              className="border-none text-start font-semibold flex break-all text-2xl outline-none focus:ring-0"
+              className="border-none font-medium flex break-all text-xl outline-none focus:ring-0"
               placeholder="Title"
             />
             {watch("name") !== "" && (
-              <PrimaryButton
-                type="submit"
-                loading={isSubmitting}
-                className="h-8 absolute top-6 right-2"
-              >
+              <PrimaryButton type="submit" loading={isSubmitting}>
                 {isSubmitting ? "Creating..." : "Create"}
               </PrimaryButton>
             )}