feat: improve content render

app/~/(dashboard)/Sidebar/SyncBar/SyncButton.tsx

@@ -29,7 +29,7 @@ export function SyncButton({}: Props) {
       <PopoverTrigger asChild>
         <div className="flex-1 flex items-center justify-center gap-1 cursor-pointer hover:bg-foreground/5 transition-all border-x">
           <RefreshCcw size={16}></RefreshCcw>
-          <div>Push</div>
+          <div>Sync</div>
         </div>
       </PopoverTrigger>
       <PopoverContent align="start" alignOffset={8} className="space-y-1 w-72">

app/~/(dashboard)/objects/[nodeId]/page.tsx

@@ -5,30 +5,11 @@ import { ELECTRIC_BASE_URL } from '@/lib/constants'
 import { db } from '@/lib/local-db'
 import { Node } from '@/lib/model'
 import { store } from '@/store'
-import { Shape, ShapeStream } from '@electric-sql/client'
-import { useLiveQuery } from '@electric-sql/pglite-react'
-import { useShape } from '@electric-sql/react'
 import { useQuery } from '@tanstack/react-query'
 import { useParams } from 'next/navigation'
 
 export const dynamic = 'force-static'
 
-// const stream = new ShapeStream({
-//   url: `${ELECTRIC_BASE_URL}/v1/shape/site`,
-// })
-
-// stream.subscribe((messages) => {
-//   console.log('=======messages:', messages)
-//   //
-// })
-
-// const shape = new Shape(stream)
-
-// shape.subscribe((data) => {
-//   console.log('rows=data========:', data)
-//   // rows is an array of the latest value of each row in a shape.
-// })
-
 export default function Page() {
   const params = useParams()
 

components/ContentRender/SlateContent.tsx

@@ -22,10 +22,17 @@ import { Editable } from 'slate-react'
 export function SlateContent() {
   return (
     <Editable
+      className="mt-4"
       renderElement={({ attributes, children, element }) => {
-        // console.log('=====element:', element)
         switch (element.type) {
           case ELEMENT_P:
+            if (element.listStyleType == 'disc') {
+              return (
+                <ul className="my-[1px]" {...attributes}>
+                  <li>{children}</li>
+                </ul>
+              )
+            }
             return (
               <div className="mb-4" {...attributes}>
                 {children}

components/SiteContext.tsx

@@ -1,78 +1,10 @@
 'use client'
 
 import { createContext, PropsWithChildren, useContext, useEffect } from 'react'
-import { ELECTRIC_BASE_URL, isServer } from '@/lib/constants'
+import { isServer } from '@/lib/constants'
 import { runWorker } from '@/lib/worker'
-import { PGlite } from '@electric-sql/pglite'
-import { electricSync } from '@electric-sql/pglite-sync'
-import { live } from '@electric-sql/pglite/live'
 import { Site } from '@penxio/types'
 
-async function runPG() {
-  console.log('init.........')
-
-  const db = await PGlite.create({
-    dataDir: 'idb://penx',
-    extensions: {
-      electric: electricSync({ debug: true }),
-      live,
-    },
-  })
-
-  return
-  await db.electric.syncShapeToTable({
-    shape: {
-      url: `${ELECTRIC_BASE_URL}/v1/shape/node`,
-    },
-
-    table: 'node',
-    primaryKey: ['id'],
-  })
-
-  await db.exec(`
-    CREATE TABLE IF NOT EXISTS node (
-      id UUID PRIMARY KEY DEFAULT gen_random_uuid(),
-      userId UUID,
-      parentId UUID,
-      databaseId UUID,
-      type TEXT NOT NULL,
-      element JSONB NOT NULL,
-      props JSONB,
-      collapsed BOOLEAN DEFAULT FALSE,
-      folded BOOLEAN DEFAULT TRUE,
-      children JSONB,
-      createdAt TIMESTAMP DEFAULT CURRENT_TIMESTAMP,
-      updatedAt TIMESTAMP DEFAULT CURRENT_TIMESTAMP
-    );
-
-    CREATE INDEX IF NOT EXISTS idx_userId ON node(userId);
-    CREATE INDEX IF NOT EXISTS idx_type ON node(type);
-  `)
-
-  // await db.exec(`
-  //   INSERT INTO node (id, userId, parentId, databaseId, type, element, props, collapsed, folded, children, createdAt, updatedAt)
-  //   VALUES (
-  //       gen_random_uuid(),
-  //       '550e8400-e29b-41d4-a716-446655440000',
-  //       NULL,
-  //       '550e8400-e29b-41d4-a716-446655440001',
-  //       'exampleType',
-  //       '{"key": "value"}',
-  //       '{"propKey": "propValue"}',
-  //       FALSE,
-  //       TRUE,
-  //       NULL,
-  //       CURRENT_TIMESTAMP,
-  //       CURRENT_TIMESTAMP
-  //   );
-  // `)
-
-  const ret = await db.query(`
-  SELECT * from node;
-`)
-  console.log('=====ret:', ret)
-}
-
 let inited = false
 if (!isServer) {
   setTimeout(() => {

components/plate-ui/table-cell-element.tsx

@@ -139,3 +139,4 @@ TableCellElement.displayName = 'TableCellElement';
 export const TableCellHeaderElement = withProps(TableCellElement, {
   isHeader: true,
 });
+

custom-types.ts

@@ -16,6 +16,7 @@ declare module 'slate' {
       type?: any
       id?: string
       nodeType?: string
+      listStyleType?: string
     }
   }
 }

lib/fetchers.ts

@@ -2,7 +2,7 @@ import prisma from '@/lib/prisma'
 import { getSite as getSiteInfo } from '@/server/lib/getSite'
 import ky from 'ky'
 import { unstable_cache } from 'next/cache'
-import { PostStatus, RESPACE_BASE_URI } from './constants'
+import { isProd, PostStatus, RESPACE_BASE_URI } from './constants'
 import { SpaceType } from './types'
 import { getUrl } from './utils'
 
@@ -46,7 +46,7 @@ export async function getPosts() {
     },
     [`posts`],
     {
-      revalidate: 3600 * 24,
+      revalidate: isProd ? 3600 * 24 : 10,
       tags: [`posts`],
     },
   )()

package.json

@@ -19,15 +19,8 @@
     "@dnd-kit/core": "^6.1.0",
     "@dnd-kit/sortable": "^7.0.2",
     "@dnd-kit/utilities": "^3.2.2",
-    "@electric-sql/client": "^0.6.5",
-    "@electric-sql/pglite": "^0.2.12",
-    "@electric-sql/pglite-react": "^0.2.12",
-    "@electric-sql/pglite-sync": "^0.2.13",
-    "@electric-sql/react": "^0.4.7",
     "@faker-js/faker": "^9.2.0",
     "@floating-ui/react": "^0.25.4",
-    "@fower/color-helper": "^2.1.1",
-    "@fower/utils": "^2.1.1",
     "@glideapps/glide-data-grid": "^6.0.3",
     "@hookform/resolvers": "^3.9.0",
     "@penxio/types": "^0.0.4",