table editor - add pk command

packages/web/src/icons/FontIcon.svelte

@@ -71,6 +71,7 @@
     'icon plugin': 'mdi mdi-toy-brick',
     'icon menu': 'mdi mdi-menu',
     'icon add-column': 'mdi mdi-table-column-plus-after',
+    'icon add-key': 'mdi mdi-key-plus',
 
     'img ok': 'mdi mdi-check-circle color-icon-green',
     'img ok-inv': 'mdi mdi-check-circle color-icon-inv-green',
@@ -114,6 +115,7 @@
     'img filter': 'mdi mdi-filter',
     'img group': 'mdi mdi-group',
   };
+
 </script>
 
 <span class={iconNames[icon] || icon} {title} on:click />

packages/web/src/tableeditor/TableEditor.svelte

@@ -12,11 +12,23 @@
     onClick: () => getCurrentEditor().addColumn(),
   });
 
+  registerCommand({
+    id: 'tableEditor.addPrimaryKey',
+    category: 'Table editor',
+    name: 'Add primary key',
+    icon: 'icon add-key',
+    toolbar: true,
+    isRelatedToTab: true,
+    testEnabled: () => getCurrentEditor()?.allowAddPrimaryKey(),
+    onClick: () => getCurrentEditor().addPrimaryKey(),
+  });
+
 </script>
 
 <script lang="ts">
   import _ from 'lodash';
   import { tick } from 'svelte';
+  import invalidateCommands from '../commands/invalidateCommands';
   import registerCommand from '../commands/registerCommand';
 
   import ColumnLabel from '../elements/ColumnLabel.svelte';
@@ -30,7 +42,7 @@
 
   import { useDbCore } from '../utility/metadataLoaders';
   import ColumnEditorModal from './ColumnEditorModal.svelte';
-import PrimaryKeyEditorModal from './PrimaryKeyEditorModal.svelte';
+  import PrimaryKeyEditorModal from './PrimaryKeyEditorModal.svelte';
 
   export const activator = createActivator('TableEditor', true);
 
@@ -52,11 +64,27 @@ import PrimaryKeyEditorModal from './PrimaryKeyEditorModal.svelte';
     });
   }
 
+  export function allowAddPrimaryKey() {
+    return writable() && !tableInfo.primaryKey;
+  }
+
+  export function addPrimaryKey() {
+    showModal(PrimaryKeyEditorModal, {
+      setTableInfo,
+      tableInfo,
+    });
+  }
+
   $: columns = tableInfo?.columns;
   $: primaryKey = tableInfo?.primaryKey;
   $: foreignKeys = tableInfo?.foreignKeys;
   $: dependencies = tableInfo?.dependencies;
 
+  $: {
+    tableInfo;
+    invalidateCommands();
+  }
+
   $: console.log('tableInfo', tableInfo);
 
 </script>
@@ -114,7 +142,6 @@ import PrimaryKeyEditorModal from './PrimaryKeyEditorModal.svelte';
     title="Primary key"
     clickable={writable()}
     on:clickrow={e => showModal(PrimaryKeyEditorModal, { constraintInfo: e.detail, tableInfo, setTableInfo })}
-    
     columns={[
       {
         fieldName: 'columns',