@truedat/bg 6.13.4 → 6.13.5

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@truedat/bg",
-  "version": "6.13.4",
+  "version": "6.13.5",
   "description": "Truedat Web Business Glossary",
   "sideEffects": false,
   "jsnext:main": "src/index.js",
@@ -86,9 +86,9 @@
     ]
   },
   "dependencies": {
-    "@truedat/core": "6.13.4",
-    "@truedat/df": "6.13.4",
-    "@truedat/lm": "6.13.4",
+    "@truedat/core": "6.13.5",
+    "@truedat/df": "6.13.5",
+    "@truedat/lm": "6.13.5",
     "decode-uri-component": "^0.2.2",
     "file-saver": "^2.0.5",
     "moment": "^2.29.4",
@@ -111,5 +111,5 @@
     "react-dom": ">= 16.8.6 < 17",
     "semantic-ui-react": ">= 2.0.3 < 2.2"
   },
-  "gitHead": "3fd777c739ce6c9c78d505a85877e0ef6059b19c"
+  "gitHead": "8a56d5172d91597712cdeab607983c2b3282eb25"
 }

package/src/messages/en.js

@@ -284,7 +284,6 @@ export default {
   "domain.selector.placeholder": "Select a domain...",
   "domains.actions.create": "New Domain",
   "domains.search.placeholder": "Search domains...",
-  "domains.search.error.fields": "Search fields not valid",
   "domains.search.results.count": "{count} domains found:",
   "domains.search.results.empty": "No domains found",
   "domains.subheader": "Manage governance structure and data domains",

package/src/messages/es.js

@@ -287,7 +287,6 @@ export default {
   "domain.selector.placeholder": "Selecciona un dominio...",
   "domains.actions.create": "Nuevo dominio",
   "domains.search.placeholder": "Buscar dominios...",
-  "domains.search.error.fields": "Campos de búsqueda no válidos",
   "domains.search.results.count": "{count} dominios encontrados:",
   "domains.search.results.empty": "Ningún dominio encontrado",
   "domains.subheader":

package/src/taxonomy/components/Domain.js

@@ -2,11 +2,12 @@ import _ from "lodash/fp";
 import React from "react";
 import PropTypes from "prop-types";
 import { connect } from "react-redux";
-import { useHistory, Route, Switch } from "react-router-dom";
-import { Grid, Segment } from "semantic-ui-react";
+import { Route, Switch } from "react-router-dom";
+import { Segment } from "semantic-ui-react";
 import { Unauthorized } from "@truedat/core/components";
 import { useAuthorized } from "@truedat/core/hooks";
 import {
+  DOMAIN,
   DOMAIN_CONCEPTS,
   DOMAIN_IMPLEMENTATIONS,
   DOMAIN_MEMBERS,
@@ -14,92 +15,89 @@ import {
   linkTo,
 } from "@truedat/core/routes";
 import UserSearchFiltersLoader from "@truedat/dd/components/UserSearchFiltersLoader";
-import { BranchViewer } from "@truedat/core/components/";
 import DomainConcepts from "../../concepts/components/DomainConcepts";
-import { useDomains } from "../../hooks/useDomains";
+import DomainActions from "./DomainActions";
+import DomainCards from "./DomainCards";
 import DomainCrumbs from "./DomainCrumbs";
 import DomainDetail from "./DomainDetail";
 import DomainImplementations from "./DomainImplementations";
 import DomainMembers from "./DomainMembers";
+import DomainSearch from "./DomainSearch";
 import DomainStructures from "./DomainStructures";
 import DomainTabs from "./DomainTabs";
 
-export const Domain = ({ domain, domainLoading }) => {
+export const Domain = ({ hasChildren, domain, domainLoading }) => {
   const ddAuthorized = useAuthorized("data_dictionary");
   const dqAuthorized = useAuthorized("quality");
-  const history = useHistory();
-  const { data: domains } = useDomains();
 
-  const handleRedirect = (id) => {
-    history.push(linkTo.DOMAIN_MEMBERS({ id }));
+  const actions = {
+    create: {
+      order: 1,
+      icon: "cube",
+      messageId: "domain.actions.create",
+      action: (id) => linkTo.DOMAIN_NEW({ id }),
+    },
   };
 
   return domainLoading ? null : domain && domain.id ? (
     <>
-      <Grid>
-        <Grid.Row>
-          <Grid.Column width={16}>
-            <DomainCrumbs />
-          </Grid.Column>
-        </Grid.Row>
-        <Grid.Row>
-          <Grid.Column width={4}>
-            <BranchViewer
-              branches={domains}
-              handleRedirect={handleRedirect}
-              idSelectedBranch={domain.id}
+      <DomainCrumbs />
+      <Segment>
+        <DomainDetail />
+        <DomainTabs />
+        <Segment attached="bottom">
+          <Switch>
+            <Route
+              exact
+              path={DOMAIN}
+              render={() => (
+                <>
+                  {hasChildren && <DomainSearch />}
+                  <DomainActions availableActions={actions} />
+                  <DomainCards />
+                </>
+              )}
             />
-          </Grid.Column>
-          <Grid.Column width={12}>
-            <>
-              <Segment>
-                <DomainDetail />
-                <DomainTabs />
-                <Segment attached="bottom">
-                  <Switch>
-                    <Route
-                      exact
-                      path={DOMAIN_MEMBERS}
-                      render={() => <DomainMembers />}
-                    />
-                    <Route
-                      exact
-                      path={DOMAIN_CONCEPTS}
-                      render={() => <DomainConcepts />}
-                    />
-                    <Route
-                      exact
-                      path={DOMAIN_STRUCTURES}
-                      render={() =>
-                        ddAuthorized ? <DomainStructures /> : <Unauthorized />
-                      }
-                    />
-                    <Route
-                      exact
-                      path={DOMAIN_IMPLEMENTATIONS}
-                      render={() =>
-                        dqAuthorized ? (
-                          <>
-                            <UserSearchFiltersLoader scope="rule_implementation" />
-                            <DomainImplementations />
-                          </>
-                        ) : (
-                          <Unauthorized />
-                        )
-                      }
-                    />
-                  </Switch>
-                </Segment>
-              </Segment>
-            </>
-          </Grid.Column>
-        </Grid.Row>
-      </Grid>
+            <Route
+              exact
+              path={DOMAIN_MEMBERS}
+              render={() => <DomainMembers />}
+            />
+            <Route
+              exact
+              path={DOMAIN_CONCEPTS}
+              render={() => <DomainConcepts />}
+            />
+            <Route
+              exact
+              path={DOMAIN_STRUCTURES}
+              render={() =>
+                ddAuthorized ? <DomainStructures /> : <Unauthorized />
+              }
+            />
+            <Route
+              exact
+              path={DOMAIN_IMPLEMENTATIONS}
+              render={() =>
+                dqAuthorized ? (
+                  <>
+                    <UserSearchFiltersLoader scope="rule_implementation" />
+                    <DomainImplementations />
+                  </>
+                ) : (
+                  <Unauthorized />
+                )
+              }
+            />
+          </Switch>
+        </Segment>
+      </Segment>
     </>
   ) : null;
 };
 
 Domain.propTypes = {
+  hasChildren: PropTypes.bool,
   domain: PropTypes.object,
   domainLoading: PropTypes.bool,
 };

package/src/taxonomy/components/DomainCards.js

@@ -0,0 +1,97 @@
+import _ from "lodash/fp";
+import React from "react";
+import PropTypes from "prop-types";
+import { Link } from "react-router-dom";
+import { Card, Header, Icon, Message, Divider } from "semantic-ui-react";
+import { connect } from "react-redux";
+import { FormattedMessage, useIntl } from "react-intl";
+import { linkTo } from "@truedat/core/routes";
+import { getVisibleDomains } from "../selectors";
+
+export const DomainCard = ({
+  id,
+  name,
+  type,
+  description,
+  childCount,
+  domain_group
+}) => (
+  <Card key={id} link as={Link} to={linkTo.DOMAIN({ id })}>
+    <Card.Content>
+      <Card.Header>
+        <Icon name="cube" />
+        {name}
+      </Card.Header>
+      <Card.Meta>
+        {_.get("name")(domain_group) && (
+          <>
+            <Icon name="object group" /> {_.get("name")(domain_group)}
+            <br />
+          </>
+        )}
+        <span>{type || <FormattedMessage id="domain" />}</span>
+      </Card.Meta>
+    </Card.Content>
+    <Card.Content description={description} />
+    <Card.Content extra>
+      <Icon name="cubes" />
+      <FormattedMessage
+        id="domain.props.children"
+        values={{ count: childCount }}
+      />
+    </Card.Content>
+  </Card>
+);
+
+DomainCard.propTypes = {
+  id: PropTypes.number,
+  name: PropTypes.string,
+  type: PropTypes.string,
+  childCount: PropTypes.number,
+  description: PropTypes.string,
+  domain_group: PropTypes.object
+};
+
+export const DomainCards = ({ visibleDomains, domainsFilter, domain }) => {
+  const { formatMessage } = useIntl();
+  return (
+    <>
+      <Divider hidden />
+      {domainsFilter && (
+        <Header as="h4">
+          <Icon name="search" />
+          <Header.Content>
+            {visibleDomains.length == 0 && (
+              <FormattedMessage id="domains.search.results.empty" />
+            )}
+            {visibleDomains.length > 0 && (
+              <FormattedMessage
+                id="domains.search.results.count"
+                values={{ count: visibleDomains.length }}
+              />
+            )}
+          </Header.Content>
+        </Header>
+      )}
+      {_.isEmpty(visibleDomains) && domain && domain.id && (
+        <Message header={formatMessage({ id: "domain.children.empty" })} />
+      )}
+      <Card.Group>{visibleDomains.map(DomainCard)}</Card.Group>
+    </>
+  );
+};
+
+DomainCards.propTypes = {
+  visibleDomains: PropTypes.array,
+  domainsFilter: PropTypes.string,
+  domain: PropTypes.object
+};
+
+const mapStateToProps = state => ({
+  visibleDomains: getVisibleDomains(state),
+  domainsLoading: state.domainsLoading,
+  domainsFilter: state.domainsFilter,
+  domain: state.domain
+});
+
+export default connect(mapStateToProps)(DomainCards);

package/src/taxonomy/components/DomainDetail.js

@@ -10,13 +10,6 @@ import DomainActions from "./DomainActions";
 
 export const DomainDetail = ({ type, name, description, domain_group }) => {
   const available_actions = {
-    create: {
-      order: 1,
-      icon: "cube",
-      messageId: "domain.actions.create",
-      action: (id) => linkTo.DOMAIN_NEW({ id }),
-      floated: null,
-    },
     update: {
       order: 2,
       icon: "edit",

package/src/taxonomy/components/DomainTabs.js

@@ -1,3 +1,4 @@
+import _ from "lodash/fp";
 import React from "react";
 import PropTypes from "prop-types";
 import { FormattedMessage } from "react-intl";
@@ -6,6 +7,7 @@ import { Link } from "react-router-dom";
 import { Menu } from "semantic-ui-react";
 import { useAuthorized, usePath } from "@truedat/core/hooks";
 import {
+  DOMAIN,
   DOMAIN_CONCEPTS,
   DOMAIN_IMPLEMENTATIONS,
   DOMAIN_MEMBERS,
@@ -20,6 +22,14 @@ const DomainTabs = ({ domain }) => {
   const id = domain?.id;
   return (
     <Menu attached="top" pointing secondary tabular>
+      <Menu.Item
+        active={path === DOMAIN}
+        as={Link}
+        to={linkTo.DOMAIN(domain)}
+        replace
+      >
+        <FormattedMessage id="tabs.subdomains" />
+      </Menu.Item>
       <Menu.Item
         active={path === DOMAIN_MEMBERS}
         as={Link}

package/src/taxonomy/components/Domains.js

@@ -6,7 +6,7 @@ import { Route, Switch } from "react-router-dom";
 import { Header, Icon, Segment } from "semantic-ui-react";
 import { DOMAINS, DOMAINS_NEW } from "@truedat/core/routes";
 import { createDomain } from "../routines";
-import DomainBranches from "./DomainBranches";
+import DomainCards from "./DomainCards";
 import DomainForm from "./DomainForm";
 import DomainsActions from "./DomainsActions";
 
@@ -24,7 +24,7 @@ export const Domains = ({ domainsLoading, createDomain }) => (
     <Segment attached="bottom" loading={domainsLoading}>
       <DomainsActions />
       <Switch>
-        <Route path={DOMAINS} component={DomainBranches} exact />
+        <Route path={DOMAINS} component={DomainCards} exact />
         <Route
           exact
           path={DOMAINS_NEW}

package/src/taxonomy/components/DomainsActions.js

@@ -6,11 +6,13 @@ import { connect } from "react-redux";
 import { Link } from "react-router-dom";
 import { Button } from "semantic-ui-react";
 import { DOMAINS_NEW } from "@truedat/core/routes";
+import DomainSearch from "./DomainSearch";
 
 export const DomainsActions = ({ createUrl }) => {
   const { formatMessage } = useIntl();
   return (
     <>
+      <DomainSearch />
       {createUrl && (
         <Button
           floated="right"
@@ -26,14 +28,14 @@ export const DomainsActions = ({ createUrl }) => {
 };
 
 DomainsActions.propTypes = {
-  createUrl: PropTypes.string,
+  createUrl: PropTypes.string
 };
 
 const mapStateToProps = ({ domainsActions }) => ({
   createUrl:
     !_.isEmpty(domainsActions) && _.has("create")(domainsActions)
       ? DOMAINS_NEW
-      : undefined,
+      : undefined
 });
 
 export default connect(mapStateToProps)(DomainsActions);

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

@@ -4,7 +4,7 @@ import Domain from "../Domain";
 
 jest.mock("@truedat/core/hooks", () => ({
   useAuthorized: jest.fn(() => true),
-  usePath: jest.fn(() => "/domains/:id/members"),
+  usePath: jest.fn(() => "/domains/:id"),
 }));
 
 describe("<Domain />", () => {

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

@@ -0,0 +1,30 @@
+import React from "react";
+import { shallow } from "enzyme";
+import { intl } from "@truedat/test/intl-stub";
+import { DomainCards } from "../DomainCards";
+
+// workaround for enzyme issue with React.useContext
+// see https://github.com/airbnb/enzyme/issues/2176#issuecomment-532361526
+jest.spyOn(React, "useContext").mockImplementation(() => intl);
+
+describe("<DomainCards />", () => {
+  const domainsFilter = "d";
+
+  it("matches the latest snapshot", () => {
+    const visibleDomains = [
+      { id: 1, name: "domain1" },
+      { id: 2, name: "domain2" }
+    ];
+    const props = { visibleDomains, domainsFilter };
+    const wrapper = shallow(<DomainCards {...props} />);
+    expect(wrapper).toMatchSnapshot();
+  });
+
+  it("matches the latest snapshot (no subdomains)", () => {
+    const domain = { id: 1 };
+    const visibleDomains = [];
+    const props = { domain, visibleDomains, domainsFilter };
+    const wrapper = shallow(<DomainCards {...props} />);
+    expect(wrapper).toMatchSnapshot();
+  });
+});

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

@@ -3,163 +3,94 @@
 exports[`<Domain /> matches the latest snapshot 1`] = `
 <div>
   <div
-    class="ui grid"
+    class="ui breadcrumb"
+  >
+    <a
+      class="section"
+      href="/domains"
+    >
+      Taxonomy
+    </a>
+    <i
+      aria-hidden="true"
+      class="right angle icon divider"
+    />
+    <div
+      class="active section"
+    >
+      DOMAIN NAME
+    </div>
+  </div>
+  <div
+    class="ui segment"
   >
     <div
-      class="row"
+      class="ui grid"
     >
       <div
-        class="sixteen wide column"
+        class="eight wide column"
       >
-        <div
-          class="ui breadcrumb"
+        <h2
+          class="ui header"
         >
-          <a
-            class="section"
-            href="/domains"
-          >
-            Taxonomy
-          </a>
           <i
             aria-hidden="true"
-            class="right angle icon divider"
+            class="cube icon"
           />
           <div
-            class="active section"
+            class="content"
           >
             DOMAIN NAME
-          </div>
-        </div>
-      </div>
-    </div>
-    <div
-      class="row"
-    >
-      <div
-        class="four wide column"
-      >
-        <div
-          class="ui segment"
-          style="overflow: auto;"
-        >
-          <div
-            class="ui grid"
-          >
             <div
-              class="row"
+              class="sub header"
             >
-              <div
-                class="sixteen wide column"
-              >
-                <div
-                  class="ui icon input searchbox"
-                >
-                  <input
-                    placeholder="Search"
-                    type="text"
-                    value=""
-                  />
-                  <i
-                    aria-hidden="true"
-                    class="search link icon"
-                  />
-                </div>
-              </div>
-            </div>
-            <div
-              class="row"
-            >
-              <div
-                class="sixteen wide column"
-              >
-                <h4
-                  class="ui header"
-                >
-                  <i
-                    aria-hidden="true"
-                    class="cube icon"
-                  />
-                  <div
-                    class="content"
-                  >
-                    There are no domains
-                  </div>
-                </h4>
-              </div>
+              Domain
             </div>
           </div>
-        </div>
+        </h2>
       </div>
       <div
-        class="twelve wide column"
+        class="right aligned eight wide column"
+      />
+    </div>
+    <p />
+    <div
+      class="ui pointing secondary top attached tabular menu"
+    >
+      <a
+        class="active item"
+        href="/domains/3"
       >
-        <div
-          class="ui segment"
-        >
-          <div
-            class="ui grid"
-          >
-            <div
-              class="eight wide column"
-            >
-              <h2
-                class="ui header"
-              >
-                <i
-                  aria-hidden="true"
-                  class="cube icon"
-                />
-                <div
-                  class="content"
-                >
-                  DOMAIN NAME
-                  <div
-                    class="sub header"
-                  >
-                    Domain
-                  </div>
-                </div>
-              </h2>
-            </div>
-            <div
-              class="right aligned eight wide column"
-            />
-          </div>
-          <p />
-          <div
-            class="ui pointing secondary top attached tabular menu"
-          >
-            <a
-              class="active item"
-              href="/domains/3/members"
-            >
-              Members
-            </a>
-            <a
-              class="item"
-              href="/domains/3/concepts"
-            >
-              Concepts
-            </a>
-            <a
-              class="item"
-              href="/domains/3/structures"
-            >
-              Structures
-            </a>
-            <a
-              class="item"
-              href="/domains/3/implementations"
-            >
-              Data Quality
-            </a>
-          </div>
-          <div
-            class="ui bottom attached segment"
-          />
-        </div>
-      </div>
+        Subdomains
+      </a>
+      <a
+        class="item"
+        href="/domains/3/members"
+      >
+        Members
+      </a>
+      <a
+        class="item"
+        href="/domains/3/concepts"
+      >
+        Concepts
+      </a>
+      <a
+        class="item"
+        href="/domains/3/structures"
+      >
+        Structures
+      </a>
+      <a
+        class="item"
+        href="/domains/3/implementations"
+      >
+        Data Quality
+      </a>
     </div>
+    <div
+      class="ui bottom attached segment"
+    />
   </div>
 </div>
 `;

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

@@ -0,0 +1,160 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`<DomainCards /> matches the latest snapshot (no subdomains) 1`] = `
+<Fragment>
+  <Divider
+    hidden={true}
+  />
+  <Header
+    as="h4"
+  >
+    <Icon
+      as="i"
+      name="search"
+    />
+    <HeaderContent>
+      <MemoizedFormattedMessage
+        id="domains.search.results.empty"
+      />
+    </HeaderContent>
+  </Header>
+  <Message
+    header="domain.children.empty"
+  />
+  <CardGroup />
+</Fragment>
+`;
+
+exports[`<DomainCards /> matches the latest snapshot 1`] = `
+<Fragment>
+  <Divider
+    hidden={true}
+  />
+  <Header
+    as="h4"
+  >
+    <Icon
+      as="i"
+      name="search"
+    />
+    <HeaderContent>
+      <MemoizedFormattedMessage
+        id="domains.search.results.count"
+        values={
+          {
+            "count": 2,
+          }
+        }
+      />
+    </HeaderContent>
+  </Header>
+  <CardGroup>
+    <Card
+      as={
+        {
+          "$$typeof": Symbol(react.forward_ref),
+          "displayName": "Link",
+          "propTypes": {
+            "innerRef": [Function],
+            "onClick": [Function],
+            "replace": [Function],
+            "target": [Function],
+            "to": [Function],
+          },
+          "render": [Function],
+        }
+      }
+      key="1"
+      link={true}
+      to="/domains/1"
+    >
+      <CardContent>
+        <CardHeader>
+          <Icon
+            as="i"
+            name="cube"
+          />
+          domain1
+        </CardHeader>
+        <CardMeta>
+          <span>
+            <MemoizedFormattedMessage
+              id="domain"
+            />
+          </span>
+        </CardMeta>
+      </CardContent>
+      <CardContent />
+      <CardContent
+        extra={true}
+      >
+        <Icon
+          as="i"
+          name="cubes"
+        />
+        <MemoizedFormattedMessage
+          id="domain.props.children"
+          values={
+            {
+              "count": undefined,
+            }
+          }
+        />
+      </CardContent>
+    </Card>
+    <Card
+      as={
+        {
+          "$$typeof": Symbol(react.forward_ref),
+          "displayName": "Link",
+          "propTypes": {
+            "innerRef": [Function],
+            "onClick": [Function],
+            "replace": [Function],
+            "target": [Function],
+            "to": [Function],
+          },
+          "render": [Function],
+        }
+      }
+      key="2"
+      link={true}
+      to="/domains/2"
+    >
+      <CardContent>
+        <CardHeader>
+          <Icon
+            as="i"
+            name="cube"
+          />
+          domain2
+        </CardHeader>
+        <CardMeta>
+          <span>
+            <MemoizedFormattedMessage
+              id="domain"
+            />
+          </span>
+        </CardMeta>
+      </CardContent>
+      <CardContent />
+      <CardContent
+        extra={true}
+      >
+        <Icon
+          as="i"
+          name="cubes"
+        />
+        <MemoizedFormattedMessage
+          id="domain.props.children"
+          values={
+            {
+              "count": undefined,
+            }
+          }
+        />
+      </CardContent>
+    </Card>
+  </CardGroup>
+</Fragment>
+`;

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

@@ -28,13 +28,6 @@ exports[`<DomainDetail /> matches the latest snapshot 1`] = `
       <Connect(DomainActions)
         availableActions={
           {
-            "create": {
-              "action": [Function],
-              "floated": null,
-              "icon": "cube",
-              "messageId": "domain.actions.create",
-              "order": 1,
-            },
             "deleteOption": true,
             "update": {
               "action": [Function],

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

@@ -28,7 +28,15 @@ exports[`<Domains /> matches the latest snapshot 1`] = `
     <Connect(DomainsActions) />
     <Switch>
       <Route
-        component={[Function]}
+        component={
+          {
+            "$$typeof": Symbol(react.memo),
+            "WrappedComponent": [Function],
+            "compare": null,
+            "displayName": "Connect(DomainCards)",
+            "type": [Function],
+          }
+        }
         exact={true}
         path="/domains"
       />

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

@@ -1,3 +1,7 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
-exports[`<DomainsActions /> matches the latest snapshot 1`] = `<Fragment />`;
+exports[`<DomainsActions /> matches the latest snapshot 1`] = `
+<Fragment>
+  <Connect(DomainSearch) />
+</Fragment>
+`;

package/src/hooks/useDomains.js

@@ -1,12 +0,0 @@
-import _ from "lodash/fp";
-import { compile } from "path-to-regexp";
-import useSWR from "swr";
-import { apiJson } from "@truedat/core/services/api";
-import { API_DOMAIN, API_DOMAINS } from "../taxonomy/api";
-
-export const useDomains = () => {
-  const toApiPath = compile(API_DOMAINS, "api");
-  const url = toApiPath();
-  const { data, error } = useSWR(url, apiJson);
-  return { data: data?.data?.data, error, loading: !error && !data };
-};

package/src/taxonomy/components/DomainBranches.js

@@ -1,28 +0,0 @@
-import _ from "lodash/fp";
-import React from "react";
-import { useHistory } from "react-router-dom";
-import { Grid } from "semantic-ui-react";
-import { linkTo } from "@truedat/core/routes";
-import { BranchViewer } from "@truedat/core/components/";
-import { useDomains } from "../../hooks/useDomains";
-
-export default function DomainBranches() {
-  const { data: domains } = useDomains();
-  const history = useHistory();
-
-  const handleRedirect = (id) => {
-    history.push(linkTo.DOMAIN_MEMBERS({ id }));
-  };
-
-  return (
-    <>
-      <Grid>
-        <Grid.Row>
-          <Grid.Column width={4}>
-            <BranchViewer branches={domains} handleRedirect={handleRedirect} />
-          </Grid.Column>
-        </Grid.Row>
-      </Grid>
-    </>
-  );
-}