@oondemand/oon-core-front 0.4.10 → 0.4.12

package/dist/index.d.ts

@@ -237,11 +237,14 @@ interface OonModule {
     views?: OonViewDefinition[];
 }
 type CollectionMode = "full" | "minimal" | "dynamic";
+type OonValueFormat = "text" | "number" | "currency" | "percent" | "date" | "datetime" | "badge";
 interface OonColumnDef {
     field: string;
     label?: string;
     /** kind sobrescreve o inferido da metadata. */
     kind?: FieldKind;
+    /** Formato de apresentação; datetime preserva data e hora no locale do usuário. */
+    format?: OonValueFormat;
     sortable?: boolean;
     width?: number;
     renderer?: string;
@@ -362,7 +365,7 @@ type OonRelationDef = {
 type OonRelatedGridColumnDef = OonColumnDef & {
     editable?: boolean;
     readonly?: boolean;
-    format?: "text" | "number" | "currency" | "percent" | "date" | "badge";
+    format?: OonValueFormat;
     editor?: "string" | "number" | "currency" | "date" | "enum" | "select" | "ref" | "boolean" | "textarea";
     hidden?: boolean;
     roles?: string[];
@@ -375,7 +378,7 @@ type OonSummaryCardDef = {
     field?: string;
     relation?: string | OonRelationDef;
     metric?: string;
-    format?: "text" | "number" | "currency" | "percent" | "date" | "badge";
+    format?: OonValueFormat;
 };
 type OonDetailTabDef = {
     id: string;
@@ -1135,8 +1138,10 @@ interface TenantStorage {
     clear(): void;
 }
 /**
- * Guarda somente a seleção de tenant do usuário. O valor persistido não é
- * autoridade: o backend/Control Plane precisa validar o header a cada request.
+ * Mantém o tenant no escopo da aba. Isso permite abrir Tenant A e Tenant B em
+ * janelas diferentes sem uma aba trocar o contexto da outra. O query param
+ * `tenant` transporta somente o identificador selecionado; o backend continua
+ * validando o membership em todas as requisições.
  */
 declare function createTenantStorage(appId: string): TenantStorage;
 

package/dist/index.js

@@ -160,24 +160,37 @@ function normalize(value3) {
   const normalized3 = String(value3 ?? "").trim();
   return normalized3 || null;
 }
+function tenantFromUrl(key) {
+  if (typeof window === "undefined") return null;
+  const url = new URL(window.location.href);
+  const tenantId = normalize(url.searchParams.get("tenant"));
+  if (!tenantId) return null;
+  window.sessionStorage.setItem(key, tenantId);
+  url.searchParams.delete("tenant");
+  window.history.replaceState(window.history.state, "", `${url.pathname}${url.search}${url.hash}`);
+  return tenantId;
+}
 function createTenantStorage(appId) {
   const key = `oon:${appId}:tenant`;
   return {
     get() {
       if (typeof window === "undefined") return null;
-      return normalize(window.localStorage.getItem(key));
+      const incoming = tenantFromUrl(key);
+      if (incoming) return incoming;
+      window.localStorage.removeItem(key);
+      return normalize(window.sessionStorage.getItem(key));
     },
     set(tenantId) {
       if (typeof window === "undefined") return;
       const value3 = normalize(tenantId);
       if (!value3) {
-        window.localStorage.removeItem(key);
+        window.sessionStorage.removeItem(key);
         return;
       }
-      window.localStorage.setItem(key, value3);
+      window.sessionStorage.setItem(key, value3);
     },
     clear() {
-      if (typeof window !== "undefined") window.localStorage.removeItem(key);
+      if (typeof window !== "undefined") window.sessionStorage.removeItem(key);
     }
   };
 }
@@ -1053,7 +1066,7 @@ function formFieldsFromMeta(fields) {
     };
   });
 }
-function formatCell(value3, kind) {
+function formatCell(value3, kind, format2) {
   if (value3 == null || value3 === "") return "\u2014";
   if (value3 && typeof value3 === "object" && !Array.isArray(value3) && kind !== "date") {
     return referenceOptionLabel(value3);
@@ -1063,7 +1076,8 @@ function formatCell(value3, kind) {
       return value3 ? "Sim" : "N\xE3o";
     case "date":
       try {
-        return new Date(value3).toLocaleDateString("pt-BR");
+        const date = new Date(value3);
+        return format2 === "datetime" ? date.toLocaleString("pt-BR", { dateStyle: "short", timeStyle: "short" }) : date.toLocaleDateString("pt-BR");
       } catch {
         return String(value3);
       }
@@ -1140,8 +1154,8 @@ function ChevronIcon({ direction }) {
 function PlusIcon() {
   return /* @__PURE__ */ jsx11("svg", { viewBox: "0 0 20 20", width: "17", height: "17", "aria-hidden": "true", children: /* @__PURE__ */ jsx11("path", { d: "M10 4v12M4 10h12", fill: "none", stroke: "currentColor", strokeWidth: "1.6", strokeLinecap: "round" }) });
 }
-function renderCell(value3, kind) {
-  const formatted = formatCell(value3, kind);
+function renderCell(value3, kind, format2) {
+  const formatted = formatCell(value3, kind, format2);
   if (kind === "enum") {
     const normalized3 = String(value3 ?? "").toLowerCase();
     const palette = /erro|cancel|inativo|recus|critica/.test(normalized3) ? "red" : /pendente|aguardando|rascunho/.test(normalized3) ? "orange" : /processando|conferencia|integrando|validando/.test(normalized3) ? "blue" : /ativo|sucesso|conclu|aplicada|disponivel|aprov/.test(normalized3) ? "green" : "gray";
@@ -1157,7 +1171,7 @@ function renderColumnCell(row, column, cellRenderers) {
   const value3 = row[column.field];
   const Renderer = column.renderer ? cellRenderers?.[column.renderer] : void 0;
   if (Renderer) return /* @__PURE__ */ jsx11(Renderer, { value: value3, row, column });
-  return renderCell(value3, column.kind);
+  return renderCell(value3, column.kind, column.format);
 }
 function DataGrid({
   resource,
@@ -2539,7 +2553,7 @@ import { Fragment as Fragment2, jsx as jsx15, jsxs as jsxs10 } from "react/jsx-r
 function format(value3, format2) {
   if (format2 === "currency") return new Intl.NumberFormat("pt-BR", { style: "currency", currency: "BRL" }).format(Number(value3 ?? 0));
   if (format2 === "percent") return `${Number(value3 ?? 0).toLocaleString("pt-BR")}%`;
-  if (format2 === "date") return formatCell(value3, "date");
+  if (format2 === "date" || format2 === "datetime") return formatCell(value3, "date", format2);
   return value3 == null || value3 === "" ? "\u2014" : String(value3);
 }
 function RelatedMetric({ card, relation, parent }) {
@@ -5277,7 +5291,7 @@ function Sidebar({ app, menu, registry }) {
 // package.json
 var package_default = {
   name: "@oondemand/oon-core-front",
-  version: "0.4.10",
+  version: "0.4.12",
   repository: {
     type: "git",
     url: "git+https://github.com/oondemand/oon-platform.git",
@@ -5733,16 +5747,7 @@ function AppAccessGuard({ children }) {
 
 // src/security/LoginPage.tsx
 import { useState as useState18 } from "react";
-import {
-  Box as Box25,
-  Button as Button18,
-  Flex as Flex18,
-  Heading as Heading14,
-  Input as Input10,
-  SimpleGrid as SimpleGrid6,
-  Text as Text26,
-  VStack as VStack5
-} from "@chakra-ui/react";
+import { Box as Box25, Button as Button18, Flex as Flex18, Heading as Heading14, Input as Input10, SimpleGrid as SimpleGrid6, Text as Text26, VStack as VStack5 } from "@chakra-ui/react";
 import { Link as Link3, Navigate as Navigate2, useLocation as useLocation4 } from "react-router-dom";
 import { jsx as jsx37, jsxs as jsxs26 } from "react/jsx-runtime";
 function tenantOptions(error) {
@@ -5753,17 +5758,22 @@ function tenantOptions(error) {
   return tenants.filter((tenant) => Boolean(tenant) && typeof tenant === "object").map((tenant) => ({
     id: String(tenant.id || ""),
     nome: String(tenant.nome || tenant.slug || tenant.id || ""),
-    slug: tenant.slug ? String(tenant.slug) : void 0
+    slug: tenant.slug ? String(tenant.slug) : void 0,
+    tipo: tenant.tipo ? String(tenant.tipo) : void 0,
+    status: tenant.status ? String(tenant.status) : void 0
   })).filter((tenant) => tenant.id && tenant.nome);
 }
 function safeRedirect(search) {
   const value3 = new URLSearchParams(search).get("redirect") || "/";
   if (!value3.startsWith("/") || value3.startsWith("//")) return "/";
-  if (value3.startsWith("/login") || value3.startsWith("/acesso-negado")) {
-    return "/";
-  }
+  if (value3.startsWith("/login") || value3.startsWith("/acesso-negado")) return "/";
   return value3;
 }
+function tenantUrl(path, tenantId) {
+  const target = new URL(path, window.location.origin);
+  target.searchParams.set("tenant", tenantId);
+  return target.toString();
+}
 function LoginPage({ app, onboardingEnabled = false }) {
   const { status, login } = useOonAuth();
   const location = useLocation4();
@@ -5772,168 +5782,92 @@ function LoginPage({ app, onboardingEnabled = false }) {
   const [submitting, setSubmitting] = useState18(false);
   const [message, setMessage] = useState18(null);
   const [tenants, setTenants] = useState18([]);
-  const [tenantId, setTenantId] = useState18("");
+  const [selectorMode, setSelectorMode] = useState18(false);
+  const [openingTenant, setOpeningTenant] = useState18(null);
   const redirect = safeRedirect(location.search);
-  if (status === "authenticated") {
-    return /* @__PURE__ */ jsx37(Navigate2, { to: redirect, replace: true });
-  }
-  if (status === "forbidden") {
-    return /* @__PURE__ */ jsx37(Navigate2, { to: "/acesso-negado", replace: true });
-  }
+  if (status === "authenticated" && !selectorMode) return /* @__PURE__ */ jsx37(Navigate2, { to: redirect, replace: true });
+  if (status === "forbidden") return /* @__PURE__ */ jsx37(Navigate2, { to: "/acesso-negado", replace: true });
   async function handleSubmit(event) {
     event.preventDefault();
+    if (tenants.length > 1) return;
     setSubmitting(true);
     setMessage(null);
     try {
-      if (tenants.length > 1 && !tenantId) {
-        setMessage("Selecione a organiza\xE7\xE3o para continuar.");
-        return;
-      }
-      await login(email.trim(), password, tenantId || void 0);
+      await login(email.trim(), password);
     } catch (error) {
       const authError = error;
       if (authError.code === "TENANT_SELECTION_REQUIRED") {
         const options = tenantOptions(authError);
         if (options.length > 1) {
           setTenants(options);
-          setTenantId("");
-          setMessage("Seu usu\xE1rio possui acesso a mais de uma organiza\xE7\xE3o. Selecione uma para continuar.");
+          setMessage("Escolha uma organiza\xE7\xE3o. O tenant ser\xE1 aberto em uma nova aba.");
           return;
         }
       }
       if (authError.status === 403) return;
-      setMessage(
-        authError.status === 401 ? "E-mail ou senha inv\xE1lidos." : authError.message || "N\xE3o foi poss\xEDvel entrar. Tente novamente."
-      );
+      setMessage(authError.status === 401 ? "E-mail ou senha inv\xE1lidos." : authError.message || "N\xE3o foi poss\xEDvel entrar. Tente novamente.");
     } finally {
       setSubmitting(false);
     }
   }
-  return /* @__PURE__ */ jsx37(Flex18, { minH: "100vh", align: "center", justify: "center", bg: "#F5F8FA", px: 4, children: /* @__PURE__ */ jsx37(
-    Box25,
-    {
-      width: "100%",
-      maxW: tenants.length > 1 ? "680px" : "440px",
-      bg: "white",
-      borderWidth: "1px",
-      borderColor: "#E4EBEF",
-      borderRadius: "18px",
-      boxShadow: "0 24px 70px rgba(7, 38, 46, 0.10)",
-      p: { base: 6, md: 9 },
-      children: /* @__PURE__ */ jsx37("form", { onSubmit: handleSubmit, children: /* @__PURE__ */ jsxs26(VStack5, { align: "stretch", gap: 6, children: [
-        /* @__PURE__ */ jsxs26(Box25, { children: [
-          /* @__PURE__ */ jsx37(
-            Text26,
-            {
-              color: "#39BFED",
-              fontSize: "xs",
-              fontWeight: "700",
-              letterSpacing: "0.12em",
-              textTransform: "uppercase",
-              children: "Central Oon"
-            }
-          ),
-          /* @__PURE__ */ jsx37(Heading14, { mt: 2, size: "lg", color: "#07262E", children: app.title ?? app.name }),
-          /* @__PURE__ */ jsx37(Text26, { mt: 2, color: "gray.600", fontSize: "sm", children: "Entre com seu usu\xE1rio autorizado para acessar este aplicativo." })
-        ] }),
-        /* @__PURE__ */ jsxs26(VStack5, { align: "stretch", gap: 4, children: [
-          /* @__PURE__ */ jsxs26(Box25, { children: [
-            /* @__PURE__ */ jsx37(Text26, { mb: 2, fontSize: "sm", fontWeight: "600", color: "#24323A", children: "E-mail" }),
-            /* @__PURE__ */ jsx37(
-              Input10,
-              {
-                type: "email",
-                value: email,
-                onChange: (event) => {
-                  setEmail(event.target.value);
-                  setTenants([]);
-                  setTenantId("");
-                },
-                autoComplete: "email",
-                placeholder: "voce@empresa.com.br",
-                required: true
-              }
-            )
-          ] }),
-          /* @__PURE__ */ jsxs26(Box25, { children: [
-            /* @__PURE__ */ jsx37(Text26, { mb: 2, fontSize: "sm", fontWeight: "600", color: "#24323A", children: "Senha" }),
-            /* @__PURE__ */ jsx37(
-              Input10,
-              {
-                type: "password",
-                value: password,
-                onChange: (event) => setPassword(event.target.value),
-                autoComplete: "current-password",
-                placeholder: "Sua senha",
-                required: true
-              }
-            )
-          ] }),
-          tenants.length > 1 ? /* @__PURE__ */ jsxs26(Box25, { children: [
-            /* @__PURE__ */ jsx37(Text26, { mb: 3, fontSize: "sm", fontWeight: "600", color: "#24323A", children: "Escolha o tenant para acessar" }),
-            /* @__PURE__ */ jsx37(SimpleGrid6, { columns: { base: 1, md: 2 }, gap: 3, children: tenants.map((tenant) => {
-              const selected = tenantId === tenant.id;
-              return /* @__PURE__ */ jsx37(
-                Button18,
-                {
-                  type: "button",
-                  variant: "outline",
-                  height: "auto",
-                  minH: "88px",
-                  justifyContent: "flex-start",
-                  whiteSpace: "normal",
-                  textAlign: "left",
-                  borderWidth: "2px",
-                  borderColor: selected ? "#39BFED" : "#D9E2E7",
-                  bg: selected ? "#EFFAFF" : "white",
-                  color: "#24323A",
-                  "aria-pressed": selected,
-                  onClick: () => {
-                    setTenantId(tenant.id);
-                    setMessage(null);
-                  },
-                  _hover: { borderColor: "#39BFED", bg: "#F6FCFE" },
-                  children: /* @__PURE__ */ jsxs26(VStack5, { align: "start", gap: 1, py: 3, children: [
-                    /* @__PURE__ */ jsx37(Text26, { fontWeight: "700", children: tenant.nome }),
-                    tenant.slug ? /* @__PURE__ */ jsx37(Text26, { fontSize: "xs", color: "gray.500", children: tenant.slug }) : null
-                  ] })
-                },
-                tenant.id
-              );
-            }) })
-          ] }) : null
-        ] }),
-        message ? /* @__PURE__ */ jsx37(
-          Box25,
-          {
-            role: "alert",
-            borderRadius: "10px",
-            bg: "red.50",
-            color: "red.700",
-            px: 4,
-            py: 3,
-            fontSize: "sm",
-            children: message
-          }
-        ) : null,
-        /* @__PURE__ */ jsx37(
-          Button18,
-          {
-            type: "submit",
-            bg: "#07262E",
-            color: "white",
-            _hover: { bg: "#0B3843" },
-            disabled: submitting || !email.trim() || !password || tenants.length > 1 && !tenantId,
-            children: submitting ? "Validando acesso..." : "Entrar"
-          }
-        ),
-        app.kind === "portal-cockpit" && onboardingEnabled ? /* @__PURE__ */ jsxs26(Text26, { textAlign: "center", fontSize: "sm", color: "gray.600", children: [
-          "Ainda n\xE3o possui acesso? ",
-          /* @__PURE__ */ jsx37(Link3, { to: "/cadastro", children: "Criar cadastro" })
-        ] }) : null
-      ] }) })
+  async function openTenant(tenant) {
+    if (openingTenant) return;
+    const popup = window.open("about:blank", "_blank");
+    if (!popup) {
+      setMessage("Permita pop-ups para abrir o tenant em uma nova aba.");
+      return;
     }
-  ) });
+    popup.opener = null;
+    setOpeningTenant(tenant.id);
+    setSelectorMode(true);
+    setMessage(null);
+    try {
+      if (status !== "authenticated") await login(email.trim(), password, tenant.id);
+      popup.location.replace(tenantUrl(redirect, tenant.id));
+      setPassword("");
+      setMessage(`${tenant.nome} foi aberto em uma nova aba. Escolha outro tenant quando precisar.`);
+    } catch (error) {
+      popup.close();
+      const authError = error;
+      setMessage(authError.message || "N\xE3o foi poss\xEDvel abrir o tenant.");
+    } finally {
+      setOpeningTenant(null);
+    }
+  }
+  return /* @__PURE__ */ jsx37(Flex18, { minH: "100vh", align: "center", justify: "center", bg: "#F5F8FA", px: 4, children: /* @__PURE__ */ jsx37(Box25, { width: "100%", maxW: tenants.length > 1 ? "760px" : "440px", bg: "white", borderWidth: "1px", borderColor: "#E4EBEF", borderRadius: "18px", boxShadow: "0 24px 70px rgba(7, 38, 46, 0.10)", p: { base: 6, md: 9 }, children: /* @__PURE__ */ jsx37("form", { onSubmit: handleSubmit, children: /* @__PURE__ */ jsxs26(VStack5, { align: "stretch", gap: 6, children: [
+    /* @__PURE__ */ jsxs26(Box25, { children: [
+      /* @__PURE__ */ jsx37(Text26, { color: "#39BFED", fontSize: "xs", fontWeight: "700", letterSpacing: "0.12em", textTransform: "uppercase", children: "Central Oon" }),
+      /* @__PURE__ */ jsx37(Heading14, { mt: 2, size: "lg", color: "#07262E", children: app.title ?? app.name }),
+      /* @__PURE__ */ jsx37(Text26, { mt: 2, color: "gray.600", fontSize: "sm", children: tenants.length > 1 ? "Abra uma ou mais organiza\xE7\xF5es para trabalhar em contextos separados." : "Entre com seu usu\xE1rio autorizado para acessar este aplicativo." })
+    ] }),
+    tenants.length <= 1 ? /* @__PURE__ */ jsxs26(VStack5, { align: "stretch", gap: 4, children: [
+      /* @__PURE__ */ jsxs26(Box25, { children: [
+        /* @__PURE__ */ jsx37(Text26, { mb: 2, fontSize: "sm", fontWeight: "600", color: "#24323A", children: "E-mail" }),
+        /* @__PURE__ */ jsx37(Input10, { type: "email", value: email, onChange: (event) => {
+          setEmail(event.target.value);
+          setTenants([]);
+          setSelectorMode(false);
+        }, autoComplete: "email", placeholder: "voce@empresa.com.br", required: true })
+      ] }),
+      /* @__PURE__ */ jsxs26(Box25, { children: [
+        /* @__PURE__ */ jsx37(Text26, { mb: 2, fontSize: "sm", fontWeight: "600", color: "#24323A", children: "Senha" }),
+        /* @__PURE__ */ jsx37(Input10, { type: "password", value: password, onChange: (event) => setPassword(event.target.value), autoComplete: "current-password", placeholder: "Sua senha", required: true })
+      ] })
+    ] }) : /* @__PURE__ */ jsxs26(Box25, { children: [
+      /* @__PURE__ */ jsx37(Text26, { mb: 3, fontSize: "sm", fontWeight: "600", color: "#24323A", children: "Escolha o tenant para acessar" }),
+      /* @__PURE__ */ jsx37(SimpleGrid6, { columns: { base: 1, md: 2 }, gap: 3, children: tenants.map((tenant) => /* @__PURE__ */ jsx37(Button18, { type: "button", variant: "outline", height: "auto", minH: "104px", justifyContent: "flex-start", whiteSpace: "normal", textAlign: "left", borderWidth: "2px", borderColor: "#D9E2E7", bg: "white", color: "#24323A", disabled: Boolean(openingTenant), "aria-label": `Abrir ${tenant.nome} em nova aba`, onClick: () => void openTenant(tenant), _hover: { borderColor: "#39BFED", bg: "#F6FCFE" }, children: /* @__PURE__ */ jsxs26(VStack5, { align: "start", gap: 1, py: 3, children: [
+        /* @__PURE__ */ jsx37(Text26, { fontWeight: "700", children: tenant.nome }),
+        /* @__PURE__ */ jsx37(Text26, { fontSize: "xs", color: "gray.500", children: [tenant.slug, tenant.tipo, tenant.status].filter(Boolean).join(" \xB7 ") }),
+        /* @__PURE__ */ jsx37(Text26, { fontSize: "xs", color: "#168EB9", children: openingTenant === tenant.id ? "Abrindo..." : "Abrir em nova aba" })
+      ] }) }, tenant.id)) })
+    ] }),
+    message ? /* @__PURE__ */ jsx37(Box25, { role: "status", borderRadius: "10px", bg: "blue.50", color: "blue.800", px: 4, py: 3, fontSize: "sm", children: message }) : null,
+    tenants.length <= 1 ? /* @__PURE__ */ jsx37(Button18, { type: "submit", bg: "#07262E", color: "white", _hover: { bg: "#0B3843" }, disabled: submitting || !email.trim() || !password, children: submitting ? "Validando acesso..." : "Entrar" }) : null,
+    app.kind === "portal-cockpit" && onboardingEnabled && tenants.length <= 1 ? /* @__PURE__ */ jsxs26(Text26, { textAlign: "center", fontSize: "sm", color: "gray.600", children: [
+      "Ainda n\xE3o possui acesso? ",
+      /* @__PURE__ */ jsx37(Link3, { to: "/cadastro", children: "Criar conta" })
+    ] }) : null
+  ] }) }) }) });
 }
 
 // src/security/FirstAccessPage.tsx