feat: note update event

Signed-off-by: Innei <[email protected]>

src/atoms/owner.ts

@@ -6,6 +6,8 @@ import { aggregationDataAtom } from '~/providers/root/aggregation-data-provider'
 import { getToken, removeToken, setToken } from '~/utils/cookie'
 import { apiClient } from '~/utils/request'
 
+import { fetchAppUrl } from './url'
+
 const ownerAtom = atom((get) => {
   return get(aggregationDataAtom)?.user
 })
@@ -23,6 +25,7 @@ export const login = async (username?: string, password?: string) => {
       setToken(token)
       jotaiStore.set(isLoggedAtom, true)
 
+      await fetchAppUrl()
       toast(`欢迎回来，${jotaiStore.get(ownerAtom)?.name}`, 'success')
     }
 

src/atoms/url.ts

@@ -20,7 +20,7 @@ export const fetchAppUrl = async () => {
   jotaiStore.set(adminUrlAtom, data.adminUrl)
 }
 
-export const getAppUrl = () => jotaiStore.get(adminUrlAtom)
+export const getAdminUrl = () => jotaiStore.get(adminUrlAtom)
 export const useAppUrl = () => {
   const url = useAggregationSelector((a) => a.url)
   const adminUrl = useAtomValue(adminUrlAtom)

src/components/layout/header/internal/AnimatedLogo.tsx

@@ -3,7 +3,7 @@
 import { AnimatePresence, motion } from 'framer-motion'
 import { useRouter } from 'next/navigation'
 
-import { getAppUrl, isLogged, useViewport } from '~/atoms'
+import { getAdminUrl, isLogged, useViewport } from '~/atoms'
 import { useSingleAndDoubleClick } from '~/hooks/common/use-single-double-click'
 import { Routes } from '~/lib/route-builder'
 import { toast } from '~/lib/toast'
@@ -19,7 +19,7 @@ const TapableLogo = () => {
     },
     () => {
       if (isLogged()) {
-        const adminUrl = getAppUrl()?.adminUrl
+        const adminUrl = getAdminUrl()
         if (adminUrl) location.href = adminUrl
         else {
           toast('Admin url not found', 'error')

src/components/layout/header/internal/HeaderMeta.tsx

@@ -41,18 +41,20 @@ export const HeaderMeta = () => {
         >
           <div className="align-center flex min-w-0 flex-shrink flex-grow flex-col">
             <small className="min-w-0 truncate">
-              <span className="text-gray-500">{description}</span>
+              <span className="text-gray-600/60 dark:text-gray-300/60">
+                {description}
+              </span>
             </small>
             <h2 className="min-w-0 truncate text-[1.2rem] font-medium leading-[1.5]">
               {title}
             </h2>
           </div>
 
           <div className="hidden min-w-0 flex-shrink flex-col text-right leading-5 lg:flex">
-            <span className="min-w-0 truncate whitespace-pre text-gray-600/60 dark:text-gray-300/60">
+            <small className="min-w-0 truncate whitespace-pre text-gray-600/60 dark:text-gray-300/60">
               {' '}
               {slug}
-            </span>
+            </small>
             <span className="font-medium text-gray-600 dark:text-gray-300">
               {seoTitle}
             </span>

src/components/widgets/comment/Comments.tsx

@@ -4,7 +4,7 @@ export const Comments: FC<{
   refId: string
 }> = ({ refId }) => {
   return (
-    <div className="relative mb-[60px] mt-[120px] min-h-[10000px]">
+    <div className="relative mb-[60px] mt-[120px] min-h-[100px]">
       Comments WIP, RefId: {refId}
     </div>
   )

src/providers/root/socket-provider.tsx

@@ -2,7 +2,6 @@
 
 import { useEffect } from 'react'
 
-// const Context = createContext<TSocketClient>(null as any)
 export const SocketContainer: Component = () => {
   useEffect(() => {
     import('~/socket').then((module) => {

src/socket/handler.ts

@@ -1,16 +1,34 @@
+import type { NoteModel } from '@mx-space/api-client'
+import type { EventTypes } from '~/types/events'
+
 import { setOnlineCount } from '~/atoms'
-import { EventTypes } from '~/types/events'
+import { toast } from '~/lib/toast'
+import {
+  getCurrentNoteData,
+  setCurrentNoteData,
+} from '~/providers/note/CurrentNoteDataProvider'
 import { isDev } from '~/utils/env'
 
 export const eventHandler = (type: EventTypes, data: any) => {
   switch (type) {
-    case EventTypes.VISITOR_ONLINE:
-    case EventTypes.VISITOR_OFFLINE: {
+    case 'VISITOR_ONLINE':
+    case 'VISITOR_OFFLINE': {
       const { online } = data
       setOnlineCount(online)
       break
     }
 
+    case 'NOTE_UPDATE': {
+      const note = data as NoteModel
+      if (getCurrentNoteData()?.data.id === note.id) {
+        setCurrentNoteData((draft) => {
+          Object.assign(draft.data, note)
+        })
+        toast('手记已更新')
+      }
+      break
+    }
+
     default: {
       if (isDev) {
         console.log(type, data)

src/types/events.ts

@@ -1,3 +1,5 @@
+import type { NoteModel } from '@mx-space/api-client'
+
 export enum EventTypes {
   GATEWAY_CONNECT = 'GATEWAY_CONNECT',
   GATEWAY_DISCONNECT = 'GATEWAY_DISCONNECT',
@@ -26,5 +28,11 @@ export enum EventTypes {
   DANMAKU_CREATE = 'DANMAKU_CREATE',
 
   RECENTLY_CREATE = 'RECENTLY_CREATE',
-  RECENTLY_DElETE = 'RECENTLY_DElETE',
+  RECENTLY_DELETE = 'RECENTLY_DELETE',
+}
+
+export interface EventTypesPayload {
+  [EventTypes.VISITOR_ONLINE]: { online: number }
+  [EventTypes.VISITOR_OFFLINE]: { online: number }
+  [EventTypes.NOTE_UPDATE]: NoteModel
 }