new schema and indexes ui

2023-03-16 19:21:16 +02:00
parent 254e691e92
commit 4d16d0e16e
87 changed files with 2807 additions and 1973 deletions
@@ -0,0 +1,82 @@
+<script>
+    import CommonHelper from "@/utils/CommonHelper";
+    import { errors, removeError } from "@/stores/errors";
+    import tooltip from "@/actions/tooltip";
+    import IndexUpsertPanel from "@/components/collections/IndexUpsertPanel.svelte";
+
+    export let collection;
+
+    let upsertPanel;
+
+    function pushOrReplace(oldIndex, newIndex) {
+        for (let i = 0; i < collection.indexes.length; i++) {
+            // replace
+            if (collection.indexes[i] == oldIndex) {
+                collection.indexes[i] = newIndex;
+                removeError("indexes." + i);
+                return;
+            }
+        }
+
+        // push missing
+        collection.indexes.push(newIndex);
+        collection.indexes = collection.indexes;
+    }
+</script>
+
+<div class="section-title">
+    Unique constraints and indexes ({collection?.indexes?.length || 0})
+</div>
+<div class="indexes-list">
+    {#each collection?.indexes || [] as rawIndex, i}
+        {@const parsed = CommonHelper.parseIndex(rawIndex)}
+        <button
+            type="button"
+            class="label link-primary {$errors.indexes?.[i]?.message ? 'label-danger' : 'label-info'}"
+            use:tooltip={$errors.indexes?.[i]?.message || ""}
+            on:click={() => upsertPanel?.show(rawIndex, i)}
+        >
+            {#if parsed.unique}
+                <strong>Unique:</strong>
+            {/if}
+            <span class="txt">
+                {parsed.columns?.map((c) => c.column).join(", ")}
+            </span>
+        </button>
+    {/each}
+    <button type="button" class="label label-primary link-fade" on:click={() => upsertPanel?.show()}>
+        <span class="txt">+</span>
+        <span class="txt">New index</span>
+    </button>
+</div>
+
+<IndexUpsertPanel
+    bind:this={upsertPanel}
+    bind:collection
+    on:remove={(e) => {
+        for (let i = 0; i < collection.indexes.length; i++) {
+            if (collection.indexes[i] == e.detail) {
+                collection.indexes.splice(i, 1);
+                removeError("indexes." + i);
+                break;
+            }
+        }
+        collection.indexes = collection.indexes;
+    }}
+    on:submit={(e) => {
+        pushOrReplace(e.detail.old, e.detail.new);
+    }}
+/>
+
+<style lang="scss">
+    .indexes-list {
+        display: flex;
+        flex-wrap: wrap;
+        width: 100%;
+        gap: 10px;
+    }
+    .label {
+        overflow: hidden;
+        min-width: 50px;
+    }
+</style>