fix: add types to read-only constraints editor

- Makes sure typescript types are added to the read-only constraints editor

Author: camargo

src/components/constraints/Constraints.svelte

@@ -13,6 +13,9 @@
   import Table from '../ui/Table.svelte';
   import ConstraintEditor from './ConstraintEditor.svelte';
 
+  export let initialPlans: PlanList[] = [];
+
+  let constraintModelId: number | null = null;
   let filterText: string = '';
   let filteredConstraints: Constraint[] = [];
   let selectedConstraint: Constraint | null = null;
@@ -29,6 +32,7 @@
       selectedConstraint = null;
     }
   }
+  $: constraintModelId = getConstraintModelId(selectedConstraint);
 
   async function deleteConstraint(id: number) {
     const success = await effects.deleteConstraint(id);
@@ -42,6 +46,23 @@
     }
   }
 
+  function getConstraintModelId(selectedConstraint: Constraint | null): number | null {
+    if (selectedConstraint !== null) {
+      const { model_id, plan_id } = selectedConstraint;
+
+      if (plan_id !== null) {
+        const plan = initialPlans.find(plan => plan.id === plan_id);
+        if (plan) {
+          return plan.model_id;
+        }
+      } else if (model_id !== null) {
+        return model_id;
+      }
+    }
+
+    return null;
+  }
+
   function toggleConstraint(event: CustomEvent<Constraint>) {
     const { detail: clickedConstraint } = event;
 
@@ -110,7 +131,7 @@
 
   <ConstraintEditor
     constraintDefinition={selectedConstraint?.definition ?? 'No Constraint Selected'}
-    constraintModelId={selectedConstraint?.model_id}
+    {constraintModelId}
     readOnly={true}
     title="Constraint - Definition Editor (Read-only)"
   />

src/routes/constraints/index.svelte

@@ -1,7 +1,23 @@
 <svelte:options immutable={true} />
 
-<script lang="ts">
+<script lang="ts" context="module">
+  import type { Load } from '@sveltejs/kit';
   import Constraints from '../../components/constraints/Constraints.svelte';
+  import effects from '../../utilities/effects';
+
+  export const load: Load = async () => {
+    const { plans: initialPlans } = await effects.getPlansAndModels();
+
+    return {
+      props: {
+        initialPlans,
+      },
+    };
+  };
+</script>
+
+<script lang="ts">
+  export let initialPlans: PlanList[] = [];
 </script>
 
-<Constraints />
+<Constraints {initialPlans} />