@devtable/settings-form 5.3.0 → 5.5.0-alpha

package/dist/settings-form.es.js

@@ -1,39 +1,45 @@
-import { Modal as we, Button as q, Box as N, SegmentedControl as jr, TextInput as F, Divider as Be, Group as L, NumberInput as kr, PasswordInput as ie, Text as be, LoadingOverlay as Ge, Table as He, Stack as Fr, Select as Lr, Switch as qr } from "@mantine/core";
-import { showNotification as V, updateNotification as A } from "@mantine/notifications";
-import Q, { forwardRef as Je, useMemo as Ir } from "react";
-import { useForm as oe, Controller as T } from "react-hook-form";
-import { PlaylistAdd as Xe, Trash as Ke, Edit as Ur } from "tabler-icons-react";
+import { Modal as oe, Button as D, Box as L, SegmentedControl as qr, TextInput as I, Divider as er, Group as j, NumberInput as Lr, PasswordInput as se, Text as ye, LoadingOverlay as _e, Table as Pe, Stack as rr, Select as Nr, Switch as Ur } from "@mantine/core";
+import { showNotification as M, updateNotification as A } from "@mantine/notifications";
+import H, { forwardRef as tr, useMemo as nr } from "react";
+import { useForm as ee, Controller as P } from "react-hook-form";
+import { PlaylistAdd as Ee, Trash as Ce, Edit as Mr } from "tabler-icons-react";
 import $r from "axios";
