@truedat/df 5.0.0 → 5.0.2

package/src/components/hierarchies/__tests__/__snapshots__/Hierarchy.spec.js.snap

@@ -0,0 +1,186 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`<Hierarchy /> matches snapshot with edition mode 1`] = `
+<div>
+  <div
+    class="column"
+  >
+    <div
+      class="row"
+    >
+      <div
+        style="display: flex; flex-direction: row; align-items: self-start;"
+      >
+        <div
+          class="ui input"
+        >
+          <input
+            placeholder="Hierarchy name"
+            type="text"
+            value="Baggins"
+          />
+        </div>
+        <div
+          class="description_wrapper"
+        >
+          <div
+            class="description"
+          >
+            bar
+          </div>
+        </div>
+      </div>
+    </div>
+    <ul
+      class="wtree expanded"
+    >
+      <li>
+        <i
+          aria-hidden="true"
+          class="cut large icon li_trash"
+          style="cursor: pointer; visibility: hidden;"
+          title="Delete node"
+        />
+        <div
+          style="display: flex; flex-direction: row; align-items: self-start;"
+        >
+          <div>
+            <div
+              class="ui left labeled input"
+            >
+              <div
+                class="ui basic label"
+                title="Expand"
+              >
+                <i
+                  aria-hidden="true"
+                  class="circle fitted icon"
+                  style="cursor: pointer;"
+                />
+              </div>
+              <input
+                placeholder="Node"
+                type="text"
+                value="Fosco"
+              />
+            </div>
+          </div>
+          <div
+            class="description_wrapper"
+          >
+            <div
+              class="description"
+            >
+              Add description
+            </div>
+          </div>
+        </div>
+      </li>
+      <li
+        class="add_node"
+      >
+        <div>
+          <form
+            class="ui form"
+          >
+            <div
+              class="ui input"
+            >
+              <input
+                placeholder="New node"
+                type="text"
+                value=""
+              />
+            </div>
+          </form>
+        </div>
+      </li>
+    </ul>
+  </div>
+</div>
+`;
+
+exports[`<Hierarchy /> matches the last snapshot with edition mode false 1`] = `
+<div>
+  <div
+    class="column"
+  >
+    <div
+      class="row"
+    >
+      <div
+        style="display: flex; flex-direction: row; align-items: self-start;"
+      >
+        <div
+          class="ui disabled input"
+          style="opacity: 1;"
+        >
+          <input
+            disabled=""
+            placeholder="Hierarchy name"
+            tabindex="-1"
+            type="text"
+            value="Baggins"
+          />
+        </div>
+        <div
+          class="description_wrapper"
+        >
+          <div
+            class="description disabled"
+          >
+            bar
+          </div>
+        </div>
+      </div>
+    </div>
+    <ul
+      class="wtree expanded"
+    >
+      <li>
+        <i
+          aria-hidden="true"
+          class="cut large icon li_trash"
+          style="cursor: pointer; visibility: hidden;"
+          title="Delete node"
+        />
+        <div
+          style="display: flex; flex-direction: row; align-items: self-start;"
+        >
+          <div>
+            <div
+              class="ui disabled left labeled input"
+              style="opacity: 1;"
+            >
+              <div
+                class="ui basic label"
+                title="Expand"
+              >
+                <i
+                  aria-hidden="true"
+                  class="circle fitted icon"
+                  style="cursor: pointer;"
+                />
+              </div>
+              <input
+                disabled=""
+                placeholder="Node"
+                tabindex="-1"
+                type="text"
+                value="Fosco"
+              />
+            </div>
+          </div>
+          <div
+            class="description_wrapper"
+          >
+            <div
+              class="description disabled"
+            />
+          </div>
+        </div>
+      </li>
+    </ul>
+  </div>
+</div>
+`;

package/src/components/hierarchies/__tests__/__snapshots__/HierarchyCrumbs.spec.js.snap

