show merged data on taxon pages

CatalogueOfLife · Mar 28, 2024 · f74c9f7 · f74c9f7
1 parent 9e55045
commit f74c9f7
Show file tree

Hide file tree

Showing 9 changed files with 497 additions and 432 deletions.
diff --git a/src/ColTree/ColTree.js b/src/ColTree/ColTree.js
diff --git a/src/Search/NameSearch.js b/src/Search/NameSearch.js
@@ -36,10 +36,10 @@ const FACET_VOCAB = [
   "nameType",
   "field",
   "authorship",
-//  "authorshipYear",
+  //  "authorshipYear",
   "extinct",
   "environment",
- // "origin", 
+  // "origin",
 ];
 const PAGE_SIZE = 50;
 const defaultParams = {
@@ -58,20 +58,21 @@ const getColumns = (pathToTaxon) => [
       const id =
         _.get(record, "usage.accepted.id") || _.get(record, "usage.id");
       return (
-       <><span >
-       {record?.usage?.merged && "* "}
-     </span><a
-          href={typeof pathToTaxon === "string" ? `${pathToTaxon}${id}`: "#"}
-          onClick={(e) => {
-            if(typeof pathToTaxon === "string"){
-              window.location.href = `${pathToTaxon}${id}`;
-            } else if(typeof pathToTaxon === "function"){
-              e.preventDefault()
-              pathToTaxon(id)
-            }
-          }}
-          dangerouslySetInnerHTML={{ __html: text }}
-        /></> 
+        <>
+          <span>{record?.usage?.merged && "* "}</span>
+          <a
+            href={typeof pathToTaxon === "string" ? `${pathToTaxon}${id}` : "#"}
+            onClick={(e) => {
+              if (typeof pathToTaxon === "string") {
+                window.location.href = `${pathToTaxon}${id}`;
+              } else if (typeof pathToTaxon === "function") {
+                e.preventDefault();
+                pathToTaxon(id);
+              }
+            }}
+            dangerouslySetInnerHTML={{ __html: text }}
+          />
+        </>
       );
     },
     width: 200,
@@ -334,13 +335,13 @@ class NameSearchPage extends React.Component {
           label: `${_.startCase(s.value)} (${s.count.toLocaleString("en-GB")})`,
         }))
       : null;
-       const facetAuthorship = _.get(facets, "authorship")
+    const facetAuthorship = _.get(facets, "authorship")
       ? facets["authorship"].map((s) => ({
           value: s.value,
           label: `${_.startCase(s.value)} (${s.count.toLocaleString("en-GB")})`,
         }))
       : [];
