diff --git a/bats_ai/core/views/grts_cells.py b/bats_ai/core/views/grts_cells.py
index 95a3c078..67e578a3 100644
--- a/bats_ai/core/views/grts_cells.py
+++ b/bats_ai/core/views/grts_cells.py
@@ -81,3 +81,39 @@ def custom_sort_key(cell):
         return JsonResponse({'latitude': center_latitude, 'longitude': center_longitude})
     except GRTSCells.DoesNotExist:
         return JsonResponse({'error': f'Cell with cellId={id} does not exist'}, status=200)
+
+
+@router.get('/{id}/bbox')
+def get_grts_cell_bbox(request: HttpRequest, id: int):
+    try:
+        cells = GRTSCells.objects.filter(grts_cell_id=id)
+        custom_order = GRTSCells.sort_order()
+
+        def custom_sort_key(cell):
+            return custom_order.index(cell.sample_frame_id)
+
+        sorted_cells = sorted(cells, key=custom_sort_key)
+        cell = sorted_cells[0]
+        geom = cell.geom_4326
+
+        min_x, min_y, max_x, max_y = geom.extent
+
+        geojson = {
+            'type': 'Feature',
+            'geometry': {
+                'type': 'Polygon',
+                'coordinates': [
+                    [min_x, min_y],
+                    [min_x, max_y],
+                    [max_x, max_y],
+                    [max_x, min_y],
+                ],
+            },
+            'properties': {
+                'grts_cell_id': id,
+                'annotationType': 'rectangle',
+            },
+        }
+        return JsonResponse(geojson)
+    except (GRTSCells.DoesNotExist, IndexError):
+        return JsonResponse({'error': f'Cell with id {id} does not exist'}, status=200)
diff --git a/client/src/api/api.ts b/client/src/api/api.ts
index 246ce16d..4faae6f5 100644
--- a/client/src/api/api.ts
+++ b/client/src/api/api.ts
@@ -258,6 +258,18 @@ interface GRTSCellCenter {
   error?: string;
 }
 
