@scalio-cloud/ui 0.10.0 → 0.11.0

package/CHANGELOG.md

@@ -1,5 +1,12 @@
 # Changelog
 
+## 0.11.0
+- Self-hosted support (ADR 0022, T11; needs scalio-connect 0.7.0 in the backend): `supportApi` gets `status()` and
+  `setButtonHidden(hidden)`. The support drawer asks `status()` first; a self-hosted installation without a
+  connection shows no form, only a note and the button "Zum Scalio-Portal" (`<portal>/support`). The card
+  "Support-Verbindung" gets the switch "Support-Knopf in der Kopfzeile ausblenden". **Visible change** only where
+  the backend reports `link_only` or the client has `setButtonHidden`; no token changes.
+
 ## 0.10.0
 - `LicensePanel` takes more from an app's own `map`: a `hint` per usage bar (e.g. base + add-on seats), add-ons with
   `badges`, `detail`, `tone` (`info`/`warn`) and `removable: false`, `addonErrors` (invalid add-ons, removable),

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@scalio-cloud/ui",
-  "version": "0.10.0",
+  "version": "0.11.0",
   "description": "Scalio Control Room design tokens, Tailwind preset, self-hosted fonts, the shared app header, sign-in layout, sidebar and page blocks",
   "license": "SEE LICENSE IN README.md",
   "private": false,

package/react/labels.js

@@ -88,6 +88,12 @@ const LABELS = {
     supportConnStatus: { unpaired: "Nicht verbunden", pending: "Wartet auf Bestätigung", active: "Verbunden", blocked: "Gesperrt" },
     supportConnHelp: "Tickets aus dieser Installation gehen an den Scalio Support. Den einmaligen Code erhalten Sie im Scalio-Portal unter Support -> Verbundene Apps.",
     supportConnHelpConnected: "Tickets aus dieser Installation gehen an den Scalio Support.",
+    supportLinkOnly: "Diese Installation ist nicht mit dem Scalio Support verbunden. Eröffnen Sie Ihre Anfrage bitte im Scalio-Portal.",
+    supportLinkOnlyAdmin: "Ein Admin kann die Verbindung unter Einstellungen -> Support-Verbindung einrichten, dann gehen Anfragen direkt aus der App.",
+    supportOpenPortal: "Zum Scalio-Portal",
+    supportButtonHidden: "Support-Knopf in der Kopfzeile ausblenden",
+    supportButtonHiddenNote: "Der Support-Knopf ist ausgeblendet.",
+    supportButtonShownNote: "Der Support-Knopf ist wieder sichtbar.",
     supportConnPending: "Ein Administrator Ihrer Organisation muss die Verbindung im Scalio-Portal bestätigen.",
     supportConnBlocked: "Diese Installation ist für den Support gesperrt. Bitte wenden Sie sich an Scalio.",
     supportConnKeyLost: "Der Schlüssel dieser Verbindung kann nicht mehr gelesen werden. Bitte verbinden Sie neu.",
@@ -277,6 +283,12 @@ const LABELS = {
     supportConnStatus: { unpaired: "Not connected", pending: "Waiting for confirmation", active: "Connected", blocked: "Blocked" },
     supportConnHelp: "Tickets from this installation go to Scalio Support. You get the one-time code in the Scalio portal under Support -> Connected apps.",
     supportConnHelpConnected: "Tickets from this installation go to Scalio Support.",
+    supportLinkOnly: "This installation is not connected to Scalio Support. Please open your request in the Scalio portal.",
+    supportLinkOnlyAdmin: "An admin can set up the connection under Settings -> Support connection; then requests go straight from the app.",
+    supportOpenPortal: "Open the Scalio portal",
+    supportButtonHidden: "Hide the support button in the header",
+    supportButtonHiddenNote: "The support button is hidden.",
+    supportButtonShownNote: "The support button is visible again.",
     supportConnPending: "An administrator of your organisation must confirm the connection in the Scalio portal.",
     supportConnBlocked: "This installation is blocked for support. Please contact Scalio.",
     supportConnKeyLost: "The key of this connection can no longer be read. Please connect again.",

package/react/support.js

@@ -29,6 +29,8 @@ function supportApi(api) {
     connect: (portal_url, code) => data(api.post("/support/connection", { portal_url, code })),
     check: () => data(api.post("/support/connection/check")),
     disconnect: () => data(api.delete("/support/connection")),
+    status: () => data(api.get("/support/status")),
+    setButtonHidden: (hidden) => data(api.put("/support/connection/button", { hidden })),
   };
 }
 
@@ -223,8 +225,27 @@ function TicketDetail({ client, id, L, lang, onBack }) {
   );
 }
 
+// Self-hosted without a connection (ADR 0022, T11): no form, only the way to the portal's support page.
+function PortalLink({ status, L }) {
+  return h(
+    "div",
+    { className: "scalio-support-form", "data-testid": "support-link-only" },
+    h("p", { className: "scalio-support-meta" }, L.supportLinkOnly),
+    h("a", { className: "scalio-btn-primary", href: status.portal_page, target: "_blank", rel: "noopener noreferrer",
+      "data-testid": "support-portal-link" }, L.supportOpenPortal),
+    h("p", { className: "scalio-support-meta" }, L.supportLinkOnlyAdmin)
+  );
+}
+
 function SupportDesk({ client, page, lang, labels }) {
   const L = labelsFor(lang, labels);
+  const [status, setStatus] = React.useState(client.status ? null : {});
+  React.useEffect(() => {
+    if (!client.status) return undefined;
+    let alive = true;
+    client.status().then((d) => alive && setStatus(d || {})).catch(() => alive && setStatus({}));
+    return () => { alive = false; };
+  }, [client]);
   const [tab, setTab] = React.useState("new");
   const [ticket, setTicket] = React.useState(null);
   const [note, setNote] = React.useState("");
@@ -233,6 +254,8 @@ function SupportDesk({ client, page, lang, labels }) {
       type: "button", role: "tab", "aria-selected": tab === key, className: cx("scalio-support-tab", tab === key && "is-active"),
       onClick: () => { setTab(key); setTicket(null); setNote(""); }, "data-testid": `support-tab-${key}`,
     }, label);
+  if (status === null) return h("div", { className: "scalio-support-meta" }, L.loading);
+  if (status.link_only && status.portal_page) return h(PortalLink, { status, L });
   return h(
     React.Fragment,
     null,
@@ -313,6 +336,15 @@ function SupportConnection({ client, lang, labels, onChange }) {
       : null,
     note ? h("div", { className: "scalio-notice is-ok", "data-testid": "support-note" }, note) : null,
     error ? h("div", { className: "scalio-notice is-error", role: "alert", "data-testid": "support-error" }, error) : null,
+    client.setButtonHidden
+      ? h(
+          "label",
+          { className: "scalio-support-check", "data-testid": "support-button-hidden" },
+          h("input", { type: "checkbox", checked: !!st.button_hidden, disabled: busy,
+            onChange: (e) => { const hide = e.target.checked; run(() => client.setButtonHidden(hide), hide ? L.supportButtonHiddenNote : L.supportButtonShownNote); } }),
+          h("span", null, L.supportButtonHidden)
+        )
+      : null,
     connected
       ? h(
           "div",