Attributes conversion to metadata

client/dive-common/apispec.ts

@@ -2,19 +2,12 @@ import { provide } from '@vue/composition-api';
 
 import { use } from 'vue-media-annotator/provides';
 import { TrackData, TrackId } from 'vue-media-annotator/track';
+import { Attribute } from 'vue-media-annotator/use/useAttributes';
 import { CustomStyle } from 'vue-media-annotator/use/useStyling';
 
 type DatasetType = 'image-sequence' | 'video';
 type MultiTrackRecord = Record<string, TrackData>;
 
-interface Attribute {
-  belongs: 'track' | 'detection';
-  datatype: 'text' | 'number' | 'boolean';
-  values?: string[];
-  name: string;
-  _id: string;
-}
-
 interface Pipe {
   name: string;
   pipe: string;
@@ -38,6 +31,11 @@ interface SaveDetectionsArgs {
   upsert: TrackData[];
 }
 
+interface SaveAttributeArgs {
+  delete: string[];
+  upsert: Attribute[];
+}
+
 interface FrameImage {
   url: string;
   filename: string;
@@ -49,7 +47,6 @@ interface FrameImage {
 interface DatasetMetaMutable {
   customTypeStyling?: Record<string, CustomStyle>;
   confidenceFilters?: Record<string, number>;
-  attributes?: Record<string, Attribute>;
 }
 
 interface DatasetMeta extends DatasetMetaMutable {
@@ -60,19 +57,10 @@ interface DatasetMeta extends DatasetMetaMutable {
   fps: Readonly<number | string>; // this will become mutable in the future.
   name: string;
   createdAt: string;
+  attributes?: Record<string, Attribute>;
 }
 
 interface Api {
-  /**
-   * TODO: Modification to use loadMetadata as well as saving
-   * utilizing upsert/delete for the metaData.  This requires having
-   * useAttributes to manage attributes locally and then save to backend
-   * @deprecated soon attributes will come from loadMetadata()
-   */
-  getAttributes(datasetId: string): Promise<Attribute[]>;
-  setAttribute(datasetId: string, { addNew, data }:
-    {addNew?: boolean; data: Attribute}): Promise<unknown>;
-  deleteAttribute(datasetId: string, data: Attribute): Promise<unknown>;
 
   getPipelineList(): Promise<Pipelines>;
   runPipeline(itemId: string, pipeline: Pipe): Promise<unknown>;
@@ -85,6 +73,7 @@ interface Api {
 
   saveDetections(datasetId: string, args: SaveDetectionsArgs): Promise<unknown>;
   saveMetadata(datasetId: string, metadata: DatasetMetaMutable): Promise<unknown>;
+  saveAttributes(datasetId: string, args: SaveAttributeArgs): Promise<unknown>;
 }
 
 const ApiSymbol = Symbol('api');
@@ -109,7 +98,6 @@ export {
 
 export type {
   Api,
-  Attribute,
   DatasetMeta,
   DatasetMetaMutable,
   DatasetType,
@@ -118,5 +106,6 @@ export type {
   Pipe,
   Pipelines,
   SaveDetectionsArgs,
+  SaveAttributeArgs,
   TrainingConfigs,
 };

client/dive-common/components/AttributeEditor.vue

@@ -2,8 +2,8 @@
 import {
   computed, defineComponent, PropType, Ref, ref,
 } from '@vue/composition-api';
+import { Attribute } from 'vue-media-annotator/use/useAttributes';
 
-import { Attribute } from 'dive-common/apispec';
 
 export default defineComponent({
   name: 'AttributeSettings',
@@ -22,7 +22,7 @@ export default defineComponent({
     const belongs: Ref<string> = ref(props.selectedAttribute.belongs);
     const datatype: Ref<string> = ref(props.selectedAttribute.datatype);
     let values: string[] = props.selectedAttribute.values ? props.selectedAttribute.values : [];
-    let addNew = !props.selectedAttribute._id.length;
+    let addNew = !props.selectedAttribute.key.length;
 
     const form: Ref<HTMLFormElement | null> = ref(null);
 
@@ -58,15 +58,19 @@ export default defineComponent({
         return;
       }
 
-      const content = {
+      const data = {
         name: name.value,
         belongs: belongs.value,
         datatype: datatype.value,
         values: datatype.value === 'text' && values ? values : [],
-        _id: props.selectedAttribute._id,
+        key: `${belongs.value}_${name.value}`,
       };
 
-      emit('save', { addNew, data: content });
+      if (addNew) {
+        emit('save', { data });
+      } else {
+        emit('save', { data, oldAttribute: props.selectedAttribute });
+      }
     }
 
     async function deleteAttribute() {
@@ -151,7 +155,7 @@ export default defineComponent({
                   <v-btn
                     class="hover-show-child"
                     color="error"
-                    :disabled="!selectedAttribute._id.length"
+                    :disabled="!selectedAttribute.key.length"
                     @click.prevent="deleteAttribute"
                   >
                     Delete