https://www.hamienet.com/assets/AppearanceSettings-Dla95Hy3.js

1import { r as reactExports, j as jsxRuntimeExports } from "./vendor-react-Bay9Y7Lb.js";
2import { a as api } from "./index-D0Bmh-UX.js";
3import { b9 as Settings, f3 as ToggleRight, f4 as ToggleLeft, ch as Database } from "./vendor-dVNaLJx_.js";
4import "./vendor-i18n-R-bMoYp_.js";
5const AppearanceSettings = ({ activeRole }) => {
6  const [uiConfig, setUiConfig] = reactExports.useState({
7    enableLanguageSelector: true,
8    enableCurrencySelector: true,
9    enableAppearanceSelector: true
10  });
11  const [isSaving, setIsSaving] = reactExports.useState(false);
12  reactExports.useEffect(() => {
13    const fetchConfig = async () => {
14      const res = await api.getSystemSetting("ui_config");
15      if (res && res.value) {
16        setUiConfig(res.value);
17      }
18    };
19    fetchConfig();
20  }, []);
21  const toggleFeature = async (key) => {
22    setIsSaving(true);
23    const newConfig = { ...uiConfig, [key]: !uiConfig[key] };
24    setUiConfig(newConfig);
25    await api.saveSystemSetting("ui_config", newConfig);
26    setIsSaving(false);
27  };
28  const DevDebugInfo = ({ table, keyName, value }) => {
29    if (!(activeRole == null ? void 0 : activeRole.isSuperAdmin)) return null;
30    return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "mt-1 p-2 bg-zinc-100 dark:bg-zinc-950 border border-dashed border-zinc-300 dark:border-zinc-800 rounded text-[10px] font-mono text-zinc-500 overflow-hidden", children: [

31      /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex gap-2 items-center mb-0.5", children: [
32        /* @__PURE__ */ jsxRuntimeExports.jsxs("span", { className: "text-indigo-600 dark:text-indigo-400 font-bold flex items-center gap-1", children: [
33          /* @__PURE__ */ jsxRuntimeExports.jsx(Database, { size: 8 }),
34          " ",
35          table
36        ] }),
37        /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "text-zinc-400", children: "|" }),
38        /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "text-zinc-600 dark:text-zinc-400", children: keyName })
39      ] }),
40      value !== void 0 && /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "text-emerald-600 dark:text-emerald-500 truncate font-medium", children: [
41        "VAL: ",
42        String(value)
43      ] })
44    ] });
45  };
46  return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "space-y-6", children: [
47    /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "bg-indigo-50 dark:bg-indigo-900/20 p-4 rounded-xl border border-indigo-100 dark:border-indigo-800", children: [

48      /* @__PURE__ */ jsxRuntimeExports.jsx("h3", { className: "font-bold text-indigo-900 dark:text-indigo-200 text-sm mb-1", children: "Asset Manager" }),
49      /* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: "text-xs text-indigo-700 dark:text-indigo-300", children: "Manage global styles, logos, and public assets. Changes here reflect immediately on the frontend in Mock Mode." })
50    ] }),
51    /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "bg-white dark:bg-zinc-900 border border-zinc-200 dark:border-zinc-800 rounded-xl p-6 shadow-sm", children: [
52      /* @__PURE__ */ jsxRuntimeExports.jsxs("h3", { className: "font-bold text-zinc-900 dark:text-white text-sm mb-4 flex items-center gap-2", children: [
53        /* @__PURE__ */ jsxRuntimeExports.jsx(Settings, { size: 16 }),
54        " Interface Controls"
55      ] }),
56      /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "space-y-4", children: [
57        /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "p-3 bg-zinc-50 dark:bg-zinc-800/50 rounded-lg border border-zinc-100 dark:border-zinc-800", children: [

58          /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex items-center justify-between mb-1", children: [
59            /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { children: [
60              /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "text-sm font-bold text-zinc-800 dark:text-zinc-200", children: "Language Selector" }),
61              /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "text-xs text-zinc-500", children: "Allow users to change interface language" })
62            ] }),
63            /* @__PURE__ */ jsxRuntimeExports.jsx(
64              "button",
65              {
66                onClick: () => toggleFeature("enableLanguageSelector"),
67                disabled: isSaving,
68                className: `p-1.5 rounded transition-colors ${uiConfig.enableLanguageSelector ? "text-emerald-500 hover:bg-emerald-50 dark:hover:bg-emerald-900/20" : "text-zinc-400 hover:text-zinc-600"}`,
69                children: uiConfig.enableLanguageSelector ? /* @__PURE__ */ jsxRuntimeExports.jsx(ToggleRight, { size: 28 }) : /* @__PURE__ */ jsxRuntimeExports.jsx(ToggleLeft, { size: 28 })
70              }
71            )
72          ] }),

