Added Table Permission Modal in Table Card Menu

mathesar_ui/src/pages/schema/TableCard.svelte

@@ -29,6 +29,7 @@
     Icon,
     Truncate,
   } from '@mathesar-component-library';
+    import TablePermissions from '@mathesar/systems/table-view/table-inspector/table/TablePermissions.svelte';
 
   const recordSelector = getRecordSelectorFromContext();
 
@@ -127,7 +128,7 @@
       showArrow={false}
       triggerAppearance="ghost"
       triggerClass="dropdown-menu-button"
-      closeOnInnerClick={true}
+      closeOnInnerClick={false}
       placements={['bottom-end', 'right-start', 'left-start']}
       label=""
       icon={iconMoreActions}
@@ -148,6 +149,8 @@
         >
           {$_('edit_table')}
         </ButtonMenuItem>
+        <TablePermissions {table} fromTableCard={true}/>
+
       {/if}
       <ButtonMenuItem
         on:click={handleDeleteTable}

mathesar_ui/src/systems/table-view/table-inspector/table/TableMode.svelte

@@ -39,7 +39,7 @@
     <div slot="content" class="content-container">
       <TableName disabled={!$currentRoleOwns} />
       <TableDescription disabled={!$currentRoleOwns} />
-      <TablePermissions />
+      <TablePermissions {table}/>
     </div>
   </Collapsible>
 

mathesar_ui/src/systems/table-view/table-inspector/table/TablePermissions.svelte

@@ -15,20 +15,19 @@
   import AsyncRpcApiStore from '@mathesar/stores/AsyncRpcApiStore';
   import { AsyncStoreValue } from '@mathesar/stores/AsyncStore';
   import { modal } from '@mathesar/stores/modal';
-  import { getTabularDataStoreFromContext } from '@mathesar/stores/table-data';
   import { toast } from '@mathesar/stores/toast';
   import {
     type AccessControlConfig,
     PermissionsModal,
     PermissionsOverview,
     TransferOwnership,
   } from '@mathesar/systems/permissions';
-  import { Button, ImmutableMap } from '@mathesar-component-library';
+  import { Button, ButtonMenuItem, ImmutableMap } from '@mathesar-component-library';
 
   const controller = modal.spawnModalController();
-  const tabularData = getTabularDataStoreFromContext();
-
-  $: table = $tabularData.table;
+
+  export let table: Table;
+  export let fromTableCard = false;
   $: tablePrivileges = table.constructTablePrivilegesStore();
 
   const databaseContext = DatabaseRouteContext.get();
@@ -135,14 +134,23 @@
 </script>
 
 <div>
-  <Button
-    appearance="secondary"
-    on:click={() => controller.open()}
-    size="small"
-  >
-    <Icon {...iconPermissions} />
-    <span>{$_('table_permissions')}</span>
-  </Button>
+  {#if fromTableCard}
+    <ButtonMenuItem
+      on:click={() => controller.open()}
+      icon={iconPermissions}
+    >
+      {$_('table_permissions')}
+    </ButtonMenuItem>
+  {:else}
+    <Button
+      appearance="secondary"
+      on:click={() => controller.open()}
+      size="small"
+    >
+      <Icon {...iconPermissions} />
+      <span>{$_('table_permissions')}</span>
+    </Button>
+  {/if}
 </div>
 
 <PermissionsModal