merge: #2392

2392: feat(web,dal,sdf-server): ENG-1682 make existing assets editable r=zacharyhamm a=zacharyhamm

If an asset has no components on the graph, and is not connected to any attribute functions and validations, there's nothing preventing us from allowing users to update the structure of it through the asset function. This enables that.

Also closes ENG-1686 and ENG-1683.

NOTE: we're not deleting the props/attribute values/providers/prototypes for orphaned schema variants here. This should be fixed in a follow up.

Co-authored-by: Zachary Hamm <zack@systeminit.com>

Author: si-bors-ng[bot]

app/web/src/components/AssetDetailsPanel.vue

@@ -13,7 +13,11 @@
         <VButton
           :requestStatus="executeAssetReqStatus"
           loadingText="Creating Asset..."
-          label="Create Asset"
+          :label="
+            assetStore.selectedAsset.schemaVariantId
+              ? 'Update Asset'
+              : 'Create Asset'
+          "
           :disabled="disabled"
           tone="action"
           icon="bolt"
@@ -30,6 +34,9 @@
       </div>
 
       <Stack>
+        <ErrorMessage v-if="disabled" icon="alert-triangle" tone="warning"
+          >{{ disabledWarning }}
+        </ErrorMessage>
         <ErrorMessage
           v-if="executeAssetReqStatus.isError"
           :requestStatus="executeAssetReqStatus"