73          /* @__PURE__ */ jsxRuntimeExports.jsx(DevDebugInfo, { table: "SystemSetting", keyName: "ui_config.enableLanguageSelector", value: uiConfig.enableLanguageSelector })
74        ] }),
75        /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "p-3 bg-zinc-50 dark:bg-zinc-800/50 rounded-lg border border-zinc-100 dark:border-zinc-800", children: [
76          /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex items-center justify-between mb-1", children: [
77            /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { children: [
78              /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "text-sm font-bold text-zinc-800 dark:text-zinc-200", children: "Currency Selector" }),
79              /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "text-xs text-zinc-500", children: "Allow users to change display currency" })
80            ] }),
81            /* @__PURE__ */ jsxRuntimeExports.jsx(
82              "button",
83              {
84                onClick: () => toggleFeature("enableCurrencySelector"),
85                disabled: isSaving,
86                className: `p-1.5 rounded transition-colors ${uiConfig.enableCurrencySelector ? "text-emerald-500 hover:bg-emerald-50 dark:hover:bg-emerald-900/20" : "text-zinc-400 hover:text-zinc-600"}`,
87                children: uiConfig.enableCurrencySelector ? /* @__PURE__ */ jsxRuntimeExports.jsx(ToggleRight, { size: 28 }) : /* @__PURE__ */ jsxRuntimeExports.jsx(ToggleLeft, { size: 28 })
88              }
89            )
90          ] }),

91          /* @__PURE__ */ jsxRuntimeExports.jsx(DevDebugInfo, { table: "SystemSetting", keyName: "ui_config.enableCurrencySelector", value: uiConfig.enableCurrencySelector })
92        ] }),
93        /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "p-3 bg-zinc-50 dark:bg-zinc-800/50 rounded-lg border border-zinc-100 dark:border-zinc-800", children: [
94          /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex items-center justify-between mb-1", children: [
95            /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { children: [
96              /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "text-sm font-bold text-zinc-800 dark:text-zinc-200", children: "Appearance Selector" }),
97              /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "text-xs text-zinc-500", children: "Allow users to switch between Light, Dark, and Fun modes" })
98            ] }),
99            /* @__PURE__ */ jsxRuntimeExports.jsx(
100              "button",
101              {
102                onClick: () => toggleFeature("enableAppearanceSelector"),
103                disabled: isSaving,
104                className: `p-1.5 rounded transition-colors ${uiConfig.enableAppearanceSelector ? "text-emerald-500 hover:bg-emerald-50 dark:hover:bg-emerald-900/20" : "text-zinc-400 hover:text-zinc-600"}`,
105                children: uiConfig.enableAppearanceSelector ? /* @__PURE__ */ jsxRuntimeExports.jsx(ToggleRight, { size: 28 }) : /* @__PURE__ */ jsxRuntimeExports.jsx(ToggleLeft, { size: 28 })
106              }
107            )
108          ] }),

109          /* @__PURE__ */ jsxRuntimeExports.jsx(DevDebugInfo, { table: "SystemSetting", keyName: "ui_config.enableAppearanceSelector", value: uiConfig.enableAppearanceSelector })
110        ] })
111      ] })
112    ] })
113  ] });
114};
115export {
116  AppearanceSettings as default
117};