-/*     const facetAuthorshipYear = _.get(facets, "authorshipYear")
+    /*     const facetAuthorshipYear = _.get(facets, "authorshipYear")
       ? facets["authorshipYear"].map((s) => ({
           value: s.value,
           label: `${_.startCase(s.value)} (${s.count.toLocaleString("en-GB")})`,
@@ -358,7 +359,7 @@ class NameSearchPage extends React.Component {
           label: `${_.startCase(s.value)} (${s.count.toLocaleString("en-GB")})`,
         }))
       : [];
-/*     const facetOrigin = _.get(facets, "origin")
+    /*     const facetOrigin = _.get(facets, "origin")
       ? facets["origin"].map((s) => ({
           value: s.value,
           label: `${_.startCase(s.value)} (${s.count.toLocaleString("en-GB")})`,
@@ -446,9 +447,7 @@ class NameSearchPage extends React.Component {
                 </FormItem>
                 <FormItem label="Include extinct">
                   <Checkbox
-                    checked={
-                      !params.extinct
-                    }
+                    checked={!params.extinct}
                     onChange={({ target: { checked } }) =>
                       this.updateSearch({
                         extinct: checked === false ? [false, ""] : null,
@@ -513,14 +512,14 @@ class NameSearchPage extends React.Component {
                   onChange={(value) => this.updateSearch({ field: value })}
                   vocab={facetNomField || []}
                   label="Name field"
-                />                  
+                />
                 <MultiValueFilter
                   defaultValue={_.get(params, "authorship")}
                   onChange={(value) => this.updateSearch({ authorship: value })}
                   vocab={facetAuthorship}
                   label="Authorship"
                 />
-{/*                 <MultiValueFilter
+                {/*                 <MultiValueFilter
                   defaultValue={_.get(params, "authorshipYear")}
                   onChange={(value) =>
                     this.updateSearch({ authorshipYear: value })
@@ -542,7 +541,7 @@ class NameSearchPage extends React.Component {
                   vocab={facetExtinct}
                   label="Extinct"
                 />
-{/*                 <MultiValueFilter
+                {/*                 <MultiValueFilter
                   defaultValue={_.get(params, "origin")}
                   onChange={(value) => this.updateSearch({ origin: value })}
                   vocab={facetOrigin}

diff --git a/src/Taxon/Includes.js b/src/Taxon/Includes.js
@@ -20,14 +20,18 @@ const IncludesTable = ({ data, style, rank, pathToSearch, taxon }) => {
             classes={{ formItem: { borderBottom: "none" } }}
             key={t.value}
           >
-           {pathToSearch ? <a
-              href={`${pathToSearch}?TAXON_ID=${taxon.id}&rank=${t.value}&status=accepted&status=provisionally%20accepted`}
-              onClick={() => {
-                window.location.href = `${pathToSearch}?TAXON_ID=${taxon.id}&rank=${t.value}&status=accepted&status=provisionally%20accepted`;
-              }}
-            >
-              {t.count}
-            </a> : t.count }
+            {pathToSearch ? (
+              <a
+                href={`${pathToSearch}?TAXON_ID=${taxon.id}&rank=${t.value}&status=accepted&status=provisionally%20accepted`}
+                onClick={() => {
+                  window.location.href = `${pathToSearch}?TAXON_ID=${taxon.id}&rank=${t.value}&status=accepted&status=provisionally%20accepted`;
+                }}
+              >
+                {t.count}
+              </a>
+            ) : (
+              t.count
+            )}
           </PresentationItem>
         ))}
     </div>

diff --git a/src/Taxon/References.js b/src/Taxon/References.js
@@ -1,36 +1,49 @@
-import React, {useEffect} from "react";
+import React, { useEffect } from "react";
 import _ from "lodash";
-import linkify from 'linkify-html';
-import {Row, Col} from "antd"
+import linkify from "linkify-html";
+import { Row, Col } from "antd";
 
-const ReferencesTable = ({ data, referenceIndexMap, style, primarySourceDatasetKey , pathToDataset}) => {
-  useEffect(()=>{},[referenceIndexMap])
+const ReferencesTable = ({
+  data,
+  referenceIndexMap,
+  style,
+  primarySourceDatasetKey,
+  pathToDataset,
+}) => {
+  useEffect(() => {}, [referenceIndexMap]);
   return (
     <div style={style} className="col-reference-link-container">
       {_.values(data)
-
-        .map(s => (
-          <>
-            <Row key={s.id}>
-              <Col style={{paddingRight: "5px"}}>
-             {_.get(referenceIndexMap, s.id) && <span>
-              {`[${_.get(referenceIndexMap, s.id)}]`}
-              </span>}
+      .map((s) => (
+        <>
+          <Row key={s.id}>
+            <Col style={{ paddingRight: "5px" }}>
+              {_.get(referenceIndexMap, s.id) && (
+                <span>{`[${_.get(referenceIndexMap, s.id)}]`}</span>
+              )}
+            </Col>
+            <Col span={20}>
+              <span
+                id={`col-refererence-${s.id}`}
+                dangerouslySetInnerHTML={{ __html: linkify(s.citation) }}
+              ></span>
+            </Col>
+          </Row>
+
+          {s?.sourceDataset?.key !== primarySourceDatasetKey && (
+            <Row>
+              <Col style={{ paddingLeft: "22px" }}>
+                Source:{" "}
+                <a href={`${pathToDataset}${s?.sourceDataset?.key}`}>
+                  {s?.sourceDataset?.title}
+                </a>
               </Col>
-              <Col span={20} >
-              <span  id={`col-refererence-${s.id}`}
-                  dangerouslySetInnerHTML={{ __html: linkify(s.citation)}}
-                ></span> 
-              </Col>   
             </Row>
-
-         {s?.sourceDataset?.key !== primarySourceDatasetKey && <Row><Col style={{paddingLeft: "22px"}}>Source: <a href={`${pathToDataset}${s?.sourceDataset?.key}`}>{s?.sourceDataset?.title}</a></Col></Row>}
-</>
-        ))}
+          )}
+        </>
+      ))}
     </div>
   );
 };
 
 export default ReferencesTable;
-
-
diff --git a/src/Taxon/TaxonBreakdown.js b/src/Taxon/TaxonBreakdown.js
@@ -20,7 +20,13 @@ const canonicalRanks = [
   "species",
 ];
 
-const TaxonBreakdown = ({ taxon, datasetKey, rank = [], pathToTaxon, dataset }) => {
+const TaxonBreakdown = ({
+  taxon,
+  datasetKey,
+  rank = [],
+  pathToTaxon,
+  dataset,
+}) => {
   const [options, setOptions] = useState(null);
   const [error, setError] = useState(null);
   const [loading, setLoading] = useState(false);
@@ -30,7 +36,6 @@ const TaxonBreakdown = ({ taxon, datasetKey, rank = [], pathToTaxon, dataset })
     getData();
   }, [taxon, datasetKey]);
 
-
   const getOverView = async () => {
     const res = await axios(
       `${config.dataApi}dataset/${datasetKey}/nameusage/search?TAXON_ID=${taxon.id}&facet=rank&status=accepted&status=provisionally%20accepted&limit=0`
@@ -102,25 +107,27 @@ const TaxonBreakdown = ({ taxon, datasetKey, rank = [], pathToTaxon, dataset })
         setInvalid(true);
         setLoading(false);
       } else {
-      const res = await axios(
-        `${config.dataApi}dataset/${datasetKey}/export.json?rank=${childRank}${
-          !root ? "&rank=" + grandChildRank : ""
-        }&countBy=${countBy}&taxonID=${taxon.id}`
-      );
-      //Api returns both ranks in the root array
-      const childRankData = res.data; //.filter((t) => t.rank === childRank);
-      if (_.get(root, "[0]")) {
-        root[0].children = processChildren(childRankData, countBy);
-        root[0][countBy] = root[0].children.reduce(
-          (acc, cur) => acc + cur[countBy],
-          0
+        const res = await axios(
+          `${
+            config.dataApi
+          }dataset/${datasetKey}/export.json?rank=${childRank}${
+            !root ? "&rank=" + grandChildRank : ""
+          }&countBy=${countBy}&taxonID=${taxon.id}`
         );
-      } else {
-        root = processChildren(childRankData, countBy);
+        //Api returns both ranks in the root array
+        const childRankData = res.data; //.filter((t) => t.rank === childRank);
+        if (_.get(root, "[0]")) {
+          root[0].children = processChildren(childRankData, countBy);
+          root[0][countBy] = root[0].children.reduce(
+            (acc, cur) => acc + cur[countBy],
+            0
+          );
+        } else {
+          root = processChildren(childRankData, countBy);
+        }
+        setLoading(false);
+        initChart(root, countBy);
       }
-      setLoading(false);
-      initChart(root, countBy);
-    }
     } catch (err) {
       setError(err);
       setLoading(false);
@@ -238,12 +245,12 @@ const TaxonBreakdown = ({ taxon, datasetKey, rank = [], pathToTaxon, dataset })
           },
           point: {
             events: {
-                click: (e) => {
-                  if(e.point._id){
-                    window.location.href = `${pathToTaxon}${e.point._id}`
-                  }
-                },
+              click: (e) => {
+                if (e.point._id) {
+                  window.location.href = `${pathToTaxon}${e.point._id}`;
+                }
               },
+            },
           },
         },
         {
@@ -253,11 +260,11 @@ const TaxonBreakdown = ({ taxon, datasetKey, rank = [], pathToTaxon, dataset })
           innerSize: "60%",
           point: {
             events: {
-                click: (e) => {
-                  if(e.point._id){
-                    window.location.href = `${pathToTaxon}${e.point._id}`
-                  }
-                  },
+              click: (e) => {
+                if (e.point._id) {
+                  window.location.href = `${pathToTaxon}${e.point._id}`;
+                }
+              },
             },
           },
           dataLabels: {
@@ -325,5 +332,4 @@ const TaxonBreakdown = ({ taxon, datasetKey, rank = [], pathToTaxon, dataset })
   );
 };
 
-
 export default TaxonBreakdown;