From ceb2ce187dd5ba67b03b7e47416852031df2dad2 Mon Sep 17 00:00:00 2001
From: wildlifehexagon <crossthebreeze@gmail.com>
Date: Fri, 19 Oct 2018 15:06:41 -0500
Subject: [PATCH] feat: add With data conversions

BREAKING CHANGE: the With data is returned from the API with a different data structure; the front
end code has been updated to reflect this
---
 src/features/Ontology/Table/DisplayTable.js | 29 +++----
 src/features/Summary/Panels/GoaPanel.js     | 96 ++++++++++-----------
 2 files changed, 59 insertions(+), 66 deletions(-)

diff --git a/src/features/Ontology/Table/DisplayTable.js b/src/features/Ontology/Table/DisplayTable.js
index 6cedfa521..7a6f528e5 100644
--- a/src/features/Ontology/Table/DisplayTable.js
+++ b/src/features/Ontology/Table/DisplayTable.js
@@ -103,21 +103,20 @@ export class DisplayTable extends Component<Props> {
 
                   <TableCell>
                     {item.with !== null &&
-                      item.with.map((item: Object) =>
-                        item.connectedXrefs.map((xref: Object, i: string) => (
-                          <Fragment key={i}>
-                            <span>
-                              <a
-                                className={classes.link}
-                                href={withLinkGenerator(xref.id, xref.db)}
-                                target="_blank">
-                                {xref.db}:{xref.id}
-                              </a>
-                            </span>
-                            <br />
-                          </Fragment>
-                        )),
-                      )}
+                      item.with.map((item: Object, i: string) => (
+                        <Fragment key={i}>
+                          <span>
+                            <a
+                              className={classes.link}
+                              href={withLinkGenerator(item.id, item.db)}
+                              target="_blank">
+                              {!item.name && `${item.db}:${item.id}`}
+                              {item.name && `${item.name}`}
+                            </a>
+                          </span>
+                          <br />
+                        </Fragment>
+                      ))}
                   </TableCell>
                   <TableCell>
                     <a
diff --git a/src/features/Summary/Panels/GoaPanel.js b/src/features/Summary/Panels/GoaPanel.js
index 6f8055aeb..b8f365cee 100644
--- a/src/features/Summary/Panels/GoaPanel.js
+++ b/src/features/Summary/Panels/GoaPanel.js
@@ -146,23 +146,21 @@ const GoaPanel = (props: Props) => {
                     <span>
                       {item.goterm}
                       {item.with !== null &&
-                        item.with.map((item: Object) =>
-                          withDataFilter(item.connectedXrefs).map(
-                            (xref: Object, i: string) => (
-                              <Fragment key={i}>
-                                <span>
-                                  {" "}
-                                  <em>with</em>{" "}
-                                  <a
-                                    className={classes.link}
-                                    href={withLinkGenerator(xref.id, xref.db)}
-                                    target="_blank">
-                                    {!xref.name && `${xref.db}:${xref.id}`}
-                                    {xref.name && `${xref.name}`}
-                                  </a>
-                                </span>
-                              </Fragment>
-                            ),
+                        withDataFilter(item.with).map(
+                          (xref: Object, i: string) => (
+                            <Fragment key={i}>
+                              <span>
+                                {" "}
+                                <em>with</em>{" "}
+                                <a
+                                  className={classes.link}
+                                  href={withLinkGenerator(xref.id, xref.db)}
+                                  target="_blank">
+                                  {!xref.name && `${xref.db}:${xref.id}`}
+                                  {xref.name && `${xref.name}`}
+                                </a>
+                              </span>
+                            </Fragment>
                           ),
                         )}
                       {item.extensions !== null &&
@@ -205,23 +203,21 @@ const GoaPanel = (props: Props) => {
                     <span>
                       {item.goterm}
                       {item.with !== null &&
-                        item.with.map((item: Object) =>
-                          withDataFilter(item.connectedXrefs).map(
-                            (xref: Object, i: string) => (
-                              <Fragment key={i}>
-                                <span>
-                                  {" "}
-                                  <em>with</em>{" "}
-                                  <a
-                                    className={classes.link}
-                                    href={withLinkGenerator(xref.id, xref.db)}
-                                    target="_blank">
-                                    {!xref.name && `${xref.db}:${xref.id}`}
-                                    {xref.name && `${xref.name}`}
-                                  </a>
-                                </span>
-                              </Fragment>
-                            ),
+                        withDataFilter(item.with).map(
+                          (xref: Object, i: string) => (
+                            <Fragment key={i}>
+                              <span>
+                                {" "}
+                                <em>with</em>{" "}
+                                <a
+                                  className={classes.link}
+                                  href={withLinkGenerator(xref.id, xref.db)}
+                                  target="_blank">
+                                  {!xref.name && `${xref.db}:${xref.id}`}
+                                  {xref.name && `${xref.name}`}
+                                </a>
+                              </span>
+                            </Fragment>
                           ),
                         )}
                       {item.extensions !== null &&
@@ -264,23 +260,21 @@ const GoaPanel = (props: Props) => {
                     <span>
                       {item.goterm}
                       {item.with !== null &&
-                        item.with.map((item: Object) =>
-                          withDataFilter(item.connectedXrefs).map(
-                            (xref: Object, i: string) => (
-                              <Fragment key={i}>
-                                <span>
-                                  {" "}
-                                  <em>with</em>{" "}
-                                  <a
-                                    className={classes.link}
-                                    href={withLinkGenerator(xref.id, xref.db)}
-                                    target="_blank">
-                                    {!xref.name && `${xref.db}:${xref.id}`}
-                                    {xref.name && `${xref.name}`}
-                                  </a>
-                                </span>
-                              </Fragment>
-                            ),
+                        withDataFilter(item.with).map(
+                          (xref: Object, i: string) => (
+                            <Fragment key={i}>
+                              <span>
+                                {" "}
+                                <em>with</em>{" "}
+                                <a
+                                  className={classes.link}
+                                  href={withLinkGenerator(xref.id, xref.db)}
+                                  target="_blank">
+                                  {!xref.name && `${xref.db}:${xref.id}`}
+                                  {xref.name && `${xref.name}`}
+                                </a>
+                              </span>
+                            </Fragment>
                           ),
                         )}
                       {item.extensions !== null &&