Merge branch 'develop'

Author: molvqingtai

src/app/content/views/AppButton/index.tsx

@@ -1,4 +1,4 @@
-import { type FC, useState, type MouseEvent, useEffect } from 'react'
+import { type FC, useState, type MouseEvent, useEffect, startTransition } from 'react'
 import { SettingsIcon, MoonIcon, SunIcon, HandIcon } from 'lucide-react'
 import { motion, AnimatePresence } from 'framer-motion'
 
@@ -54,7 +54,9 @@ const AppButton: FC<AppButtonProps> = ({ className }) => {
   })
 
   useWindowResize(({ width, height }) => {
-    send(appStatusDomain.command.UpdatePositionCommand({ x: width - 50, y: height - 22 }))
+    startTransition(() => {
+      send(appStatusDomain.command.UpdatePositionCommand({ x: width - 50, y: height - 22 }))
+    })
   })
 
   useEffect(() => {

src/app/content/views/AppMain/index.tsx

@@ -45,7 +45,7 @@ const AppMain: FC<AppMainProps> = ({ children, className }) => {
             bottom: `calc(100vh - ${y}px + 22px)`
           }}
           className={cn(
-            `fixed inset-y-10 right-10 z-infinity mb-0 mt-auto box-border grid max-h-[min(calc(100vh_-60px),_1000px)] grid-flow-col grid-rows-[auto_1fr_auto] rounded-xl bg-slate-50 dark:bg-slate-950 font-sans shadow-2xl`,
+            `fixed inset-y-10 right-10 z-infinity mb-0 mt-auto box-border grid max-h-[min(calc(100vh_-60px),_1000px)] min-h-[375px] grid-flow-col grid-rows-[auto_1fr_auto] rounded-xl bg-slate-50 dark:bg-slate-950 font-sans shadow-2xl`,
             className,
             { 'transition-transform': isAnimationComplete }
           )}

src/app/content/views/Footer/index.tsx

@@ -312,7 +312,7 @@ const Footer: FC = () => {
   const root = getRootNode()
 
   return (
-    <div className="relative z-10 grid gap-y-2 rounded-b-xl px-4 pb-4 pt-2 before:pointer-events-none before:absolute before:inset-x-4 before:-top-2 before:h-2 before:bg-gradient-to-t before:from-slate-50 before:from-30%  before:to-transparent dark:bg-slate-900 before:dark:from-slate-900">
+    <div className="relative grid gap-y-2 rounded-b-xl px-4 pb-4 pt-2 before:pointer-events-none before:absolute before:inset-x-4 before:-top-2 before:h-2 before:bg-gradient-to-t before:from-slate-50 before:from-30%  before:to-transparent dark:bg-slate-900 before:dark:from-slate-900">
       <Presence present={autoCompleteListShow}>
         <Portal
           container={root}

src/domain/ChatRoom.ts

@@ -67,10 +67,8 @@ const MessageUserSchema = {
 }
 
 const AtUserSchema = {
-  userId: v.string(),
-  username: v.string(),
-  userAvatar: v.string(),
-  positions: v.array(v.tuple([v.number(), v.number()]))
+  positions: v.array(v.tuple([v.number(), v.number()])),
+  ...MessageUserSchema
 }
 
 const NormalMessageSchema = {
@@ -81,7 +79,8 @@ const NormalMessageSchema = {
   receiveTime: v.number(),
   likeUsers: v.array(v.object(MessageUserSchema)),
   hateUsers: v.array(v.object(MessageUserSchema)),
-  atUsers: v.array(v.object(AtUserSchema))
+  atUsers: v.array(v.object(AtUserSchema)),
+  ...MessageUserSchema
 }
 
 const RoomMessageSchema = v.union([

src/utils/getRootNode.ts

@@ -1,5 +1,5 @@
 export const getRootNode = () => {
-  return document.querySelector(__NAME__)?.shadowRoot?.querySelector('#app') || document.body
+  return document.querySelector(__NAME__)?.shadowRoot?.querySelector('#root') || document.body
 }
 
 export default getRootNode