WIP

Signed-off-by: Noa Virellia <noa@requiem.garden>

client/cms/eslint.config.js

@@ -3,7 +3,7 @@ import pluginQuery from '@tanstack/eslint-plugin-query';
 
 export default antfu({
   gitignore: true,
-  ignores: ['**/node_modules/**', '**/dist/**', 'bun.lock', '**/routeTree.gen.ts', '**/ui/**'],
+  ignores: ['**/node_modules/**', '**/dist/**', 'bun.lock', '**/routeTree.gen.ts', '**/ui/**', 'src/components/editor/**/*'],
   react: true,
   stylistic: {
     semi: true,

client/cms/src/components/profile/edit-bio-dialog.tsx

@@ -0,0 +1,33 @@
+import { Pencil } from 'lucide-react';
+import { PlateEditor } from '@/components/editor/plate-editor';
+import { Button } from '@/components/ui/button';
+import {
+  Dialog,
+  DialogClose,
+  DialogContent,
+  DialogFooter,
+  DialogTrigger,
+} from '@/components/ui/dialog';
+
+export function EditBioDialog() {
+  return (
+    <Dialog>
+      <DialogTrigger asChild>
+        <Button className="absolute top-4 right-4" size="icon-sm" variant="outline">
+          <Pencil />
+        </Button>
+      </DialogTrigger>
+      <DialogContent className="sm:max-w-[425px] max-h-128">
+        <PlateEditor />
+        <DialogFooter>
+          <DialogClose asChild>
+            <Button variant="outline">取消</Button>
+          </DialogClose>
+          <DialogClose asChild>
+            <Button type="submit">保存</Button>
+          </DialogClose>
+        </DialogFooter>
+      </DialogContent>
+    </Dialog>
+  );
+}

client/cms/src/components/profile/main-profile.tsx

@@ -3,6 +3,7 @@ import Markdown from 'react-markdown';
 import { Avatar, AvatarFallback, AvatarImage } from '@/components/ui/avatar';
 import { useUserInfo } from '@/hooks/data/useUserInfo';
 import { base64ToUtf8 } from '@/lib/utils';
+import { EditBioDialog } from './edit-bio-dialog';
 import { EditProfileDialog } from './edit-profile-dialog';
 
 export function MainProfile() {
@@ -30,9 +31,10 @@ export function MainProfile() {
           <EditProfileDialog />
         </div>
       </div>
-      <section className="rounded-md border border-muted w-full flex-1 lg:flex-auto min-h-72 lg:h-full mt-4 lg:mt-0 p-6 prose dark:prose-invert max-w-[1012px] self-center">
+      <section className="relative rounded-md border border-muted w-full flex-1 lg:flex-auto min-h-72 lg:h-full mt-4 lg:mt-0 p-6 prose dark:prose-invert max-w-[1012px] self-center">
         {/* Bio */}
         <Markdown>{base64ToUtf8(user.bio)}</Markdown>
+        <EditBioDialog />
       </section>
     </div>
   );