@deviceinsight/ng-ui-scale-lib 9.14.0

package/dist/PropertiesEditPage-c84dc0d9.js

@@ -0,0 +1,370 @@
+import { at as e, cz as E, aK as V, dl as F, dd as L, dk as B, ag as d, ah as G, bc as U, bf as D, bi as h, b4 as w, dm as R, di as P, dn as k, aq as M, dp as H, dq as X, bN as _, aU as z, dr as Y } from "./ContextBarContext-f745a63a.js";
+import { useState as T, useEffect as $ } from "react";
+import { useLocation as J, useHistory as Q, useParams as W } from "react-router-dom";
+import { getPropertyById as Z, updateProperty as ee, createProperty as re } from "@deviceinsight/ng-ui-api-client";
+import { Button as v, Checkbox as A, Icon as K, ButtonRow as te, Spinner as se } from "@deviceinsight/ng-ui-basic-components";
+import { messageBoxError as O, ContentHeader as ae } from "@deviceinsight/ng-ui-components";
+import { P as ne } from "./react-router-f15627c1.js";
+import "react-dom";
+import "./extends-0a3e0827.js";
+function le(r) {
+  const { options: s, children: x, onChange: c, values: i, ...t } = r;
+  function a(u) {
+    i.includes(u.value) ? c(i.filter((f) => f !== u.value)) : c([...i, u.value]);
+  }
+  return /* @__PURE__ */ e.jsx(E, { ...t, children: /* @__PURE__ */ e.jsx("div", { className: "buttonpicker", children: s.map((u) => /* @__PURE__ */ e.jsx(
+    v,
+    {
+      onClick: () => a(u),
+      className: V({
+        active: i.includes(u.value)
+      }),
+      disabled: r.disabled,
+      children: /* @__PURE__ */ e.jsx(F, { translationDescriptor: u.label })
+    },
+    String(u.value)
+  )) }) });
+}
+function ie() {
+  const {
+    getValues: r,
+    formState: { errors: s },
+    trigger: x
+  } = L(), [c, i] = T(!!r("allowedValues")), {
+    field: { value: t, onChange: a },
+    fieldState: { invalid: u }
+  } = B({
+    name: "allowedValues",
+    rules: {
+      validate: (n) => n == null || n != null && n.some((p) => p !== "") ? void 0 : "Required"
+    }
+  });
+  function f(n) {
+    a(t == null ? void 0 : t.filter((p, m) => m !== n));
+  }
+  function b(n) {
+    a(t ? [...t, n] : [n]);
+  }
+  function g(n, p) {
+    a(t == null ? void 0 : t.map((m, j) => p === j ? n : m));
+  }
+  async function y(n) {
+    a(n ? [] : null), i(n), !n && u && await x();
+  }
+  return /* @__PURE__ */ e.jsxs(e.Fragment, { children: [
+    /* @__PURE__ */ e.jsxs(
+      E,
+      {
+        label: /* @__PURE__ */ e.jsxs("div", { className: "di allowed-values-header", children: [
+          /* @__PURE__ */ e.jsx(A, { type: "toggle", value: c, toggleSmall: !0, onChange: y }),
+          " ",
+          /* @__PURE__ */ e.jsx(d, { i18nKey: "properties.labels.allowedValues", children: "Allowed Values" })
+        ] }),
+        error: s.allowedValues ? "Required" : void 0,
+        className: "di allowed-values-container",
+        children: [
+          /* @__PURE__ */ e.jsx(A, { value: c, onChange: y }),
+          (t == null ? void 0 : t.length) === 0 ? /* @__PURE__ */ e.jsx("div", { className: "empty-placeholder", children: /* @__PURE__ */ e.jsx(d, { i18nKey: "properties.labels.allowedValuesEmptyPlaceholder", children: "No values" }) }) : /* @__PURE__ */ e.jsx("ul", { children: t == null ? void 0 : t.map((n, p) => /* @__PURE__ */ e.jsxs("li", { className: "item", children: [
+            /* @__PURE__ */ e.jsx(E, { className: "value-container", children: /* @__PURE__ */ e.jsx(
+              "input",
+              {
+                type: "text",
+                value: n,
+                onChange: (m) => g(m.target.value, p)
+              }
+            ) }),
+            /* @__PURE__ */ e.jsx(v, { onClick: () => f(p), children: /* @__PURE__ */ e.jsx(K, { del: !0 }) })
+          ] }, p)) })
+        ]
+      }
+    ),
+    c && /* @__PURE__ */ e.jsxs(v, { onClick: () => b(""), children: [
+      /* @__PURE__ */ e.jsx(K, { add: !0 }),
+      /* @__PURE__ */ e.jsx(d, { i18nKey: "properties.labels.allowedValuesAdd", children: "Add" })
+    ] })
+  ] });
+}
+const oe = ["STRING", "TEXT", "DATE", "LONG", "DOUBLE", "BOOLEAN", "IP", "GEO"].map((r) => ({
+  value: r,
+  name: r
+})), de = ["ASSET", "ASSET_GROUP", "ACCOUNT", "ACCOUNT_GROUP", "DATAPOINT"].map(
+  (r) => ({
+    value: r,
+    label: r
+  })
+);
+function ce() {
+  return {
+    key: "",
+    type: "STRING",
+    entityTargets: [],
+    addToAll: !1,
+    deletable: !0
+  };
+}
+function ue({ editedProperty: r, isReadonly: s, onSubmit: x, onCancel: c }) {
+  const { t: i } = G(), t = U({
+    defaultValues: r || ce()
+  }), {
+    control: a,
+    handleSubmit: u,
+    watch: f,
+    setError: b,
+    formState: { isSubmitting: g, isDirty: y }
+  } = t;
+  function n() {
+    async function l(o) {
+      try {
+        await x(o);
+      } catch (S) {
+        if (M.isAxiosError(S)) {
+          const { fieldName: N, message: C } = H(S, i);
+          N ? b(N, { message: C }) : O(C);
+        } else
+          O(X(i));
+      }
+    }
+    return u(l, (o) => {
+      console.warn("Validation error", o);
+    })();
+  }
+  const p = f("type"), m = !!r, j = p === "STRING" || p === "TEXT", I = !!f("allowedValues");
+  return /* @__PURE__ */ e.jsx(D, { ...t, children: /* @__PURE__ */ e.jsxs("div", { className: "property-form", children: [
+    /* @__PURE__ */ e.jsx(
+      h,
+      {
+        name: "key",
+        control: a,
+        rules: {
+          required: i("properties.form.validation.key.required", {
+            defaultValue: "Please enter a property key"
+          })
+        },
+        render: ({ field: l, fieldState: { error: o } }) => /* @__PURE__ */ e.jsx(
+          w,
+          {
+            ...l,
+            label: /* @__PURE__ */ e.jsx(d, { i18nKey: "properties.labels.key", children: "Key" }),
+            error: o == null ? void 0 : o.message,
+            required: !0,
+            disabled: s || m
+          }
+        )
+      }
+    ),
+    /* @__PURE__ */ e.jsx(
+      h,
+      {
+        name: "type",
+        control: a,
+        render: ({ field: l }) => /* @__PURE__ */ e.jsx(
+          R,
+          {
+            label: /* @__PURE__ */ e.jsx(d, { i18nKey: "properties.labels.type", children: "Type" }),
+            ...l,
+            options: oe,
+            required: !0,
+            disabled: s || m
+          }
+        )
+      }
+    ),
+    /* @__PURE__ */ e.jsx(
+      h,
+      {
+        name: "entityTargets",
+        control: a,
+        rules: { validate: (l) => l.length === 0 ? "Required" : void 0 },
+        render: ({ field: { value: l, onChange: o }, fieldState: { error: S } }) => /* @__PURE__ */ e.jsx(
+          le,
+          {
+            label: /* @__PURE__ */ e.jsx(d, { i18nKey: "properties.labels.entityTargets", children: "Entity targets" }),
+            values: l,
+            onChange: o,
+            options: de,
+            error: S ? i("properties.form.validation.entityTargets.required", {
+              defaultValue: "Please select a at least one entity target"
+            }) : void 0,
+            required: !0,
+            disabled: s
+          }
+        )
+      }
+    ),
+    /* @__PURE__ */ e.jsx(
+      h,
+      {
+        name: "addToAll",
+        control: a,
+        render: ({ field: l }) => /* @__PURE__ */ e.jsx(
+          P,
+          {
+            ...l,
+            label: /* @__PURE__ */ e.jsx(d, { i18nKey: "properties.labels.addToSearch", children: "Add to Search" }),
+            disabled: s || m
+          }
+        )
+      }
+    ),
+    /* @__PURE__ */ e.jsx(
+      h,
+      {
+        name: "unique",
+        control: a,
+        render: ({ field: { value: l, onChange: o } }) => /* @__PURE__ */ e.jsx(
+          P,
+          {
+            value: !!l,
+            onChange: o,
+            label: /* @__PURE__ */ e.jsx(d, { i18nKey: "properties.labels.unique", children: "Unique" }),
+            disabled: s
+          }
+        )
+      }
+    ),
+    /* @__PURE__ */ e.jsx(
+      h,
+      {
+        name: "final",
+        control: a,
+        render: ({ field: { value: l, onChange: o } }) => /* @__PURE__ */ e.jsx(
+          P,
+          {
+            value: !!l,
+            onChange: o,
+            label: /* @__PURE__ */ e.jsx(d, { i18nKey: "properties.labels.final", children: "Final" }),
+            disabled: s
+          }
+        )
+      }
+    ),
+    j && !I && /* @__PURE__ */ e.jsxs(e.Fragment, { children: [
+      /* @__PURE__ */ e.jsx(
+        h,
+        {
+          name: "minLength",
+          control: a,
+          render: ({ field: { value: l, ...o } }) => /* @__PURE__ */ e.jsx(
+            k,
+            {
+              ...o,
+              value: l ?? void 0,
+              label: /* @__PURE__ */ e.jsx(d, { i18nKey: "properties.label.minLength", children: "Minimum length" }),
+              placeholder: s ? i("properties.placeholder.notSet", { defaultValue: "Not set" }) : "0",
+              readOnly: s
+            }
+          )
+        }
+      ),
+      /* @__PURE__ */ e.jsx(
+        h,
+        {
+          name: "maxLength",
+          control: a,
+          render: ({ field: { value: l, ...o } }) => /* @__PURE__ */ e.jsx(
+            k,
+            {
+              ...o,
+              value: l ?? void 0,
+              label: /* @__PURE__ */ e.jsx(d, { i18nKey: "properties.label.maxLength", children: "Maximum length" }),
+              placeholder: s ? i("properties.placeholder.notSet", { defaultValue: "Not set" }) : "0",
+              readOnly: s
+            }
+          )
+        }
+      ),
+      /* @__PURE__ */ e.jsx(
+        h,
+        {
+          name: "regularExpression",
+          control: a,
+          render: ({ field: { value: l, ...o } }) => /* @__PURE__ */ e.jsx(
+            w,
+            {
+              ...o,
+              value: l ?? void 0,
+              label: /* @__PURE__ */ e.jsx(d, { i18nKey: "properties.labels.regularExpression", children: "Regular expression" }),
+              readOnly: s,
+              placeholder: s ? i("properties.placeholder.notSet", { defaultValue: "Not set" }) : ""
+            }
+          )
+        }
+      )
+    ] }),
+    p === "STRING" && /* @__PURE__ */ e.jsx(ie, {}),
+    /* @__PURE__ */ e.jsxs("div", { className: "formRequired", children: [
+      "* ",
+      /* @__PURE__ */ e.jsx(d, { i18nKey: "form.field.required", children: "required" })
+    ] }),
+    /* @__PURE__ */ e.jsxs(te, { dividing: !0, children: [
+      /* @__PURE__ */ e.jsx(v, { className: "with-spinner", primary: !0, onClick: n, disabled: g, children: /* @__PURE__ */ e.jsx(d, { i18nKey: "general.actions.save", children: "Save" }) }),
+      /* @__PURE__ */ e.jsx(v, { disabled: g, onClick: c, children: /* @__PURE__ */ e.jsx(d, { i18nKey: "general.actions.cancel", children: "Cancel" }) })
+    ] }),
+    /* @__PURE__ */ e.jsx(ne, { message: "", when: y && !g })
+  ] }) });
+}
+const pe = (r) => r ? {
+  id: "properties.create.title",
+  defaultValue: "Create Property"
+} : {
+  id: "properties.edit.title",
+  defaultValue: "Edit Property"
+}, me = /* @__PURE__ */ e.jsx(d, { i18nKey: "properties.saveSuccessMessage", children: "Property has been saved successfully." });
+function q(r) {
+  if (r.type === "STRING" && r.allowedValues && r.allowedValues.length > 0) {
+    const { regularExpression: s, maxLength: x, minLength: c, allowedValues: i, ...t } = r;
+    return { ...t, allowedValues: [...new Set(i.filter((a) => a !== ""))] };
+  }
+  if (r.allowedValues && r.allowedValues.length === 0) {
+    const { allowedValues: s, ...x } = r;
+    return x;
+  }
+  if (r.type !== "STRING" && r.type !== "TEXT") {
+    const { regularExpression: s, maxLength: x, minLength: c, ...i } = r;
+    return i;
+  }
+  return r;
+}
+function Te() {
+  const { pathname: r } = J(), s = Q(), { propertyKey: x } = W(), [c, i] = T(void 0), [t, a] = T(!0), [u, f] = T(!1);
+  async function b(m) {
+    try {
+      const j = await Z(m);
+      i(j);
+    } catch (j) {
+      console.error(j), f(!0);
+    } finally {
+      a(!1);
+    }
+  }
+  $(() => {
+    x && x !== "create" ? b(x) : a(!1);
+  }, [x]);
+  function g() {
+    s.push(r.substring(0, r.lastIndexOf("/")));
+  }
+  async function y(m) {
+    c ? await ee(q(m)) : await re(q(m)), Y(me), g();
+  }
+  function n() {
+    g();
+  }
+  if (u)
+    return /* @__PURE__ */ e.jsx(_, {});
+  const p = pe(!c);
+  return t ? /* @__PURE__ */ e.jsx(se, { center: !0 }) : /* @__PURE__ */ e.jsxs(e.Fragment, { children: [
+    /* @__PURE__ */ e.jsx(ae, { title: p, parentPageLink: !0 }),
+    /* @__PURE__ */ e.jsx(
+      ue,
+      {
+        editedProperty: c,
+        isReadonly: !!c && !z(["UPDATE_PROPERTY"]),
+        onSubmit: y,
+        onCancel: n
+      }
+    )
+  ] });
+}
+export {
+  Te as default
+};