-import { useRequest as ae } from "ahooks";
-import { useModals as Qe } from "@mantine/modals";
-const y = {
+import { useRequest as G } from "ahooks";
+import { useModals as ce, closeAllModals as Wr } from "@mantine/modals";
+const C = {
   baseURL: "http://localhost:31200",
-  getRequest(a) {
-    return (n, s, c = {}) => {
-      const d = window.localStorage.getItem("token"), o = {
+  apiKey: "",
+  getRequest(t) {
+    return (a, s, c = {}) => {
+      const u = window.localStorage.getItem("token"), i = {
         "X-Requested-With": "XMLHttpRequest",
         "Content-Type": c.string ? "application/x-www-form-urlencoded" : "application/json",
-        authorization: d ? `bearer ${d}` : "",
+        authorization: u ? `bearer ${u}` : "",
+        "x-api-key": this.apiKey,
         ...c.headers
-      }, u = {
+      }, l = {
         baseURL: this.baseURL,
-        method: a,
-        url: n,
-        params: a === "GET" ? s : c.params,
-        headers: o
+        method: t,
+        url: a,
+        params: t === "GET" ? s : c.params,
+        headers: i
       };
-      return ["POST", "PUT"].includes(a) && (u.data = c.string ? JSON.stringify(s) : s), $r(u).then((f) => f.data).catch((f) => Promise.reject(f));
+      return ["POST", "PUT"].includes(t) && (l.data = c.string ? JSON.stringify(s) : s), $r(l).then((f) => f.data).catch((f) => Promise.reject(f));
     };
   }
-}, Nr = {
-  login: async (a, n) => {
+};
+function le(t) {
+  C.baseURL !== t.apiBaseURL && (C.baseURL = t.apiBaseURL), t.apiKey && (C.apiKey = t.apiKey);
+}
+const Kr = {
+  login: async (t, a) => {
     const s = {
-      name: a,
-      password: n
+      name: t,
+      password: a
     };
-    return await y.getRequest("POST")("/account/login", s);
+    return await C.getRequest("POST")("/account/login", s);
   },
-  list: async () => await y.getRequest("POST")("/account/list", {
+  list: async () => await C.getRequest("POST")("/account/list", {
     filter: {
       search: ""
     },
@@ -46,34 +52,57 @@ const y = {
       pagesize: 100
     }
   }),
-  get: async () => await y.getRequest("GET")("/account/get", {}),
-  update: async (a, n) => {
+  get: async () => await C.getRequest("GET")("/account/get", {}),
+  update: async (t, a) => {
     const s = {
-      name: a,
-      email: n
+      name: t,
+      email: a
     };
-    return await y.getRequest("PUT")("/account/update", s);
+    return await C.getRequest("PUT")("/account/update", s);
   },
-  changepassword: async (a, n) => {
+  changepassword: async (t, a) => {
     const s = {
-      old_password: a,
-      new_password: n
+      old_password: t,
+      new_password: a
     };
-    return await y.getRequest("POST")("/account/changepassword", s);
+    return await C.getRequest("POST")("/account/changepassword", s);
   },
-  create: async (a, n, s, c) => await y.getRequest("POST")("/account/create", {
-    name: a,
-    email: n,
+  create: async (t, a, s, c) => await C.getRequest("POST")("/account/create", {
+    name: t,
+    email: a,
     password: s,
     role_id: c
   }),
-  edit: async (a) => (a.reset_password || (a.new_password = void 0), await y.getRequest("PUT")("/account/edit", a)),
-  delete: async (a) => {
-    if (!!a)
-      return y.getRequest("POST")("/account/delete", { id: a });
+  edit: async (t) => (t.reset_password || (t.new_password = void 0), await C.getRequest("PUT")("/account/edit", t)),
+  delete: async (t) => {
+    if (!!t)
+      return C.getRequest("POST")("/account/delete", { id: t });
+  }
+}, Vr = {
+  list: async () => await C.getRequest("POST")("/api/key/list", {
+    filter: {
+      search: ""
+    },
+    sort: {
+      field: "name",
+      order: "ASC"
+    },
+    pagination: {
+      page: 1,
+      pagesize: 100
+    }
+  }),
+  create: async (t, a, s) => await C.getRequest("POST")("/api/key/create", {
+    name: t,
+    role_id: a,
+    domain: s
+  }),
+  delete: async (t) => {
+    if (!!t)
+      return C.getRequest("POST")("/api/key/delete", { id: t });
   }
-}, Wr = {
-  list: async () => await y.getRequest("POST")("/datasource/list", {
+}, Yr = {
+  list: async () => await C.getRequest("POST")("/datasource/list", {
     filter: {},
     sort: {
       field: "create_time",
@@ -84,30 +113,31 @@ const y = {
       pagesize: 100
     }
   }),
-  create: async (a, n, s) => {
+  create: async (t, a, s) => {
     try {
-      return await y.getRequest("POST")("/datasource/create", { type: a, key: n, config: s });
+      return await C.getRequest("POST")("/datasource/create", { type: t, key: a, config: s });
     } catch (c) {
       return console.error(c), !1;
     }
   },
-  delete: async (a) => {
-    await y.getRequest("POST")("/datasource/delete", { id: a });
+  delete: async (t) => {
+    await C.getRequest("POST")("/datasource/delete", { id: t });
   }
-}, Mr = {
-  list: async () => await y.getRequest("GET")("/role/list", {})
-}, D = {
-  datasource: Wr,
-  account: Nr,
-  role: Mr
-}, se = {
+}, Br = {
+  list: async () => await C.getRequest("GET")("/role/list", {})
+}, x = {
+  datasource: Yr,
+  account: Kr,
+  role: Br,
+  api_key: Vr
+}, ue = {
   size: "sm",
   spacing: "md",
   button: {
     size: "xs"
   }
 };
-var ce = { exports: {} }, X = {};
+var de = { exports: {} }, Q = {};
 /**
  * @license React
  * react-jsx-runtime.production.min.js
@@ -117,25 +147,25 @@ var ce = { exports: {} }, X = {};
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
  */
-var Ye;
-function Yr() {
-  if (Ye)
-    return X;
-  Ye = 1;
-  var a = Q, n = Symbol.for("react.element"), s = Symbol.for("react.fragment"), c = Object.prototype.hasOwnProperty, d = a.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED.ReactCurrentOwner, o = { key: !0, ref: !0, __self: !0, __source: !0 };
-  function u(f, b, O) {
-    var S, w = {}, g = null, x = null;
-    O !== void 0 && (g = "" + O), b.key !== void 0 && (g = "" + b.key), b.ref !== void 0 && (x = b.ref);
-    for (S in b)
-      c.call(b, S) && !o.hasOwnProperty(S) && (w[S] = b[S]);
+var Qe;
+function Gr() {
+  if (Qe)
+    return Q;
+  Qe = 1;
+  var t = H, a = Symbol.for("react.element"), s = Symbol.for("react.fragment"), c = Object.prototype.hasOwnProperty, u = t.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED.ReactCurrentOwner, i = { key: !0, ref: !0, __self: !0, __source: !0 };
+  function l(f, v, R) {
+    var y, h = {}, d = null, O = null;
+    R !== void 0 && (d = "" + R), v.key !== void 0 && (d = "" + v.key), v.ref !== void 0 && (O = v.ref);
+    for (y in v)
+      c.call(v, y) && !i.hasOwnProperty(y) && (h[y] = v[y]);
     if (f && f.defaultProps)
-      for (S in b = f.defaultProps, b)
-        w[S] === void 0 && (w[S] = b[S]);
-    return { $$typeof: n, type: f, key: g, ref: x, props: w, _owner: d.current };
+      for (y in v = f.defaultProps, v)
+        h[y] === void 0 && (h[y] = v[y]);
+    return { $$typeof: a, type: f, key: d, ref: O, props: h, _owner: u.current };
   }
-  return X.Fragment = s, X.jsx = u, X.jsxs = u, X;
+  return Q.Fragment = s, Q.jsx = l, Q.jsxs = l, Q;
 }
-var K = {};
+var Z = {};
 /**
  * @license React
  * react-jsx-runtime.development.js
@@ -145,53 +175,53 @@ var K = {};
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
  */
-var Ve;
-function Vr() {
-  return Ve || (Ve = 1, process.env.NODE_ENV !== "production" && function() {
-    var a = Q, n = Symbol.for("react.element"), s = Symbol.for("react.portal"), c = Symbol.for("react.fragment"), d = Symbol.for("react.strict_mode"), o = Symbol.for("react.profiler"), u = Symbol.for("react.provider"), f = Symbol.for("react.context"), b = Symbol.for("react.forward_ref"), O = Symbol.for("react.suspense"), S = Symbol.for("react.suspense_list"), w = Symbol.for("react.memo"), g = Symbol.for("react.lazy"), x = Symbol.for("react.offscreen"), W = Symbol.iterator, G = "@@iterator";
-    function le(e) {
+var Ze;
+function Hr() {
+  return Ze || (Ze = 1, process.env.NODE_ENV !== "production" && function() {
+    var t = H, a = Symbol.for("react.element"), s = Symbol.for("react.portal"), c = Symbol.for("react.fragment"), u = Symbol.for("react.strict_mode"), i = Symbol.for("react.profiler"), l = Symbol.for("react.provider"), f = Symbol.for("react.context"), v = Symbol.for("react.forward_ref"), R = Symbol.for("react.suspense"), y = Symbol.for("react.suspense_list"), h = Symbol.for("react.memo"), d = Symbol.for("react.lazy"), O = Symbol.for("react.offscreen"), N = Symbol.iterator, K = "@@iterator";
+    function pe(e) {
       if (e === null || typeof e != "object")
         return null;
-      var t = W && e[W] || e[G];
-      return typeof t == "function" ? t : null;
+      var n = N && e[N] || e[K];
+      return typeof n == "function" ? n : null;
     }
-    var I = a.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED;
-    function P(e) {
+    var U = t.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED;
+    function T(e) {
       {
-        for (var t = arguments.length, i = new Array(t > 1 ? t - 1 : 0), l = 1; l < t; l++)
-          i[l - 1] = arguments[l];
-        er("error", e, i);
+        for (var n = arguments.length, o = new Array(n > 1 ? n - 1 : 0), p = 1; p < n; p++)
+          o[p - 1] = arguments[p];
+        ar("error", e, o);
       }
     }
-    function er(e, t, i) {
+    function ar(e, n, o) {
       {
-        var l = I.ReactDebugCurrentFrame, h = l.getStackAddendum();
-        h !== "" && (t += "%s", i = i.concat([h]));
-        var v = i.map(function(m) {
+        var p = U.ReactDebugCurrentFrame, b = p.getStackAddendum();
+        b !== "" && (n += "%s", o = o.concat([b]));
+        var S = o.map(function(m) {
           return String(m);
         });
-        v.unshift("Warning: " + t), Function.prototype.apply.call(console[e], console, v);
+        S.unshift("Warning: " + n), Function.prototype.apply.call(console[e], console, S);
       }
     }
-    var rr = !1, tr = !1, nr = !1, ar = !1, ir = !1, Re;
-    Re = Symbol.for("react.module.reference");
-    function or(e) {
-      return !!(typeof e == "string" || typeof e == "function" || e === c || e === o || ir || e === d || e === O || e === S || ar || e === x || rr || tr || nr || typeof e == "object" && e !== null && (e.$$typeof === g || e.$$typeof === w || e.$$typeof === u || e.$$typeof === f || e.$$typeof === b || e.$$typeof === Re || e.getModuleId !== void 0));
+    var ir = !1, or = !1, sr = !1, cr = !1, lr = !1, ze;
+    ze = Symbol.for("react.module.reference");
+    function ur(e) {
+      return !!(typeof e == "string" || typeof e == "function" || e === c || e === i || lr || e === u || e === R || e === y || cr || e === O || ir || or || sr || typeof e == "object" && e !== null && (e.$$typeof === d || e.$$typeof === h || e.$$typeof === l || e.$$typeof === f || e.$$typeof === v || e.$$typeof === ze || e.getModuleId !== void 0));
     }
-    function sr(e, t, i) {
-      var l = e.displayName;
-      if (l)
-        return l;
-      var h = t.displayName || t.name || "";
-      return h !== "" ? i + "(" + h + ")" : i;
+    function dr(e, n, o) {
+      var p = e.displayName;
+      if (p)
+        return p;
+      var b = n.displayName || n.name || "";
+      return b !== "" ? o + "(" + b + ")" : o;
     }
-    function Se(e) {
+    function Ae(e) {
       return e.displayName || "Context";
     }
-    function j(e) {
+    function F(e) {
       if (e == null)
         return null;
-      if (typeof e.tag == "number" && P("Received an unexpected object in getComponentNameFromType(). This is likely a bug in React. Please file an issue."), typeof e == "function")
+      if (typeof e.tag == "number" && T("Received an unexpected object in getComponentNameFromType(). This is likely a bug in React. Please file an issue."), typeof e == "function")
         return e.displayName || e.name || null;
       if (typeof e == "string")
         return e;
@@ -200,32 +230,32 @@ function Vr() {
           return "Fragment";
         case s:
           return "Portal";
-        case o:
+        case i:
           return "Profiler";
-        case d:
+        case u:
           return "StrictMode";
-        case O:
+        case R:
           return "Suspense";
-        case S:
+        case y:
           return "SuspenseList";
       }
       if (typeof e == "object")
         switch (e.$$typeof) {
           case f:
-            var t = e;
-            return Se(t) + ".Consumer";
-          case u:
-            var i = e;
-            return Se(i._context) + ".Provider";
-          case b:
-            return sr(e, e.render, "ForwardRef");
-          case w:
-            var l = e.displayName || null;
-            return l !== null ? l : j(e.type) || "Memo";
-          case g: {
-            var h = e, v = h._payload, m = h._init;
+            var n = e;
+            return Ae(n) + ".Consumer";
+          case l:
+            var o = e;
+            return Ae(o._context) + ".Provider";
+          case v:
+            return dr(e, e.render, "ForwardRef");
+          case h:
+            var p = e.displayName || null;
+            return p !== null ? p : F(e.type) || "Memo";
+          case d: {
+            var b = e, S = b._payload, m = b._init;
             try {
-              return j(m(v));
+              return F(m(S));
             } catch {
               return null;
             }
@@ -233,18 +263,18 @@ function Vr() {
         }
       return null;
     }
-    var $ = Object.assign, H = 0, _e, Ee, ye, Te, Pe, Ce, Oe;
-    function ze() {
+    var V = Object.assign, J = 0, Oe, xe, De, ke, Ie, je, Fe;
+    function qe() {
     }
-    ze.__reactDisabledLog = !0;
-    function cr() {
+    qe.__reactDisabledLog = !0;
+    function fr() {
       {
-        if (H === 0) {
-          _e = console.log, Ee = console.info, ye = console.warn, Te = console.error, Pe = console.group, Ce = console.groupCollapsed, Oe = console.groupEnd;
+        if (J === 0) {
+          Oe = console.log, xe = console.info, De = console.warn, ke = console.error, Ie = console.group, je = console.groupCollapsed, Fe = console.groupEnd;
           var e = {
             configurable: !0,
             enumerable: !0,
-            value: ze,
+            value: qe,
             writable: !0
           };
           Object.defineProperties(console, {
@@ -257,79 +287,79 @@ function Vr() {
             groupEnd: e
           });
         }
-        H++;
+        J++;
       }
     }
-    function lr() {
+    function pr() {
       {
-        if (H--, H === 0) {
+        if (J--, J === 0) {
           var e = {
             configurable: !0,
             enumerable: !0,
             writable: !0
           };
           Object.defineProperties(console, {
-            log: $({}, e, {
-              value: _e
+            log: V({}, e, {
+              value: Oe
             }),
-            info: $({}, e, {
-              value: Ee
+            info: V({}, e, {
+              value: xe
             }),
-            warn: $({}, e, {
-              value: ye
+            warn: V({}, e, {
+              value: De
             }),
-            error: $({}, e, {
-              value: Te
+            error: V({}, e, {
+              value: ke
             }),
-            group: $({}, e, {
-              value: Pe
+            group: V({}, e, {
+              value: Ie
             }),
-            groupCollapsed: $({}, e, {
-              value: Ce
+            groupCollapsed: V({}, e, {
+              value: je
             }),
-            groupEnd: $({}, e, {
-              value: Oe
+            groupEnd: V({}, e, {
+              value: Fe
             })
           });
         }
-        H < 0 && P("disabledDepth fell below zero. This is a bug in React. Please file an issue.");
+        J < 0 && T("disabledDepth fell below zero. This is a bug in React. Please file an issue.");
       }
     }
-    var ue = I.ReactCurrentDispatcher, de;
-    function Z(e, t, i) {
+    var ge = U.ReactCurrentDispatcher, me;
+    function re(e, n, o) {
       {
-        if (de === void 0)
+        if (me === void 0)
           try {
             throw Error();
-          } catch (h) {
-            var l = h.stack.trim().match(/\n( *(at )?)/);
-            de = l && l[1] || "";
+          } catch (b) {
+            var p = b.stack.trim().match(/\n( *(at )?)/);
+            me = p && p[1] || "";
           }
         return `
-` + de + e;
+` + me + e;
       }
     }
-    var fe = !1, ee;
+    var he = !1, te;
     {
-      var ur = typeof WeakMap == "function" ? WeakMap : Map;
-      ee = new ur();
+      var gr = typeof WeakMap == "function" ? WeakMap : Map;
+      te = new gr();
     }
-    function xe(e, t) {
-      if (!e || fe)
+    function Le(e, n) {
+      if (!e || he)
         return "";
       {
-        var i = ee.get(e);
-        if (i !== void 0)
-          return i;
+        var o = te.get(e);
+        if (o !== void 0)
+          return o;
       }
-      var l;
-      fe = !0;
-      var h = Error.prepareStackTrace;
+      var p;
+      he = !0;
+      var b = Error.prepareStackTrace;
       Error.prepareStackTrace = void 0;
-      var v;
-      v = ue.current, ue.current = null, cr();
+      var S;
+      S = ge.current, ge.current = null, fr();
       try {
-        if (t) {
+        if (n) {
           var m = function() {
             throw Error();
           };
@@ -340,250 +370,250 @@ function Vr() {
           }), typeof Reflect == "object" && Reflect.construct) {
             try {
               Reflect.construct(m, []);
-            } catch (k) {
-              l = k;
+            } catch (q) {
+              p = q;
             }
             Reflect.construct(e, [], m);
           } else {
             try {
               m.call();
-            } catch (k) {
-              l = k;
+            } catch (q) {
+              p = q;
             }
             e.call(m.prototype);
           }
         } else {
           try {
             throw Error();
-          } catch (k) {
-            l = k;
+          } catch (q) {
+            p = q;
           }
           e();
         }
-      } catch (k) {
-        if (k && l && typeof k.stack == "string") {
-          for (var p = k.stack.split(`
-`), C = l.stack.split(`
-`), R = p.length - 1, _ = C.length - 1; R >= 1 && _ >= 0 && p[R] !== C[_]; )
-            _--;
-          for (; R >= 1 && _ >= 0; R--, _--)
-            if (p[R] !== C[_]) {
-              if (R !== 1 || _ !== 1)
+      } catch (q) {
+        if (q && p && typeof q.stack == "string") {
+          for (var g = q.stack.split(`
+`), z = p.stack.split(`
+`), _ = g.length - 1, E = z.length - 1; _ >= 1 && E >= 0 && g[_] !== z[E]; )
+            E--;
+          for (; _ >= 1 && E >= 0; _--, E--)
+            if (g[_] !== z[E]) {
+              if (_ !== 1 || E !== 1)
                 do
-                  if (R--, _--, _ < 0 || p[R] !== C[_]) {
-                    var z = `
-` + p[R].replace(" at new ", " at ");
-                    return e.displayName && z.includes("<anonymous>") && (z = z.replace("<anonymous>", e.displayName)), typeof e == "function" && ee.set(e, z), z;
+                  if (_--, E--, E < 0 || g[_] !== z[E]) {
+                    var k = `
+` + g[_].replace(" at new ", " at ");
+                    return e.displayName && k.includes("<anonymous>") && (k = k.replace("<anonymous>", e.displayName)), typeof e == "function" && te.set(e, k), k;
                   }
-                while (R >= 1 && _ >= 0);
+                while (_ >= 1 && E >= 0);
               break;
             }
         }
       } finally {
-        fe = !1, ue.current = v, lr(), Error.prepareStackTrace = h;
+        he = !1, ge.current = S, pr(), Error.prepareStackTrace = b;
       }
-      var Y = e ? e.displayName || e.name : "", Me = Y ? Z(Y) : "";
-      return typeof e == "function" && ee.set(e, Me), Me;
+      var B = e ? e.displayName || e.name : "", Xe = B ? re(B) : "";
+      return typeof e == "function" && te.set(e, Xe), Xe;
     }
-    function dr(e, t, i) {
-      return xe(e, !1);
+    function mr(e, n, o) {
+      return Le(e, !1);
     }
-    function fr(e) {
-      var t = e.prototype;
-      return !!(t && t.isReactComponent);
+    function hr(e) {
+      var n = e.prototype;
+      return !!(n && n.isReactComponent);
     }
-    function re(e, t, i) {
+    function ne(e, n, o) {
       if (e == null)
         return "";
       if (typeof e == "function")
-        return xe(e, fr(e));
+        return Le(e, hr(e));
       if (typeof e == "string")
-        return Z(e);
+        return re(e);
       switch (e) {
-        case O:
-          return Z("Suspense");
-        case S:
-          return Z("SuspenseList");
+        case R:
+          return re("Suspense");
+        case y:
+          return re("SuspenseList");
       }
       if (typeof e == "object")
         switch (e.$$typeof) {
-          case b:
-            return dr(e.render);
-          case w:
-            return re(e.type, t, i);
-          case g: {
-            var l = e, h = l._payload, v = l._init;
+          case v:
+            return mr(e.render);
+          case h:
+            return ne(e.type, n, o);
+          case d: {
+            var p = e, b = p._payload, S = p._init;
             try {
-              return re(v(h), t, i);
+              return ne(S(b), n, o);
             } catch {
             }
           }
         }
       return "";
     }
-    var te = Object.prototype.hasOwnProperty, Ae = {}, De = I.ReactDebugCurrentFrame;
-    function ne(e) {
+    var ae = Object.prototype.hasOwnProperty, Ne = {}, Ue = U.ReactDebugCurrentFrame;
+    function ie(e) {
       if (e) {
-        var t = e._owner, i = re(e.type, e._source, t ? t.type : null);
-        De.setExtraStackFrame(i);
+        var n = e._owner, o = ne(e.type, e._source, n ? n.type : null);
+        Ue.setExtraStackFrame(o);
       } else
-        De.setExtraStackFrame(null);
+        Ue.setExtraStackFrame(null);
     }
-    function pr(e, t, i, l, h) {
+    function vr(e, n, o, p, b) {
       {
-        var v = Function.call.bind(te);
+        var S = Function.call.bind(ae);
         for (var m in e)
-          if (v(e, m)) {
-            var p = void 0;
+          if (S(e, m)) {
+            var g = void 0;
             try {
               if (typeof e[m] != "function") {
-                var C = Error((l || "React class") + ": " + i + " type `" + m + "` is invalid; it must be a function, usually from the `prop-types` package, but received `" + typeof e[m] + "`.This often happens because of typos such as `PropTypes.function` instead of `PropTypes.func`.");
-                throw C.name = "Invariant Violation", C;
+                var z = Error((p || "React class") + ": " + o + " type `" + m + "` is invalid; it must be a function, usually from the `prop-types` package, but received `" + typeof e[m] + "`.This often happens because of typos such as `PropTypes.function` instead of `PropTypes.func`.");
+                throw z.name = "Invariant Violation", z;
               }
-              p = e[m](t, m, l, i, null, "SECRET_DO_NOT_PASS_THIS_OR_YOU_WILL_BE_FIRED");
-            } catch (R) {
-              p = R;
+              g = e[m](n, m, p, o, null, "SECRET_DO_NOT_PASS_THIS_OR_YOU_WILL_BE_FIRED");
+            } catch (_) {
+              g = _;
             }
-            p && !(p instanceof Error) && (ne(h), P("%s: type specification of %s `%s` is invalid; the type checker function must return `null` or an `Error` but returned a %s. You may have forgotten to pass an argument to the type checker creator (arrayOf, instanceOf, objectOf, oneOf, oneOfType, and shape all require an argument).", l || "React class", i, m, typeof p), ne(null)), p instanceof Error && !(p.message in Ae) && (Ae[p.message] = !0, ne(h), P("Failed %s type: %s", i, p.message), ne(null));
+            g && !(g instanceof Error) && (ie(b), T("%s: type specification of %s `%s` is invalid; the type checker function must return `null` or an `Error` but returned a %s. You may have forgotten to pass an argument to the type checker creator (arrayOf, instanceOf, objectOf, oneOf, oneOfType, and shape all require an argument).", p || "React class", o, m, typeof g), ie(null)), g instanceof Error && !(g.message in Ne) && (Ne[g.message] = !0, ie(b), T("Failed %s type: %s", o, g.message), ie(null));
           }
       }
     }
-    var gr = Array.isArray;
-    function pe(e) {
-      return gr(e);
+    var br = Array.isArray;
+    function ve(e) {
+      return br(e);
     }
-    function mr(e) {
+    function wr(e) {
       {
-        var t = typeof Symbol == "function" && Symbol.toStringTag, i = t && e[Symbol.toStringTag] || e.constructor.name || "Object";
-        return i;
+        var n = typeof Symbol == "function" && Symbol.toStringTag, o = n && e[Symbol.toStringTag] || e.constructor.name || "Object";
+        return o;
       }
     }
-    function hr(e) {
+    function Sr(e) {
       try {
-        return je(e), !1;
+        return Me(e), !1;
       } catch {
         return !0;
       }
     }
-    function je(e) {
+    function Me(e) {
       return "" + e;
     }
-    function ke(e) {
-      if (hr(e))
-        return P("The provided key is an unsupported type %s. This value must be coerced to a string before before using it here.", mr(e)), je(e);
+    function $e(e) {
+      if (Sr(e))
+        return T("The provided key is an unsupported type %s. This value must be coerced to a string before before using it here.", wr(e)), Me(e);
     }
-    var J = I.ReactCurrentOwner, vr = {
+    var X = U.ReactCurrentOwner, Rr = {
       key: !0,
       ref: !0,
       __self: !0,
       __source: !0
-    }, Fe, Le, ge;
-    ge = {};
-    function br(e) {
-      if (te.call(e, "ref")) {
-        var t = Object.getOwnPropertyDescriptor(e, "ref").get;
-        if (t && t.isReactWarning)
+    }, We, Ke, be;
+    be = {};
+    function yr(e) {
+      if (ae.call(e, "ref")) {
+        var n = Object.getOwnPropertyDescriptor(e, "ref").get;
+        if (n && n.isReactWarning)
           return !1;
       }
       return e.ref !== void 0;
     }
-    function wr(e) {
-      if (te.call(e, "key")) {
-        var t = Object.getOwnPropertyDescriptor(e, "key").get;
-        if (t && t.isReactWarning)
+    function _r(e) {
+      if (ae.call(e, "key")) {
+        var n = Object.getOwnPropertyDescriptor(e, "key").get;
+        if (n && n.isReactWarning)
           return !1;
       }
       return e.key !== void 0;
     }
-    function Rr(e, t) {
-      if (typeof e.ref == "string" && J.current && t && J.current.stateNode !== t) {
-        var i = j(J.current.type);
-        ge[i] || (P('Component "%s" contains the string ref "%s". Support for string refs will be removed in a future major release. This case cannot be automatically converted to an arrow function. We ask you to manually fix this case by using useRef() or createRef() instead. Learn more about using refs safely here: https://reactjs.org/link/strict-mode-string-ref', j(J.current.type), e.ref), ge[i] = !0);
+    function Pr(e, n) {
+      if (typeof e.ref == "string" && X.current && n && X.current.stateNode !== n) {
+        var o = F(X.current.type);
+        be[o] || (T('Component "%s" contains the string ref "%s". Support for string refs will be removed in a future major release. This case cannot be automatically converted to an arrow function. We ask you to manually fix this case by using useRef() or createRef() instead. Learn more about using refs safely here: https://reactjs.org/link/strict-mode-string-ref', F(X.current.type), e.ref), be[o] = !0);
       }
     }
-    function Sr(e, t) {
+    function Er(e, n) {
       {
-        var i = function() {
-          Fe || (Fe = !0, P("%s: `key` is not a prop. Trying to access it will result in `undefined` being returned. If you need to access the same value within the child component, you should pass it as a different prop. (https://reactjs.org/link/special-props)", t));
+        var o = function() {
+          We || (We = !0, T("%s: `key` is not a prop. Trying to access it will result in `undefined` being returned. If you need to access the same value within the child component, you should pass it as a different prop. (https://reactjs.org/link/special-props)", n));
         };
-        i.isReactWarning = !0, Object.defineProperty(e, "key", {
-          get: i,
+        o.isReactWarning = !0, Object.defineProperty(e, "key", {
+          get: o,
           configurable: !0
         });
       }
     }
-    function _r(e, t) {
+    function Cr(e, n) {
       {
-        var i = function() {
-          Le || (Le = !0, P("%s: `ref` is not a prop. Trying to access it will result in `undefined` being returned. If you need to access the same value within the child component, you should pass it as a different prop. (https://reactjs.org/link/special-props)", t));
+        var o = function() {
+          Ke || (Ke = !0, T("%s: `ref` is not a prop. Trying to access it will result in `undefined` being returned. If you need to access the same value within the child component, you should pass it as a different prop. (https://reactjs.org/link/special-props)", n));
         };
-        i.isReactWarning = !0, Object.defineProperty(e, "ref", {
-          get: i,
+        o.isReactWarning = !0, Object.defineProperty(e, "ref", {
+          get: o,
           configurable: !0
         });
       }
     }
-    var Er = function(e, t, i, l, h, v, m) {
-      var p = {
-        $$typeof: n,
+    var Tr = function(e, n, o, p, b, S, m) {
+      var g = {
+        $$typeof: a,
         type: e,
-        key: t,
-        ref: i,
+        key: n,
+        ref: o,
         props: m,
-        _owner: v
+        _owner: S
       };
-      return p._store = {}, Object.defineProperty(p._store, "validated", {
+      return g._store = {}, Object.defineProperty(g._store, "validated", {
         configurable: !1,
         enumerable: !1,
         writable: !0,
         value: !1
-      }), Object.defineProperty(p, "_self", {
+      }), Object.defineProperty(g, "_self", {
         configurable: !1,
         enumerable: !1,
         writable: !1,
-        value: l
-      }), Object.defineProperty(p, "_source", {
+        value: p
+      }), Object.defineProperty(g, "_source", {
         configurable: !1,
         enumerable: !1,
         writable: !1,
-        value: h
-      }), Object.freeze && (Object.freeze(p.props), Object.freeze(p)), p;
+        value: b
+      }), Object.freeze && (Object.freeze(g.props), Object.freeze(g)), g;
     };
-    function yr(e, t, i, l, h) {
+    function zr(e, n, o, p, b) {
       {
-        var v, m = {}, p = null, C = null;
-        i !== void 0 && (ke(i), p = "" + i), wr(t) && (ke(t.key), p = "" + t.key), br(t) && (C = t.ref, Rr(t, h));
-        for (v in t)
-          te.call(t, v) && !vr.hasOwnProperty(v) && (m[v] = t[v]);
+        var S, m = {}, g = null, z = null;
+        o !== void 0 && ($e(o), g = "" + o), _r(n) && ($e(n.key), g = "" + n.key), yr(n) && (z = n.ref, Pr(n, b));
+        for (S in n)
+          ae.call(n, S) && !Rr.hasOwnProperty(S) && (m[S] = n[S]);
         if (e && e.defaultProps) {
-          var R = e.defaultProps;
-          for (v in R)
-            m[v] === void 0 && (m[v] = R[v]);
+          var _ = e.defaultProps;
+          for (S in _)
+            m[S] === void 0 && (m[S] = _[S]);
         }
-        if (p || C) {
-          var _ = typeof e == "function" ? e.displayName || e.name || "Unknown" : e;
-          p && Sr(m, _), C && _r(m, _);
+        if (g || z) {
+          var E = typeof e == "function" ? e.displayName || e.name || "Unknown" : e;
+          g && Er(m, E), z && Cr(m, E);
         }
-        return Er(e, p, C, h, l, J.current, m);
+        return Tr(e, g, z, b, p, X.current, m);
       }
     }
-    var me = I.ReactCurrentOwner, qe = I.ReactDebugCurrentFrame;
-    function M(e) {
+    var we = U.ReactCurrentOwner, Ve = U.ReactDebugCurrentFrame;
+    function Y(e) {
       if (e) {
-        var t = e._owner, i = re(e.type, e._source, t ? t.type : null);
-        qe.setExtraStackFrame(i);
+        var n = e._owner, o = ne(e.type, e._source, n ? n.type : null);
+        Ve.setExtraStackFrame(o);
       } else
-        qe.setExtraStackFrame(null);
+        Ve.setExtraStackFrame(null);
     }
-    var he;
-    he = !1;
-    function ve(e) {
-      return typeof e == "object" && e !== null && e.$$typeof === n;
+    var Se;
+    Se = !1;
+    function Re(e) {
+      return typeof e == "object" && e !== null && e.$$typeof === a;
     }
-    function Ie() {
+    function Ye() {
       {
-        if (me.current) {
-          var e = j(me.current.type);
+        if (we.current) {
+          var e = F(we.current.type);
           if (e)
             return `
 
@@ -592,149 +622,149 @@ Check the render method of \`` + e + "`.";
         return "";
       }
     }
-    function Tr(e) {
+    function Ar(e) {
       {
         if (e !== void 0) {
-          var t = e.fileName.replace(/^.*[\\\/]/, ""), i = e.lineNumber;
+          var n = e.fileName.replace(/^.*[\\\/]/, ""), o = e.lineNumber;
           return `
 
-Check your code at ` + t + ":" + i + ".";
+Check your code at ` + n + ":" + o + ".";
         }
         return "";
       }
     }
-    var Ue = {};
-    function Pr(e) {
+    var Be = {};
+    function Or(e) {
       {
-        var t = Ie();
-        if (!t) {
-          var i = typeof e == "string" ? e : e.displayName || e.name;
-          i && (t = `
+        var n = Ye();
+        if (!n) {
+          var o = typeof e == "string" ? e : e.displayName || e.name;
+          o && (n = `
 
-Check the top-level render call using <` + i + ">.");
+Check the top-level render call using <` + o + ">.");
         }
-        return t;
+        return n;
       }
     }
-    function $e(e, t) {
+    function Ge(e, n) {
       {
         if (!e._store || e._store.validated || e.key != null)
           return;
         e._store.validated = !0;
-        var i = Pr(t);
-        if (Ue[i])
+        var o = Or(n);
+        if (Be[o])
           return;
-        Ue[i] = !0;
-        var l = "";
-        e && e._owner && e._owner !== me.current && (l = " It was passed a child from " + j(e._owner.type) + "."), M(e), P('Each child in a list should have a unique "key" prop.%s%s See https://reactjs.org/link/warning-keys for more information.', i, l), M(null);
+        Be[o] = !0;
+        var p = "";
+        e && e._owner && e._owner !== we.current && (p = " It was passed a child from " + F(e._owner.type) + "."), Y(e), T('Each child in a list should have a unique "key" prop.%s%s See https://reactjs.org/link/warning-keys for more information.', o, p), Y(null);
       }
     }
-    function Ne(e, t) {
+    function He(e, n) {
       {
         if (typeof e != "object")
           return;
-        if (pe(e))
-          for (var i = 0; i < e.length; i++) {
-            var l = e[i];
-            ve(l) && $e(l, t);
+        if (ve(e))
+          for (var o = 0; o < e.length; o++) {
+            var p = e[o];
+            Re(p) && Ge(p, n);
           }
-        else if (ve(e))
+        else if (Re(e))
           e._store && (e._store.validated = !0);
         else if (e) {
-          var h = le(e);
-          if (typeof h == "function" && h !== e.entries)
-            for (var v = h.call(e), m; !(m = v.next()).done; )
-              ve(m.value) && $e(m.value, t);
+          var b = pe(e);
+          if (typeof b == "function" && b !== e.entries)
+            for (var S = b.call(e), m; !(m = S.next()).done; )
+              Re(m.value) && Ge(m.value, n);
         }
       }
     }
-    function Cr(e) {
+    function xr(e) {
       {
-        var t = e.type;
-        if (t == null || typeof t == "string")
+        var n = e.type;
+        if (n == null || typeof n == "string")
           return;
-        var i;
-        if (typeof t == "function")
-          i = t.propTypes;
-        else if (typeof t == "object" && (t.$$typeof === b || t.$$typeof === w))
-          i = t.propTypes;
+        var o;
+        if (typeof n == "function")
+          o = n.propTypes;
+        else if (typeof n == "object" && (n.$$typeof === v || n.$$typeof === h))
+          o = n.propTypes;
         else
           return;
-        if (i) {
-          var l = j(t);
-          pr(i, e.props, "prop", l, e);
-        } else if (t.PropTypes !== void 0 && !he) {
-          he = !0;
-          var h = j(t);
-          P("Component %s declared `PropTypes` instead of `propTypes`. Did you misspell the property assignment?", h || "Unknown");
+        if (o) {
+          var p = F(n);
+          vr(o, e.props, "prop", p, e);
+        } else if (n.PropTypes !== void 0 && !Se) {
+          Se = !0;
+          var b = F(n);
+          T("Component %s declared `PropTypes` instead of `propTypes`. Did you misspell the property assignment?", b || "Unknown");
         }
-        typeof t.getDefaultProps == "function" && !t.getDefaultProps.isReactClassApproved && P("getDefaultProps is only used on classic React.createClass definitions. Use a static property named `defaultProps` instead.");
+        typeof n.getDefaultProps == "function" && !n.getDefaultProps.isReactClassApproved && T("getDefaultProps is only used on classic React.createClass definitions. Use a static property named `defaultProps` instead.");
       }
     }
-    function Or(e) {
+    function Dr(e) {
       {
-        for (var t = Object.keys(e.props), i = 0; i < t.length; i++) {
-          var l = t[i];
-          if (l !== "children" && l !== "key") {
-            M(e), P("Invalid prop `%s` supplied to `React.Fragment`. React.Fragment can only have `key` and `children` props.", l), M(null);
+        for (var n = Object.keys(e.props), o = 0; o < n.length; o++) {
+          var p = n[o];
+          if (p !== "children" && p !== "key") {
+            Y(e), T("Invalid prop `%s` supplied to `React.Fragment`. React.Fragment can only have `key` and `children` props.", p), Y(null);
             break;
           }
         }
-        e.ref !== null && (M(e), P("Invalid attribute `ref` supplied to `React.Fragment`."), M(null));
+        e.ref !== null && (Y(e), T("Invalid attribute `ref` supplied to `React.Fragment`."), Y(null));
       }
     }
-    function We(e, t, i, l, h, v) {
+    function Je(e, n, o, p, b, S) {
       {
-        var m = or(e);
+        var m = ur(e);
         if (!m) {
-          var p = "";
-          (e === void 0 || typeof e == "object" && e !== null && Object.keys(e).length === 0) && (p += " You likely forgot to export your component from the file it's defined in, or you might have mixed up default and named imports.");
-          var C = Tr(h);
-          C ? p += C : p += Ie();
-          var R;
-          e === null ? R = "null" : pe(e) ? R = "array" : e !== void 0 && e.$$typeof === n ? (R = "<" + (j(e.type) || "Unknown") + " />", p = " Did you accidentally export a JSX literal instead of a component?") : R = typeof e, P("React.jsx: type is invalid -- expected a string (for built-in components) or a class/function (for composite components) but got: %s.%s", R, p);
+          var g = "";
+          (e === void 0 || typeof e == "object" && e !== null && Object.keys(e).length === 0) && (g += " You likely forgot to export your component from the file it's defined in, or you might have mixed up default and named imports.");
+          var z = Ar(b);
+          z ? g += z : g += Ye();
+          var _;
+          e === null ? _ = "null" : ve(e) ? _ = "array" : e !== void 0 && e.$$typeof === a ? (_ = "<" + (F(e.type) || "Unknown") + " />", g = " Did you accidentally export a JSX literal instead of a component?") : _ = typeof e, T("React.jsx: type is invalid -- expected a string (for built-in components) or a class/function (for composite components) but got: %s.%s", _, g);
         }
-        var _ = yr(e, t, i, h, v);
-        if (_ == null)
-          return _;
+        var E = zr(e, n, o, b, S);
+        if (E == null)
+          return E;
         if (m) {
-          var z = t.children;
-          if (z !== void 0)
-            if (l)
-              if (pe(z)) {
-                for (var Y = 0; Y < z.length; Y++)
-                  Ne(z[Y], e);
-                Object.freeze && Object.freeze(z);
+          var k = n.children;
+          if (k !== void 0)
+            if (p)
+              if (ve(k)) {
+                for (var B = 0; B < k.length; B++)
+                  He(k[B], e);
+                Object.freeze && Object.freeze(k);
               } else
-                P("React.jsx: Static children should always be an array. You are likely explicitly calling React.jsxs or React.jsxDEV. Use the Babel transform instead.");
+                T("React.jsx: Static children should always be an array. You are likely explicitly calling React.jsxs or React.jsxDEV. Use the Babel transform instead.");
             else
-              Ne(z, e);
+              He(k, e);
         }
-        return e === c ? Or(_) : Cr(_), _;
+        return e === c ? Dr(E) : xr(E), E;
       }
     }
-    function zr(e, t, i) {
-      return We(e, t, i, !0);
+    function kr(e, n, o) {
+      return Je(e, n, o, !0);
     }
-    function xr(e, t, i) {
-      return We(e, t, i, !1);
+    function Ir(e, n, o) {
+      return Je(e, n, o, !1);
     }
-    var Ar = xr, Dr = zr;
-    K.Fragment = c, K.jsx = Ar, K.jsxs = Dr;
-  }()), K;
+    var jr = Ir, Fr = kr;
+    Z.Fragment = c, Z.jsx = jr, Z.jsxs = Fr;
+  }()), Z;
 }
-(function(a) {
-  process.env.NODE_ENV === "production" ? a.exports = Yr() : a.exports = Vr();
-})(ce);
-const B = ce.exports.Fragment, r = ce.exports.jsx, E = ce.exports.jsxs;
-function Br({
-  postSubmit: a,
-  styles: n = se
+(function(t) {
+  process.env.NODE_ENV === "production" ? t.exports = Gr() : t.exports = Hr();
+})(de);
+const $ = de.exports.Fragment, r = de.exports.jsx, w = de.exports.jsxs;
+function Jr({
+  postSubmit: t,
+  styles: a = ue
 }) {
   const {
     control: s,
     handleSubmit: c
-  } = oe({
+  } = ee({
     defaultValues: {
       type: "postgresql",
       key: "",
@@ -747,20 +777,20 @@ function Br({
       }
     }
   });
-  return /* @__PURE__ */ r(N, {
+  return /* @__PURE__ */ r(L, {
     mx: "auto",
-    children: /* @__PURE__ */ E("form", {
+    children: /* @__PURE__ */ w("form", {
       onSubmit: c(async ({
-        type: o,
-        key: u,
+        type: i,
+        key: l,
         config: f
       }) => {
-        if (V({
+        if (M({
           id: "for-creating",
           title: "Pending",
           message: "Adding data source...",
           loading: !0
-        }), !await D.datasource.create(o, u, f)) {
+        }), !await x.datasource.create(i, l, f)) {
           A({
             id: "for-creating",
             title: "Failed",
@@ -774,17 +804,17 @@ function Br({
           title: "Successful",
           message: "Data source is added",
           color: "green"
-        }), a();
+        }), t();
       }),
-      children: [/* @__PURE__ */ r(T, {
+      children: [/* @__PURE__ */ r(P, {
         name: "type",
         control: s,
         render: ({
-          field: o
-        }) => /* @__PURE__ */ r(jr, {
+          field: i
+        }) => /* @__PURE__ */ r(qr, {
           fullWidth: !0,
-          mb: n.spacing,
-          size: n.size,
+          mb: a.spacing,
+          size: a.size,
           data: [{
             label: "PostgreSQL",
             value: "postgresql"
@@ -796,113 +826,113 @@ function Br({
             value: "http",
             disabled: !0
           }],
-          ...o
+          ...i
         })
-      }), /* @__PURE__ */ r(T, {
+      }), /* @__PURE__ */ r(P, {
         name: "key",
         control: s,
         render: ({
-          field: o
-        }) => /* @__PURE__ */ r(F, {
-          mb: n.spacing,
-          size: n.size,
+          field: i
+        }) => /* @__PURE__ */ r(I, {
+          mb: a.spacing,
+          size: a.size,
           required: !0,
           label: "Name",
           placeholder: "A unique name",
-          ...o
+          ...i
         })
-      }), /* @__PURE__ */ r(Be, {
+      }), /* @__PURE__ */ r(er, {
         label: "Connection Info",
         labelPosition: "center"
-      }), /* @__PURE__ */ E(L, {
+      }), /* @__PURE__ */ w(j, {
         grow: !0,
-        children: [/* @__PURE__ */ r(T, {
+        children: [/* @__PURE__ */ r(P, {
           name: "config.host",
           control: s,
           render: ({
-            field: o
-          }) => /* @__PURE__ */ r(F, {
-            mb: n.spacing,
-            size: n.size,
+            field: i
+          }) => /* @__PURE__ */ r(I, {
+            mb: a.spacing,
+            size: a.size,
             required: !0,
             label: "Host",
             sx: {
               flexGrow: 1
             },
-            ...o
+            ...i
           })
-        }), /* @__PURE__ */ r(T, {
+        }), /* @__PURE__ */ r(P, {
           name: "config.port",
           control: s,
           render: ({
-            field: o
-          }) => /* @__PURE__ */ r(kr, {
-            mb: n.spacing,
-            size: n.size,
+            field: i
+          }) => /* @__PURE__ */ r(Lr, {
+            mb: a.spacing,
+            size: a.size,
             required: !0,
             label: "Port",
             hideControls: !0,
             sx: {
               width: "8em"
             },
-            ...o
+            ...i
           })
         })]
-      }), /* @__PURE__ */ r(T, {
+      }), /* @__PURE__ */ r(P, {
         name: "config.username",
         control: s,
         render: ({
-          field: o
-        }) => /* @__PURE__ */ r(F, {
-          mb: n.spacing,
-          size: n.size,
+          field: i
+        }) => /* @__PURE__ */ r(I, {
+          mb: a.spacing,
+          size: a.size,
           required: !0,
           label: "Username",
-          ...o
+          ...i
         })
-      }), /* @__PURE__ */ r(T, {
+      }), /* @__PURE__ */ r(P, {
         name: "config.password",
         control: s,
         render: ({
-          field: o
-        }) => /* @__PURE__ */ r(ie, {
-          mb: n.spacing,
-          size: n.size,
+          field: i
+        }) => /* @__PURE__ */ r(se, {
+          mb: a.spacing,
+          size: a.size,
           required: !0,
           label: "Password",
-          ...o
+          ...i
         })
-      }), /* @__PURE__ */ r(T, {
+      }), /* @__PURE__ */ r(P, {
         name: "config.database",
         control: s,
         render: ({
-          field: o
-        }) => /* @__PURE__ */ r(F, {
-          mb: n.spacing,
-          size: n.size,
+          field: i
+        }) => /* @__PURE__ */ r(I, {
+          mb: a.spacing,
+          size: a.size,
           required: !0,
           label: "Database",
-          ...o
+          ...i
         })
-      }), /* @__PURE__ */ r(L, {
+      }), /* @__PURE__ */ r(j, {
         position: "right",
-        mt: n.spacing,
-        children: /* @__PURE__ */ r(q, {
+        mt: a.spacing,
+        children: /* @__PURE__ */ r(D, {
           type: "submit",
-          size: n.button.size,
+          size: a.button.size,
           children: "Save"
         })
       })]
     })
   });
 }
-function Gr({
-  onSuccess: a,
-  styles: n = se
+function Xr({
+  onSuccess: t,
+  styles: a = ue
 }) {
-  const [s, c] = Q.useState(!1), d = () => c(!0), o = () => c(!1);
-  return /* @__PURE__ */ E(B, {
-    children: [/* @__PURE__ */ r(we, {
+  const [s, c] = H.useState(!1), u = () => c(!0), i = () => c(!1);
+  return /* @__PURE__ */ w($, {
+    children: [/* @__PURE__ */ r(oe, {
       overflow: "inside",
       opened: s,
       onClose: () => c(!1),
@@ -911,43 +941,43 @@ function Gr({
       onDragStart: (f) => {
         f.stopPropagation();
       },
-      children: /* @__PURE__ */ r(Br, {
+      children: /* @__PURE__ */ r(Jr, {
         postSubmit: () => {
-          a(), o();
+          t(), i();
         },
-        styles: n
+        styles: a
       })
-    }), /* @__PURE__ */ r(q, {
-      size: n.button.size,
-      onClick: d,
-      leftIcon: /* @__PURE__ */ r(Xe, {
+    }), /* @__PURE__ */ r(D, {
+      size: a.button.size,
+      onClick: u,
+      leftIcon: /* @__PURE__ */ r(Ee, {
         size: 20
       }),
       children: "Add a Data Source"
     })]
   });
 }
-function Hr({
-  id: a,
-  name: n,
+function Qr({
+  id: t,
+  name: a,
   onSuccess: s,
-  styles: c = se
+  styles: c = ue
 }) {
-  const d = Qe(), o = async () => {
-    !a || (V({
+  const u = ce(), i = async () => {
+    !t || (M({
       id: "for-deleting",
       title: "Pending",
       message: "Deleting data source...",
       loading: !0
-    }), await D.datasource.delete(a), A({
+    }), await x.datasource.delete(t), A({
       id: "for-deleting",
       title: "Successful",
-      message: `Data source [${n}] is deleted`,
+      message: `Data source [${a}] is deleted`,
       color: "green"
     }), s());
-  }, u = () => d.openConfirmModal({
+  }, l = () => u.openConfirmModal({
     title: "Delete this data source?",
-    children: /* @__PURE__ */ r(be, {
+    children: /* @__PURE__ */ r(ye, {
       size: c.size,
       children: "This action won't affect your database."
     }),
@@ -956,55 +986,56 @@ function Hr({
       cancel: "Cancel"
     },
     onCancel: () => console.log("Cancel"),
-    onConfirm: o
+    onConfirm: i
   });
-  return /* @__PURE__ */ r(q, {
+  return /* @__PURE__ */ r(D, {
     size: c.button.size,
     color: "red",
-    onClick: u,
-    leftIcon: /* @__PURE__ */ r(Ke, {
+    onClick: l,
+    leftIcon: /* @__PURE__ */ r(Ce, {
       size: 20
     }),
     children: "Delete"
   });
 }
-function ut({
-  styles: a = se,
-  config: n
+function vt({
+  styles: t = ue,
+  config: a
 }) {
+  le(a);
   const {
     data: s = [],
     loading: c,
-    refresh: d
-  } = ae(async () => {
+    refresh: u
+  } = G(async () => {
     const {
-      data: o
-    } = await D.datasource.list();
-    return o;
+      data: i
+    } = await x.datasource.list();
+    return i;
   }, {
     refreshDeps: []
   });
-  return y.baseURL !== n.apiBaseURL && (y.baseURL = n.apiBaseURL), /* @__PURE__ */ E(B, {
-    children: [/* @__PURE__ */ r(L, {
-      pt: a.spacing,
+  return /* @__PURE__ */ w($, {
+    children: [/* @__PURE__ */ r(j, {
+      pt: t.spacing,
       position: "right",
-      children: /* @__PURE__ */ r(Gr, {
-        onSuccess: d
+      children: /* @__PURE__ */ r(Xr, {
+        onSuccess: u
       })
-    }), /* @__PURE__ */ E(N, {
-      mt: a.spacing,
+    }), /* @__PURE__ */ w(L, {
+      mt: t.spacing,
       sx: {
         position: "relative"
       },
-      children: [/* @__PURE__ */ r(Ge, {
+      children: [/* @__PURE__ */ r(_e, {
         visible: c
-      }), /* @__PURE__ */ E(He, {
-        horizontalSpacing: a.spacing,
-        verticalSpacing: a.spacing,
-        fontSize: a.size,
+      }), /* @__PURE__ */ w(Pe, {
+        horizontalSpacing: t.spacing,
+        verticalSpacing: t.spacing,
+        fontSize: t.size,
         highlightOnHover: !0,
         children: [/* @__PURE__ */ r("thead", {
-          children: /* @__PURE__ */ E("tr", {
+          children: /* @__PURE__ */ w("tr", {
             children: [/* @__PURE__ */ r("th", {
               children: "Type"
             }), /* @__PURE__ */ r("th", {
@@ -1015,59 +1046,59 @@ function ut({
           })
         }), /* @__PURE__ */ r("tbody", {
           children: s.map(({
-            id: o,
-            key: u,
+            id: i,
+            key: l,
             type: f
-          }) => /* @__PURE__ */ E("tr", {
+          }) => /* @__PURE__ */ w("tr", {
             children: [/* @__PURE__ */ r("td", {
               width: 200,
               children: f
             }), /* @__PURE__ */ r("td", {
-              children: u
+              children: l
             }), /* @__PURE__ */ r("td", {
               width: 200,
-              children: /* @__PURE__ */ r(L, {
+              children: /* @__PURE__ */ r(j, {
                 position: "left",
-                children: /* @__PURE__ */ r(Hr, {
-                  id: o,
-                  name: u,
-                  onSuccess: d
+                children: /* @__PURE__ */ r(Qr, {
+                  id: i,
+                  name: l,
+                  onSuccess: u
                 })
               })
             })]
-          }, u))
+          }, l))
         })]
       })]
     })]
   });
 }
-const Jr = Je(({
-  label: a,
-  value: n,
+const Zr = tr(({
+  label: t,
+  value: a,
   description: s,
   ...c
-}, d) => /* @__PURE__ */ E(Fr, {
+}, u) => /* @__PURE__ */ w(rr, {
   spacing: 2,
-  ref: d,
+  ref: u,
   ...c,
-  children: [/* @__PURE__ */ r(be, {
+  children: [/* @__PURE__ */ r(ye, {
     size: "sm",
-    children: a
-  }), /* @__PURE__ */ r(be, {
+    children: t
+  }), /* @__PURE__ */ r(ye, {
     size: "xs",
     color: "dimmed",
     className: "role-description",
     children: s
   })]
-})), Ze = Je(({
-  styles: a,
-  value: n,
+})), Te = tr(({
+  styles: t,
+  value: a,
   onChange: s
 }, c) => {
   const {
-    data: d = [],
-    loading: o
-  } = ae(async () => (await D.role.list()).map((f) => ({
+    data: u = [],
+    loading: i
+  } = G(async () => (await x.role.list()).map((f) => ({
     label: f.name,
     value: f.id,
     description: f.description,
@@ -1075,15 +1106,15 @@ const Jr = Je(({
   })), {
     refreshDeps: []
   });
-  return /* @__PURE__ */ r(Lr, {
+  return /* @__PURE__ */ r(Nr, {
     ref: c,
-    mb: a.spacing,
-    size: a.size,
+    mb: t.spacing,
+    size: t.size,
     required: !0,
     label: "Role",
-    itemComponent: Jr,
-    data: d,
-    disabled: o,
+    itemComponent: Zr,
+    data: u,
+    disabled: i,
     styles: () => ({
       item: {
         "&[data-selected]": {
@@ -1095,25 +1126,25 @@ const Jr = Je(({
         }
       }
     }),
-    value: n,
+    value: a,
     onChange: s
   });
-}), U = {
+}), W = {
   size: "sm",
   spacing: "md",
   button: {
     size: "xs"
   }
 };
-function Xr({
-  postSubmit: a,
-  styles: n = U,
+function et({
+  postSubmit: t,
+  styles: a = W,
   initialRoleID: s
 }) {
   const {
     control: c,
-    handleSubmit: d
-  } = oe({
+    handleSubmit: u
+  } = ee({
     defaultValues: {
       name: "",
       email: "",
@@ -1121,146 +1152,146 @@ function Xr({
       password: ""
     }
   });
-  return /* @__PURE__ */ r(N, {
+  return /* @__PURE__ */ r(L, {
     mx: "auto",
-    children: /* @__PURE__ */ E("form", {
-      onSubmit: d(async ({
-        name: u,
+    children: /* @__PURE__ */ w("form", {
+      onSubmit: u(async ({
+        name: l,
         email: f,
-        password: b,
-        role_id: O
+        password: v,
+        role_id: R
       }) => {
         try {
-          V({
+          M({
             id: "for-creating",
             title: "Pending",
             message: "Adding account...",
             loading: !0
-          }), await D.account.create(u, f, b, O), A({
+          }), await x.account.create(l, f, v, R), A({
             id: "for-creating",
             title: "Successful",
             message: "Account is added",
             color: "green"
-          }), a();
-        } catch (S) {
+          }), t();
+        } catch (y) {
           A({
             id: "for-creating",
             title: "Failed",
-            message: S.message,
+            message: y.message,
             color: "red"
           });
         }
       }),
-      children: [/* @__PURE__ */ r(T, {
+      children: [/* @__PURE__ */ r(P, {
         name: "name",
         control: c,
         render: ({
-          field: u
-        }) => /* @__PURE__ */ r(F, {
-          mb: n.spacing,
-          size: n.size,
+          field: l
+        }) => /* @__PURE__ */ r(I, {
+          mb: a.spacing,
+          size: a.size,
           required: !0,
           label: "Username",
-          ...u
+          ...l
         })
-      }), /* @__PURE__ */ r(T, {
+      }), /* @__PURE__ */ r(P, {
         name: "email",
         control: c,
         render: ({
-          field: u
-        }) => /* @__PURE__ */ r(F, {
-          mb: n.spacing,
-          size: n.size,
+          field: l
+        }) => /* @__PURE__ */ r(I, {
+          mb: a.spacing,
+          size: a.size,
           required: !0,
           label: "Email",
-          ...u
+          ...l
         })
-      }), /* @__PURE__ */ r(T, {
+      }), /* @__PURE__ */ r(P, {
         name: "password",
         control: c,
         render: ({
-          field: u
-        }) => /* @__PURE__ */ r(ie, {
-          mb: n.spacing,
-          size: n.size,
+          field: l
+        }) => /* @__PURE__ */ r(se, {
+          mb: a.spacing,
+          size: a.size,
           required: !0,
           label: "Password",
           description: "Password must be at least 8 characters long",
-          ...u
+          ...l
         })
-      }), /* @__PURE__ */ r(T, {
+      }), /* @__PURE__ */ r(P, {
         name: "role_id",
         control: c,
         render: ({
-          field: u
-        }) => /* @__PURE__ */ r(Ze, {
-          styles: n,
-          ...u
+          field: l
+        }) => /* @__PURE__ */ r(Te, {
+          styles: a,
+          ...l
         })
-      }), /* @__PURE__ */ r(L, {
+      }), /* @__PURE__ */ r(j, {
         position: "right",
-        mt: n.spacing,
-        children: /* @__PURE__ */ r(q, {
+        mt: a.spacing,
+        children: /* @__PURE__ */ r(D, {
           type: "submit",
-          size: n.button.size,
+          size: a.button.size,
           children: "Save"
         })
       })]
     })
   });
 }
-function Kr({
-  onSuccess: a,
-  styles: n = U,
+function rt({
+  onSuccess: t,
+  styles: a = W,
   initialRoleID: s
 }) {
-  const [c, d] = Q.useState(!1), o = () => d(!0), u = () => d(!1);
-  return /* @__PURE__ */ E(B, {
-    children: [/* @__PURE__ */ r(we, {
+  const [c, u] = H.useState(!1), i = () => u(!0), l = () => u(!1);
+  return /* @__PURE__ */ w($, {
+    children: [/* @__PURE__ */ r(oe, {
       overflow: "inside",
       opened: c,
-      onClose: () => d(!1),
+      onClose: () => u(!1),
       title: "Add an Account",
       trapFocus: !0,
-      onDragStart: (b) => {
-        b.stopPropagation();
+      onDragStart: (v) => {
+        v.stopPropagation();
       },
-      children: /* @__PURE__ */ r(Xr, {
+      children: /* @__PURE__ */ r(et, {
         postSubmit: () => {
-          a(), u();
+          t(), l();
         },
-        styles: n,
+        styles: a,
         initialRoleID: s
       })
-    }), /* @__PURE__ */ r(q, {
-      size: n.button.size,
-      onClick: o,
-      leftIcon: /* @__PURE__ */ r(Xe, {
+    }), /* @__PURE__ */ r(D, {
+      size: a.button.size,
+      onClick: i,
+      leftIcon: /* @__PURE__ */ r(Ee, {
         size: 20
       }),
       children: "Add an Account"
     })]
   });
 }
-function Qr({
-  id: a,
-  name: n,
+function tt({
+  id: t,
+  name: a,
   onSuccess: s,
-  styles: c = U
+  styles: c = W
 }) {
-  const d = Qe(), o = async () => {
-    if (!!a) {
-      V({
+  const u = ce(), i = async () => {
+    if (!!t) {
+      M({
         id: "for-deleting",
         title: "Pending",
         message: "Deleting account...",
         loading: !0
       });
       try {
-        await D.account.delete(a), A({
+        await x.account.delete(t), A({
           id: "for-deleting",
           title: "Successful",
-          message: `Account [${n}] is deleted`,
+          message: `Account [${a}] is deleted`,
           color: "green"
         }), s();
       } catch (f) {
@@ -1272,250 +1303,251 @@ function Qr({
         });
       }
     }
-  }, u = () => d.openConfirmModal({
+  }, l = () => u.openConfirmModal({
     title: "Delete this account?",
     labels: {
       confirm: "Confirm",
       cancel: "Cancel"
     },
     onCancel: () => console.log("Cancel"),
-    onConfirm: o
+    onConfirm: i
   });
-  return /* @__PURE__ */ r(q, {
+  return /* @__PURE__ */ r(D, {
     size: c.button.size,
     color: "red",
-    onClick: u,
-    leftIcon: /* @__PURE__ */ r(Ke, {
+    onClick: l,
+    leftIcon: /* @__PURE__ */ r(Ce, {
       size: 20
     }),
     children: "Delete"
   });
 }
-function Zr({
-  id: a,
-  name: n,
+function nt({
+  id: t,
+  name: a,
   email: s,
   role_id: c,
-  postSubmit: d,
-  styles: o = U
+  postSubmit: u,
+  styles: i = W
 }) {
   const {
-    control: u,
+    control: l,
     handleSubmit: f,
-    watch: b
-  } = oe({
+    watch: v
+  } = ee({
     defaultValues: {
-      name: n,
+      name: a,
       email: s,
       role_id: c,
       reset_password: !1,
       new_password: ""
     }
-  }), O = async ({
-    name: g,
-    email: x,
-    role_id: W,
-    reset_password: G,
-    new_password: le
+  }), R = async ({
+    name: d,
+    email: O,
+    role_id: N,
+    reset_password: K,
+    new_password: pe
   }) => {
     try {
-      V({
+      M({
         id: "for-updating",
         title: "Pending",
         message: "Updating account...",
         loading: !0
-      }), await D.account.edit({
-        id: a,
-        name: g,
-        email: x,
-        role_id: W,
-        reset_password: G,
-        new_password: le
+      }), await x.account.edit({
+        id: t,
+        name: d,
+        email: O,
+        role_id: N,
+        reset_password: K,
+        new_password: pe
       }), A({
         id: "for-updating",
         title: "Successful",
         message: "Account is updated",
         color: "green"
-      }), d();
-    } catch (I) {
+      }), u();
+    } catch (U) {
       A({
         id: "for-updating",
         title: "Failed",
-        message: I.message,
+        message: U.message,
         color: "red"
       });
     }
-  }, [S, w] = b(["reset_password", "new_password"]);
-  return /* @__PURE__ */ r(N, {
+  }, [y, h] = v(["reset_password", "new_password"]);
+  return /* @__PURE__ */ r(L, {
     mx: "auto",
-    children: /* @__PURE__ */ E("form", {
-      onSubmit: f(O),
-      children: [/* @__PURE__ */ r(T, {
+    children: /* @__PURE__ */ w("form", {
+      onSubmit: f(R),
+      children: [/* @__PURE__ */ r(P, {
         name: "name",
-        control: u,
+        control: l,
         render: ({
-          field: g
-        }) => /* @__PURE__ */ r(F, {
-          mb: o.spacing,
-          size: o.size,
+          field: d
+        }) => /* @__PURE__ */ r(I, {
+          mb: i.spacing,
+          size: i.size,
           required: !0,
           label: "Username",
-          ...g
+          ...d
         })
-      }), /* @__PURE__ */ r(T, {
+      }), /* @__PURE__ */ r(P, {
         name: "email",
-        control: u,
+        control: l,
         render: ({
-          field: g
-        }) => /* @__PURE__ */ r(F, {
-          mb: o.spacing,
-          size: o.size,
+          field: d
+        }) => /* @__PURE__ */ r(I, {
+          mb: i.spacing,
+          size: i.size,
           required: !0,
           label: "Email",
-          ...g
+          ...d
         })
-      }), /* @__PURE__ */ r(T, {
+      }), /* @__PURE__ */ r(P, {
         name: "role_id",
-        control: u,
+        control: l,
         render: ({
-          field: g
-        }) => /* @__PURE__ */ r(Ze, {
-          styles: o,
-          ...g
+          field: d
+        }) => /* @__PURE__ */ r(Te, {
+          styles: i,
+          ...d
         })
-      }), /* @__PURE__ */ r(Be, {
+      }), /* @__PURE__ */ r(er, {
         my: 20,
         variant: "dashed",
         label: "",
         labelPosition: "center"
-      }), /* @__PURE__ */ r(T, {
+      }), /* @__PURE__ */ r(P, {
         name: "reset_password",
-        control: u,
+        control: l,
         render: ({
-          field: g
-        }) => /* @__PURE__ */ r(qr, {
-          mb: o.spacing,
-          size: o.size,
+          field: d
+        }) => /* @__PURE__ */ r(Ur, {
+          mb: i.spacing,
+          size: i.size,
           label: "Reset password",
-          checked: g.value,
-          onChange: (x) => g.onChange(x.currentTarget.checked),
+          checked: d.value,
+          onChange: (O) => d.onChange(O.currentTarget.checked),
           styles: {
             label: {
               verticalAlign: "middle"
             }
           }
         })
-      }), S && /* @__PURE__ */ r(T, {
+      }), y && /* @__PURE__ */ r(P, {
         name: "new_password",
-        control: u,
+        control: l,
         render: ({
-          field: g
-        }) => /* @__PURE__ */ r(ie, {
+          field: d
+        }) => /* @__PURE__ */ r(se, {
           autoComplete: "off",
-          mb: o.spacing,
-          size: o.size,
+          mb: i.spacing,
+          size: i.size,
           required: !0,
           description: "Password must be at least 8 characters long",
           label: "New Password",
-          ...g
+          ...d
         })
-      }), /* @__PURE__ */ r(L, {
+      }), /* @__PURE__ */ r(j, {
         position: "right",
-        mt: o.spacing,
-        children: /* @__PURE__ */ r(q, {
+        mt: i.spacing,
+        children: /* @__PURE__ */ r(D, {
           type: "submit",
-          size: o.button.size,
+          size: i.button.size,
           children: "Submit"
         })
       })]
     })
   });
 }
-function et({
-  account: a,
-  onSuccess: n,
-  styles: s = U
+function at({
+  account: t,
+  onSuccess: a,
+  styles: s = W
 }) {
-  const [c, d] = Q.useState(!1), o = () => d(!0), u = () => d(!1), f = () => {
-    n(), u();
+  const [c, u] = H.useState(!1), i = () => u(!0), l = () => u(!1), f = () => {
+    a(), l();
   };
-  return /* @__PURE__ */ E(B, {
-    children: [/* @__PURE__ */ r(we, {
+  return /* @__PURE__ */ w($, {
+    children: [/* @__PURE__ */ r(oe, {
       overflow: "inside",
       opened: c,
-      onClose: () => d(!1),
-      title: `Editing ${a.name}`,
+      onClose: () => u(!1),
+      title: `Editing ${t.name}`,
       trapFocus: !0,
-      onDragStart: (b) => {
-        b.stopPropagation();
+      onDragStart: (v) => {
+        v.stopPropagation();
       },
-      children: /* @__PURE__ */ r(Zr, {
-        ...a,
+      children: /* @__PURE__ */ r(nt, {
+        ...t,
         postSubmit: f,
         styles: s
       })
-    }), /* @__PURE__ */ r(q, {
+    }), /* @__PURE__ */ r(D, {
       size: s.button.size,
-      onClick: o,
-      leftIcon: /* @__PURE__ */ r(Ur, {
+      onClick: i,
+      leftIcon: /* @__PURE__ */ r(Mr, {
         size: 20
       }),
       children: "Edit"
     })]
   });
 }
-function dt({
-  styles: a = U,
-  config: n
+function bt({
+  styles: t = W,
+  config: a
 }) {
-  var O, S;
+  var R, y;
+  le(a);
   const {
     data: s = [],
     loading: c,
-    refresh: d
-  } = ae(async () => {
+    refresh: u
+  } = G(async () => {
     const {
-      data: w
-    } = await D.account.list();
-    return w;
+      data: h
+    } = await x.account.list();
+    return h;
   }, {
     refreshDeps: []
   }), {
-    data: o = [],
-    loading: u
-  } = ae(async () => (await D.role.list()).map((g) => ({
-    label: g.name,
-    value: g.id,
-    description: g.description,
-    disabled: g.id === 50
+    data: i = [],
+    loading: l
+  } = G(async () => (await x.role.list()).map((d) => ({
+    label: d.name,
+    value: d.id,
+    description: d.description,
+    disabled: d.id === 50
   })), {
     refreshDeps: []
-  }), f = Ir(() => o.reduce((w, g) => (w.set(g.value, g.label), w), /* @__PURE__ */ new Map()), [o]), b = (w) => {
-    var g;
-    return (g = f.get(w)) != null ? g : w;
+  }), f = nr(() => i.reduce((h, d) => (h.set(d.value, d.label), h), /* @__PURE__ */ new Map()), [i]), v = (h) => {
+    var d;
+    return (d = f.get(h)) != null ? d : h;
   };
-  return y.baseURL !== n.apiBaseURL && (y.baseURL = n.apiBaseURL), /* @__PURE__ */ E(B, {
-    children: [/* @__PURE__ */ r(L, {
-      pt: a.spacing,
+  return /* @__PURE__ */ w($, {
+    children: [/* @__PURE__ */ r(j, {
+      pt: t.spacing,
       position: "right",
-      children: /* @__PURE__ */ r(Kr, {
-        onSuccess: d,
-        initialRoleID: (S = (O = o == null ? void 0 : o[0]) == null ? void 0 : O.value) != null ? S : 0
+      children: /* @__PURE__ */ r(rt, {
+        onSuccess: u,
+        initialRoleID: (y = (R = i == null ? void 0 : i[0]) == null ? void 0 : R.value) != null ? y : 0
       })
-    }), /* @__PURE__ */ E(N, {
-      mt: a.spacing,
+    }), /* @__PURE__ */ w(L, {
+      mt: t.spacing,
       sx: {
         position: "relative"
       },
-      children: [/* @__PURE__ */ r(Ge, {
-        visible: c || u
-      }), /* @__PURE__ */ E(He, {
-        horizontalSpacing: a.spacing,
-        verticalSpacing: a.spacing,
-        fontSize: a.size,
+      children: [/* @__PURE__ */ r(_e, {
+        visible: c || l
+      }), /* @__PURE__ */ w(Pe, {
+        horizontalSpacing: t.spacing,
+        verticalSpacing: t.spacing,
+        fontSize: t.size,
         highlightOnHover: !0,
         children: [/* @__PURE__ */ r("thead", {
-          children: /* @__PURE__ */ E("tr", {
+          children: /* @__PURE__ */ w("tr", {
             children: [/* @__PURE__ */ r("th", {
               children: "Username"
             }), /* @__PURE__ */ r("th", {
@@ -1527,78 +1559,78 @@ function dt({
             })]
           })
         }), /* @__PURE__ */ r("tbody", {
-          children: s.map((w) => {
+          children: s.map((h) => {
             const {
-              id: g,
-              name: x,
-              email: W,
-              role_id: G
-            } = w;
-            return /* @__PURE__ */ E("tr", {
+              id: d,
+              name: O,
+              email: N,
+              role_id: K
+            } = h;
+            return /* @__PURE__ */ w("tr", {
               children: [/* @__PURE__ */ r("td", {
                 width: 200,
-                children: x
+                children: O
               }), /* @__PURE__ */ r("td", {
                 width: 200,
-                children: W
+                children: N
               }), /* @__PURE__ */ r("td", {
                 width: 200,
-                children: b(G)
+                children: v(K)
               }), /* @__PURE__ */ r("td", {
                 width: 200,
-                children: /* @__PURE__ */ E(L, {
+                children: /* @__PURE__ */ w(j, {
                   position: "left",
-                  children: [/* @__PURE__ */ r(et, {
-                    account: w,
-                    onSuccess: d
-                  }), /* @__PURE__ */ r(Qr, {
-                    id: g,
-                    name: x,
-                    onSuccess: d
+                  children: [/* @__PURE__ */ r(at, {
+                    account: h,
+                    onSuccess: u
+                  }), /* @__PURE__ */ r(tt, {
+                    id: d,
+                    name: O,
+                    onSuccess: u
                   })]
                 })
               })]
-            }, g);
+            }, d);
           })
         })]
       })]
     })]
   });
 }
-function rt({
-  postSubmit: a,
-  styles: n = U
+function it({
+  postSubmit: t,
+  styles: a = W
 }) {
   const {
     control: s,
     handleSubmit: c
-  } = oe({
+  } = ee({
     defaultValues: {
       name: "",
       password: ""
     }
   });
-  return /* @__PURE__ */ r(N, {
+  return /* @__PURE__ */ r(L, {
     mx: "auto",
-    children: /* @__PURE__ */ E("form", {
+    children: /* @__PURE__ */ w("form", {
       onSubmit: c(async ({
-        name: o,
-        password: u
+        name: i,
+        password: l
       }) => {
         try {
-          V({
+          M({
             id: "for-login",
             title: "Pending",
             message: "Loggin in...",
             loading: !0
           });
-          const f = await D.account.login(o, u);
+          const f = await x.account.login(i, l);
           window.localStorage.setItem("token", f.token), A({
             id: "for-login",
             title: "Successful",
             message: "Logged in",
             color: "green"
-          }), a(f);
+          }), t(f);
         } catch (f) {
           A({
             id: "for-login",
@@ -1608,66 +1640,369 @@ function rt({
           });
         }
       }),
-      children: [/* @__PURE__ */ r(T, {
+      children: [/* @__PURE__ */ r(P, {
         name: "name",
         control: s,
         render: ({
-          field: o
-        }) => /* @__PURE__ */ r(F, {
-          mb: n.spacing,
-          size: n.size,
+          field: i
+        }) => /* @__PURE__ */ r(I, {
+          mb: a.spacing,
+          size: a.size,
           required: !0,
           label: "Username",
-          ...o
+          ...i
         })
-      }), /* @__PURE__ */ r(T, {
+      }), /* @__PURE__ */ r(P, {
         name: "password",
         control: s,
         render: ({
-          field: o
-        }) => /* @__PURE__ */ r(ie, {
-          mb: n.spacing,
-          size: n.size,
+          field: i
+        }) => /* @__PURE__ */ r(se, {
+          mb: a.spacing,
+          size: a.size,
           required: !0,
           label: "Password",
-          ...o
+          ...i
         })
-      }), /* @__PURE__ */ r(L, {
+      }), /* @__PURE__ */ r(j, {
         position: "right",
-        mt: n.spacing,
-        children: /* @__PURE__ */ r(q, {
+        mt: a.spacing,
+        children: /* @__PURE__ */ r(D, {
           type: "submit",
-          size: n.button.size,
+          size: a.button.size,
           children: "Submit"
         })
       })]
     })
   });
 }
-function ft({
-  styles: a = U,
-  config: n,
+function wt({
+  styles: t = W,
+  config: a,
   onSuccess: s
 }) {
-  return y.baseURL !== n.apiBaseURL && (y.baseURL = n.apiBaseURL), /* @__PURE__ */ r(B, {
-    children: /* @__PURE__ */ r(N, {
-      mt: a.spacing,
+  return le(a), /* @__PURE__ */ r($, {
+    children: /* @__PURE__ */ r(L, {
+      mt: t.spacing,
       sx: {
         position: "relative"
       },
-      children: /* @__PURE__ */ r(rt, {
-        styles: a,
+      children: /* @__PURE__ */ r(it, {
+        styles: t,
         postSubmit: s
       })
     })
   });
 }
+const fe = {
+  size: "sm",
+  spacing: "md",
+  button: {
+    size: "xs"
+  }
+};
+function ot({
+  postSubmit: t,
+  styles: a = fe,
+  initialRoleID: s
+}) {
+  const {
+    control: c,
+    handleSubmit: u
+  } = ee({
+    defaultValues: {
+      name: "",
+      role_id: s,
+      domain: ""
+    }
+  });
+  return /* @__PURE__ */ r(L, {
+    mx: "auto",
+    children: /* @__PURE__ */ w("form", {
+      onSubmit: u(async ({
+        name: l,
+        role_id: f,
+        domain: v
+      }) => {
+        try {
+          M({
+            id: "for-creating",
+            title: "Pending",
+            message: "Adding API Key...",
+            loading: !0
+          });
+          const R = await x.api_key.create(l, f, v);
+          A({
+            id: "for-creating",
+            title: "Successful",
+            message: "API Key is added",
+            color: "green"
+          }), t(R);
+        } catch (R) {
+          A({
+            id: "for-creating",
+            title: "Failed",
+            message: R.message,
+            color: "red"
+          });
+        }
+      }),
+      children: [/* @__PURE__ */ r(P, {
+        name: "name",
+        control: c,
+        render: ({
+          field: l
+        }) => /* @__PURE__ */ r(I, {
+          mb: a.spacing,
+          size: a.size,
+          required: !0,
+          label: "Name",
+          ...l
+        })
+      }), /* @__PURE__ */ r(P, {
+        name: "domain",
+        control: c,
+        render: ({
+          field: l
+        }) => /* @__PURE__ */ r(I, {
+          mb: a.spacing,
+          size: a.size,
+          required: !0,
+          label: "Domain",
+          ...l
+        })
+      }), /* @__PURE__ */ r(P, {
+        name: "role_id",
+        control: c,
+        render: ({
+          field: l
+        }) => /* @__PURE__ */ r(Te, {
+          styles: a,
+          ...l
+        })
+      }), /* @__PURE__ */ r(j, {
+        position: "right",
+        mt: a.spacing,
+        children: /* @__PURE__ */ r(D, {
+          type: "submit",
+          size: a.button.size,
+          children: "Save"
+        })
+      })]
+    })
+  });
+}
+function st({
+  onSuccess: t,
+  styles: a = fe,
+  initialRoleID: s
+}) {
+  const c = ce(), [u, i] = H.useState(!1), l = () => i(!0), f = () => i(!1);
+  return /* @__PURE__ */ w($, {
+    children: [/* @__PURE__ */ r(oe, {
+      overflow: "inside",
+      opened: u,
+      onClose: () => i(!1),
+      title: "Add an API Key",
+      trapFocus: !0,
+      onDragStart: (R) => {
+        R.stopPropagation();
+      },
+      children: /* @__PURE__ */ r(ot, {
+        postSubmit: (R) => {
+          f(), c.openModal({
+            title: "API Key is generated",
+            children: /* @__PURE__ */ w(rr, {
+              children: [/* @__PURE__ */ r(I, {
+                defaultValue: R,
+                disabled: !0,
+                label: "Generated API Key",
+                description: "Make sure you save it - you won't be able to access it again.",
+                styles: {
+                  input: {
+                    cursor: "text !important"
+                  }
+                }
+              }), /* @__PURE__ */ r(D, {
+                size: "sm",
+                onClick: () => {
+                  Wr(), t();
+                },
+                children: "I've saved this API Key"
+              })]
+            })
+          });
+        },
+        styles: a,
+        initialRoleID: s
+      })
+    }), /* @__PURE__ */ r(D, {
+      size: a.button.size,
+      onClick: l,
+      leftIcon: /* @__PURE__ */ r(Ee, {
+        size: 20
+      }),
+      children: "Add an API Key"
+    })]
+  });
+}
+function ct({
+  id: t,
+  name: a,
+  onSuccess: s,
+  styles: c = fe
+}) {
+  const u = ce(), i = async () => {
+    if (!!t) {
+      M({
+        id: "for-deleting",
+        title: "Pending",
+        message: "Deleting API Key...",
+        loading: !0
+      });
+      try {
+        await x.api_key.delete(t), A({
+          id: "for-deleting",
+          title: "Successful",
+          message: `API Key [${a}] is deleted`,
+          color: "green"
+        }), s();
+      } catch (f) {
+        A({
+          id: "for-deleting",
+          title: "Failed",
+          message: f.message,
+          color: "red"
+        });
+      }
+    }
+  }, l = () => u.openConfirmModal({
+    title: "Delete this api-key?",
+    labels: {
+      confirm: "Confirm",
+      cancel: "Cancel"
+    },
+    onCancel: () => console.log("Cancel"),
+    onConfirm: i
+  });
+  return /* @__PURE__ */ r(D, {
+    size: c.button.size,
+    color: "red",
+    onClick: l,
+    leftIcon: /* @__PURE__ */ r(Ce, {
+      size: 20
+    }),
+    children: "Delete"
+  });
+}
+function St({
+  styles: t = fe,
+  config: a
+}) {
+  var R, y;
+  le(a);
+  const {
+    data: s = [],
+    loading: c,
+    refresh: u
+  } = G(async () => {
+    const {
+      data: h
+    } = await x.api_key.list();
+    return h;
+  }, {
+    refreshDeps: []
+  }), {
+    data: i = [],
+    loading: l
+  } = G(async () => (await x.role.list()).map((d) => ({
+    label: d.name,
+    value: d.id,
+    description: d.description,
+    disabled: d.id === 50
+  })), {
+    refreshDeps: []
+  }), f = nr(() => i.reduce((h, d) => (h.set(d.value, d.label), h), /* @__PURE__ */ new Map()), [i]), v = (h) => {
+    var d;
+    return (d = f.get(h)) != null ? d : h;
+  };
+  return /* @__PURE__ */ w($, {
+    children: [/* @__PURE__ */ r(j, {
+      pt: t.spacing,
+      position: "right",
+      children: /* @__PURE__ */ r(st, {
+        onSuccess: u,
+        initialRoleID: (y = (R = i == null ? void 0 : i[0]) == null ? void 0 : R.value) != null ? y : 0
+      })
+    }), /* @__PURE__ */ w(L, {
+      mt: t.spacing,
+      sx: {
+        position: "relative"
+      },
+      children: [/* @__PURE__ */ r(_e, {
+        visible: c || l
+      }), /* @__PURE__ */ w(Pe, {
+        horizontalSpacing: t.spacing,
+        verticalSpacing: t.spacing,
+        fontSize: t.size,
+        highlightOnHover: !0,
+        children: [/* @__PURE__ */ r("thead", {
+          children: /* @__PURE__ */ w("tr", {
+            children: [/* @__PURE__ */ r("th", {
+              children: "Name"
+            }), /* @__PURE__ */ r("th", {
+              children: "Domain"
+            }), /* @__PURE__ */ r("th", {
+              children: "Role"
+            }), /* @__PURE__ */ r("th", {
+              children: "Action"
+            })]
+          })
+        }), /* @__PURE__ */ r("tbody", {
+          children: s.map((h) => {
+            const {
+              id: d,
+              name: O,
+              domain: N,
+              role_id: K
+            } = h;
+            return /* @__PURE__ */ w("tr", {
+              children: [/* @__PURE__ */ r("td", {
+                width: 200,
+                children: O
+              }), /* @__PURE__ */ r("td", {
+                width: 200,
+                children: N
+              }), /* @__PURE__ */ r("td", {
+                width: 200,
+                children: v(K)
+              }), /* @__PURE__ */ r("td", {
+                width: 200,
+                children: /* @__PURE__ */ r(j, {
+                  position: "left",
+                  children: /* @__PURE__ */ r(ct, {
+                    id: d,
+                    name: O,
+                    onSuccess: u
+                  })
+                })
+              })]
+            }, d);
+          })
+        })]
+      })]
+    })]
+  });
+}
 export {
-  dt as AccountList,
-  Kr as AddAccount,
-  Gr as AddDataSource,
-  ut as DataSourceList,
-  Qr as DeleteAccount,
-  Hr as DeleteDataSource,
-  ft as Login
+  St as APIKeyList,
+  bt as AccountList,
+  st as AddAPIKey,
+  rt as AddAccount,
+  Xr as AddDataSource,
+  vt as DataSourceList,
+  ct as DeleteAPIKey,
+  tt as DeleteAccount,
+  Qr as DeleteDataSource,
+  wt as Login
 };