fix: improve default contribution action icon

packages/renderer/src/lib/actions/ContributionActions.spec.ts

@@ -43,6 +43,41 @@ test('Expect one ListItemButtonIcon', async () => {
   expect(item).toBeInTheDocument();
 });
 
+test('Expect one ListItemButtonIcon without detail', async () => {
+  render(ContributionActions, {
+    args: [],
+    contributions: [
+      {
+        command: 'dummy.command',
+        title: 'dummy-title',
+      },
+    ],
+    onError: () => {},
+    dropdownMenu: false,
+  });
+  const item = screen.getByLabelText('dummy-title');
+  expect(item).toBeInTheDocument();
+  expect(item).toHaveClass('m-0.5');
+});
+
+test('Expect one ListItemButtonIcon with detail', async () => {
+  render(ContributionActions, {
+    args: [],
+    contributions: [
+      {
+        command: 'dummy.command',
+        title: 'dummy-title',
+      },
+    ],
+    onError: () => {},
+    dropdownMenu: false,
+    detailed: true,
+  });
+  const item = screen.getByLabelText('dummy-title');
+  expect(item).toBeInTheDocument();
+  expect(item).not.toHaveClass('m-0.5');
+});
+
 test('Expect executeCommand to be called', async () => {
   render(ContributionActions, {
     args: [],

packages/renderer/src/lib/actions/ContributionActions.svelte

@@ -1,6 +1,6 @@
 <script lang="ts">
 import type { Menu } from '../../../../main/src/plugin/menu-registry';
-import { faEllipsisVertical } from '@fortawesome/free-solid-svg-icons';
+import { faPlug } from '@fortawesome/free-solid-svg-icons';
 import ListItemButtonIcon from '../ui/ListItemButtonIcon.svelte';
 import { removeNonSerializableProperties } from '/@/lib/actions/ActionUtils';
 import type { ContextUI } from '/@/lib/context/context';
@@ -16,6 +16,7 @@ export let contextPrefix: string | undefined = undefined;
 
 export let dropdownMenu = false;
 export let contributions: Menu[] = [];
+export let detailed = false;
 
 let filteredContributions: Menu[] = [];
 $: {
@@ -75,6 +76,7 @@ async function executeContribution(menu: Menu): Promise<void> {
     title="{menu.title}"
     onClick="{() => executeContribution(menu)}"
     menu="{dropdownMenu}"
-    icon="{faEllipsisVertical}"
+    icon="{faPlug}"
+    detailed="{detailed}"
     disabledWhen="{menu.disabled}" />
 {/each}

packages/renderer/src/lib/compose/ComposeActions.svelte

@@ -138,5 +138,6 @@ if (dropdownMenu) {
     contextPrefix="composeItem"
     dropdownMenu="{dropdownMenu}"
     contributions="{contributions}"
+    detailed="{detailed}"
     onError="{errorCallback}" />
 </svelte:component>

packages/renderer/src/lib/container/ContainerActions.svelte

@@ -187,5 +187,6 @@ if (dropdownMenu) {
     contextPrefix="containerItem"
     dropdownMenu="{dropdownMenu}"
     contributions="{contributions}"
+    detailed="{detailed}"
     onError="{errorCallback}" />
 </svelte:component>

packages/renderer/src/lib/image/ImageActions.svelte

@@ -132,6 +132,7 @@ function onError(error: string): void {
     dropdownMenu="{dropdownMenu}"
     contributions="{contributions}"
     contextPrefix="imageItem"
+    detailed="{detailed}"
     onError="{onError}" />
 
   {#if errorMessage}

packages/renderer/src/lib/pod/PodActions.svelte

@@ -202,5 +202,6 @@ if (dropdownMenu) {
     contextPrefix="podItem"
     dropdownMenu="{dropdownMenu}"
     contributions="{contributions}"
+    detailed="{detailed}"
     onError="{errorCallback}" />
 </svelte:component>