package/dist/PropertiesList-fe8aa64d.js

@@ -0,0 +1,265 @@
+import { aU as c, at as t, ag as a, b9 as f, ah as y, d8 as b, dc as T } from "./ContextBarContext-f745a63a.js";
+import { useContext as m, useState as h, useEffect as P } from "react";
+import { deleteProperty as A } from "@deviceinsight/ng-ui-api-client";
+import { Bubble as g, Button as x, Icon as I, withConfirm as O } from "@deviceinsight/ng-ui-basic-components";
+import { ContentHeader as E } from "@deviceinsight/ng-ui-components";
+import { Link as v } from "react-router-dom";
+import "react-dom";
+const D = [
+  "name",
+  "urn",
+  "parentId",
+  "createdAt",
+  "assetGroupId",
+  "accountNumber",
+  "username",
+  "emailAddress",
+  "accountGroupId",
+  "assetGroupDefinitionId",
+  "description",
+  "locale",
+  "timezone",
+  "state",
+  "transitiveAssetGroupId",
+  "transitiveAssetGroupDefinitionId",
+  "isGateway",
+  "gatewayId",
+  "roleId",
+  "displayName",
+  "definitionId"
+];
+function G(n, l) {
+  const o = c(["DELETE_PROPERTY"]);
+  return [
+    {
+      name: "propertyKey",
+      label: /* @__PURE__ */ t.jsx(a, { i18nKey: "properties.tableHeaders.key", children: "Property" }),
+      sortable: !0,
+      filterable: {
+        filterType: "text",
+        filterFn: (e, r) => e.key.toLowerCase().indexOf(r.toLowerCase()) >= 0
+      },
+      render: (e) => /* @__PURE__ */ t.jsx(
+        v,
+        {
+          to: `properties/${e.key}`,
+          state: e,
+          children: e.key
+        }
+      )
+    },
+    {
+      name: "propertyType",
+      label: /* @__PURE__ */ t.jsx(a, { i18nKey: "properties.tableHeaders.type", children: "Type" }),
+      width: "10%",
+      filterable: {
+        filterType: "options",
+        filterOptions: [
+          {
+            value: "STRING",
+            label: {
+              id: "string",
+              defaultValue: "String"
+            }
+          },
+          {
+            value: "TEXT",
+            label: {
+              id: "text",
+              defaultValue: "Text"
+            }
+          },
+          {
+            value: "DATE",
+            label: {
+              id: "date",
+              defaultValue: "Date"
+            }
+          },
+          {
+            value: "LONG",
+            label: {
+              id: "long",
+              defaultValue: "Long"
+            }
+          },
+          {
+            value: "DOUBLE",
+            label: {
+              id: "double",
+              defaultValue: "Double"
+            }
+          },
+          {
+            value: "BOOLEAN",
+            label: {
+              id: "boolean",
+              defaultValue: "Boolean"
+            }
+          },
+          {
+            value: "IP",
+            label: {
+              id: "ip",
+              defaultValue: "Ip"
+            }
+          },
+          {
+            value: "GEO",
+            label: {
+              id: "geo",
+              defaultValue: "Geo"
+            }
+          }
+        ],
+        filterFn: (e, r) => e.type === r
+      },
+      render: (e) => e.type
+    },
+    {
+      name: "propertyEntityTargets",
+      label: /* @__PURE__ */ t.jsx(a, { i18nKey: "properties.tableHeaders.entityTargets", children: "Scope" }),
+      width: "30%",
+      filterable: {
+        filterType: "options",
+        filterOptions: [
+          {
+            value: "DATAPOINT",
+            label: {
+              id: "properties.filterOptions.datapoint",
+              defaultValue: "Datapoint"
+            }
+          },
+          {
+            value: "ASSET",
+            label: {
+              id: "properties.filterOptions.asset",
+              defaultValue: "Asset"
+            }
+          },
+          {
+            value: "ASSET_GROUP",
+            label: {
+              id: "properties.filterOptions.assetGroup",
+              defaultValue: "Asset Group"
+            }
+          },
+          {
+            value: "ACCOUNT",
+            label: {
+              id: "properties.filterOptions.account",
+              defaultValue: "Account"
+            }
+          },
+          {
+            value: "ACCOUNT_GROUP",
+            label: {
+              id: "properties.filterOptions.accountGroup",
+              defaultValue: "Account Group"
+            }
+          }
+        ],
+        filterFn: (e, r) => e.entityTargets.includes(r)
+      },
+      render: (e) => [...e.entityTargets].sort().join(", ")
+    },
+    {
+      name: "actions",
+      label: "",
+      width: "10%",
+      align: "right",
+      render: (e) => {
+        const r = D.includes(e.key);
+        if (o) {
+          const i = /* @__PURE__ */ t.jsx(
+            x,
+            {
+              naked: !0,
+              title: {
+                id: "properties.tableHeaders.deleteProperty",
+                defaultValue: "Delete this Property"
+              },
+              onClick: () => l(e),
+              disabled: r,
+              children: /* @__PURE__ */ t.jsx(I, { del: !0 })
+            }
+          );
+          return r ? /* @__PURE__ */ t.jsx(
+            g,
+            {
+              content: /* @__PURE__ */ t.jsx(a, { i18nKey: "properties.tableHeaders.reserved", children: "This property is reserved and can't be deleted" }),
+              children: i
+            }
+          ) : i;
+        } else
+          return null;
+      }
+    }
+  ];
+}
+const C = {
+  page: 0,
+  size: 15,
+  sort: {
+    property: "key",
+    direction: "ASC"
+  }
+}, V = ({ confirm: n }) => {
+  const { properties: l, reloadProperties: o } = m(f), [e, r] = h(!1), { t: i } = y(), d = /* @__PURE__ */ t.jsx(a, { i18nKey: "portalAdmin.sidebarElements.properties.create", children: "Create new property" });
+  async function p() {
+    try {
+      r(!0), await o();
+    } finally {
+      r(!1);
+    }
+  }
+  P(() => {
+    p();
+  }, []);
+  async function u(s) {
+    await n(
+      {
+        id: "properties.confirmDeletePropertyTitle",
+        defaultValue: "Delete Property"
+      },
+      {
+        id: "properties.confirmDeletePropertyMessage",
+        defaultValue: "Do you really want to delete this Property?"
+      }
+    ), r(!0), await A(s), await p();
+  }
+  return /* @__PURE__ */ t.jsxs("div", { "data-testid": "properties-list", children: [
+    /* @__PURE__ */ t.jsx(
+      E,
+      {
+        title: {
+          id: "route.label.properties.name",
+          defaultValue: "Properties"
+        }
+      }
+    ),
+    /* @__PURE__ */ t.jsx(
+      b,
+      {
+        tooltip: d,
+        authorities: "CREATE_PROPERTY",
+        path: "properties/create",
+        dataTestId: "create-property-button"
+      }
+    ),
+    /* @__PURE__ */ t.jsx(
+      T,
+      {
+        columnDefs: G(i, u),
+        items: l,
+        isLoading: e,
+        uniqueItemKey: (s) => s.key,
+        paginationSettings: C,
+        "data-testid": "properties-table"
+      }
+    )
+  ] });
+}, K = O(V);
+export {
+  K as default
+};