chore: pages content update, empty state for recent pages (#637)

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

@@ -112,13 +112,13 @@ export const SingleList: React.FC<Props> = ({
               <div className="flex items-center gap-x-3">
                 {selectedGroup !== null && selectedGroup === "state" ? (
                   <span>
-                    {currentState && getStateGroupIcon(currentState.group, "20", "20", bgColor)}
+                    {currentState && getStateGroupIcon(currentState.group, "16", "16", bgColor)}
                   </span>
                 ) : (
                   ""
                 )}
                 {selectedGroup !== null ? (
-                  <h2 className="text-xl font-semibold capitalize leading-6 text-gray-800">
+                  <h2 className="text-base font-semibold capitalize leading-6 text-gray-800">
                     {getGroupTitle()}
                   </h2>
                 ) : (
@@ -142,9 +142,9 @@ export const SingleList: React.FC<Props> = ({
             ) : (
               <CustomMenu
                 customButton={
-                  <span className="flex items-center">
+                  <div className="flex items-center cursor-pointer">
                     <PlusIcon className="h-4 w-4" />
-                  </span>
+                  </div>
                 }
                 optionsPosition="right"
                 noBorder

apps/app/components/pages/create-update-page-modal.tsx

@@ -63,6 +63,8 @@ export const CreateUpdatePageModal: React.FC<Props> = ({ isOpen, handleClose, da
         );
         onClose();
 
+        router.push(`/${workspaceSlug}/projects/${projectId}/pages/${res.id}`);
+
         setToastAlert({
           type: "success",
           title: "Success!",

apps/app/components/pages/pages-list/recent-pages-list.tsx

@@ -9,7 +9,9 @@ import pagesService from "services/pages.service";
 // components
 import { PagesView } from "components/pages";
 // ui
-import { Loader } from "components/ui";
+import { EmptyState, Loader } from "components/ui";
+// images
+import emptyPage from "public/empty-state/empty-page.svg";
 // helpers
 import { replaceUnderscoreIfSnakeCase } from "helpers/string.helper";
 // types
@@ -29,10 +31,12 @@ export const RecentPagesList: React.FC<TPagesListProps> = ({ viewType }) => {
       : null
   );
 
+  const isEmpty = pages && Object.keys(pages).every((key) => pages[key].length === 0);
+
   return (
     <>
       {pages ? (
-        Object.keys(pages).length > 0 ? (
+        Object.keys(pages).length > 0 && !isEmpty ? (
           <div className="mt-4 space-y-4">
             {Object.keys(pages).map((key) => {
               if (pages[key].length === 0) return null;
@@ -48,7 +52,14 @@ export const RecentPagesList: React.FC<TPagesListProps> = ({ viewType }) => {
             })}
           </div>
         ) : (
-          <p className="mt-4 text-center">No issues found</p>
+          <div className="mt-4">
+            <EmptyState
+              type="page"
+              title="Create New Page"
+              description="Create and document issues effortlessly in one place with Plane Notes, AI-powered for ease."
+              imgURL={emptyPage}
+            />
+          </div>
         )
       ) : (
         <Loader className="mt-8 space-y-4">

apps/app/components/pages/pages-view.tsx

@@ -210,8 +210,7 @@ export const PagesView: React.FC<Props> = ({ pages, viewType }) => {
           <EmptyState
             type="page"
             title="Create New Page"
-            description="Sprint more effectively with Cycles by confining your project
-      to a fixed amount of time. Create new cycle now."
+            description="Create and document issues effortlessly in one place with Plane Notes, AI-powered for ease."
             imgURL={emptyPage}
           />
         )

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

@@ -27,7 +27,7 @@ import { RecentPagesList, CreateUpdatePageModal, TPagesListProps } from "compone
 import { Input, PrimaryButton } from "components/ui";
 import { BreadcrumbItem, Breadcrumbs } from "components/breadcrumbs";
 // icons
-import { ListBulletIcon, RectangleGroupIcon } from "@heroicons/react/20/solid";
+import { ListBulletIcon, RectangleGroupIcon, Squares2X2Icon } from "@heroicons/react/20/solid";
 // types
 import { IPage, TPageViewProps, UserAuth } from "types";
 // fetch-keys
@@ -115,6 +115,7 @@ const ProjectPages: NextPage<UserAuth> = (props) => {
           title: "Success!",
           message: "Page created successfully.",
         });
+        router.push(`/${workspaceSlug}/projects/${projectId}/pages/${res.id}`);
         reset();
 
         mutate(RECENT_PAGES_LIST(projectId as string));
@@ -222,7 +223,7 @@ const ProjectPages: NextPage<UserAuth> = (props) => {
                   >
                     <ListBulletIcon className="h-4 w-4" />
                   </button>
-                  {/* <button
+                  <button
                     type="button"
                     className={`grid h-7 w-7 place-items-center rounded p-1 outline-none duration-300 hover:bg-gray-200 ${
                       viewType === "detailed" ? "bg-gray-200" : ""
@@ -230,8 +231,8 @@ const ProjectPages: NextPage<UserAuth> = (props) => {
                     onClick={() => setViewType("detailed")}
                   >
                     <Squares2X2Icon className="h-4 w-4" />
-                  </button> */}
-                  <button
+                  </button>
+                  {/* <button
                     type="button"
                     className={`grid h-7 w-7 place-items-center rounded p-1 outline-none duration-300 hover:bg-gray-200 ${
                       viewType === "masonry" ? "bg-gray-200" : ""
@@ -239,7 +240,7 @@ const ProjectPages: NextPage<UserAuth> = (props) => {
                     onClick={() => setViewType("masonry")}
                   >
                     <RectangleGroupIcon className="h-4 w-4" />
-                  </button>
+                  </button> */}
                 </div>
               </Tab.List>
               <Tab.Panels>