Hide counts that are missing in API response

RolnickLab · Dec 3, 2023 · 687380d · 687380d
1 parent 5504d99
commit 687380d
Show file tree

Hide file tree

Showing 4 changed files with 8 additions and 5 deletions.
diff --git a/ui/src/data-services/models/species.ts b/ui/src/data-services/models/species.ts
@@ -22,11 +22,11 @@ export class Species extends Taxon {
   }
 
   get numDetections(): number {
-    return this._species.detections_count
+    return this._species.detections_count || null
   }
 
   get numOccurrences(): number {
-    return this._species.occurrences_count
+    return this._species.occurrences_count || null
   }
 
   get trainingImagesLabel(): string {

diff --git a/ui/src/design-system/components/info-block/info-block.tsx b/ui/src/design-system/components/info-block/info-block.tsx
@@ -1,5 +1,6 @@
 import classNames from 'classnames'
 import { Link } from 'react-router-dom'
+import { STRING } from 'utils/language'
 import styles from './info-block.module.scss'
 
 interface Field {
@@ -11,7 +12,7 @@ interface Field {
 export const InfoBlock = ({ fields }: { fields: Field[] }) => (
   <>
     {fields.map((field, index) => {
-      const value = field.value !== undefined ? field.value : 'N/A'
+      const value = field.value !== undefined ? field.value : STRING.VALUE_NOT_AVAILABLE
 
       return (
         <p className={styles.field} key={index}>

diff --git a/ui/src/pages/species-details/species-details.tsx b/ui/src/pages/species-details/species-details.tsx
@@ -53,7 +53,7 @@ export const SpeciesDetails = ({ species }: { species: Species }) => {
       value: species.trainingImagesLabel,
       to: species.trainingImagesUrl,
     },
-  ]
+  ].filter((field) => field.value !== null);
 
   return (
     <div className={styles.wrapper}>

diff --git a/ui/src/utils/language.ts b/ui/src/utils/language.ts
@@ -164,6 +164,7 @@ export enum STRING {
   UPDATING_DATA,
   USER_INFO,
   VERIFIED_BY,
+  VALUE_NOT_AVAILABLE,
 }
 
 const ENGLISH_STRINGS: { [key in STRING]: string } = {
@@ -242,7 +243,7 @@ const ENGLISH_STRINGS: { [key in STRING]: string } = {
   [STRING.FIELD_LABEL_THUMBNAIL]: 'Thumbnail',
   [STRING.FIELD_LABEL_TIME]: 'Time',
   [STRING.FIELD_LABEL_TIMESTAMP]: 'Timestamp',
-  [STRING.FIELD_LABEL_TRAINING_IMAGES]: 'Training images',
+  [STRING.FIELD_LABEL_TRAINING_IMAGES]: 'Reference images',
   [STRING.FIELD_LABEL_FIRST_DATE]: 'First date',
   [STRING.FIELD_LABEL_LAST_DATE]: 'Last date',
   [STRING.FIELD_LABEL_UPDATED_AT]: 'Updated at',
@@ -342,6 +343,7 @@ const ENGLISH_STRINGS: { [key in STRING]: string } = {
   [STRING.UPDATING_DATA]: 'Updating data',
   [STRING.USER_INFO]: 'User info',
   [STRING.VERIFIED_BY]: 'Verified by\n{{name}}',
+  [STRING.VALUE_NOT_AVAILABLE]: 'n/a',
 }
 
 // When we have more translations available, this function could return a value based on current language settings.