+interface GRTSCellBbox {
+  type: string;
+  geometry: {
+    type: string;
+    coordinates: number[][];
+  };
+  properties: {
+    grts_cell_id: number;
+    annotationType: string;
+  };
+}
+
 export interface RecordingTag {
   id: number;
   text: string;
@@ -367,6 +379,11 @@ async function getOtherUserAnnotations(recordingId: string) {
 async function getCellLocation(cellId: number, quadrant?: "SW" | "NE" | "NW" | "SE") {
   return axiosInstance.get<GRTSCellCenter>(`/grts/${cellId}`, { params: { quadrant } });
 }
+
+async function getCellBbox(cellId: number) {
+  return await axiosInstance.get<GRTSCellBbox>(`/grts/${cellId}/bbox`);
+}
+
 async function getFileAnnotations(recordingId: number) {
   return axiosInstance.get<FileAnnotation[]>(`recording/${recordingId}/recording-annotations`);
 }
@@ -539,6 +556,7 @@ export {
   deleteAnnotation,
   deleteSequenceAnnotation,
   getCellLocation,
+  getCellBbox,
   getCellfromLocation,
   getGuanoMetadata,
   getFileAnnotations,
diff --git a/client/src/components/MapLocation.vue b/client/src/components/MapLocation.vue
index d23d04d5..3da9499f 100644
--- a/client/src/components/MapLocation.vue
+++ b/client/src/components/MapLocation.vue
@@ -2,6 +2,7 @@
 <script lang="ts">
 import { defineComponent, PropType, Ref, ref, onMounted } from "vue";
 import { watch } from "vue";
+import { getCellBbox } from "@api/api";
 import geo, { GeoEvent } from "geojs";
 
 export default defineComponent({
@@ -20,6 +21,10 @@ export default defineComponent({
       type: Object as PropType<{ x?: number; y?: number } | undefined>,
       default: () => undefined,
     },
+    grtsCellId: {
+      type: Number,
+      default: undefined,
+    },
     updateMap: {
       type: Number,
       default: 0,
@@ -32,23 +37,49 @@ export default defineComponent({
     const map: Ref<any> = ref();
     const mapLayer: Ref<any> = ref();
     const markerLayer: Ref<any> = ref();
+    const bboxLayer: Ref<any> = ref();
     const markerFeature: Ref<any> = ref();
+    const bboxFeature: Ref<any> = ref();
     const markerLocation: Ref<{ x: number; y: number } | null> = ref(null);
     const uiLayer: Ref<any> = ref();
     const mounted = ref(false);
-    onMounted((() => mounted.value = true));
-    watch(mapRef, () => {
+
+    onMounted(async () => {
+      mounted.value = true;
+    });
+    watch(mapRef, async () => {
       if (mapRef.value) {
         const centerPoint = props.location && props.location.x && props.location.y ? props.location : usCenter;
         const zoomLevel = props.location && props.location.x && props.location.y ? 6 : 3;
         map.value = geo.map({ node: mapRef.value, center: centerPoint, zoom: zoomLevel });
         mapLayer.value = map.value.createLayer("osm");
         markerLayer.value = map.value.createLayer("feature", { features: ["marker"] });
+        bboxLayer.value = map.value.createLayer("feature", { features: ["polygon"] });
         uiLayer.value = map.value.createLayer("ui");
         markerFeature.value = markerLayer.value.createFeature("marker");
+        bboxFeature.value = bboxLayer.value.createFeature("polygon");
         uiLayer.value.createWidget('slider');
 
-        if (props.location?.x && props.location?.y) {
+
+        if (props.grtsCellId !== undefined) {
+          const annotation = await getCellBbox(props.grtsCellId);
+          const coordinates = annotation.data.geometry.coordinates;
+          const data = coordinates.map((point: number[]) => ({ x: point[0], y: point[1] }));
+          data.push({ x: coordinates[0][0], y: coordinates[0][1] });
+          bboxFeature.value.data([data]).style({
+            stroke: true,
+            strokeWidth: 1,
+            strokeColor: 'black',
+            fill: false,
+          }).draw();
+          bboxLayer.value.draw();
+          const center = {
+            x: (data[0].x + data[2].x) / 2,
+            y: (data[0].y + data[1].y) / 2
+          };
+          map.value.center(center);
+          map.value.zoom(9);
+        } else if (props.location?.x && props.location?.y) {
             markerLocation.value = { x: props.location?.x, y: props.location.y };
             markerFeature.value
               .data([markerLocation.value])
@@ -104,8 +135,8 @@ export default defineComponent({
                 rotateWithMap: false,
               })
               .draw();
-              const centerPoint = props.location && props.location.x && props.location.y ? props.location : usCenter;
               const zoomLevel = props.location && props.location.x && props.location.y ? 6 : 3;
+              const centerPoint = props.location && props.location.x && props.location.y ? props.location : usCenter;
               if (map.value) {
                 map.value.zoom(zoomLevel);
                 map.value.center(centerPoint);
diff --git a/client/src/components/RecordingInfoDialog.vue b/client/src/components/RecordingInfoDialog.vue
index 4e6fc240..ed619f77 100644
--- a/client/src/components/RecordingInfoDialog.vue
+++ b/client/src/components/RecordingInfoDialog.vue
@@ -1,6 +1,7 @@
 <script lang="ts">
 import { defineComponent, onMounted, ref, Ref, watch } from 'vue';
 import { getRecording, Recording } from '../api/api';
+import useState from '@use/useState';
 import RecordingInfoDisplay from './RecordingInfoDisplay.vue';
 
 
@@ -17,6 +18,7 @@ export default defineComponent({
   emits: ['close'],
   setup(props) {
     const recordingInfo: Ref<Recording | null> = ref(null);
+    const { configuration } = useState();
 
     const loadData = async () => {
       const recording = getRecording(props.id);
@@ -26,6 +28,7 @@ export default defineComponent({
     onMounted(() => loadData());
     return {
       recordingInfo,
+      configuration,
     };
   },
 });
@@ -35,6 +38,7 @@ export default defineComponent({
   <recording-info-display
     v-if="recordingInfo"
     :recording-info="recordingInfo"
+    :minimal-metadata="configuration.mark_annotations_completed_enabled"
     @close="$emit('close')"
   />
 </template>
diff --git a/client/src/components/RecordingInfoDisplay.vue b/client/src/components/RecordingInfoDisplay.vue
index 6ee1c43f..5dc3dcc9 100644
--- a/client/src/components/RecordingInfoDisplay.vue
+++ b/client/src/components/RecordingInfoDisplay.vue
@@ -1,5 +1,5 @@
 <script lang="ts">
-import { defineComponent, PropType } from 'vue';
+import { computed, defineComponent, PropType } from 'vue';
 import { Recording } from '../api/api';
 import MapLocation from './MapLocation.vue';
 
@@ -16,12 +16,25 @@ export default defineComponent({
     disableButton: {
       type: Boolean,
       default: false,
+    },
+    minimalMetadata: {
+      type: Boolean,
+      default: false,
     }
   },
   emits: ['close'],
-  setup() {
+  setup(props) {
+    const location = computed(() => {
+      if (!props.minimalMetadata && props.recordingInfo.recording_location) {
+        return {
+          x: props.recordingInfo.recording_location.coordinates[0],
+          y:props.recordingInfo.recording_location.coordinates[1]
+        };
+      }
+      return undefined;
+    });
     return {
-
+      location,
     };
   },
 });
@@ -42,10 +55,10 @@ export default defineComponent({
       <v-row>
         <div><b>Time:</b><span>{{ recordingInfo.recorded_date }}</span> <span> {{ recordingInfo.recorded_time }}</span></div>
       </v-row>
-      <v-row>
+      <v-row v-if="!minimalMetadata">
         <div><b>Equipment:</b><span>{{ recordingInfo.equipment || 'None' }}</span></div>
       </v-row>
-      <v-row>
+      <v-row v-if="!minimalMetadata">
         <div><b>Comments:</b><span>{{ recordingInfo.comments || 'None' }}</span></div>
       </v-row>
       <v-row>
@@ -56,11 +69,12 @@ export default defineComponent({
         <map-location
           :editor="false"
           :size="{width: 400, height: 400}"
-          :location="{ x: recordingInfo.recording_location.coordinates[0], y:recordingInfo.recording_location.coordinates[1]}"
+          :location="location"
+          :grts-cell-id="recordingInfo.grts_cell_id || undefined"
         />
         <v-spacer />
       </v-row>
-      
+
       <div
         v-if="recordingInfo.site_name"
         class="mt-5"
diff --git a/client/src/views/Recordings.vue b/client/src/views/Recordings.vue
index df7458ce..ef15dbc4 100644
--- a/client/src/views/Recordings.vue
+++ b/client/src/views/Recordings.vue
@@ -91,7 +91,7 @@ export default defineComponent({
           key:'comments'
         },
         {
-          title:'Users Annotated',
+          title:'User Pulse Annotations',
           key:'userAnnotations',
         },
         {
@@ -217,6 +217,16 @@ export default defineComponent({
       return filterTagSet.intersection(itemTagSet).size > 0;
     };
 
+    function currentUserSubmissionStatus(recording: Recording) {
+      const userAnnotations = recording.fileAnnotations.filter((annotation: FileAnnotation) => (
+        annotation.owner === currentUser.value && annotation.model === 'User Defined'
+      ));
+      if (userAnnotations.find((annotation: FileAnnotation) => annotation.submitted)) {
+        return 1;
+      }
+      return userAnnotations.length ? 0 : -1;
+    }
+
     function currentUserSubmission(recording: Recording) {
       const userSubmittedAnnotation = recording.fileAnnotations.find((annotation: FileAnnotation) => (
         annotation.owner === currentUser.value && annotation.submitted
@@ -227,9 +237,9 @@ export default defineComponent({
     function addSubmittedColumns() {
       if (configuration.value.mark_annotations_completed_enabled) {
         const submittedHeader = {
-          title: 'Submitted',
+          title: 'Submission Status',
           key: 'submitted',
-          value: currentUserSubmission,
+          value: currentUserSubmissionStatus,
         };
         const myLabelHeader = {
           title: 'My Submitted Label',
@@ -241,6 +251,15 @@ export default defineComponent({
       }
     }
 
+    function hideDetailedMetadataColumns() {
+      if (!configuration.value.mark_annotations_completed_enabled) return;
+      const filterDetailedMetadataFunction = (val: { key: string }) => (
+        !['comments', 'details', 'annotation', 'userAnnotations'].includes(val.key)
+      );
+      headers.value = headers.value.filter(filterDetailedMetadataFunction);
+      sharedHeaders.value = sharedHeaders.value.filter(filterDetailedMetadataFunction);
+    }
+
     const recordingListStyles = computed(() => {
       const sectionHeight = configuration.value.mark_annotations_completed_enabled ? '35vh' : '40vh';
       return {
@@ -250,10 +269,11 @@ export default defineComponent({
     });
 
     onMounted(async () => {
+      addSubmittedColumns();
+      hideDetailedMetadataColumns();
       await loadCurrentUser();
       await fetchRecordingTags();
       await fetchRecordings();
-      addSubmittedColumns();
     });
 
     const uploadDone = () => {
@@ -325,6 +345,7 @@ export default defineComponent({
         editingRecording,
         dataLoading,
         currentUserSubmission,
+        currentUserSubmissionStatus,
         configuration,
         submittedMyRecordings,
         submittedSharedRecordings,
@@ -495,6 +516,7 @@ export default defineComponent({
                 :editor="false"
                 :size="{width: 400, height: 400}"
                 :location="{ x: item.recording_location.coordinates[0], y: item.recording_location.coordinates[1]}"
+                :grts-cell-id="configuration.mark_annotations_completed_enabled ? item.grts_cell_id || undefined : undefined"
               />
             </v-card>
           </v-menu>
@@ -519,6 +541,7 @@ export default defineComponent({
             </template>
             <recording-info-display
               :recording-info="item"
+              :minimal-metadata="configuration.mark_annotations_completed_enabled"
               disable-button
             />
           </v-menu>
@@ -544,17 +567,23 @@ export default defineComponent({
           #item.submitted="{ item }"
         >
           <v-icon
-            v-if="currentUserSubmission(item)"
+            v-if="currentUserSubmissionStatus(item) === 1"
             color="success"
           >
             mdi-check
           </v-icon>
           <v-icon
-            v-else
+            v-else-if="currentUserSubmissionStatus(item) === -1"
             color="error"
           >
             mdi-close
           </v-icon>
+          <v-icon
+            v-else
+            color="warning"
+          >
+            mdi-circle-outline
+          </v-icon>
         </template>
         <template #bottom />
       </v-data-table>
@@ -670,6 +699,7 @@ export default defineComponent({
                 :editor="false"
                 :size="{width: 400, height: 400}"
                 :location="{ x: item.recording_location.coordinates[0], y: item.recording_location.coordinates[1]}"
+                :grts-cell-id="configuration.mark_annotations_completed_enabled ? item.grts_cell_id || undefined : undefined"
               />
             </v-card>
           </v-menu>
@@ -719,17 +749,23 @@ export default defineComponent({
           #item.submitted="{ item }"
         >
           <v-icon
-            v-if="currentUserSubmission(item)"
+            v-if="currentUserSubmissionStatus(item) === 1"
             color="success"
           >
             mdi-check
           </v-icon>
           <v-icon
-            v-else
+            v-else-if="currentUserSubmissionStatus(item) === -1"
             color="error"
           >
             mdi-close
           </v-icon>
+          <v-icon
+            v-else
+            color="warning"
+          >
+            mdi-circle-outline
+          </v-icon>
         </template>
         <template #bottom />
       </v-data-table>