feat: impove ui

.env

@@ -3,4 +3,4 @@ NEXT_PUBLIC_THEME=penx-theme-garden
 
 # DATABASE_URL=postgresql://user:[email protected]:5437/demo
 
-DATABASE_URL="postgresql://user:[email protected]:5432/penx"
+DATABASE_URL="postgresql://user:[email protected]:5432/penx"

components/ContentRender/SlateContent.tsx

@@ -39,7 +39,7 @@ export function SlateContent() {
                   }}
                   {...attributes}
                 >
-                  <li>{children}</li>
+                  <li className="[&>*]:inline-flex">{children}</li>
                 </ul>
               )
             }

components/PostActions/Comment/CommentInput.tsx

@@ -4,6 +4,7 @@ import LoadingDots from '@/components/icons/loading-dots'
 import { Button } from '@/components/ui/button'
 import { Textarea } from '@/components/ui/textarea'
 import { WalletConnectButton } from '@/components/WalletConnectButton'
+import { extractErrorMessage } from '@/lib/extractErrorMessage'
 import { trpc } from '@/lib/trpc'
 import { useSession } from 'next-auth/react'
 import { toast } from 'sonner'
@@ -19,14 +20,19 @@ const CommentSchema = z.object({
 interface Props {
   postId: string
   // For reply
-  parentId?: string;
+  parentId?: string
   refetchComments: () => void
   onCancel?: () => void
 }
 
 const maxCharacters = 1000
 
-export function CommentInput({ postId, parentId, refetchComments, onCancel }: Props) {
+export function CommentInput({
+  postId,
+  parentId,
+  refetchComments,
+  onCancel,
+}: Props) {
   const userID = useAddress()
   const [content, setContent] = useState('')
   const { isPending, mutateAsync } = trpc.comment.create.useMutation()
@@ -52,7 +58,7 @@ export function CommentInput({ postId, parentId, refetchComments, onCancel }: Pr
         postId,
         userId: userID as string,
         content,
-        parentId
+        parentId,
       })
 
       setContent('')
@@ -61,7 +67,8 @@ export function CommentInput({ postId, parentId, refetchComments, onCancel }: Pr
       toast.success('Comment submitted successfully!')
     } catch (error) {
       console.log('Failed to submit comment.', 'color:red', error)
-      toast.error('Failed to submit comment.')
+      const msg = extractErrorMessage(error)
+      toast.error(msg || 'Failed to submit comment.')
     }
   }
 
@@ -82,16 +89,17 @@ export function CommentInput({ postId, parentId, refetchComments, onCancel }: Pr
         </div>
 
         <div className="flex justify-end">
-          {
-            parentId && <Button
+          {parentId && (
+            <Button
               onClick={() => {
                 setContent('')
                 onCancel && onCancel()
               }}
-              className="w-20 text-xs h-8 mr-1">
+              className="w-20 text-xs h-8 mr-1"
+            >
               <p>Cancel</p>
             </Button>
-          }
+          )}
 
           {!authenticated ? (
             <WalletConnectButton className="w-30 text-xs h-8">

components/Profile/WalletInfo.tsx

@@ -22,7 +22,7 @@ export function WalletInfo() {
     },
   })
 
-  if (!address) return null
+  if (!address || !data || !penBalance) return null
 
   if (isLoading) {
     return (
@@ -39,7 +39,7 @@ export function WalletInfo() {
         <div className="text-sm text-foreground/60">$ETH</div>
         <div>
           {typeof data !== 'undefined' &&
-            `${precision.toDecimal(data.value).toFixed(5)}`}
+            `${precision.toDecimal(data.value).toFixed(5) || '0'}`}
         </div>
       </div>
 

lib/worker/worker.ts

@@ -5,7 +5,7 @@ import { pollingCloudSync } from './pollingCloudSync'
 self.addEventListener('message', async (event) => {
   if (event.data === WorkerEvents.START_POLLING) {
     console.log('===========start polling......')
-    pollingBackupToGoogle()
-    pollingCloudSync()
+    // pollingBackupToGoogle()
+    // pollingCloudSync()
   }
 })

package.json

@@ -24,7 +24,7 @@
     "@floating-ui/react": "^0.25.4",
     "@glideapps/glide-data-grid": "^6.0.3",
     "@hookform/resolvers": "^3.9.0",
-    "@penxio/types": "^0.0.6",
+    "@penxio/types": "^0.0.9",
     "@prisma/client": "^5.21.1",
     "@privy-io/server-auth": "^1.15.0",
     "@radix-ui/react-accordion": "^1.2.1",
@@ -146,11 +146,11 @@
     "octokit": "^4.0.2",
     "openai-edge": "^1.2.2",
     "p-retry": "^6.2.0",
-    "penx-theme-card": "^0.0.6",
-    "penx-theme-garden": "^0.0.6",
-    "penx-theme-micro": "^0.0.6",
-    "penx-theme-minimal": "^0.0.6",
-    "penx-theme-photo": "^0.0.6",
+    "penx-theme-card": "^0.0.9",
+    "penx-theme-garden": "^0.0.9",
+    "penx-theme-micro": "^0.0.9",
+    "penx-theme-minimal": "^0.0.9",
+    "penx-theme-photo": "^0.0.9",
     "prisma-extension-pagination": "^0.7.4",
     "prismjs": "^1.29.0",
     "rc-table": "^7.48.1",

server/trpc.ts

@@ -64,7 +64,7 @@ export const protectedProcedure = t.procedure.use(
 
     if (
       ![UserRole.ADMIN, UserRole.AUTHOR].includes(role) &&
-      path !== 'user.me'
+      !['user.me', 'comment.create'].includes(path)
     ) {
       throw new TRPCError({
         code: 'UNAUTHORIZED',