#128 related resources

packages/doi/src/components/DOIInfo/DOIInfo.tsx

@@ -12,7 +12,6 @@ import type { DOI } from 'model/doi';
 import { Col, Row } from 'react-bootstrap';
 import { CONFIG } from 'config/config';
 import { DOIKeywords } from 'components/DOIInfo/DOIKeywords';
-import { DOIReferencesIn } from 'components/DOIInfo/DOIReferencesIn';
 
 export function DOIInfo({ doi }: { doi: DOI }) {
   return (
@@ -49,9 +48,6 @@ export function DOIInfo({ doi }: { doi: DOI }) {
             <Col xs={12}>
               <DOICited doi={doi} />
             </Col>
-            <Col xs={12}>
-              <DOIReferencesIn doi={doi} />
-            </Col>
           </Row>
         </Col>
         <Col xs={12} lg={5} xl={4} xxl={3}>

packages/doi/src/components/DOIInfo/DOIReferencesIn.tsx

-import { DOIReferenceURL } from 'components/DOIInfo/DOIReferenceURL';
-import type { DOI } from 'model/doi';
-import { Card } from 'react-bootstrap';
-
-export function DOIReferencesIn({ doi }: { doi: DOI }) {
-  if (!doi.referenceURL) {
-    return null;
-  }
-  return (
-    <Card>
-      <Card.Header className="p-2">References</Card.Header>
-      <Card.Body className="p-0">
-        <DOIReferenceURL doi={doi} />
-      </Card.Body>
-    </Card>
-  );
-}

packages/doi/src/components/DOIInfo/DOIRelated.tsx

 import { LoadReference } from 'components/DOIInfo/DOIReference';
+import { DOIReferenceURL } from 'components/DOIInfo/DOIReferenceURL';
 import { Loading } from 'components/Loading';
 import type { DOI } from 'model/doi';
 import { Suspense } from 'react';
 import { Card } from 'react-bootstrap';
 
 export function DOIRelated({ doi }: { doi: DOI }) {
+  if (doi.relatedDOI?.length === 0 && !doi.referenceURL) {
+    return null;
+  }
   return (
     <Card>
-      <Card.Header className="p-2">Related DOIs</Card.Header>
+      <Card.Header className="p-2">Related Resources</Card.Header>
       <Card.Body className="p-0">
-        {doi.relatedDOI?.length ? (
-          doi.relatedDOI?.map((doi, index, self) => (
-            <div
-              key={doi}
-              className={`p-2 ${
-                index === self.length - 1 ? '' : 'border-bottom border-black'
-              }`}
-            >
-              <Suspense fallback={<Loading />}>
-                <LoadReference doi={doi} />
-              </Suspense>
-            </div>
-          ))
-        ) : (
-          <p className="p-2 m-0">No related DOIs were found.</p>
-        )}
-        {}
+        {doi.relatedDOI?.map((doi, index, self) => (
+          <div
+            key={doi}
+            className={`p-2 ${
+              index === self.length - 1 ? '' : 'border-bottom border-black'
+            }`}
+          >
+            <Suspense fallback={<Loading />}>
+              <LoadReference doi={doi} />
+            </Suspense>
+          </div>
+        ))}
+        <DOIReferenceURL doi={doi} />
       </Card.Body>
     </Card>
   );