From 19831281e2dbc61072d915082a36cbc4ee242690 Mon Sep 17 00:00:00 2001
From: Johnathan Clementi <johnathan.clementi1@gmail.com>
Date: Wed, 8 Jan 2025 11:02:55 -0500
Subject: [PATCH] Fix label values not updating between edit sessions and
 update save method #147

---
 arches_lingo/src/arches_lingo/api.ts          | 20 ++++++
 .../components/generic/LabelEditor.vue        | 69 +++++++++++++------
 .../components/scheme/report/SchemeLabel.vue  | 23 +++----
 arches_lingo/templates/arches_urls.htm        |  1 +
 arches_lingo/urls.py                          |  6 ++
 arches_lingo/views/api/pythonic_models.py     |  5 ++
 6 files changed, 90 insertions(+), 34 deletions(-)

diff --git a/arches_lingo/src/arches_lingo/api.ts b/arches_lingo/src/arches_lingo/api.ts
index ab9ccd4e..4dc9213c 100644
--- a/arches_lingo/src/arches_lingo/api.ts
+++ b/arches_lingo/src/arches_lingo/api.ts
@@ -80,6 +80,26 @@ export const fetchSchemeLabel = async (schemeId: string) => {
     return parsed;
 };
 
+export const createSchemeLabel = async (
+    schemeId: string,
+    appellative_status: AppellativeStatus,
+) => {
+    const response = await fetch(arches.urls.api_scheme_label_create, {
+        method: "POST",
+        headers: {
+            "X-CSRFTOKEN": getToken(),
+            "Content-Type": "application/json",
+        },
+        body: JSON.stringify({
+            resourceinstance: schemeId,
+            ...appellative_status,
+        }),
+    });
+    const parsed = await response.json();
+    if (!response.ok) throw new Error(parsed.message || response.statusText);
+    return parsed;
+};
+
 export const deleteSchemeLabelTile = async (
     schemeId: string,
     tileId: string,
diff --git a/arches_lingo/src/arches_lingo/components/generic/LabelEditor.vue b/arches_lingo/src/arches_lingo/components/generic/LabelEditor.vue
index da6f1e0f..82c336f8 100644
--- a/arches_lingo/src/arches_lingo/components/generic/LabelEditor.vue
+++ b/arches_lingo/src/arches_lingo/components/generic/LabelEditor.vue
@@ -1,12 +1,14 @@
 <script setup lang="ts">
-import { inject, onMounted, ref, toRaw, type Ref } from "vue";
+import { computed, inject, onMounted, ref, toRaw, toRef, type Ref } from "vue";
 
 import Button from "primevue/button";
 import { useGettext } from "vue3-gettext";
-import { useRoute } from "vue-router";
+import { useRoute, useRouter } from "vue-router";
 import { useToast } from "primevue/usetoast";
 
 import {
+    createScheme,
+    createSchemeLabel,
     fetchControlledListOptions,
     fetchGroupRdmSystemList,
     fetchPersonRdmSystemList,
@@ -26,8 +28,10 @@ import {
     LABEL_CONTROLLED_LIST,
     LANGUAGE_CONTROLLED_LIST,
     METATYPES_CONTROLLED_LIST,
+    NEW,
     selectedLanguageKey,
     STATUSES_CONTROLLED_LIST,
+    UPDATED,
 } from "@/arches_lingo/constants.ts";
 
 import type {
@@ -36,12 +40,14 @@ import type {
     ControlledListItemResult,
     ResourceInstanceReference,
     ResourceInstanceResult,
+    SchemeInstance,
 } from "@/arches_lingo/types.ts";
 import type { Language } from "@/arches_vue_utils/types.ts";
 
-const emit = defineEmits(["update"]);
+const emit = defineEmits([UPDATED]);
 const toast = useToast();
 const route = useRoute();
+const router = useRouter();
 const selectedLanguage = inject(selectedLanguageKey) as Ref<Language>;
 const { $gettext } = useGettext();
 
@@ -53,7 +59,13 @@ const props = withDefaults(
         value: () => ({}) as AppellativeStatus,
     },
 );
-const value = ref(props.value);
+const valueRef = toRef(props, "value");
+const formValue = computed({
+    get: () => valueRef.value,
+    set: (newVal: AppellativeStatus) => {
+        valueRef.value = newVal;
+    },
+});
 
 const languageOptions = ref<ControlledListItem[]>([]);
 const typeOptions = ref<ControlledListItem[]>([]);
@@ -64,14 +76,14 @@ const groupAndPersonOptions = ref<ResourceInstanceReference[]>();
 const textualWorkOptions = ref<ResourceInstanceReference[]>();
 
 function onUpdateString(node: keyof AppellativeStatus, val: string) {
-    (value.value[node] as unknown) = toRaw(val);
+    (formValue.value[node] as unknown) = toRaw(val);
 }
 
 function onUpdateReferenceDatatype(
     node: keyof AppellativeStatus,
     val: ControlledListItem[],
 ) {
-    (value.value[node] as unknown) = val.map((item) => toRaw(item));
+    (formValue.value[node] as unknown) = val.map((item) => toRaw(item));
 }
 
 function onUpdateResourceInstance(
@@ -83,18 +95,31 @@ function onUpdateResourceInstance(
         const selectedOptions = options.filter((option) =>
             val.includes(option.resourceId),
         );
-        (value.value[node] as unknown) = selectedOptions;
+        (formValue.value[node] as unknown) = selectedOptions;
     }
 }
 
 async function save() {
     try {
-        await updateSchemeLabel(
-            route.params.id as string,
-            value.value.tileid as string,
-            value.value,
-        );
-        emit("update");
+        if (route.params.id === NEW) {
+            const newSchemeInstance: SchemeInstance = {
+                appellative_status: [toRaw(formValue.value)],
+            };
+            const updated = await createScheme(newSchemeInstance);
+            await router.push({
+                name: "scheme",
+                params: { id: updated.resourceinstanceid },
+            });
+        } else if (!formValue.value.tileid) {
+            await createSchemeLabel(route.params.id as string, formValue.value);
+        } else {
+            await updateSchemeLabel(
+                route.params.id as string,
+                formValue.value.tileid as string,
+                formValue.value,
+            );
+        }
+        emit(UPDATED);
     } catch (error) {
         toast.add({
             severity: ERROR,
@@ -176,7 +201,7 @@ onMounted(async () => {
     <!-- Label Language: reference datatype -->
     <label for="">{{ $gettext("Label Language") }}</label>
     <ReferenceDatatype
-        :value="value?.appellative_status_ascribed_name_language"
+        :value="formValue?.appellative_status_ascribed_name_language"
         :mode="EDIT"
         :multi-value="false"
         :options="languageOptions"
@@ -191,7 +216,7 @@ onMounted(async () => {
     <!-- Label Type: reference datatype -->
     <label for="">{{ $gettext("Label Type") }}</label>
     <ReferenceDatatype
-        :value="value?.appellative_status_ascribed_relation"
+        :value="formValue?.appellative_status_ascribed_relation"
         :mode="EDIT"
         :multi-value="false"
         :options="typeOptions"
@@ -206,7 +231,7 @@ onMounted(async () => {
     <!-- Label Status: reference datatype -->
     <label for="">{{ $gettext("Label Status") }}</label>
     <ReferenceDatatype
-        :value="value?.appellative_status_status"
+        :value="formValue?.appellative_status_status"
         :mode="EDIT"
         :multi-value="false"
         :options="statusOptions"
@@ -217,7 +242,7 @@ onMounted(async () => {
     <!-- Label Status Metatype: reference datatype -->
     <label for="">{{ $gettext("Label Metatype") }}</label>
     <ReferenceDatatype
-        :value="value?.appellative_status_status_metatype"
+        :value="formValue?.appellative_status_status_metatype"
         :mode="EDIT"
         :multi-value="false"
         :options="metatypeOptions"
@@ -233,7 +258,7 @@ onMounted(async () => {
     <!-- Label Temporal Validity Start: date -->
     <label for="">{{ $gettext("Label Temporal Validity Start") }}</label>
     <DateDatatype
-        :value="value?.appellative_status_timespan_begin_of_the_begin"
+        :value="formValue?.appellative_status_timespan_begin_of_the_begin"
         :mode="EDIT"
         @update="
             (val) =>
@@ -247,7 +272,7 @@ onMounted(async () => {
     <!-- Label Temporal Validity End: date -->
     <label for="">{{ $gettext("Label Temporal Validity End") }}</label>
     <DateDatatype
-        :value="value?.appellative_status_timespan_end_of_the_end"
+        :value="formValue?.appellative_status_timespan_end_of_the_end"
         :mode="EDIT"
         @update="
             (val) =>
@@ -261,7 +286,7 @@ onMounted(async () => {
     <!-- Contributor: resource instance -->
     <label for="">{{ $gettext("Contributor") }}</label>
     <ResourceInstanceRelationships
-        :value="value?.appellative_status_data_assignment_actor"
+        :value="formValue?.appellative_status_data_assignment_actor"
         :mode="EDIT"
         :options="groupAndPersonOptions"
         @update="
@@ -276,7 +301,7 @@ onMounted(async () => {
     <!-- Sources: resource instance -->
     <label for="">{{ $gettext("Sources") }}</label>
     <ResourceInstanceRelationships
-        :value="value?.appellative_status_data_assignment_object_used"
+        :value="formValue?.appellative_status_data_assignment_object_used"
         :mode="EDIT"
         :options="textualWorkOptions"
         @update="
@@ -291,7 +316,7 @@ onMounted(async () => {
     <!-- Warrant Type: reference datatype -->
     <label for="">{{ $gettext("Warrant Type") }}</label>
     <ReferenceDatatype
-        :value="value?.appellative_status_data_assignment_type"
+        :value="formValue?.appellative_status_data_assignment_type"
         :mode="EDIT"
         :multi-value="false"
         :options="eventTypeOptions"
diff --git a/arches_lingo/src/arches_lingo/components/scheme/report/SchemeLabel.vue b/arches_lingo/src/arches_lingo/components/scheme/report/SchemeLabel.vue
index a7b1f622..26670d8c 100644
--- a/arches_lingo/src/arches_lingo/components/scheme/report/SchemeLabel.vue
+++ b/arches_lingo/src/arches_lingo/components/scheme/report/SchemeLabel.vue
@@ -1,6 +1,6 @@
 <script setup lang="ts">
 import { useGettext } from "vue3-gettext";
-import { onMounted, ref } from "vue";
+import { computed, onMounted, ref } from "vue";
 import { useRoute } from "vue-router";
 import { useToast } from "primevue/usetoast";
 
@@ -36,11 +36,10 @@ const metaStringLabel: MetaStringText = {
     noRecords: $gettext("No scheme labels were found."),
 };
 
-withDefaults(
+const props = withDefaults(
     defineProps<{
         mode?: DataComponentMode;
         tileId?: string | null;
-        args?: Array<object>;
     }>(),
     {
         mode: VIEW,
@@ -48,6 +47,11 @@ withDefaults(
     },
 );
 const schemeInstance = ref<SchemeInstance>();
+const appellativeStatusToEdit = computed(() => {
+    return schemeInstance.value?.appellative_status?.find(
+        (tile) => tile.tileid === props.tileId,
+    );
+});
 
 defineExpose({ getSectionValue });
 
@@ -181,15 +185,10 @@ function update() {
         </SchemeReportSection>
     </div>
     <div v-if="mode === EDIT">
-        <div
-            v-for="appellative_status in schemeInstance?.appellative_status"
-            :key="appellative_status.tileid"
-        >
-            <LabelEditor
-                :value="appellative_status"
-                @update="update"
-            ></LabelEditor>
-        </div>
+        <LabelEditor
+            :value="appellativeStatusToEdit"
+            @update="update"
+        />
     </div>
 </template>
 <style scoped>
diff --git a/arches_lingo/templates/arches_urls.htm b/arches_lingo/templates/arches_urls.htm
index a9c2fd8c..13f631d2 100644
--- a/arches_lingo/templates/arches_urls.htm
+++ b/arches_lingo/templates/arches_urls.htm
@@ -13,6 +13,7 @@
     api_schemes="{% url 'schemes-list-create' %}"
     api_scheme_label='(resourceid)=>{return "{% url "api-scheme-label" "aaaaaaaa-aaaa-aaaa-aaaa-aaaaaaaaaaaa" %}".replace("aaaaaaaa-aaaa-aaaa-aaaa-aaaaaaaaaaaa", resourceid)}'
     api_scheme_label_tile='(resourceid, tileid)=>{return "{% url "api-scheme-label-tile" "aaaaaaaa-aaaa-aaaa-aaaa-aaaaaaaaaaaa" "aaaaaaaa-aaaa-aaaa-aaaa-aaaaaaaaaaab"%}".replace("aaaaaaaa-aaaa-aaaa-aaaa-aaaaaaaaaaaa", resourceid).replace("aaaaaaaa-aaaa-aaaa-aaaa-aaaaaaaaaaab", tileid)}'
+    api_scheme_label_create="{% url 'api-scheme-label-create' %}"
     api_scheme_note='(resourceid)=>{return "{% url "api-scheme-note" "aaaaaaaa-aaaa-aaaa-aaaa-aaaaaaaaaaaa" %}".replace("aaaaaaaa-aaaa-aaaa-aaaa-aaaaaaaaaaaa", resourceid)}'
     api_scheme_note_tile='(resourceid, tileid)=>{return "{% url "api-scheme-note-tile" "aaaaaaaa-aaaa-aaaa-aaaa-aaaaaaaaaaaa" "aaaaaaaa-aaaa-aaaa-aaaa-aaaaaaaaaaab" %}".replace("aaaaaaaa-aaaa-aaaa-aaaa-aaaaaaaaaaaa", resourceid).replace("aaaaaaaa-aaaa-aaaa-aaaa-aaaaaaaaaaab", tileid)}'
     api_scheme_creation='(resourceid)=>{return "{% url "api-scheme-creation" "aaaaaaaa-aaaa-aaaa-aaaa-aaaaaaaaaaaa" %}".replace("aaaaaaaa-aaaa-aaaa-aaaa-aaaaaaaaaaaa", resourceid)}'
diff --git a/arches_lingo/urls.py b/arches_lingo/urls.py
index deb23edb..e0bdfa02 100644
--- a/arches_lingo/urls.py
+++ b/arches_lingo/urls.py
@@ -16,6 +16,7 @@
     SchemeDetailView,
     SchemeLabelTileView,
     SchemeLabelView,
+    SchemeLabelCreateView,
     SchemeListCreateView,
     SchemeNamespaceView,
     SchemeNoteTileView,
@@ -70,6 +71,11 @@
         SchemeLabelTileView.as_view(),
         name="api-scheme-label-tile",
     ),
+    path(
+        "api/scheme/label",
+        SchemeLabelCreateView.as_view(),
+        name="api-scheme-label-create",
+    ),
     path(
         "api/scheme/<uuid:pk>/note",
         SchemeNoteView.as_view(),
diff --git a/arches_lingo/views/api/pythonic_models.py b/arches_lingo/views/api/pythonic_models.py
index 9d5643b4..aa3ed1d7 100644
--- a/arches_lingo/views/api/pythonic_models.py
+++ b/arches_lingo/views/api/pythonic_models.py
@@ -70,6 +70,11 @@ class SchemeLabelTileView(ArchesModelAPIMixin, RetrieveUpdateDestroyAPIView):
     serializer_class = SchemeLabelTileSerializer
 
 
+class SchemeLabelCreateView(ArchesModelAPIMixin, ListCreateAPIView):
+    permission_classes = [RDMAdministrator]
+    serializer_class = SchemeLabelTileSerializer
+
+
 class SchemeNoteView(ArchesModelAPIMixin, RetrieveUpdateDestroyAPIView):
     permission_classes = [RDMAdministrator]
     serializer_class = SchemeNoteSerializer