@akanjs/ui 0.9.55 → 0.9.57

package/esm/Signal/Object.js

@@ -71,17 +71,9 @@ const ObjectDetail = ({ objRef }) => {
           })()
         ] }) : null
       ] }),
-      /* @__PURE__ */ jsx("td", { className: "text-center", children: l.field(modelRefName, key) }),
-      /* @__PURE__ */ jsx("td", { className: "text-center", children: l.desc(modelRefName, key) }),
-      /* @__PURE__ */ jsx("td", { className: "flex flex-wrap items-center justify-center gap-2 text-center", children: enumOpt ? enumOpt.map((opt, idx2) => /* @__PURE__ */ jsx(
-        "div",
-        {
-          className: "tooltip tooltip-primary",
-          "data-tip": l.enum(modelRefName, key, opt),
-          children: /* @__PURE__ */ jsx("button", { className: "btn btn-xs", children: opt })
-        },
-        idx2
-      )) : "-" })
+      /* @__PURE__ */ jsx("td", { className: "text-center", children: l._(`${modelRefName}.${key}`) }),
+      /* @__PURE__ */ jsx("td", { className: "text-center", children: l._(`${modelRefName}.${key}.desc`) }),
+      /* @__PURE__ */ jsx("td", { className: "flex flex-wrap items-center justify-center gap-2 text-center", children: enumOpt ? enumOpt.map((opt, idx2) => /* @__PURE__ */ jsx("div", { className: "tooltip tooltip-primary", "data-tip": l._(`${enumOpt.refName}.${opt}`), children: /* @__PURE__ */ jsx("button", { className: "btn btn-xs", children: opt }) }, idx2)) : "-" })
     ] }) }, idx))
   ] }) });
 };
@@ -95,7 +87,7 @@ const ObjectSchema = ({ objRef }) => {
     /* @__PURE__ */ jsx("div", { className: "text-3xl font-bold", children: gqlName }),
     /* @__PURE__ */ jsxs("div", { className: "mb-5", children: [
       " - ",
-      l.field(refName, "modelDesc")
+      l._(`${refName}.modelDesc`)
     ] }),
     /* @__PURE__ */ jsx("div", { className: "text-2xl font-bold", children: "Schema" }),
     /* @__PURE__ */ jsx(ObjectDetail, { objRef })

package/esm/Signal/PubSub.js

@@ -1,9 +1,9 @@
 "use client";
 import { jsx, jsxs } from "react/jsx-runtime";
-import { getNonArrayModel, isGqlScalar } from "@akanjs/base";
+import { isGqlScalar } from "@akanjs/base";
 import { usePage } from "@akanjs/client";
-import { capitalize } from "@akanjs/common";
-import { fetch, getArgMetas, getSigMeta, makeRequestExample } from "@akanjs/signal";
+import { constantInfo } from "@akanjs/constant";
+import { fetch, makeRequestExample } from "@akanjs/signal";
 import { st } from "@akanjs/store";
 import { useEffect, useMemo, useState } from "react";
 import { AiOutlineDisconnect, AiOutlineFileWord, AiOutlineSwap } from "react-icons/ai";
@@ -15,22 +15,18 @@ import Response from "./Response";
 function PubSub() {
   return /* @__PURE__ */ jsx("div", {});
 }
-const PubSubEndpoint = ({ sigRef, gqlMeta, open }) => {
+const PubSubEndpoint = ({ refName, gqlKey, gqlMeta, open }) => {
   const { l } = usePage();
-  const sigMeta = getSigMeta(sigRef);
   const [viewStatus, setViewStatus] = useState("doc");
-  const [argMetas] = getArgMetas(sigRef, gqlMeta.key);
-  const gqlArgMetas = argMetas.filter((argMeta) => argMeta.type !== "Upload");
-  const uploadArgMetas = argMetas.filter((argMeta) => argMeta.type === "Upload");
   return /* @__PURE__ */ jsxs("div", { className: "collapse-arrow bg-base-300 collapse my-1", children: [
     /* @__PURE__ */ jsx("input", { type: "checkbox", checked: open }),
     /* @__PURE__ */ jsx("div", { className: "collapse-title text-xl", children: /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-3", children: [
-      /* @__PURE__ */ jsx("div", { className: `btn btn-xs w-16 ${gqlMeta.type === "Pubsub" ? "btn-info" : "btn-warning"}`, children: gqlMeta.type }),
-      gqlMeta.key,
+      /* @__PURE__ */ jsx("div", { className: `btn btn-xs w-16 ${gqlMeta.type === "pubsub" ? "btn-info" : "btn-warning"}`, children: gqlMeta.type }),
+      gqlKey,
       " ",
       /* @__PURE__ */ jsxs("span", { className: "text-sm", children: [
         "(",
-        l.api(sigMeta.refName, gqlMeta.key),
+        l._(`${refName}.signal.${gqlKey}`),
         ")"
       ] })
     ] }) }),
@@ -38,9 +34,9 @@ const PubSubEndpoint = ({ sigRef, gqlMeta, open }) => {
       /* @__PURE__ */ jsxs("div", { className: "mt-4 text-lg", children: [
         "Description",
         /* @__PURE__ */ jsx("hr", { className: "my-2 border-[0.1px] border-gray-400" }),
-        gqlMeta.guards.some((guard) => guard !== "None") ? /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 pb-3 pl-3 text-base font-normal", children: [
+        gqlMeta.signalOption?.guards?.some((guard) => guard !== "None") ? /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 pb-3 pl-3 text-base font-normal", children: [
           "- Guards:",
-          gqlMeta.guards.map((guard) => /* @__PURE__ */ jsx(
+          gqlMeta.signalOption.guards.map((guard) => /* @__PURE__ */ jsx(
             "span",
             {
               className: `badge ${guard === "Public" ? "badge-success" : guard === "SuperAdmin" ? "badge-error" : guard === "Admin" ? "badge-error" : guard === "User" ? "badge-accent" : guard === "Owner" ? "badge-accent" : guard === "Every" ? "badge-warning" : ""}`,
@@ -51,7 +47,7 @@ const PubSubEndpoint = ({ sigRef, gqlMeta, open }) => {
         ] }) : null,
         /* @__PURE__ */ jsxs("div", { className: "pb-3 pl-3 text-base font-normal", children: [
           "- ",
-          l.apidesc(sigMeta.refName, gqlMeta.key)
+          l._(`${refName}.signal.${gqlKey}.desc`)
         ] })
       ] }),
       /* @__PURE__ */ jsxs("div", { className: "my-4 flex w-full gap-5 px-5", children: [
@@ -82,64 +78,48 @@ const PubSubEndpoint = ({ sigRef, gqlMeta, open }) => {
           }
         )
       ] }),
-      viewStatus === "doc" ? /* @__PURE__ */ jsx(
-        PubSubInterface,
-        {
-          sigRef,
-          gqlMeta,
-          gqlArgMetas,
-          uploadArgMetas
-        }
-      ) : /* @__PURE__ */ jsx(PubSubTry, { sigRef, gqlMeta, gqlArgMetas, uploadArgMetas })
+      viewStatus === "doc" ? /* @__PURE__ */ jsx(PubSubInterface, { refName, gqlKey, gqlMeta }) : /* @__PURE__ */ jsx(PubSubTry, { refName, gqlKey, gqlMeta })
     ] })
   ] });
 };
 PubSub.Endpoint = PubSubEndpoint;
