gitbutlerapp/gitbutler
1
1
Fork 0
mirror of https://github.com/gitbutlerapp/gitbutler.git synced 2024-12-18 14:31:30 +03:00
Code Issues Packages Projects Releases Wiki Activity

added context menu to the whole hard

Browse Source
This commit is contained in:
Pavel Laptev 2024-10-25 14:13:57 +02:00 committed by Nico Domino
parent 655db0ffee
commit f58a29fa1c
2 changed files with 76 additions and 69 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

138
apps/desktop/src/lib/pr/StackingPullRequestCard.svelte
View File

@ -31,10 +31,8 @@
messageStyle?: MessageStyle; messageStyle?: MessageStyle;
}; };
let checksContextMenuEl = $state<ReturnType<typeof ContextMenu>>(); let contextMenuEl = $state<ReturnType<typeof ContextMenu>>();
let prContextMenuEl = $state<ReturnType<typeof ContextMenu>>(); let contextMenuTarget = $state<HTMLElement>();
let checksContextMenuTarget = $state<HTMLElement>();
let prContextMenuTarget = $state<HTMLElement>();
const vbranchService = getContext(VirtualBranchService); const vbranchService = getContext(VirtualBranchService);
const baseBranchService = getContext(BaseBranchService); const baseBranchService = getContext(BaseBranchService);
@ -122,7 +120,52 @@
</script> </script>
{#if $pr} {#if $pr}
<div class="pr-header"> <ContextMenu bind:this={contextMenuEl} target={contextMenuTarget} openByMouse>
<ContextMenuSection>
<ContextMenuItem
label="Open PR in browser"
onclick={() => {
openExternalUrl($pr.htmlUrl);
contextMenuEl?.close();
}}
/>
<ContextMenuItem
label="Copy PR link"
onclick={() => {
copyToClipboard($pr.htmlUrl);
contextMenuEl?.close();
}}
/>
</ContextMenuSection>
{#if checksTagInfo && checksTagInfo.text !== 'No PR checks' && checksTagInfo.text === 'Checks'}
<ContextMenuSection>
<ContextMenuItem
label="Open checks"
onclick={() => {
openExternalUrl(`${$pr.htmlUrl}/checks`);
contextMenuEl?.close();
}}
/>
<ContextMenuItem
label="Copy checks"
onclick={() => {
copyToClipboard(`${$pr.htmlUrl}/checks`);
contextMenuEl?.close();
}}
/>
</ContextMenuSection>
{/if}
</ContextMenu>
<div
bind:this={contextMenuTarget}
role="article"
class="pr-header"
oncontextmenu={(e: MouseEvent) => {
e.preventDefault();
contextMenuEl?.open(e);
}}
>
<div class="text-13 text-semibold pr-header-title"> <div class="text-13 text-semibold pr-header-title">
<span style="color: var(--clr-scale-ntrl-50)">PR #{$pr?.number}:</span> <span style="color: var(--clr-scale-ntrl-50)">PR #{$pr?.number}:</span>
<span>{$pr?.title}</span> <span>{$pr?.title}</span>
@ -140,72 +183,29 @@
{prStatusInfo.text} {prStatusInfo.text}
</Button> </Button>
{#if !$pr?.closedAt && checksTagInfo} {#if !$pr?.closedAt && checksTagInfo}
<div bind:this={checksContextMenuTarget}> <Button
<Button size="tag"
size="tag" clickable={false}
clickable={false} icon={checksTagInfo.icon}
icon={checksTagInfo.icon} style={checksTagInfo.style}
style={checksTagInfo.style} kind={checksTagInfo.icon === 'success-small' ? 'solid' : 'soft'}
kind={checksTagInfo.icon === 'success-small' ? 'solid' : 'soft'} >
oncontextmenu={(e: MouseEvent) => { {checksTagInfo.text}
e.preventDefault(); </Button>
checksContextMenuEl?.open();
}}
>
{checksTagInfo.text}
</Button>
</div>
<ContextMenu bind:this={checksContextMenuEl} target={checksContextMenuTarget}>
<ContextMenuSection>
<ContextMenuItem
label="Open checks"
onclick={() => {
openExternalUrl(`${$pr.htmlUrl}/checks`);
checksContextMenuEl?.close();
}}
/>
<ContextMenuItem
label="Copy Checks"
onclick={() => {
copyToClipboard(`${$pr.htmlUrl}/checks`);
checksContextMenuEl?.close();
}}
/>
</ContextMenuSection>
</ContextMenu>
{/if} {/if}
{#if $pr?.htmlUrl} {#if $pr?.htmlUrl}
<div bind:this={prContextMenuTarget}> <Button
<Button icon="open-link"
icon="open-link" size="tag"
size="tag" style="ghost"
style="ghost" outline
outline tooltip="Open in browser"
tooltip="Open in browser" onclick={() => {
onclick={() => { openExternalUrl($pr.htmlUrl);
openExternalUrl($pr.htmlUrl); }}
}} >
oncontextmenu={(e: MouseEvent) => { View PR
e.preventDefault(); </Button>
prContextMenuEl?.open();
}}
>
View PR
</Button>
</div>
<ContextMenu bind:this={prContextMenuEl} target={prContextMenuTarget}>
<ContextMenuSection>
<ContextMenuItem
label="Copy PR Link"
onclick={() => {
copyToClipboard($pr.htmlUrl);
prContextMenuEl?.close();
}}
/>
</ContextMenuSection>
</ContextMenu>
{/if} {/if}
</div> </div>

7
apps/desktop/src/lib/shared/DropDownButton.svelte
View File

@ -42,6 +42,11 @@
let iconEl = $state<HTMLElement>(); let iconEl = $state<HTMLElement>();
let visible = $state(false); let visible = $state(false);
function preventContextMenu(e: MouseEvent) {
e.preventDefault();
e.stopPropagation();
}
export function show() { export function show() {
visible = true; visible = true;
contextMenu?.open(); contextMenu?.open();
@ -66,6 +71,7 @@
disabled={disabled || loading} disabled={disabled || loading}
dropdownChild dropdownChild
{onclick} {onclick}
oncontextmenu={preventContextMenu}
> >
{@render children()} {@render children()}
</Button> </Button>
@ -82,6 +88,7 @@
visible = !visible; visible = !visible;
contextMenu?.toggle(); contextMenu?.toggle();
}} }}
oncontextmenu={preventContextMenu}
/> />
</div> </div>
<ContextMenu <ContextMenu