@@ -0,0 +1,102 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`<HierarchyCrumbs /> matches the latest snapshot 1`] = `
+Object {
+  "asFragment": [Function],
+  "baseElement": <body>
+    <div>
+      <div
+        class="ui breadcrumb"
+      >
+        <a
+          class="section"
+          href="/hierarchies"
+        >
+          Hierarchies
+        </a>
+        <i
+          aria-hidden="true"
+          class="right angle icon divider"
+        />
+        <div
+          class="active section"
+        >
+          foo
+        </div>
+      </div>
+    </div>
+  </body>,
+  "container": <div>
+    <div
+      class="ui breadcrumb"
+    >
+      <a
+        class="section"
+        href="/hierarchies"
+      >
+        Hierarchies
+      </a>
+      <i
+        aria-hidden="true"
+        class="right angle icon divider"
+      />
+      <div
+        class="active section"
+      >
+        foo
+      </div>
+    </div>
+  </div>,
+  "debug": [Function],
+  "findAllByAltText": [Function],
+  "findAllByDisplayValue": [Function],
+  "findAllByLabelText": [Function],
+  "findAllByPlaceholderText": [Function],
+  "findAllByRole": [Function],
+  "findAllByTestId": [Function],
+  "findAllByText": [Function],
+  "findAllByTitle": [Function],
+  "findByAltText": [Function],
+  "findByDisplayValue": [Function],
+  "findByLabelText": [Function],
+  "findByPlaceholderText": [Function],
+  "findByRole": [Function],
+  "findByTestId": [Function],
+  "findByText": [Function],
+  "findByTitle": [Function],
+  "getAllByAltText": [Function],
+  "getAllByDisplayValue": [Function],
+  "getAllByLabelText": [Function],
+  "getAllByPlaceholderText": [Function],
+  "getAllByRole": [Function],
+  "getAllByTestId": [Function],
+  "getAllByText": [Function],
+  "getAllByTitle": [Function],
+  "getByAltText": [Function],
+  "getByDisplayValue": [Function],
+  "getByLabelText": [Function],
+  "getByPlaceholderText": [Function],
+  "getByRole": [Function],
+  "getByTestId": [Function],
+  "getByText": [Function],
+  "getByTitle": [Function],
+  "queryAllByAltText": [Function],
+  "queryAllByDisplayValue": [Function],
+  "queryAllByLabelText": [Function],
+  "queryAllByPlaceholderText": [Function],
+  "queryAllByRole": [Function],
+  "queryAllByTestId": [Function],
+  "queryAllByText": [Function],
+  "queryAllByTitle": [Function],
+  "queryByAltText": [Function],
+  "queryByDisplayValue": [Function],
+  "queryByLabelText": [Function],
+  "queryByPlaceholderText": [Function],
+  "queryByRole": [Function],
+  "queryByTestId": [Function],
+  "queryByText": [Function],
+  "queryByTitle": [Function],
+  "rerender": [Function],
+  "unmount": [Function],
+}
+`;

package/src/components/hierarchies/__tests__/__snapshots__/HierarchyView.spec.js.snap

@@ -0,0 +1,145 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`<HierarchyView /> matches the last snapshot 1`] = `
+<div>
+  <div
+    class="ui breadcrumb"
+  >
+    <a
+      class="section"
+      href="/hierarchies"
+    >
+      Hierarchies
+    </a>
+    <i
+      aria-hidden="true"
+      class="right angle icon divider"
+    />
+    <div
+      class="active section"
+    >
+      Baggins
+    </div>
+  </div>
+  <div
+    class="ui segment"
+  >
+    <h2
+      class="ui header"
+    >
+      <div
+        class="actions_wrapper"
+      >
+        <div
+          class="actions"
+        >
+          <a
+            class="ui primary right floated button"
+            href="/hierarchies/1/edit"
+            role="button"
+          >
+            Edit
+          </a>
+          <button
+            class="ui secondary right floated button"
+          >
+            Delete
+          </button>
+        </div>
+      </div>
+      <i
+        aria-hidden="true"
+        class="tree circular icon"
+      />
+      <div
+        class="content"
+      >
+        Baggins
+        <div
+          class="sub header"
+        />
+      </div>
+    </h2>
+    <div
+      class="ui bottom attached segment"
+    >
+      <div
+        class="column"
+      >
+        <div
+          class="row"
+        >
+          <div
+            style="display: flex; flex-direction: row; align-items: self-start;"
+          >
+            <div
+              class="ui disabled input"
+              style="opacity: 1;"
+            >
+              <input
+                disabled=""
+                placeholder="Hierarchy name"
+                tabindex="-1"
+                type="text"
+                value="Baggins"
+              />
+            </div>
+            <div
+              class="description_wrapper"
+            >
+              <div
+                class="description disabled"
+              />
+            </div>
+          </div>
+        </div>
+        <ul
+          class="wtree expanded"
+        >
+          <li>
+            <i
+              aria-hidden="true"
+              class="cut large icon li_trash"
+              style="cursor: pointer; visibility: hidden;"
+              title="Delete node"
+            />
+            <div
+              style="display: flex; flex-direction: row; align-items: self-start;"
+            >
+              <div>
+                <div
+                  class="ui disabled left labeled input"
+                  style="opacity: 1;"
+                >
+                  <div
+                    class="ui basic label"
+                  >
+                    <i
+                      aria-hidden="true"
+                      class="circle outline fitted icon"
+                    />
+                  </div>
+                  <input
+                    disabled=""
+                    placeholder="Node"
+                    tabindex="-1"
+                    type="text"
+                    value="Fosco"
+                  />
+                </div>
+              </div>
+              <div
+                class="description_wrapper"
+              >
+                <div
+                  class="description disabled"
+                />
+              </div>
+            </div>
+          </li>
+        </ul>
+      </div>
+    </div>
+  </div>
+</div>
+`;