-const PubSubInterface = ({ sigRef, gqlMeta, gqlArgMetas, uploadArgMetas }) => {
-  const sigMeta = getSigMeta(sigRef);
-  const [returnRef, arrDepth] = getNonArrayModel(gqlMeta.returns());
+const PubSubInterface = ({ refName, gqlKey, gqlMeta }) => {
+  const returnRef = constantInfo.getModelRef(gqlMeta.returns.refName, gqlMeta.returns.modelType);
   const isReturnModelType = !isGqlScalar(returnRef);
   return /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-4", children: [
-    uploadArgMetas.length ? /* @__PURE__ */ jsxs("div", { children: [
-      /* @__PURE__ */ jsx("div", { className: "text-lg", children: "Form data upload" }),
-      /* @__PURE__ */ jsx("div", { className: "bg-base-100 overflow-x-auto rounded-md p-3", children: /* @__PURE__ */ jsx(Arg.Table, { sigMeta, gqlMeta, argMetas: uploadArgMetas }) })
-    ] }) : null,
-    gqlArgMetas.length ? /* @__PURE__ */ jsxs("div", { children: [
+    gqlMeta.args.length ? /* @__PURE__ */ jsxs("div", { children: [
       /* @__PURE__ */ jsx("div", { className: "text-lg", children: "Variables" }),
-      /* @__PURE__ */ jsx("div", { className: "bg-base-100 overflow-x-auto rounded-md p-3", children: /* @__PURE__ */ jsx(Arg.Table, { sigMeta, gqlMeta, argMetas: gqlArgMetas }) })
+      /* @__PURE__ */ jsx("div", { className: "bg-base-100 overflow-x-auto rounded-md p-3", children: /* @__PURE__ */ jsx(Arg.Table, { refName, gqlKey, argMetas: gqlMeta.args }) })
     ] }) : null,
     /* @__PURE__ */ jsx("div", { className: "text-lg font-bold", children: /* @__PURE__ */ jsxs("div", { className: "flex w-full flex-col gap-2 rounded-md font-normal md:flex-row", children: [
       /* @__PURE__ */ jsxs("div", { className: "w-full md:w-1/2", children: [
         "Response Type",
         /* @__PURE__ */ jsxs("div", { className: "bg-base-100 max-h-[500px] overflow-auto rounded-md p-4 md:h-[500px]", children: [
           "Returns: ",
-          /* @__PURE__ */ jsx(Object.Type, { objRef: returnRef, arrDepth }),
+          /* @__PURE__ */ jsx(Object.Type, { objRef: returnRef, arrDepth: gqlMeta.returns.arrDepth }),
           isReturnModelType ? /* @__PURE__ */ jsx(Object.Detail, { objRef: returnRef }) : null
         ] })
       ] }),
       /* @__PURE__ */ jsxs("div", { className: "w-full md:w-1/2", children: [
         "Response Example",
-        /* @__PURE__ */ jsx(Response.Example, { sigRef, gqlMeta })
+        /* @__PURE__ */ jsx(Response.Example, { gqlMeta })
       ] })
     ] }) })
   ] });
 };
 PubSub.Interface = PubSubInterface;
-const PubSubTry = ({ sigRef, gqlMeta, gqlArgMetas, uploadArgMetas }) => {
+const PubSubTry = ({ refName, gqlKey, gqlMeta }) => {
   const tryJwt = st.use.tryJwt();
-  const [modelRef, arrDepth] = getNonArrayModel(gqlMeta.returns());
-  const isScalar = isGqlScalar(modelRef);
-  const requestExample = useMemo(() => JSON.stringify(makeRequestExample(sigRef, gqlMeta.key), null, 2), []);
+  const requestExample = useMemo(() => JSON.stringify(makeRequestExample(gqlMeta), null, 2), []);
   const [gqlRequest, setGqlRequest] = useState(requestExample);
-  const [uploadRequest, setUploadRequest] = useState({});
   const [unsubscribe, setUnsubscribe] = useState(null);
   const [messages, setMessages] = useState("");
   const [response, setResponse] = useState({ status: "ready", data: "" });
   const onSubscribe = () => {
     setResponse({ status: "loading", data: "" });
-    const request = { ...JSON.parse(gqlRequest), ...uploadRequest };
-    const argData = [...gqlArgMetas, ...uploadArgMetas].sort((a, b) => a.idx - b.idx).map((argMeta) => request[argMeta.name]);
-    const fetchFn = fetch[`subscribe${capitalize(gqlMeta.key)}`].bind(fetch);
+    const request = JSON.parse(gqlRequest);
+    const argData = gqlMeta.args.map((argMeta) => request[argMeta.name]);
+    const fetchFn = fetch[gqlKey].bind(fetch);
     setResponse({ status: "loading", data: messages });
     const unsubscribe2 = fetchFn(...argData, (data) => {
       setMessages(
@@ -169,20 +149,6 @@ ${data}` : typeof data === "object" ? [
     };
   }, [unsubscribe]);
   return /* @__PURE__ */ jsxs("div", { className: "flex w-full flex-col gap-4", children: [
-    uploadArgMetas.length ? /* @__PURE__ */ jsxs("div", { children: [
-      /* @__PURE__ */ jsx("div", { className: "text-lg", children: "Form data uplaod" }),
-      uploadArgMetas.map((argMeta) => /* @__PURE__ */ jsx(
-        Arg.FormData,
-        {
-          argMeta,
-          value: uploadRequest[argMeta.name],
-          onChange: (fileList) => {
-            setUploadRequest({ ...uploadRequest, [argMeta.name]: fileList });
-          }
-        },
-        argMeta.name
-      ))
-    ] }) : null,
     /* @__PURE__ */ jsxs("div", { children: [
       /* @__PURE__ */ jsx("div", { className: "grid gap-2 lg:grid-cols-2", children: /* @__PURE__ */ jsxs("div", { children: [
         /* @__PURE__ */ jsx("div", { className: "text-lg", children: "Variables" }),

package/esm/Signal/Response.js

@@ -6,8 +6,8 @@ import { Copy } from "../Copy";
 function Response() {
   return /* @__PURE__ */ jsx("div", {});
 }
-const ResponseExample = ({ sigRef, gqlMeta }) => {
-  const example = useMemo(() => JSON.stringify(makeResponseExample(sigRef, gqlMeta.key), null, 2), []);
+const ResponseExample = ({ gqlMeta }) => {
+  const example = useMemo(() => JSON.stringify(makeResponseExample(gqlMeta), null, 2), []);
   return /* @__PURE__ */ jsxs("div", { className: "relative", children: [
     /* @__PURE__ */ jsx(
       "textarea",

package/esm/Signal/RestApi.js

@@ -1,17 +1,9 @@
 "use client";
 import { jsx, jsxs } from "react/jsx-runtime";
-import { baseClientEnv, getNonArrayModel, isGqlScalar } from "@akanjs/base";
+import { baseClientEnv, isGqlScalar } from "@akanjs/base";
 import { usePage } from "@akanjs/client";
-import { getGqlTypeStr } from "@akanjs/constant";
-import {
-  getArgMetas,
-  getControllerPath,
-  getControllerPrefix,
-  getExampleData,
-  getGqlMetas,
-  getSigMeta,
-  getSignalRefsOnStorage
-} from "@akanjs/signal";
+import { constantInfo, getGqlTypeStr } from "@akanjs/constant";
+import { getExampleData } from "@akanjs/signal";
 import { st } from "@akanjs/store";
 import { useMemo, useState } from "react";
 import { AiOutlineApi, AiOutlineCopy, AiOutlineFileWord, AiOutlineSend } from "react-icons/ai";
@@ -19,55 +11,67 @@ import { Copy } from "../Copy";
 import { Signal } from ".";
 import Arg from "./Arg";
 import Response from "./Response";
+const getControllerPath = (gqlKey, gqlMeta) => {
+  return gqlMeta.signalOption?.path ?? [
+    gqlMeta.signalOption?.name ?? gqlKey,
+    ...gqlMeta.args.filter((argMeta) => argMeta.type === "Param").map((argMeta) => `:${argMeta.name}`)
+  ].join("/");
+};
 function RestApi() {
   return /* @__PURE__ */ jsx("div", {});
 }
-const RestApiEndpoints = ({ refName, endpoints, openAll, httpUri }) => {
-  const sigRefs = getSignalRefsOnStorage(refName);
-  if (!sigRefs.length)
+const RestApiEndpoints = ({ refName, prefix, endpoints, openAll, httpUri }) => {
+  const signals = global.signals;
+  const signal = signals.find((signal2) => signal2.refName === refName);
+  if (!signal)
     return null;
   const tryRoles = st.use.tryRoles();
-  const gqlInfos = sigRefs.reduce(
-    (acc, sigRef) => [...acc, ...getGqlMetas(sigRef).map((gqlMeta) => ({ key: gqlMeta.key, gqlMeta, sigRef }))],
-    []
-  ).filter(({ key }) => !endpoints || endpoints.includes(key)).sort((a, b) => a.key > b.key ? 1 : -1).filter(({ gqlMeta }) => gqlMeta.signalOption.onlyFor !== "graphql").filter(({ gqlMeta }) => {
-    if (gqlMeta.type === "Pubsub" || gqlMeta.type === "Message")
+  const gqlInfos = Object.entries(signal.endpoint).filter(([key, gqlMeta]) => !endpoints || endpoints.includes(key)).sort(([keyA], [keyB]) => keyA > keyB ? 1 : -1).filter(([key, gqlMeta]) => gqlMeta.signalOption?.onlyFor !== "graphql").filter(([key, gqlMeta]) => {
+    if (gqlMeta.type === "pubsub" || gqlMeta.type === "message")
       return false;
-    if (gqlMeta.guards.includes("Public") && tryRoles.includes("Public"))
+    if (gqlMeta.signalOption?.guards?.includes("Public") && tryRoles.includes("Public"))
       return true;
-    if ((gqlMeta.guards.includes("User") || gqlMeta.guards.includes("Every")) && tryRoles.includes("User"))
+    if ((gqlMeta.signalOption?.guards?.includes("User") || gqlMeta.signalOption?.guards?.includes("Every")) && tryRoles.includes("User"))
       return true;
-    if ((gqlMeta.guards.includes("Admin") || gqlMeta.guards.includes("Every")) && tryRoles.includes("Admin"))
+    if ((gqlMeta.signalOption?.guards?.includes("Admin") || gqlMeta.signalOption?.guards?.includes("Every")) && tryRoles.includes("Admin"))
       return true;
-    if (gqlMeta.guards.includes("SuperAdmin") && tryRoles.includes("SuperAdmin"))
+    if ((gqlMeta.signalOption?.guards?.includes("SuperAdmin") || gqlMeta.signalOption?.guards?.includes("Every")) && tryRoles.includes("SuperAdmin"))
       return true;
     return false;
   });
-  return /* @__PURE__ */ jsx("div", { children: gqlInfos.map(({ gqlMeta, sigRef }, idx) => /* @__PURE__ */ jsx(RestApiEndpoint, { sigRef, gqlMeta, open: openAll, httpUri }, idx)) });
+  return /* @__PURE__ */ jsx("div", { children: gqlInfos.map(([gqlKey, gqlMeta], idx) => /* @__PURE__ */ jsx(
+    RestApiEndpoint,
+    {
+      prefix,
+      refName,
+      gqlKey,
+      gqlMeta,
+      open: openAll,
+      httpUri
+    },
+    idx
+  )) });
 };
 RestApi.Endpoints = RestApiEndpoints;
-const RestApiEndpoint = ({ sigRef, gqlMeta, open, httpUri }) => {
+const RestApiEndpoint = ({ refName, prefix, gqlKey, gqlMeta, open, httpUri }) => {
   const { l } = usePage();
-  const sigMeta = getSigMeta(sigRef);
   const [viewStatus, setViewStatus] = useState("doc");
-  const [argMetas] = getArgMetas(sigRef, gqlMeta.key);
-  const queryArgMetas = argMetas.filter((argMeta) => argMeta.type === "Query");
-  const paramArgMetas = argMetas.filter((argMeta) => argMeta.type === "Param");
-  const bodyArgMetas = argMetas.filter((argMeta) => argMeta.type === "Body");
-  const uploadArgMetas = argMetas.filter((argMeta) => argMeta.type === "Upload");
-  const prefix = getControllerPrefix(sigMeta);
-  const path = getControllerPath(gqlMeta, paramArgMetas);
+  const queryArgMetas = gqlMeta.args.filter((argMeta) => argMeta.type === "Query");
+  const paramArgMetas = gqlMeta.args.filter((argMeta) => argMeta.type === "Param");
+  const bodyArgMetas = gqlMeta.args.filter((argMeta) => argMeta.type === "Body");
+  const uploadArgMetas = gqlMeta.args.filter((argMeta) => argMeta.type === "Upload");
+  const path = getControllerPath(gqlKey, gqlMeta);
   return /* @__PURE__ */ jsxs("div", { className: "collapse-arrow bg-base-300 collapse my-1", children: [
     /* @__PURE__ */ jsx("input", { type: "checkbox", checked: open }),
     /* @__PURE__ */ jsx("div", { className: "collapse-title", children: /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-3", children: [
-      /* @__PURE__ */ jsx("div", { className: `btn btn-xs w-16 ${gqlMeta.type === "Query" ? "btn-success" : "btn-accent"}`, children: gqlMeta.type === "Query" ? "GET" : "POST" }),
+      /* @__PURE__ */ jsx("div", { className: `btn btn-xs w-16 ${gqlMeta.type === "query" ? "btn-success" : "btn-accent"}`, children: gqlMeta.type === "query" ? "GET" : "POST" }),
       prefix ? `/${prefix}` : "",
       "/",
       path,
       " ",
       /* @__PURE__ */ jsxs("span", { className: "text-lg", children: [
         "(",
-        l.api(sigMeta.refName, gqlMeta.key),
+        l._(`${refName}.signal.${gqlKey}`),
         ")"
       ] })
     ] }) }),
@@ -75,9 +79,9 @@ const RestApiEndpoint = ({ sigRef, gqlMeta, open, httpUri }) => {
       /* @__PURE__ */ jsxs("div", { className: "mt-4 text-lg", children: [
         /* @__PURE__ */ jsx("div", { className: "text-lg font-extrabold", children: "Description" }),
         /* @__PURE__ */ jsx("hr", { className: "my-2 border-[0.1px] border-gray-400" }),
-        gqlMeta.guards.some((guard) => guard !== "None") ? /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 pb-3 pl-3 text-base font-normal", children: [
+        gqlMeta.signalOption?.guards?.some((guard) => guard !== "None") ? /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 pb-3 pl-3 text-base font-normal", children: [
           "- Guards:",
-          gqlMeta.guards.map((guard) => /* @__PURE__ */ jsx(
+          gqlMeta.signalOption.guards.map((guard) => /* @__PURE__ */ jsx(
             "span",
             {
               className: `badge ${guard === "Public" ? "badge-success" : guard === "SuperAdmin" ? "badge-error" : guard === "Admin" ? "badge-error" : guard === "User" ? "badge-accent" : guard === "Owner" ? "badge-accent" : guard === "Every" ? "badge-warning" : ""}`,
@@ -88,7 +92,7 @@ const RestApiEndpoint = ({ sigRef, gqlMeta, open, httpUri }) => {
         ] }) : null,
         /* @__PURE__ */ jsxs("div", { className: "pb-3 pl-3 text-base font-normal", children: [
           "- ",
-          l.apidesc(sigMeta.refName, gqlMeta.key)
+          l._(`${refName}.signal.${gqlKey}.desc`)
         ] })
       ] }),
       /* @__PURE__ */ jsxs("div", { className: "my-4 flex w-full gap-5 px-5", children: [
@@ -119,87 +123,57 @@ const RestApiEndpoint = ({ sigRef, gqlMeta, open, httpUri }) => {
           }
         )
       ] }),
-      viewStatus === "doc" ? /* @__PURE__ */ jsx(
-        RestApiInterface,
-        {
-          sigRef,
-          gqlMeta,
-          queryArgMetas,
-          paramArgMetas,
-          bodyArgMetas,
-          uploadArgMetas
-        }
-      ) : /* @__PURE__ */ jsx(
-        RestApiTry,
-        {
-          sigRef,
-          gqlMeta,
-          queryArgMetas,
-          paramArgMetas,
-          bodyArgMetas,
-          uploadArgMetas,
-          httpUri
-        }
-      )
+      viewStatus === "doc" ? /* @__PURE__ */ jsx(RestApiInterface, { refName, gqlKey, gqlMeta }) : /* @__PURE__ */ jsx(RestApiTry, { refName, gqlKey, gqlMeta, httpUri })
     ] })
   ] });
 };
 RestApi.Endpoint = RestApiEndpoint;
-const RestApiInterface = ({
-  sigRef,
-  gqlMeta,
-  queryArgMetas,
-  paramArgMetas,
-  bodyArgMetas,
-  uploadArgMetas
-}) => {
-  const sigMeta = getSigMeta(sigRef);
-  const [returnRef, arrDepth] = getNonArrayModel(gqlMeta.returns());
+const RestApiInterface = ({ refName, gqlKey, gqlMeta }) => {
+  const returnRef = constantInfo.getModelRef(gqlMeta.returns.refName, gqlMeta.returns.modelType);
   const isReturnModelType = !isGqlScalar(returnRef);
+  const uploadArgMetas = gqlMeta.args.filter((argMeta) => argMeta.type === "Upload");
+  const paramArgMetas = gqlMeta.args.filter((argMeta) => argMeta.type === "Param");
+  const queryArgMetas = gqlMeta.args.filter((argMeta) => argMeta.type === "Query");
+  const bodyArgMetas = gqlMeta.args.filter((argMeta) => argMeta.type === "Body");
   return /* @__PURE__ */ jsxs("div", { className: "flex w-full flex-col gap-4", children: [
     uploadArgMetas.length ? /* @__PURE__ */ jsxs("div", { children: [
       /* @__PURE__ */ jsx("div", { className: "text-lg font-extrabold", children: "Form data upload" }),
-      /* @__PURE__ */ jsx("div", { className: "bg-base-100 overflow-x-auto rounded-md p-3", children: /* @__PURE__ */ jsx(Arg.Table, { sigMeta, gqlMeta, argMetas: uploadArgMetas }) })
+      /* @__PURE__ */ jsx("div", { className: "bg-base-100 overflow-x-auto rounded-md p-3", children: /* @__PURE__ */ jsx(Arg.Table, { refName, gqlKey, argMetas: uploadArgMetas }) })
     ] }) : null,
     paramArgMetas.length ? /* @__PURE__ */ jsxs("div", { children: [
       /* @__PURE__ */ jsx("div", { className: "text-lg font-extrabold", children: "Parameters" }),
-      /* @__PURE__ */ jsx("div", { className: "bg-base-100 overflow-x-auto rounded-md p-3", children: /* @__PURE__ */ jsx(Arg.Table, { sigMeta, gqlMeta, argMetas: paramArgMetas }) })
+      /* @__PURE__ */ jsx("div", { className: "bg-base-100 overflow-x-auto rounded-md p-3", children: /* @__PURE__ */ jsx(Arg.Table, { refName, gqlKey, argMetas: paramArgMetas }) })
     ] }) : null,
     queryArgMetas.length ? /* @__PURE__ */ jsxs("div", { children: [
       /* @__PURE__ */ jsx("div", { className: "text-lg font-extrabold", children: "Query" }),
-      /* @__PURE__ */ jsx("div", { className: "bg-base-100 overflow-x-auto rounded-md p-3", children: /* @__PURE__ */ jsx(Arg.Table, { sigMeta, gqlMeta, argMetas: queryArgMetas }) })
+      /* @__PURE__ */ jsx("div", { className: "bg-base-100 overflow-x-auto rounded-md p-3", children: /* @__PURE__ */ jsx(Arg.Table, { refName, gqlKey, argMetas: queryArgMetas }) })
     ] }) : null,
     bodyArgMetas.length ? /* @__PURE__ */ jsxs("div", { children: [
       /* @__PURE__ */ jsx("div", { className: "text-lg font-extrabold", children: "Body" }),
-      /* @__PURE__ */ jsx("div", { className: "bg-base-100 overflow-x-auto rounded-md p-3", children: /* @__PURE__ */ jsx(Arg.Table, { sigMeta, gqlMeta, argMetas: bodyArgMetas }) })
+      /* @__PURE__ */ jsx("div", { className: "bg-base-100 overflow-x-auto rounded-md p-3", children: /* @__PURE__ */ jsx(Arg.Table, { refName, gqlKey, argMetas: bodyArgMetas }) })
     ] }) : null,
     /* @__PURE__ */ jsx("div", { className: "text-lg font-bold", children: /* @__PURE__ */ jsxs("div", { className: "flex w-full flex-col gap-2 rounded-md font-normal md:flex-row", children: [
       /* @__PURE__ */ jsxs("div", { className: "w-full md:w-1/2", children: [
         /* @__PURE__ */ jsx("div", { className: "text-lg font-extrabold", children: "Response Type" }),
         /* @__PURE__ */ jsxs("div", { className: "bg-base-100 max-h-[500px] overflow-auto rounded-md p-4 md:h-[500px]", children: [
           "Returns: ",
-          /* @__PURE__ */ jsx(Signal.Object.Type, { objRef: returnRef, arrDepth }),
+          /* @__PURE__ */ jsx(Signal.Object.Type, { objRef: returnRef, arrDepth: gqlMeta.returns.arrDepth }),
           isReturnModelType ? /* @__PURE__ */ jsx(Signal.Object.Detail, { objRef: returnRef }) : null
         ] })
       ] }),
       /* @__PURE__ */ jsxs("div", { className: "w-full md:w-1/2", children: [
         /* @__PURE__ */ jsx("div", { className: "text-lg font-extrabold", children: "Response Example" }),
-        /* @__PURE__ */ jsx(Response.Example, { sigRef, gqlMeta })
+        /* @__PURE__ */ jsx(Response.Example, { gqlMeta })
       ] })
     ] }) })
   ] });
 };
 RestApi.Interface = RestApiInterface;
-const RestApiTry = ({
-  sigRef,
-  gqlMeta,
-  queryArgMetas,
-  paramArgMetas,
-  bodyArgMetas,
-  uploadArgMetas,
-  httpUri = baseClientEnv.serverHttpUri
-}) => {
-  const sigMeta = getSigMeta(sigRef);
+const RestApiTry = ({ prefix, refName, gqlKey, gqlMeta, httpUri = baseClientEnv.serverHttpUri }) => {
+  const queryArgMetas = gqlMeta.args.filter((argMeta) => argMeta.type === "Query");
+  const paramArgMetas = gqlMeta.args.filter((argMeta) => argMeta.type === "Param");
+  const bodyArgMetas = gqlMeta.args.filter((argMeta) => argMeta.type === "Body");
+  const uploadArgMetas = gqlMeta.args.filter((argMeta) => argMeta.type === "Upload");
   const tryJwt = st.use.tryJwt();
   const paramExample = useMemo(() => getExampleData(paramArgMetas, "restapi"), []);
   const queryExample = useMemo(() => getExampleData(queryArgMetas, "restapi"), []);
@@ -212,16 +186,15 @@ const RestApiTry = ({
     status: "idle",
     data: null
   });
-  const method = gqlMeta.type === "Query" ? "GET" : "POST";
-  const prefix = getControllerPrefix(sigMeta);
-  const path = getControllerPath(gqlMeta, paramArgMetas);
+  const method = gqlMeta.type === "query" ? "GET" : "POST";
+  const path = getControllerPath(gqlKey, gqlMeta);
   const queryString = new URLSearchParams(
     Object.fromEntries(
       queryArgMetas.map((argMeta) => {
         const value = queryRequest[argMeta.name];
         if (value === void 0 || value === null || value === "" || Array.isArray(value) && value.length === 0)
           return null;
-        const [argRef] = getNonArrayModel(argMeta.returns());
+        const argRef = constantInfo.getModelRef(argMeta.refName, argMeta.modelType);
         if (getGqlTypeStr(argRef) === "JSON")
           return [argMeta.name, btoa(value)];
         return [argMeta.name, value];
@@ -279,6 +252,7 @@ const RestApiTry = ({
       uploadArgMetas.map((argMeta) => /* @__PURE__ */ jsx(
         Arg.FormData,
         {
+          gqlKey,
           argMeta,
           value: uploadRequest[argMeta.name],
           onChange: (fileList) => {
@@ -293,6 +267,7 @@ const RestApiTry = ({
       paramArgMetas.map((argMeta, idx) => /* @__PURE__ */ jsx(
         Arg.Param,
         {
+          gqlKey,
           argMeta,
           value: paramRequest[argMeta.name],
           onChange: (value) => {
@@ -307,6 +282,7 @@ const RestApiTry = ({
       queryArgMetas.map((argMeta, idx) => /* @__PURE__ */ jsx(
         Arg.Query,
         {
+          gqlKey,
           argMeta,
           value: queryRequest[argMeta.name] ?? "",
           onChange: (value) => {

package/esm/Signal/WebSocket.js

@@ -1,6 +1,5 @@
 "use client";
 import { jsx } from "react/jsx-runtime";
-import { getGqlMetas, getSignalRefsOnStorage } from "@akanjs/signal";
 import { st } from "@akanjs/store";
 import Message from "./Message";
 import PubSub from "./PubSub";
@@ -8,29 +7,29 @@ function WebSocket() {
   return /* @__PURE__ */ jsx("div", {});
 }
 const WebSocketEndpoints = ({ refName, openAll }) => {
-  const sigRefs = getSignalRefsOnStorage(refName);
+  const signals = global.signals;
+  const signal = signals.find((signal2) => signal2.refName === refName);
+  if (!signal)
+    return null;
   const tryRoles = st.use.tryRoles();
-  const gqlInfos = sigRefs.reduce(
-    (acc, sigRef) => [...acc, ...getGqlMetas(sigRef).map((gqlMeta) => ({ key: gqlMeta.key, gqlMeta, sigRef }))],
-    []
-  ).sort((a, b) => a.key > b.key ? 1 : -1).filter(({ gqlMeta }) => gqlMeta.signalOption.onlyFor !== "restapi").filter(({ gqlMeta }) => {
-    if (gqlMeta.type === "Query" || gqlMeta.type === "Mutation")
+  const gqlInfos = Object.entries(signal.endpoint).sort(([keyA], [keyB]) => keyA > keyB ? 1 : -1).filter(([key, gqlMeta]) => gqlMeta.signalOption?.onlyFor !== "restapi").filter(([key, gqlMeta]) => {
+    if (gqlMeta.type === "pubsub" || gqlMeta.type === "message")
       return false;
-    if (gqlMeta.guards.includes("Public") && tryRoles.includes("Public"))
+    if (gqlMeta.signalOption?.guards?.includes("Public") && tryRoles.includes("Public"))
       return true;
-    if ((gqlMeta.guards.includes("User") || gqlMeta.guards.includes("Every")) && tryRoles.includes("User"))
+    if ((gqlMeta.signalOption?.guards?.includes("User") || gqlMeta.signalOption?.guards?.includes("Every")) && tryRoles.includes("User"))
       return true;
-    if ((gqlMeta.guards.includes("Admin") || gqlMeta.guards.includes("Every")) && tryRoles.includes("Admin"))
+    if ((gqlMeta.signalOption?.guards?.includes("Admin") || gqlMeta.signalOption?.guards?.includes("Every")) && tryRoles.includes("Admin"))
       return true;
-    if (gqlMeta.guards.includes("SuperAdmin") && tryRoles.includes("SuperAdmin"))
+    if ((gqlMeta.signalOption?.guards?.includes("SuperAdmin") || gqlMeta.signalOption?.guards?.includes("Every")) && tryRoles.includes("SuperAdmin"))
       return true;
     return false;
   });
-  return /* @__PURE__ */ jsx("div", { children: gqlInfos.map(({ gqlMeta, sigRef }, idx) => {
-    if (gqlMeta.type === "Pubsub") {
-      return /* @__PURE__ */ jsx(PubSub.Endpoint, { sigRef, gqlMeta, open: openAll }, idx);
+  return /* @__PURE__ */ jsx("div", { children: gqlInfos.map(([gqlKey, gqlMeta], idx) => {
+    if (gqlMeta.type === "pubsub") {
+      return /* @__PURE__ */ jsx(PubSub.Endpoint, { refName, gqlKey, gqlMeta, open: openAll }, idx);
     } else {
-      return /* @__PURE__ */ jsx(Message.Endpoint, { sigRef, gqlMeta, open: openAll }, idx);
+      return /* @__PURE__ */ jsx(Message.Endpoint, { refName, gqlKey, gqlMeta, open: openAll }, idx);
     }
   }) });
 };

package/esm/System/CSR.js

@@ -1,5 +1,6 @@
 "use client";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { baseClientEnv } from "@akanjs/base";
 import { clsx, device, getPathInfo, router, useCsr } from "@akanjs/client";
 import { usePushNoti } from "@akanjs/next";
 import { st } from "@akanjs/store";
@@ -26,10 +27,7 @@ const CSRProvider = ({
   fonts,
   layoutStyle = "web",
   reconnect,
-  of,
-  fetchPing,
-  fetchMe,
-  fetchSelf
+  of
 }) => {
   return /* @__PURE__ */ jsx(
     Load.Page,
@@ -37,9 +35,10 @@ const CSRProvider = ({
       of,
       loader: async () => {
         const { lang } = await params;
-        return { lang };
+        const fetch = baseClientEnv.side === "server" && baseClientEnv.operationMode === "local" ? global.builtFetch : global.fetch;
+        return { lang, fetch };
       },
-      render: ({ lang }) => /* @__PURE__ */ jsxs(Fragment, { children: [
+      render: ({ lang, fetch }) => /* @__PURE__ */ jsxs(Fragment, { children: [
         /* @__PURE__ */ jsx(Client.Wrapper, { theme, lang, reconnect, children: /* @__PURE__ */ jsx(
           CSRWrapper,
           {
@@ -57,10 +56,6 @@ const CSRProvider = ({
           Common.Wrapper,
           {
             fetch,
-            environment: env.environment,
-            fetchPing,
-            fetchMe,
-            fetchSelf,
             render: ({ mePromise, selfPromise }) => /* @__PURE__ */ jsxs(Fragment, { children: [
               /* @__PURE__ */ jsx(Client.Inner, {}),
               /* @__PURE__ */ jsx(CSRInner, {}),

package/esm/System/Common.js

@@ -1,19 +1,19 @@
 import { Fragment, jsx } from "react/jsx-runtime";
 import "dayjs/locale/ko";
+import { baseClientEnv } from "@akanjs/base";
 import { getAccount } from "@akanjs/client";
 import { Load } from "../Load";
 const Common = () => {
   return /* @__PURE__ */ jsx(Fragment, {});
 };
 const CommonWrapper = ({
-  fetch,
-  environment,
-  render,
-  fetchPing,
-  fetchMe = (props, option) => fetch.me?.(props, option),
-  fetchSelf = (props, option) => fetch.getSelf?.(props, option)
+  fetch = baseClientEnv.side === "server" && baseClientEnv.operationMode === "local" ? global.builtFetch : global.fetch,
+  render
 }) => {
   const account = getAccount();
+  const fetchPing = (option) => fetch.ping(option);
+  const fetchMe = (props, option) => fetch.me?.(props, option);
+  const fetchSelf = (props, option) => fetch.getSelf?.(props, option);
   return /* @__PURE__ */ jsx(
     Load.Page,
     {