update pay function

2025-11-22 08:57:37 +08:00
parent 990ca3663e
commit e778742590
210 changed files with 8236 additions and 5345 deletions
--- a/src/views/AgentChat/neuratalk/components/ModalSettings/index.tsx
+++ b/src/views/AgentChat/neuratalk/components/ModalSettings/index.tsx
@@ -0,0 +1,90 @@
+import { useState } from "react";
+import Modal from "@/components/Modal";
+import Icon from "@/components/Icon";
+import General from "./General";
+import Notifications from "./Notifications";
+import Speech from "./Speech";
+import Theme from "./Theme";
+import Security from "./Security";
+import DataControls from "./DataControls";
+
+import { menu } from "./menu";
+
+type Props = {
+    open: boolean;
+    onClose: () => void;
+};
+
+const Settings = ({ open, onClose }: Props) => {
+    const [activeId, setActiveId] = useState(0);
+
+    return (
+        <>
+            <Modal
+                classWrapper="flex flex-col max-w-199.5 min-h-180 max-md:min-h-[calc(100svh-6rem)]"
+                open={open}
+                onClose={onClose}
+            >
+                <div className="mb-4.5 pb-2 border-b border-stroke-soft-200 max-md:mb-3">
+                    <div className="text-label-xl max-md:text-label-lg">
+                        Settings
+                    </div>
+                    <div className="mt-2 text-label-md text-sub-600 max-md:hidden">
+                        People with link will be able to view conversations and
+                        ideas in this board.Changes you make after creating the
+                        link will remain private.
+                    </div>
+                </div>
+                <div className="flex grow max-md:block">
+                    <div className="flex flex-col gap-2 shrink-0 w-50 pr-4 border-r border-stroke-soft-200 max-lg:w-40 max-md:flex-row max-md:gap-4 max-md:w-auto max-md:mb-4 max-md:overflow-auto max-md:scrollbar-none max-md:-mx-4 max-md:px-4 max-md:border-0">
+                        {menu.map((item) => (
+                            <button
+                                className={`group flex items-center gap-2 h-10 transition-colors hover:text-strong-950 max-md:shrink-0 ${
+                                    activeId === item.id
+                                        ? "!text-blue-500"
+                                        : "text-sub-600"
+                                }`}
+                                onClick={() => setActiveId(item.id)}
+                                key={item.id}
+                            >
+                                <Icon
+                                    className={`transition-colors group-hover:fill-strong-950 ${
+                                        activeId === item.id
+                                            ? "!fill-blue-500"
+                                            : "fill-sub-600"
+                                    }`}
+                                    name={item.icon}
+                                />
+                                {item.name}
+                            </button>
+                        ))}
+                    </div>
+                    <div className="grow pl-4 max-md:pl-0">
+                        {menu
+                            .filter((item) => item.id === activeId)
+                            .map((item) => (
+                                <div
+                                    className="flex items-center gap-2.5 mb-8 text-label-lg max-md:hidden"
+                                    key={item.id}
+                                >
+                                    <Icon
+                                        className="!size-7 fill-strong-950"
+                                        name={item.icon}
+                                    />
+                                    {item.name}
+                                </div>
+                            ))}
+                        {activeId === 0 && <General />}
+                        {activeId === 1 && <Notifications />}
+                        {activeId === 2 && <Speech />}
+                        {activeId === 3 && <Theme />}
+                        {activeId === 4 && <Security />}
+                        {activeId === 5 && <DataControls />}
+                    </div>
+                </div>
+            </Modal>
+        </>
+    );
+};
+
+export default Settings;