@truedat/bg 4.48.9 → 4.48.12

package/src/taxonomy/components/Domains.js

@@ -28,7 +28,7 @@ export const Domains = ({ domainsLoading, createDomain }) => (
         <Route
           exact
           path={DOMAINS_NEW}
-          render={() => <DomainForm handleSubmit={createDomain} />}
+          render={() => <DomainForm onSubmit={createDomain} />}
         />
       </Switch>
     </Segment>

package/src/taxonomy/components/EditDomain.js

@@ -1,3 +1,4 @@
+import _ from "lodash/fp";
 import React from "react";
 import PropTypes from "prop-types";
 import { connect } from "react-redux";
@@ -7,23 +8,24 @@ import { updateDomain } from "../routines";
 import DomainForm from "./DomainForm";
 import DomainCrumbs from "./DomainCrumbs";
 
-export const EditDomain = ({ domain, updateDomain }) => (
-  <>
-    <DomainCrumbs actionCrumb="domain.actions.edit.header" />
-    <Container as={Segment} text>
-      <Header as="h2">
-        <Icon name="cube" />
-        <Header.Content>
-          <FormattedMessage id="domain.actions.edit.header" />
-        </Header.Content>
-      </Header>
-      <DomainForm handleSubmit={updateDomain} domain={domain} />
-    </Container>
-  </>
-);
+export const EditDomain = ({ domain, updateDomain }) =>
+  _.isEmpty(domain) ? null : (
+    <>
+      <DomainCrumbs actionCrumb="domain.actions.edit.header" />
+      <Container as={Segment} text>
+        <Header as="h2">
+          <Icon name="cube" />
+          <Header.Content>
+            <FormattedMessage id="domain.actions.edit.header" />
+          </Header.Content>
+        </Header>
+        <DomainForm onSubmit={updateDomain} domain={domain} />
+      </Container>
+    </>
+  );
 
 EditDomain.propTypes = {
-  domain: PropTypes.object.isRequired,
+  domain: PropTypes.object,
   updateDomain: PropTypes.func.isRequired,
 };
 

package/src/taxonomy/components/NewDomain.js

@@ -15,18 +15,10 @@ export const NewDomain = ({ domain, createDomain }) => (
       <Header as="h2">
         <Icon name="cube" />
         <Header.Content>
-          {!_.isEmpty(domain) && (
-            <FormattedMessage id="domain.actions.create" />
-          )}
-          {_.isEmpty(domain) && (
-            <FormattedMessage id="domains.actions.create" />
-          )}
+          <FormattedMessage id="domain.actions.create" />
         </Header.Content>
       </Header>
-      <DomainForm
-        handleSubmit={createDomain}
-        domain={{ parent_id: domain.id }}
-      />
+      <DomainForm onSubmit={createDomain} domain={{ parent_id: domain.id }} />
     </Container>
   </>
 );

package/src/taxonomy/components/__tests__/DomainForm.spec.js

@@ -1,23 +1,26 @@
 import React from "react";
-import { shallowWithIntl } from "@truedat/test/intl-stub";
+import userEvent from "@testing-library/user-event";
+import { render } from "@truedat/test/render";
 import { DomainForm } from "../DomainForm";
 
 describe("<DomainForm />", () => {
-  const handleSubmit = jest.fn();
+  const onSubmit = jest.fn();
   const domain = { id: 1, name: "nn", external_id: "foo", description: "dd" };
   const isSubmitting = false;
-  const props = { domain, handleSubmit, isSubmitting };
+  const props = { domain, onSubmit, isSubmitting };
 
-  it("matches the latest snapshot", () => {
-    const wrapper = shallowWithIntl(<DomainForm {...props} />);
-    expect(wrapper).toMatchSnapshot();
+  it("matches the latest snapshot", async () => {
+    const { container, findByRole } = render(<DomainForm {...props} />);
+    await findByRole("button", { name: "Save" });
+    expect(container).toMatchSnapshot();
   });
 
-  it("disables submit button when there are uniformed mandatory fields", () => {
-    const wrapper = shallowWithIntl(<DomainForm {...props} />);
-    wrapper.setState({ touched: true });
-    expect(wrapper.find({ type: "submit" }).prop("disabled")).toBeFalsy();
-    wrapper.setState({ domain: { ...props, external_id: null } });
-    expect(wrapper.find({ type: "submit" }).prop("disabled")).toBeTruthy();
+  it("enables submit when required fields have values", async () => {
+    const props = { domain: {}, onSubmit: jest.fn() };
+    const { findByRole } = render(<DomainForm {...props} />);
+    expect(await findByRole("button", { name: "Save" })).toBeDisabled();
+    userEvent.type(await findByRole("textbox", { name: "Name" }), "name");
+    userEvent.type(await findByRole("textbox", { name: "External Id" }), "id");
+    expect(await findByRole("button", { name: "Save" })).toBeEnabled();
   });
 });

package/src/taxonomy/components/__tests__/DomainStructures.spec.js

@@ -0,0 +1,12 @@
+import React from "react";
+import { render } from "@truedat/test/render";
+import DomainStructures from "../DomainStructures";
+
+describe("<DomainStructures />", () => {
+  const renderOpts = { state: { domain: { id: 1, name: "domain" } } };
+
+  it("matches the latest snapshot", () => {
+    const { container } = render(<DomainStructures />, renderOpts);
+    expect(container).toMatchSnapshot();
+  });
+});

package/src/taxonomy/components/__tests__/__snapshots__/Domain.spec.js.snap

@@ -25,6 +25,11 @@ exports[`<Domain /> matches the latest snapshot (no subdomains) 1`] = `
           path="/domains/:id/concepts"
           render={[Function]}
         />
+        <Route
+          exact={true}
+          path="/domains/:id/structures"
+          render={[Function]}
+        />
       </Switch>
     </Segment>
   </Segment>
@@ -56,6 +61,11 @@ exports[`<Domain /> matches the latest snapshot (with subdomains) 1`] = `
           path="/domains/:id/concepts"
           render={[Function]}
         />
+        <Route
+          exact={true}
+          path="/domains/:id/structures"
+          render={[Function]}
+        />
       </Switch>
     </Segment>
   </Segment>

package/src/taxonomy/components/__tests__/__snapshots__/DomainForm.spec.js.snap

@@ -1,142 +1,182 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`<DomainForm /> matches the latest snapshot 1`] = `
-<Form
-  as="form"
-  onSubmit={[Function]}
->
-  <FormInput
-    as={[Function]}
-    autoComplete="off"
-    control={[Function]}
-    label="domain.props.name"
-    name="name"
-    onChange={[Function]}
-    placeholder="domain.props.name.placeholder"
-    required={true}
-    value="nn"
-  />
-  <FormInput
-    as={[Function]}
-    autoComplete="off"
-    control={[Function]}
-    label="domain.props.external_id"
-    name="external_id"
-    onChange={[Function]}
-    placeholder="domain.props.external_id.placeholder"
-    required={true}
-    value="foo"
-  />
-  <Segment>
-    <FormGroup
-      inline={true}
+<div>
+  <form
+    class="ui form"
+  >
+    <div
+      class="required field"
+    >
+      <label
+        for="name"
+      >
+        Name
+      </label>
+      <div
+        class="ui input"
+      >
+        <input
+          autocomplete="off"
+          id="name"
+          name="name"
+          placeholder="Domain Name"
+          required=""
+          type="text"
+          value="nn"
+        />
+      </div>
+    </div>
+    <div
+      class="required field"
+    >
+      <label
+        for="external_id"
+      >
+        External Id
+      </label>
+      <div
+        class="ui input"
+      >
+        <input
+          autocomplete="off"
+          id="external_id"
+          name="external_id"
+          placeholder="Domain's external reference"
+          required=""
+          type="text"
+          value="foo"
+        />
+      </div>
+    </div>
+    <div
+      class="field"
     >
       <label>
-        domain.props.domain_group
+        Group
       </label>
-    </FormGroup>
-    <Accordion>
-      <AccordionTitle
-        onClick={[Function]}
+      <div
+        aria-expanded="false"
+        class="ui basic search selection dropdown"
+        name="domain_group"
+        role="combobox"
       >
-        <Icon
-          as="i"
-          name="dropdown"
+        <input
+          aria-autocomplete="list"
+          autocomplete="off"
+          class="search"
+          tabindex="0"
+          type="text"
+          value=""
+        />
+        <div
+          aria-atomic="true"
+          aria-live="polite"
+          class="divider default text"
+          role="alert"
+        >
+          Domain Group
+        </div>
+        <i
+          aria-hidden="true"
+          class="dropdown icon"
         />
-        domain.domain_group.select
-         
-      </AccordionTitle>
-      <AccordionContent>
-        <FormDropdown
-          additionLabel={
-            <i
-              style={
-                Object {
-                  "color": "red",
-                }
-              }
-            >
-              domain.label.domain_group
-            </i>
-          }
-          allowAdditions={true}
-          as={[Function]}
-          basic={true}
-          clearable={true}
-          control={[Function]}
-          label="domain.props.domain_group"
-          name="domain_group"
-          onChange={[Function]}
-          options={Array []}
-          placeholder="domain.props.domain_group.placeholder"
-          search={true}
-          selection={true}
+        <div
+          class="menu transition"
+          role="listbox"
+        >
+          <div
+            class="message"
+          >
+            No results found.
+          </div>
+        </div>
+      </div>
+    </div>
+    <div
+      class="field"
+    >
+      <label>
+        Type
+      </label>
+      <div
+        aria-expanded="false"
+        class="ui basic search selection dropdown"
+        name="type"
+        role="combobox"
+      >
+        <input
+          aria-autocomplete="list"
+          autocomplete="off"
+          class="search"
+          tabindex="0"
+          type="text"
           value=""
         />
-      </AccordionContent>
-    </Accordion>
-  </Segment>
-  <FormDropdown
-    additionLabel={
-      <i
-        style={
-          Object {
-            "color": "red",
-          }
-        }
+        <div
+          aria-atomic="true"
+          aria-live="polite"
+          class="divider default text"
+          role="alert"
+        >
+          Domain Type
+        </div>
+        <i
+          aria-hidden="true"
+          class="dropdown icon"
+        />
+        <div
+          class="menu transition"
+          role="listbox"
+        >
+          <div
+            aria-checked="true"
+            aria-selected="true"
+            class="active selected item"
+            role="option"
+            style="pointer-events: all;"
+          >
+            <span
+              class="text"
+            />
+          </div>
+        </div>
+      </div>
+    </div>
+    <div
+      class="field"
+    >
+      <label>
+        Description
+      </label>
+      <textarea
+        autocomplete="off"
+        name="description"
+        placeholder="A description for this domain"
+        rows="3"
       >
-        New Domain Type: 
-      </i>
-    }
-    allowAdditions={true}
-    as={[Function]}
-    basic={true}
-    clearable={true}
-    control={[Function]}
-    label="domain.props.type"
-    name="type"
-    onChange={[Function]}
-    options={
-      Array [
-        Object {
-          "key": 0,
-          "text": "",
-          "value": "",
-        },
-      ]
-    }
-    placeholder="domain.props.type.placeholder"
-    search={true}
-    selection={true}
-    value=""
-  />
-  <FormTextArea
-    as={[Function]}
-    autoComplete="off"
-    control={[Function]}
-    label="domain.props.description"
-    maxLength={255}
-    name="description"
-    onChange={[Function]}
-    placeholder="domain.props.description.placeholder"
-    required={true}
-    value="dd"
-  />
-  <div
-    className="actions"
-  >
-    <HistoryBackButton
-      content="actions.cancel"
-      disabled={false}
-    />
-    <Button
-      as="button"
-      content="actions.save"
-      disabled={true}
-      loading={false}
-      primary={true}
-      type="submit"
-    />
-  </div>
-</Form>
+        dd
+      </textarea>
+    </div>
+    <div
+      class="actions"
+    >
+      <button
+        class="ui primary disabled right floated button"
+        disabled=""
+        tabindex="-1"
+        type="submit"
+      >
+        Save
+      </button>
+      <a
+        class="ui secondary button"
+        href="/"
+        role="button"
+      >
+        Cancel
+      </a>
+    </div>
+  </form>
+</div>
 `;

package/src/taxonomy/components/__tests__/__snapshots__/DomainStructures.spec.js.snap

@@ -0,0 +1,151 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`<DomainStructures /> matches the latest snapshot 1`] = `
+<div>
+  <div
+    aria-expanded="false"
+    class="ui floating dropdown button icon group-actions button-update"
+    role="listbox"
+    tabindex="0"
+  >
+    <i
+      aria-hidden="true"
+      class="ellipsis vertical icon"
+    />
+    <div
+      class="menu transition left"
+    >
+      <div
+        class="divider"
+      />
+      <div
+        aria-disabled="true"
+        class="disabled item"
+        role="option"
+      >
+        <i
+          aria-hidden="true"
+          class="download icon"
+        />
+        <span>
+          Download structures metadata
+        </span>
+        <p
+          class="menu-item-description"
+        >
+          You must search or filter to download structures
+        </p>
+      </div>
+      <div
+        aria-disabled="true"
+        class="disabled item"
+        role="option"
+      >
+        <i
+          aria-hidden="true"
+          class="download icon"
+        />
+        <span>
+          Download editable structures metadata
+        </span>
+        <p
+          class="menu-item-description"
+        >
+          You must search or filter to download structures
+        </p>
+      </div>
+      <div
+        class="divider"
+      />
+    </div>
+  </div>
+  <div
+    class="ui action left icon input"
+  >
+    <i
+      aria-hidden="true"
+      class="search link icon"
+    />
+    <input
+      placeholder="Search structures..."
+      type="text"
+      value=""
+    />
+    <button
+      class="ui icon button"
+    >
+      <i
+        aria-hidden="true"
+        class="calendar alternate outline icon"
+      />
+    </button>
+    <div
+      aria-expanded="false"
+      class="ui button floating labeled scrolling dropdown icon"
+      role="listbox"
+      tabindex="0"
+    >
+      <div
+        aria-atomic="true"
+        aria-live="polite"
+        class="divider text"
+        role="alert"
+      >
+        Filters
+      </div>
+      <i
+        aria-hidden="true"
+        class="filter icon"
+      />
+      <div
+        class="menu transition"
+      >
+        <div
+          class="item"
+          role="option"
+        >
+          <em>
+            (reset all filters)
+          </em>
+        </div>
+      </div>
+    </div>
+  </div>
+  <div
+    class="selectedFilters"
+  />
+  <div
+    class="dimmable"
+  >
+    <div
+      class="ui inverted dimmer"
+    >
+      <div
+        class="content"
+      >
+        <div
+          class="ui large loader"
+        />
+      </div>
+    </div>
+    <div
+      class="ui icon info message"
+    >
+      <i
+        aria-hidden="true"
+        class="search icon"
+      />
+      <div
+        class="content"
+      >
+        <div
+          class="header"
+        >
+          Nothing found...
+        </div>
+        No structures have been found matching these filters.
+      </div>
+    </div>
+  </div>
+</div>
+`;

package/src/taxonomy/components/__tests__/__snapshots__/EditDomain.spec.js.snap

@@ -22,7 +22,7 @@ exports[`<EditDomain /> matches the latest snapshot 1`] = `
         />
       </HeaderContent>
     </Header>
-    <injectIntl(Connect(DomainForm))
+    <Connect(DomainForm)
       domain={
         Object {
           "description": "dd",
@@ -30,7 +30,7 @@ exports[`<EditDomain /> matches the latest snapshot 1`] = `
           "name": "nn",
         }
       }
-      handleSubmit={[MockFunction]}
+      onSubmit={[MockFunction]}
     />
   </Container>
 </Fragment>

package/src/taxonomy/components/__tests__/__snapshots__/NewDomain.spec.js.snap

@@ -22,13 +22,13 @@ exports[`<NewDomain /> matches the latest snapshot 1`] = `
         />
       </HeaderContent>
     </Header>
-    <injectIntl(Connect(DomainForm))
+    <Connect(DomainForm)
       domain={
         Object {
           "parent_id": 1,
         }
       }
-      handleSubmit={[MockFunction]}
+      onSubmit={[MockFunction]}
     />
   </Container>
 </Fragment>

package/src/taxonomy/components/index.js

@@ -1,11 +1,13 @@
-import DomainsLoader from "./DomainsLoader";
-import DomainRoutes from "./DomainRoutes";
 import DomainDropdownSelector from "./DomainDropdownSelector";
 import DomainMenuSelector from "./DomainMenuSelector";
+import DomainRoutes from "./DomainRoutes";
+import DomainsLoader from "./DomainsLoader";
+import DomainStructures from "./DomainStructures";
 
 export {
   DomainDropdownSelector,
   DomainMenuSelector,
   DomainRoutes,
   DomainsLoader,
+  DomainStructures,
 };

package/src/taxonomy/reducers/domain.js

@@ -11,7 +11,7 @@ const pickFields = _.pick([
   "description",
   "type",
   "parentable_ids",
-  "domain_group"
+  "domain_group",
 ]);
 
 const domain = (state = initialState, { type, payload }) => {