add multiple selection tip

This commit is contained in:
vcoppe
2024-09-26 13:31:19 +02:00
parent 01bf1274d9
commit ce974d7791
5 changed files with 46 additions and 21 deletions

View File

@@ -1,27 +1,36 @@
<script lang="ts"> <script lang="ts">
import { isMac, isSafari } from '$lib/utils'; import { isMac, isSafari } from '$lib/utils';
import { onMount } from 'svelte'; import { onMount } from 'svelte';
import { _ } from 'svelte-i18n'; import { _ } from 'svelte-i18n';
export let key: string; export let key: string | undefined = undefined;
export let shift: boolean = false; export let shift: boolean = false;
export let ctrl: boolean = false; export let ctrl: boolean = false;
export let click: boolean = false; export let click: boolean = false;
let mac = false; let mac = false;
let safari = false; let safari = false;
onMount(() => { onMount(() => {
mac = isMac(); mac = isMac();
safari = isSafari(); safari = isSafari();
}); });
</script> </script>
<div <div
class="ml-auto pl-2 text-xs tracking-widest text-muted-foreground flex flex-row gap-0 items-baseline" class="ml-auto pl-2 text-xs tracking-widest text-muted-foreground flex flex-row gap-0 items-baseline"
{...$$props}
> >
<span>{shift ? '⇧' : ''}</span> {#if shift}
<span>{ctrl ? (mac && !safari ? '⌘' : $_('menu.ctrl') + '+') : ''}</span> <span></span>
<span class={key === '+' ? 'font-medium text-sm/4' : ''}>{key}</span> {/if}
<span>{click ? $_('menu.click') : ''}</span> {#if ctrl}
<span>{mac && !safari ? '⌘' : $_('menu.ctrl') + '+'}</span>
{/if}
{#if key}
<span class={key === '+' ? 'font-medium text-sm/4' : ''}>{key}</span>
{/if}
{#if click}
<span>{$_('menu.click')}</span>
{/if}
</div> </div>

View File

@@ -89,7 +89,7 @@
> >
<Trash2 size="16" class="mr-1" /> <Trash2 size="16" class="mr-1" />
{$_('menu.delete')} {$_('menu.delete')}
<Shortcut key="" shift={true} click={true} /> <Shortcut shift={true} click={true} />
</Button> </Button>
{/if} {/if}
</Card.Content> </Card.Content>

View File

@@ -16,6 +16,7 @@
import { dbUtils, getFile } from '$lib/db'; import { dbUtils, getFile } from '$lib/db';
import { Group } from 'lucide-svelte'; import { Group } from 'lucide-svelte';
import { getURLForLanguage } from '$lib/utils'; import { getURLForLanguage } from '$lib/utils';
import Shortcut from '$lib/components/Shortcut.svelte';
let canMergeTraces = false; let canMergeTraces = false;
let canMergeContents = false; let canMergeContents = false;
@@ -81,10 +82,24 @@
{$_('toolbar.merge.help_merge_traces')} {$_('toolbar.merge.help_merge_traces')}
{:else if mergeType === MergeType.TRACES && !canMergeTraces} {:else if mergeType === MergeType.TRACES && !canMergeTraces}
{$_('toolbar.merge.help_cannot_merge_traces')} {$_('toolbar.merge.help_cannot_merge_traces')}
{$_('toolbar.merge.selection_tip').split('{KEYBOARD_SHORTCUT}')[0]}
<Shortcut
ctrl={true}
click={true}
class="inline-flex text-muted-foreground text-xs border rounded p-0.5 gap-0"
/>
{$_('toolbar.merge.selection_tip').split('{KEYBOARD_SHORTCUT}')[1]}
{:else if mergeType === MergeType.CONTENTS && canMergeContents} {:else if mergeType === MergeType.CONTENTS && canMergeContents}
{$_('toolbar.merge.help_merge_contents')} {$_('toolbar.merge.help_merge_contents')}
{:else if mergeType === MergeType.CONTENTS && !canMergeContents} {:else if mergeType === MergeType.CONTENTS && !canMergeContents}
{$_('toolbar.merge.help_cannot_merge_contents')} {$_('toolbar.merge.help_cannot_merge_contents')}
{$_('toolbar.merge.selection_tip').split('{KEYBOARD_SHORTCUT}')[0]}
<Shortcut
ctrl={true}
click={true}
class="inline-flex text-muted-foreground text-xs border rounded p-0.5 gap-0"
/>
{$_('toolbar.merge.selection_tip').split('{KEYBOARD_SHORTCUT}')[1]}
{/if} {/if}
</Help> </Help>
</div> </div>

View File

@@ -30,7 +30,7 @@
> >
<Trash2 size="16" class="mr-1" /> <Trash2 size="16" class="mr-1" />
{$_('menu.delete')} {$_('menu.delete')}
<Shortcut key="" shift={true} click={true} /> <Shortcut shift={true} click={true} />
</Button> </Button>
</Card.Content> </Card.Content>
</Card.Root> </Card.Root>

View File

@@ -177,7 +177,8 @@
"help_merge_traces": "Connecting the selected traces will create a single continuous trace.", "help_merge_traces": "Connecting the selected traces will create a single continuous trace.",
"help_cannot_merge_traces": "Your selection must contain several traces to connect them.", "help_cannot_merge_traces": "Your selection must contain several traces to connect them.",
"help_merge_contents": "Merging the contents of the selected items will group all the contents inside the first item.", "help_merge_contents": "Merging the contents of the selected items will group all the contents inside the first item.",
"help_cannot_merge_contents": "Your selection must contain several items to merge their contents." "help_cannot_merge_contents": "Your selection must contain several items to merge their contents.",
"selection_tip": "Tip: use {KEYBOARD_SHORTCUT} to add items to the selection."
}, },
"extract": { "extract": {
"tooltip": "Extract contents to separate items", "tooltip": "Extract contents to separate items",