pref: simplified AI provider's settings

2025-09-28 17:34:47 +08:00
parent 5ec38df940
commit f2df793afa
39 changed files with 265 additions and 755 deletions
--- a/app/components/header/ChatDescription.client.tsx
+++ b/app/components/header/ChatDescription.client.tsx
@@ -0,0 +1,85 @@
+import { useStore } from '@nanostores/react';
+import { TooltipProvider } from '@radix-ui/react-tooltip';
+import { useEffect } from 'react';
+import WithTooltip from '~/components/ui/Tooltip';
+import { useEditChatDescription } from '~/lib/hooks';
+import { useChatHistory } from '~/lib/hooks/useChatHistory';
+import { webBuilderStore } from '~/lib/stores/web-builder';
+
+export function ChatDescription() {
+  const { getChatLatestDescription } = useChatHistory();
+  const description = useStore(webBuilderStore.chatStore.description);
+
+  const {
+    editing,
+    handleChange,
+    handleBlur,
+    handleSubmit,
+    handleKeyDown,
+    currentDescription,
+    toggleEditMode,
+    setCurrentDescription,
+    updateChatDescription,
+  } = useEditChatDescription({
+    initialDescription: getChatLatestDescription() || '',
+  });
+
+  useEffect(() => {
+    if (!currentDescription && description) {
+      setCurrentDescription(description);
+      updateChatDescription(description);
+    }
+  }, [description]);
+
+  if (!currentDescription) {
+    return null;
+  }
+
+  return (
+    <div className="flex items-center justify-center">
+      {editing ? (
+        <form onSubmit={handleSubmit} className="flex items-center justify-center">
+          <input
+            type="text"
+            className="bg-upage-elements-background-depth-1 text-upage-elements-textPrimary rounded px-2 py-0.5 mr-2 focus:outline-none focus:ring-1 focus:ring-upage-elements-ring"
+            autoFocus
+            value={currentDescription}
+            onChange={handleChange}
+            onBlur={handleBlur}
+            onKeyDown={handleKeyDown}
+            style={{ width: `${Math.max(currentDescription?.length * 9 || 0, 180)}px` }}
+          />
+          <TooltipProvider>
+            <WithTooltip tooltip="保存标题">
+              <div className="flex justify-between items-center p-2 rounded-md bg-upage-elements-item-backgroundAccent">
+                <button
+                  type="submit"
+                  className="i-ph:check-bold scale-110 hover:text-upage-elements-item-contentAccent"
+                  onMouseDown={handleSubmit}
+                />
+              </div>
+            </WithTooltip>
+          </TooltipProvider>
+        </form>
+      ) : (
+        <>
+          {currentDescription}
+          <TooltipProvider>
+            <WithTooltip tooltip="重命名聊天">
+              <div className="flex justify-between items-center p-2 rounded-md bg-upage-elements-item-backgroundAccent ml-2">
+                <button
+                  type="button"
+                  className="i-ph:pencil-fill scale-110 hover:text-upage-elements-item-contentAccent"
+                  onClick={(event) => {
+                    event.preventDefault();
+                    toggleEditMode();
+                  }}
+                />
+              </div>
+            </WithTooltip>
+          </TooltipProvider>
+        </>
+      )}
+    </div>
+  );
+}