Accession displays updated

- Card without CropChips
- Institute country with noflag

src/ui/genesys/Links.tsx

@@ -72,12 +72,18 @@ function RequestLink({ to: request, edit = false, children = null }
     }
 }
 
-const CountryLink = ({ country, children }: { country: Country, children?: any }) => (
+const CountryLink = ({ country, noflag, children }: { country: Country, noflag?: boolean, children?: any }) => {
+  if (! country) {
+    return null;
+  }
+  return (
     <Link to={ `/geo/${country.code3}` }>
         <div style={ {display: 'flex', alignItems: 'center'} }>
-            <img src={ `images/flags/${country.code3}.png` } style={ {maxWidth: '1.25rem', padding: '0 0.25rem'} } />{ children || country.name }
+            { !noflag && <img src={ `images/flags/${country.code3}.png` } style={ {maxWidth: '1.25rem', padding: '0 0.25rem'} } /> }
+            { children || country.name }
         </div>
     </Link>
-);
+  );
+};
 
 export { SubsetLink, AccessionLink, InstituteLink, RequestLink, CountryLink};

src/ui/genesys/accession/AccessionCard.tsx

@@ -6,7 +6,7 @@ import { AccessionLink } from 'ui/genesys/Links';
 import Card, {CardContent, CardActions} from 'ui/common/Card';
 import DOI from 'ui/common/DOI';
 import SciName from 'ui/genesys/SciName';
-import CropChips from 'ui/genesys/crop/CropChips';
+// import CropChips from 'ui/genesys/crop/CropChips';
 
 const styles = (theme) => ({
   firstRow: {
@@ -28,7 +28,7 @@ const AccessionCard = ({ accession, classes, index, ...other }: { accession: Acc
               <SciName taxa={ accession.taxonomy.taxonNameHtml } />
             </AccessionLink>
           </b>
-          { accession.crop && <CropChips crops={ accession.crop.shortName } /> }
+          { /* { accession.crop && <CropChips crops={ accession.crop.shortName } /> } */ }
           { accession.countryOfOrigin && ` • ${accession.countryOfOrigin.name}` }
         </div>
         <div>

src/ui/pages/accessions/DisplayPage.tsx

@@ -119,11 +119,12 @@ class BrowsePage extends React.Component<IBrowsePageProps, any> {
                       <InstituteLink to={ accession.institute }>
                         { accession.institute.fullName }
                       </InstituteLink>
+                      <span> &mdash; </span>
+                      <CountryLink noflag country={ accession.institute.country }/>
                     </PropertiesItem>
-                    <PropertiesItem title="Country of holding institute">{ <CountryLink country={ accession.institute.country }/> }</PropertiesItem>
                     <PropertiesItem title="Institute code">{ accession.institute.code }</PropertiesItem>
                     <PropertiesItem title="Acquisition date"><McpdDate value={ accession.acquisitionDate } /></PropertiesItem>
-                    <PropertiesItem title="Country of origin">{ accession.countryOfOrigin.name }</PropertiesItem>
+                    { accession.countryOfOrigin && <PropertiesItem title="Country of origin">{ <CountryLink country={ accession.countryOfOrigin }/> }</PropertiesItem> }
                     { accession.sampStat && <PropertiesItem title="Biological status of accession">{ t(`accession.sampleStatus.${accession.sampStat}`) }</PropertiesItem> }
                     { accession.storage && accession.storage.length > 0 && <PropertiesItem title="Type of Germplasm storage">
                       { accession.storage.map((storage, i) => (
@@ -172,7 +173,7 @@ class BrowsePage extends React.Component<IBrowsePageProps, any> {
                   <PageSection title="Collecting information">
                     <Properties>
                       { accession.countryOfOrigin && <PropertiesItem title="Country of origin">{ <CountryLink country={ accession.countryOfOrigin }/> }</PropertiesItem> }
-                      { accession.coll.collDate &&   <PropertiesItem key="collDate" title={ t(`accession.coll.collDate`) }><McpdDate value={ accession.coll.collDate } /></PropertiesItem> }
+                      { accession.coll.collDate && <PropertiesItem key="collDate" title={ t(`accession.coll.collDate`) }><McpdDate value={ accession.coll.collDate } /></PropertiesItem> }
                       { accession.coll &&
                         [ 'collMissId', 'collNumb', 'collSite', 'collSrc' ]
                           .filter((prop) => accession.coll[prop] !== null).map((prop) => (