package/src/components/hierarchies/index.js

@@ -0,0 +1,3 @@
+import HierarchyRoutes from "./HierarchyRoutes";
+
+export { HierarchyRoutes };

package/src/components/index.js

@@ -1 +1,2 @@
 export * from "../templates/components";
+export * from "./hierarchies";

package/src/hooks/useHierarchies.js

@@ -0,0 +1,111 @@
+import _ from "lodash/fp";
+import { compile } from "path-to-regexp";
+import { mutate } from "swr";
+import useSWR from "swr";
+import useSWRMutations from "swr/mutation";
+import {
+  apiJson,
+  apiJsonPatch,
+  apiJsonPost,
+  apiJsonDelete,
+} from "@truedat/core/services/api";
+import { API_HIERARCHIES, API_HIERARCHY } from "../api/hierarchies";
+
+const newHierarchy = {
+  name: "",
+  description: null,
+  nodes: [],
+};
+
+export const useHierarchies = () => {
+  const toApiPath = compile(API_HIERARCHIES);
+  const url = toApiPath();
+  const { data, error } = useSWR(url, apiJson);
+  return { data: data?.data?.data, error, loading: !error && !data };
+};
+
+export const useInitialHiearchy = () => {
+  return {
+    data: newHierarchy,
+    error: null,
+    loading: false,
+  };
+};
+
+export const useHierarchy = (id) => {
+  const toApiPath = compile(API_HIERARCHY);
+  const url = toApiPath({ id: id });
+  const { data, error } = useSWR(url, apiJson);
+  const back_hierarchy = data?.data?.data;
+  const front_hierarchy = toFront(back_hierarchy);
+  return { data: front_hierarchy, error, loading: !error && !data };
+};
+
+export const useHierarchyPatch = (id, callback) => {
+  const toApiPath = compile(API_HIERARCHY);
+  const url = toApiPath({ id });
+  return useSWRMutations(url, (url, { arg }) =>
+    apiJsonPatch(url, toBack(arg)).then(
+      ({ data }) =>
+        mutate(API_HIERARCHIES) && mutate(url, data) && callback(data?.data)
+    )
+  );
+};
+
+export const useHierarchyPost = (callback) => {
+  return useSWRMutations(API_HIERARCHIES, (url, { arg }) =>
+    apiJsonPost(url, toBack(arg)).then(
+      ({ data }) => mutate(API_HIERARCHIES) && callback(data?.data)
+    )
+  );
+};
+
+export const useHierarchyDelete = (id, callback) => {
+  const toApiPath = compile(API_HIERARCHY);
+  const url = toApiPath({ id });
+  return useSWRMutations(url, (url, { arg }) =>
+    apiJsonDelete(url, toBack(arg)).then(
+      ({ data }) => mutate(API_HIERARCHIES) && callback(data?.data)
+    )
+  );
+};
+
+const toFront = (hierarchy) => {
+  return hierarchy
+    ? {
+        ...hierarchy,
+        nodes: _.flow(
+          _.pathOr([], "nodes"),
+          _.map((node) => {
+            return {
+              id: node.node_id,
+              parentId: node.parent_id,
+              name: node.name,
+              description: node.description,
+            };
+          })
+        )(hierarchy),
+      }
+    : hierarchy;
+};
+
+const toBack = (hierarchy) => {
+  return hierarchy
+    ? {
+        hierarchy: {
+          ...hierarchy,
+          nodes: _.flow(
+            _.pathOr([], "nodes"),
+            _.map((node) => {
+              return {
+                node_id: node.id,
+                parent_id: node.parentId,
+                name: node.name,
+                description: node.description,
+              };
+            })
+          )(hierarchy),
+        },
+      }
+    : hierarchy;
+};