@@ -134,6 +141,7 @@ import {
 import { useAssetStore } from "@/store/asset.store";
 import { useFuncStore } from "@/store/func/funcs.store";
 import { useChangeSetsStore } from "@/store/change_sets.store";
+import { nilId } from "@/utils/nilId";
 import ColorPicker from "./ColorPicker.vue";
 
 defineProps<{
@@ -160,23 +168,45 @@ const updateAsset = () => {
 };
 
 const disabled = computed(
-  () => !!(assetStore.selectedAsset?.defaultVariantId ?? false),
+  () =>
+    !!(
+      (assetStore.selectedAsset?.hasComponents ||
+        assetStore.selectedAsset?.hasAttrFuncs) ??
+      false
+    ),
 );
 
+const disabledWarning = computed(() => {
+  let byComponents = "";
+  if (assetStore.selectedAsset?.hasComponents) {
+    byComponents = "by components";
+  }
+  let byFuncs = "";
+  if (assetStore.selectedAsset?.hasAttrFuncs) {
+    byFuncs = "by attribute functions or custom validations";
+  }
+  const and =
+    assetStore.selectedAsset?.hasComponents &&
+    assetStore.selectedAsset?.hasAttrFuncs
+      ? " and "
+      : "";
+
+  return `This asset cannot be edited because it is in use ${byComponents}${and}${byFuncs}.`;
+});
+
 const executeAsset = async () => {
   if (assetStore.selectedAssetId) {
     const result = await assetStore.EXEC_ASSET(assetStore.selectedAssetId);
     if (result.result.success) {
       executeAssetModalRef.value.open();
-      for (const ipa of result.result.data.installedPkgAssets) {
-        if (ipa.assetKind === "schemaVariant") {
-          // there should only be one sv for an exec'd asset
-          assetStore.setSchemaVariantIdForAsset(
-            assetStore.selectedAssetId,
-            ipa.assetId,
-          );
-          await funcStore.FETCH_INPUT_SOURCE_LIST(ipa.assetId); // a new asset means new input sources
-        }
+      const { schemaVariantId } = result.result.data;
+      if (schemaVariantId !== nilId()) {
+        assetStore.setSchemaVariantIdForAsset(
+          assetStore.selectedAssetId,
+          schemaVariantId,
+        );
+        await assetStore.LOAD_ASSET(schemaVariantId);
+        await funcStore.FETCH_INPUT_SOURCE_LIST(schemaVariantId); // a new asset means new input sources
       }
     }
   }

app/web/src/components/AssetEditor.vue

@@ -20,19 +20,13 @@
       </div>
       <!-- TODO: Populate the created by from SDF actorHistory-->
       <div><span class="font-bold">Created By: </span>System Initiative</div>
-      <SiChip
-        v-if="selectedAsset.defaultVariantId"
-        variant="warning"
-        text="read-only"
-      />
+      <SiChip v-if="isReadOnly" variant="warning" text="read-only" />
     </div>
     <div class="flex-grow relative overflow-auto">
       <CodeEditor
         v-model="editingAsset"
         :typescript="selectedAsset?.types"
-        :disabled="
-          !!selectedAsset.defaultVariantId || changeSetsStore.headSelected
-        "
+        :disabled="isReadOnly || changeSetsStore.headSelected"
         @change="onChange"
       />
     </div>
@@ -62,6 +56,11 @@ const selectedAsset = computed(() =>
   props.assetId ? assetStore.assetsById[props.assetId] : undefined,
 );
 
+const isReadOnly = computed(
+  () =>
+    !!(selectedAsset.value?.hasComponents || selectedAsset.value?.hasAttrFuncs),
+);
+
 const editingAsset = ref<string>(selectedAsset.value?.code ?? "");
 
 const loadAssetReqStatus = assetStore.getRequestStatus(

app/web/src/components/AssetFuncListPanel.vue

@@ -14,7 +14,7 @@
               v-if="assetStore.selectedAssetId && !changeSetsStore.headSelected"
               :disabled="
                 !assetStore.assetsById[assetStore.selectedAssetId]
-                  ?.defaultVariantId
+                  ?.schemaVariantId
               "
               label="Attach Function"
               @selected-attach-type="openAttachFuncModal"
@@ -107,7 +107,7 @@ const loadAssetReqStatus = assetStore.getRequestStatus(
 const attachModalRef = ref<InstanceType<typeof AssetFuncAttachModal>>();
 const assetSchemaVariantId = computed(() =>
   props.assetId
-    ? assetStore.assetsById[props.assetId]?.defaultVariantId
+    ? assetStore.assetsById[props.assetId]?.schemaVariantId
     : undefined,
 );
 

app/web/src/components/Workspace/WorkspaceCustomizeAssets.vue

@@ -43,7 +43,7 @@
       <FuncDetails
         v-else-if="assetId && funcId"
         :funcId="funcId"
-        :schemaVariantId="assetStore.assetsById[assetId]?.defaultVariantId"
+        :schemaVariantId="assetStore.assetsById[assetId]?.schemaVariantId"
         singleModelScreen
         @detached="onDetach"
       />
@@ -53,7 +53,7 @@
       <FuncDetails
         v-else-if="assetId && funcId"
         :funcId="funcId"
-        :schemaVariantId="assetStore.assetsById[assetId]?.defaultVariantId"
+        :schemaVariantId="assetStore.assetsById[assetId]?.schemaVariantId"
         @detached="onDetach"
       />
     </template>

app/web/src/store/asset.store.ts

@@ -42,18 +42,27 @@ export interface ListedVariantDef {
 
 export interface VariantDef extends ListedVariantDef {
   link?: string;
-  defaultVariantId?: string;
+  schemaVariantId?: string;
   code: string;
   handler: string;
   types?: string;
+  hasComponents: boolean;
+  hasAttrFuncs: boolean;
 }
 
 const funcStore = useFuncStore();
 
 export type Asset = VariantDef;
 export type AssetListEntry = ListedVariantDef;
 export type AssetSaveRequest = Visibility &
-  Omit<Asset, "createdAt" | "updatedAt" | "variantExists">;
+  Omit<
+    Asset,
+    | "createdAt"
+    | "updatedAt"
+    | "variantExists"
+    | "hasComponents"
+    | "hasAttrFuncs"
+  >;
 export type AssetCreateRequest = Omit<
   AssetSaveRequest,
   "id" | "definition" | "variantExists"
@@ -105,7 +114,7 @@ export const useAssetStore = () => {
         setSchemaVariantIdForAsset(assetId: AssetId, schemaVariantId: string) {
           const asset = this.assetsById[assetId];
           if (asset) {
-            asset.defaultVariantId = schemaVariantId;
+            asset.schemaVariantId = schemaVariantId;
             this.assetsById[assetId] = asset;
           }
         },
@@ -185,11 +194,7 @@ export const useAssetStore = () => {
         createNewAsset(): Asset {
           return {
             id: nilId(),
-            name: `new asset ${Math.floor(Math.random() * 10000)}${
-              Math.floor(Math.random() * 20) === 0
-                ? " omg has such a long name the name is so long you can't even believe how long it is!"
-                : ""
-            }`,
+            name: `new asset ${Math.floor(Math.random() * 10000)}`,
             code: "",
             handler: "",
             color: this.generateMockColor(),
@@ -200,7 +205,9 @@ export const useAssetStore = () => {
             funcs: [],
             createdAt: new Date().toISOString(),
             updatedAt: new Date().toISOString(),
-            defaultVariantId: undefined,
+            schemaVariantId: undefined,
+            hasComponents: false,
+            hasAttrFuncs: false,
           };
         },
 
@@ -215,7 +222,9 @@ export const useAssetStore = () => {
               ...visibility,
               ..._.omit(asset, [
                 "id",
-                "defaultVariantId",
+                "schemaVariantId",
+                "hasComponents",
+                "hasAttrFuncs",
                 "createdAt",
                 "updatedAt",
               ]),
@@ -246,7 +255,13 @@ export const useAssetStore = () => {
             url: "/variant_def/save_variant_def",
             params: {
               ...visibility,
-              ..._.omit(asset, ["defaultVariantId", "createdAt", "updatedAt"]),
+              ..._.omit(asset, [
+                "schemaVariantId",
+                "hasComponents",
+                "hasAttrFuncs",
+                "createdAt",
+                "updatedAt",
+              ]),
             },
           });
         },
@@ -274,7 +289,7 @@ export const useAssetStore = () => {
 
         async EXEC_ASSET(assetId: AssetId) {
           return new ApiRequest<
-            { success: true; installedPkgAssets: InstalledPkgAssetView[] },
+            { success: true; schemaVariantId: string },
             Visibility & { id: AssetId }
           >({
             method: "post",

lib/dal/src/migrations/U2300__drop_unique_schema_name_indexes.sql

@@ -0,0 +1,2 @@
+DROP INDEX schema_names;
+DROP INDEX unique_schema_ui_menus;