refactor: refactor title

apps/web/next.config.mjs

@@ -44,7 +44,6 @@ const config = {
     '@penx/auto-format',
     '@penx/auto-node-id',
     '@penx/paragraph',
-    '@penx/title',
     '@penx/list',
     '@penx/image',
     '@penx/file',

extensions/list/src/guard.tsx

@@ -2,13 +2,19 @@ import {
   ELEMENT_LI,
   ELEMENT_LIC,
   ELEMENT_OL,
+  ELEMENT_TITLE,
   ELEMENT_UL,
   ListContentElement,
   ListElement,
   ListItemElement,
   OrderedListElement,
+  TitleElement,
 } from './types'
 
+export function isTitle(node: any): node is TitleElement {
+  return node.type === ELEMENT_TITLE
+}
+
 export function isListElement(node: any): node is ListElement {
   return [ELEMENT_UL, ELEMENT_OL].includes(node?.type)
 }

extensions/list/src/onKeyDown.ts

@@ -19,6 +19,7 @@ export const onKeyDown: OnKeyDown = (editor, e) => {
     const node = getCurrentNode(editor)!
     const path = findNodePath(editor, node)
     if (!path) return
+
     const parentPath = Path.parent(path)
     const parentNode: any = getNodeByPath(editor, parentPath)
 

extensions/list/src/types.ts

@@ -1,10 +1,16 @@
 import { BaseElement } from 'slate'
 
+export const ELEMENT_TITLE = 'title'
 export const ELEMENT_UL = 'unordered-list'
 export const ELEMENT_OL = 'ordered-list'
 export const ELEMENT_LI = 'list-item'
 export const ELEMENT_LIC = 'list-item-text'
 
+export interface TitleElement extends BaseElement {
+  id?: string
+  type: typeof ELEMENT_TITLE
+}
+
 export interface ListElement extends BaseElement {
   id: string
   type: typeof ELEMENT_UL | typeof ELEMENT_OL

extensions/title/package.json

@@ -1,34 +0,0 @@
-{
-  "name": "@penx/title",
-  "version": "0.0.0",
-  "main": "./src/index.ts",
-  "types": "./src/index.ts",
-  "scripts": {
-    "lint": "eslint \"**/*.ts*\""
-  },
-  "devDependencies": {
-    "@types/react": "^18.2.22",
-    "@types/react-dom": "^18.2.7",
-    "eslint": "^8.42.0",
-    "eslint-config-custom": "workspace:*",
-    "react": "^18.2.0",
-    "tsconfig": "workspace:*",
-    "typescript": "^5.1.3"
-  },
-  "dependencies": {
-    "@bone-ui/iconify": "^0.37.0",
-    "@bone-ui/utils": "^0.37.0",
-    "@fower/react": "^1.86.0",
-    "@penx/constants": "workspace:*",
-    "@penx/editor-queries": "workspace:*",
-    "@penx/editor-shared": "workspace:*",
-    "@penx/extension-typings": "*",
-    "@penx/hooks": "workspace:*",
-    "@penx/local-db": "workspace:*",
-    "lucide-react": "^0.284.0",
-    "slate": "0.94.1",
-    "slate-history": "0.93.0",
-    "slate-lists": "workspace:*",
-    "slate-react": "^0.98.3"
-  }
-}

extensions/title/src/index.ts

@@ -1,20 +0,0 @@
-import { ExtensionContext } from '@penx/extension-typings'
-import { Title } from './Title'
-import { ELEMENT_TITLE } from './types'
-
-export function activate(ctx: ExtensionContext) {
-  ctx.registerBlock({
-    elements: [
-      {
-        type: ELEMENT_TITLE,
-        component: Title,
-        placeholder: 'Untitled',
-      },
-    ],
-  })
-}
-
-export * from './types'
-export * from './isTitle'
-
-export { Title }

extensions/title/src/isTitle.ts

@@ -1,5 +0,0 @@
-import { ELEMENT_TITLE, TitleElement } from './types'
-
-export function isTitle(node: any): node is TitleElement {
-  return node.type === ELEMENT_TITLE
-}

extensions/title/src/types.ts

@@ -1,8 +0,0 @@
-import { BaseElement } from 'slate'
-
-export const ELEMENT_TITLE = 'title'
-
-export interface TitleElement extends BaseElement {
-  id?: string
-  type: typeof ELEMENT_TITLE
-}

extensions/title/tsconfig.json

@@ -1,8 +0,0 @@
-{
-  "extends": "tsconfig/react-library.json",
-  "compilerOptions": {
-    "lib": ["ESNext", "DOM"]
-  },
-  "include": [".", "src/types.ts"],
-  "exclude": ["dist", "build", "node_modules"]
-}

packages/extension-list/package.json

@@ -22,7 +22,6 @@
     "@penx/word-count": "workspace:*",
     "@penx/blockquote": "workspace:*",
     "@penx/heading": "workspace:*",
-    "@penx/title": "workspace:*",
     "@penx/divider": "workspace:*",
     "@penx/tree-view": "workspace:*",
     "@penx/check-list": "workspace:*",

packages/extension-list/src/index.ts

@@ -14,7 +14,6 @@ import * as list from '@penx/list'
 import * as paragraph from '@penx/paragraph'
 import * as storageEstimate from '@penx/storage-estimate'
 import * as table from '@penx/table'
-import * as title from '@penx/title'
 // import * as treeView from '@penx/tree-view'
 import * as wordCount from '@penx/word-count'
 
@@ -88,11 +87,6 @@ export const extensionList = [
     activate: File.activate,
   },
 
-  {
-    id: 'title',
-    activate: title.activate,
-  },
-
   // {
   //   id: 'tree-view',
   //   activate: treeView.activate,

packages/service/package.json

@@ -21,7 +21,6 @@
   "dependencies": {
     "@penx/autoformat": "workspace:*",
     "@penx/catalogue": "workspace:*",
-    "@penx/title": "workspace:*",
     "@penx/constants": "workspace:*",
     "@penx/list": "workspace:*",
     "@penx/extension-typings": "*",

packages/service/src/NodeService.ts

@@ -7,12 +7,12 @@ import {
   isListContentElement,
   ListContentElement,
   ListItemElement,
+  TitleElement,
   UnorderedListElement,
 } from '@penx/list'
 import { db } from '@penx/local-db'
 import { Node } from '@penx/model'
 import { store } from '@penx/store'
-import { TitleElement } from '@penx/title'
 import { INode } from '@penx/types'
 
 export class NodeService {
@@ -74,35 +74,40 @@ export class NodeService {
       }
     }
 
-    const value = [
+    const content = {
+      type: ELEMENT_UL,
+      children: this.pageNodes.map((node) => {
+        const listChildren = [
+          {
+            id: node.id,
+            type: ELEMENT_LIC,
+            collapsed: node.collapsed,
+            children: [node.element],
+          },
+        ]
+
+        const ul = childrenToList(node.children) as any
+        if (ul) listChildren.push(ul)
+
+        return {
+          type: ELEMENT_LI,
+          children: listChildren,
+        }
+      }),
+    }
+
+    const value: any[] = [
       {
         id: this.node.id,
         type: ELEMENT_TITLE,
         children: [this.node.element],
       },
-      {
-        type: ELEMENT_UL,
-        children: this.pageNodes.map((node) => {
-          const listChildren = [
-            {
-              id: node.id,
-              type: ELEMENT_LIC,
-              collapsed: node.collapsed,
-              children: [node.element],
-            },
-          ]
-
-          const ul = childrenToList(node.children) as any
-          if (ul) listChildren.push(ul)
-
-          return {
-            type: ELEMENT_LI,
-            children: listChildren,
-          }
-        }),
-      },
     ]
 
+    if (this.pageNodes.length) {
+      value.push(content)
+    }
+
     return value
   }
 
@@ -131,7 +136,6 @@ export class NodeService {
   }
 
   async selectNode(node?: Node) {
-    // TODO: improve performance
     store.routeTo('NODE')
     store.reloadNode(node?.raw || this.node.raw)
   }

pnpm-lock.yaml

@@ -1854,73 +1854,6 @@ importers:
         specifier: ^5.1.3
         version: 5.2.2
 
-  extensions/title:
-    dependencies:
-      '@bone-ui/iconify':
-        specifier: ^0.37.0
-        version: 0.37.0
-      '@bone-ui/utils':
-        specifier: ^0.37.0
-        version: 0.37.0
-      '@fower/react':
-        specifier: ^1.86.0
-        version: 1.86.0
-      '@penx/constants':
-        specifier: workspace:*
-        version: link:../../packages/constants
-      '@penx/editor-queries':
-        specifier: workspace:*
-        version: link:../../packages/editor-queries
-      '@penx/editor-shared':
-        specifier: workspace:*
-        version: link:../../packages/editor-shared
-      '@penx/extension-typings':
-        specifier: '*'
-        version: link:../../packages/extension-typings
-      '@penx/hooks':
-        specifier: workspace:*
-        version: link:../../packages/hooks
-      '@penx/local-db':
-        specifier: workspace:*
-        version: link:../../packages/local-db
-      lucide-react:
-        specifier: ^0.284.0
-        version: 0.284.0(react@18.2.0)
-      slate:
-        specifier: 0.94.1
-        version: 0.94.1
-      slate-history:
-        specifier: 0.93.0
-        version: 0.93.0(slate@0.94.1)
-      slate-lists:
-        specifier: workspace:*
-        version: link:../../packages/slate-lists
-      slate-react:
-        specifier: ^0.98.3
-        version: 0.98.4(react-dom@18.2.0)(react@18.2.0)(slate@0.94.1)
-    devDependencies:
-      '@types/react':
-        specifier: ^18.2.22
-        version: 18.2.22
-      '@types/react-dom':
-        specifier: ^18.2.7
-        version: 18.2.7
-      eslint:
-        specifier: ^8.42.0
-        version: 8.49.0
-      eslint-config-custom:
-        specifier: workspace:*
-        version: link:../../packages/eslint-config-custom
-      react:
-        specifier: ^18.2.0
-        version: 18.2.0
-      tsconfig:
-        specifier: workspace:*
-        version: link:../../packages/tsconfig
-      typescript:
-        specifier: ^5.1.3
-        version: 5.2.2
-
   extensions/tree-view:
     dependencies:
       '@bone-ui/utils':
@@ -3295,9 +3228,6 @@ importers:
       '@penx/table':
         specifier: workspace:*
         version: link:../../extensions/table
-      '@penx/title':
-        specifier: workspace:*
-        version: link:../../extensions/title
       '@penx/tree-view':
         specifier: workspace:*
         version: link:../../extensions/tree-view
@@ -3781,9 +3711,6 @@ importers:
       '@penx/store':
         specifier: workspace:*
         version: link:../store
-      '@penx/title':
-        specifier: workspace:*
-        version: link:../../extensions/title
       '@penx/trpc-client':
         specifier: workspace:*
         version: link:../trpc-client