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;
};
let checksContextMenuEl = $state<ReturnType<typeof ContextMenu>>();
let prContextMenuEl = $state<ReturnType<typeof ContextMenu>>();
let checksContextMenuTarget = $state<HTMLElement>();
let prContextMenuTarget = $state<HTMLElement>();
let contextMenuEl = $state<ReturnType<typeof ContextMenu>>();
let contextMenuTarget = $state<HTMLElement>();
const vbranchService = getContext(VirtualBranchService);
const baseBranchService = getContext(BaseBranchService);
@ -122,7 +120,52 @@
</script>
{#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">
<span style="color: var(--clr-scale-ntrl-50)">PR #{$pr?.number}:</span>
<span>{$pr?.title}</span>
@ -140,72 +183,29 @@
{prStatusInfo.text}
</Button>
{#if !$pr?.closedAt && checksTagInfo}
<div bind:this={checksContextMenuTarget}>
<Button
size="tag"
clickable={false}
icon={checksTagInfo.icon}
style={checksTagInfo.style}
kind={checksTagInfo.icon === 'success-small' ? 'solid' : 'soft'}
oncontextmenu={(e: MouseEvent) => {
e.preventDefault();
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>
<Button
size="tag"
clickable={false}
icon={checksTagInfo.icon}
style={checksTagInfo.style}
kind={checksTagInfo.icon === 'success-small' ? 'solid' : 'soft'}
>
{checksTagInfo.text}
</Button>
{/if}
{#if $pr?.htmlUrl}
<div bind:this={prContextMenuTarget}>
<Button
icon="open-link"
size="tag"
style="ghost"
outline
tooltip="Open in browser"
onclick={() => {
openExternalUrl($pr.htmlUrl);
}}
oncontextmenu={(e: MouseEvent) => {
e.preventDefault();
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>
<Button
icon="open-link"
size="tag"
style="ghost"
outline
tooltip="Open in browser"
onclick={() => {
openExternalUrl($pr.htmlUrl);
}}
>
View PR
</Button>
{/if}
</div>

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

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