fix: address remaining inconsistencies after PR feedback

Author: annavik

ui/src/pages/captures/upload-images-dialog/select-images-section/select-images-section.tsx

@@ -43,7 +43,7 @@ export const SelectImagesSection = ({
 
   return (
     <FormSection title={TITLE} description={DESCRIPTION}>
-      <div className={styles.collection}>
+      <div className={styles.captures}>
         {images.map(({ file }) => (
           <Card key={file.name}>
             <div className={styles.cardContent}>

ui/src/pages/captures/upload-images-dialog/select-images-section/styles.module.scss

@@ -2,7 +2,7 @@
 @import 'src/design-system/variables/colors.scss';
 @import 'src/design-system/variables/typography.scss';
 
-.collection {
+.captures {
   display: grid;
   grid-template-columns: 1fr 1fr 1fr;
   gap: 16px;

ui/src/pages/captures/upload-images-dialog/upload-images-dialog.tsx

@@ -290,7 +290,7 @@ const SectionUpload = ({
       description="Your captures will be uploaded and added to the selected monitoring station. If processing is enabled, a job will start in the background."
     >
       <div className="grid grid-cols-2 gap-8">
-        <InputValue label="Images" value={images.length} />
+        <InputValue label="Captures" value={images.length} />
         <InputValue label="Station" value={deployment?.name} />
         <div className="space-y-4">
           <div className="flex items-center gap-2">

ui/src/pages/project/capture-sets/capture-sets.tsx

@@ -49,7 +49,7 @@ export const CaptureSets = () => {
   const canCreate = userPermissions?.includes(UserPermission.Create)
 
   useEffect(() => {
-    // If any collection has a job in progress, we want to poll the endpoint so we can show job updates
+    // If any capture set has a job in progress, we want to poll the endpoint so we can show job updates
     if (captureSets?.some(({ hasJobInProgress }) => hasJobInProgress)) {
       setPoll(true)
     } else {

…details-form/collection-details-form.tsx …etails-form/capture-set-details-form.tsxui/src/pages/project/entities/details-form/collection-details-form.tsx renamed to ui/src/pages/project/entities/details-form/capture-set-details-form.tsx ui/src/pages/project/entities/details-form/collection-details-form.tsx renamed to ui/src/pages/project/entities/details-form/capture-set-details-form.tsx

@@ -7,7 +7,7 @@ import {
   FormSection,
 } from 'components/form/layout/layout'
 import { FormConfig } from 'components/form/types'
-import { Collection } from 'data-services/models/capture-set'
+import { CaptureSet } from 'data-services/models/capture-set'
 import { SaveButton } from 'design-system/components/button/save-button'
 import { InputContent } from 'design-system/components/input/input'
 import { DatePicker } from 'design-system/components/select/date-picker'
@@ -26,7 +26,7 @@ import { snakeCaseToSentenceCase } from 'utils/snakeCaseToSentenceCase'
 import { useFormError } from 'utils/useFormError'
 import { DetailsFormProps, FormValues } from './types'
 
-type CollectionFormValues = FormValues & {
+type CaptureSetFormValues = FormValues & {
   method: string
   kwargs: {
     date_start: string | undefined
@@ -125,24 +125,24 @@ const config: FormConfig = {
   },
 }
 
-export const CollectionDetailsForm = ({
+export const CaptureSetDetailsForm = ({
   entity,
   error,
   isLoading,
   isSuccess,
   onSubmit,
 }: DetailsFormProps) => {
-  const collection = entity as Collection | undefined
+  const captureSet = entity as CaptureSet | undefined
   const { control, handleSubmit, setError, watch } =
-    useForm<CollectionFormValues>({
+    useForm<CaptureSetFormValues>({
       defaultValues: {
         name: entity?.name ?? '',
         description: entity?.description ?? '',
         kwargs: {
           minute_interval: 10,
           size: 100,
           ...Object.fromEntries(
-            Object.entries(collection?.kwargs || {}).map(([key, value]) => {
+            Object.entries(captureSet?.kwargs || {}).map(([key, value]) => {
               const fieldConfig = config[`kwargs.${key}`]
               const formValue = fieldConfig?.toFormValue
                 ? fieldConfig.toFormValue(value)
@@ -151,7 +151,7 @@ export const CollectionDetailsForm = ({
             })
           ),
         },
-        method: collection?.method ?? SERVER_SAMPLING_METHODS[0],
+        method: captureSet?.method ?? SERVER_SAMPLING_METHODS[0],
       },
       mode: 'onChange',
     })

ui/src/pages/project/entities/details-form/constants.ts

@@ -1,4 +1,4 @@
-import { CollectionDetailsForm } from './collection-details-form'
+import { CaptureSetDetailsForm } from './capture-set-details-form'
 import { ExportDetailsForm } from './export-details-form'
 import { ProcessingServiceDetailsForm } from './processing-service-details-form'
 import { StorageDetailsForm } from './storage-details-form'
@@ -7,7 +7,7 @@ import { DetailsFormProps } from './types'
 export const customFormMap: {
   [key: string]: (props: DetailsFormProps) => JSX.Element
 } = {
-  'capture set': CollectionDetailsForm,
+  'capture set': CaptureSetDetailsForm,
   export: ExportDetailsForm,
   service: ProcessingServiceDetailsForm,
   storage: StorageDetailsForm,

ui/src/pages/project/sidebar/useSidebarSections.tsx

@@ -135,10 +135,5 @@ export const useSidebarSections = (project: ProjectDetails) => {
     )
   }, [location.pathname, sidebarSections])
 
-  sidebarSections
-    .map(({ items }) => items)
-    .flat()
-    .find((item) => !!matchPath(item.path, location.pathname))
-
   return { sidebarSections, activeItem }
 }

ui/src/utils/useFilters.ts

@@ -21,7 +21,7 @@ export const AVAILABLE_FILTERS: {
   },
   {
     label: translate(STRING.FIELD_LABEL_CAPTURE_SET),
-    field: 'source_image_collection', // This is for viewing jobs by capture set. @TODO: Can we update this key to "capture_set_id" streamline?
+    field: 'source_image_collection', // This is for viewing jobs by capture set. @TODO: Can we update this key to "capture_set_id" to streamline?
   },
   {
     label: translate(STRING.FIELD_LABEL_CAPTURE_SET),
@@ -70,8 +70,8 @@ export const AVAILABLE_FILTERS: {
     },
   },
   {
-    label: 'Source image',
-    field: 'detections__source_image', // This is for viewing Occurrences by source image. @TODO: Can we update this key to "source_image" to streamline?
+    label: translate(STRING.FIELD_LABEL_CAPTURE),
+    field: 'detections__source_image', // This is for viewing occurrences by capture. @TODO: Can we update this key to "capture_id" to streamline?
   },
   {
     label: 'Session',
@@ -106,8 +106,8 @@ export const AVAILABLE_FILTERS: {
     field: 'not_taxa_list_id',
   },
   {
-    label: 'Source image',
-    field: 'source_image_single', // This is for viewing Jobs by source image. @TODO: Can we update this key to "source_image" to streamline?
+    label: translate(STRING.FIELD_LABEL_CAPTURE),
+    field: 'source_image_single', // This is for viewing jobs by capture. @TODO: Can we update this key to "capture_id" to streamline?
   },
   {
     label: 'Status',