Enhance chat handling.

src/shared/components/ManualConfigModal.js

@@ -0,0 +1,46 @@
+"use client";
+
+import { useState } from "react";
+import Modal from "./Modal";
+import Button from "./Button";
+
+export default function ManualConfigModal({ isOpen, onClose, title = "Manual Configuration", configs = [] }) {
+  const [copiedIndex, setCopiedIndex] = useState(null);
+
+  const copyToClipboard = async (text, index) => {
+    try {
+      await navigator.clipboard.writeText(text);
+      setCopiedIndex(index);
+      setTimeout(() => setCopiedIndex(null), 2000);
+    } catch (err) {
+      console.log("Failed to copy:", err);
+    }
+  };
+
+  return (
+    <Modal isOpen={isOpen} onClose={onClose} title={title} size="xl">
+      <div className="flex flex-col gap-4">
+        {configs.map((config, index) => (
+          <div key={index} className="flex flex-col gap-2">
+            <div className="flex items-center justify-between">
+              <span className="text-sm font-medium text-text-main">{config.filename}</span>
+              <Button
+                variant="ghost"
+                size="sm"
+                onClick={() => copyToClipboard(config.content, index)}
+              >
+                <span className="material-symbols-outlined text-[14px] mr-1">
+                  {copiedIndex === index ? "check" : "content_copy"}
+                </span>
+                {copiedIndex === index ? "Copied!" : "Copy"}
+              </Button>
+            </div>
+            <pre className="px-3 py-2 bg-black/5 dark:bg-white/5 rounded font-mono text-xs overflow-x-auto whitespace-pre-wrap break-all max-h-60 overflow-y-auto border border-border">
+              {config.content}
+            </pre>
+          </div>
+        ))}
+      </div>
+    </Modal>
+  );
+}

src/shared/components/index.js

@@ -15,6 +15,7 @@ export { default as Header } from "./Header";
 export { default as Footer } from "./Footer";
 export { default as OAuthModal } from "./OAuthModal";
 export { default as ModelSelectModal } from "./ModelSelectModal";
+export { default as ManualConfigModal } from "./ManualConfigModal";
 export { default as UsageStats } from "./UsageStats";
 export { default as RequestLogger } from "./RequestLogger";