HunkContextMenu.svelte

<script lang="ts" module>
	export interface HunkContextItem {
		hunk: DiffHunk;
		selectedLines: LineId[] | undefined;
		beforeLineNumber: number | undefined;
		afterLineNumber: number | undefined;
	}

	export function isHunkContextItem(item: unknown): item is HunkContextItem {
		return typeof item === "object" && item !== null && "hunk" in item && isDiffHunk(item.hunk);
	}
</script>

<script lang="ts">
	import IrcSendToSubmenus from "$components/diff/IrcSendToSubmenus.svelte";
	import { getEditorUri, URL_SERVICE } from "$lib/backend/url";
	import { isDiffHunk, lineIdsToHunkHeaders, type DiffHunk } from "$lib/hunks/hunk";
	import { IRC_API_SERVICE } from "$lib/irc/ircApiService";
	import { vscodePath } from "$lib/project/project";
	import { PROJECTS_SERVICE } from "$lib/project/projectsService";
	import { SETTINGS } from "$lib/settings/userSettings";
	import { STACK_SERVICE } from "$lib/stacks/stackService.svelte";
	import { UI_STATE } from "$lib/state/uiState.svelte";
	import { inject } from "@gitbutler/core/context";
	import { ContextMenu, ContextMenuItem, ContextMenuSection, TestId } from "@gitbutler/ui";
	import type { TreeChange } from "$lib/hunks/change";
	import type { LineId } from "@gitbutler/ui/utils/diffParsing";

	interface Props {
		trigger: HTMLElement | undefined;
		projectId: string;
		change: TreeChange;
		stackId?: string;
		commitId?: string;
		discardable: boolean;
		selectable: boolean;
		selectAllHunkLines: (hunk: DiffHunk) => void;
		unselectAllHunkLines: (hunk: DiffHunk) => void;
		invertHunkSelection: (hunk: DiffHunk) => void;
	}

	const {
		trigger,
		projectId,
		change,
		stackId,
		commitId,
		discardable,
		selectable,
		selectAllHunkLines,
		unselectAllHunkLines,
		invertHunkSelection,
	}: Props = $props();

	const stackService = inject(STACK_SERVICE);
	const uiState = inject(UI_STATE);
	const ircApiService = inject(IRC_API_SERVICE);
	const projectService = inject(PROJECTS_SERVICE);
	const urlService = inject(URL_SERVICE);

	const userSettings = inject(SETTINGS);

	const filePath = $derived(change.path);
	let contextMenu: ReturnType<typeof ContextMenu> | undefined;

	function getDiscardLineLabel(item: HunkContextItem) {
		const { selectedLines } = item;

		if (selectedLines !== undefined && selectedLines.length > 0)
			return `Discard ${selectedLines.length} selected lines`;

		return "";
	}

	async function discardHunk(item: HunkContextItem) {
		const previousPathBytes =
			change.status.type === "Rename" ? change.status.subject.previousPathBytes : null;

		unselectAllHunkLines(item.hunk);

		const isWholeFileChange =
			change.status.type === "Addition" || change.status.type === "Deletion";

		await stackService.discardChanges({
			projectId,
			worktreeChanges: [
				{
					previousPathBytes,
					pathBytes: change.pathBytes,
					hunkHeaders: isWholeFileChange ? [] : [item.hunk],
				},
			],
		});
	}

	async function discardHunkLines(item: HunkContextItem) {
		if (item.selectedLines === undefined || item.selectedLines.length === 0) return;
		const previousPathBytes =
			change.status.type === "Rename" ? change.status.subject.previousPathBytes : null;

		unselectAllHunkLines(item.hunk);

		await stackService.discardChanges({
			projectId,
			worktreeChanges: [
				{
					previousPathBytes,
					pathBytes: change.pathBytes,
					hunkHeaders: lineIdsToHunkHeaders(item.selectedLines, item.hunk.diff, "discard"),
				},
			],
		});
	}

	async function uncommitHunk(item: HunkContextItem) {
		if (!(stackId && commitId)) return;

		const previousPathBytes =
			change.status.type === "Rename" ? change.status.subject.previousPathBytes : null;

		unselectAllHunkLines(item.hunk);

		const isWholeFileChange =
			change.status.type === "Addition" || change.status.type === "Deletion";

		const { replacedCommits } = await stackService.uncommitChanges({
			projectId,
			stackId,
			commitId,
			changes: [
				{
					previousPathBytes,
					pathBytes: change.pathBytes,
					hunkHeaders: isWholeFileChange ? [] : [item.hunk],
				},
			],
		});

		const replacementCommit = replacedCommits.find(([before]) => before === commitId)?.[1];
		const selection = uiState.lane(stackId).selection.current;

		if (replacementCommit && selection) {
			uiState.lane(stackId).selection.set({ ...selection, commitId: replacementCommit });
		}

		contextMenu?.close();
	}

	export function open(e: MouseEvent | HTMLElement | undefined, item: HunkContextItem) {
		contextMenu?.open(e, item);
	}

	export function close() {
		contextMenu?.close();
	}
</script>

<ContextMenu
	testId={TestId.HunkContextMenu}
	bind:this={contextMenu}
	rightClickTrigger={trigger}
	align="start"
	side="bottom"
>
	{#snippet children(item)}
		{#if isHunkContextItem(item)}
			{#if discardable}
				<ContextMenuSection>
					<ContextMenuItem
						testId={TestId.HunkContextMenu_DiscardChange}
						label="Discard change"
						icon="bin"
						onclick={() => {
							discardHunk(item);
							contextMenu?.close();
						}}
					/>
					{#if item.selectedLines !== undefined && item.selectedLines.length > 0 && change.status.type !== "Addition" && change.status.type !== "Deletion"}
						<ContextMenuItem
							testId={TestId.HunkContextMenu_DiscardLines}
							label={getDiscardLineLabel(item)}
							icon="checklist-remove"
							onclick={() => {
								discardHunkLines(item);
								contextMenu?.close();
							}}
						/>
					{/if}
				</ContextMenuSection>
			{/if}
			{#if stackId && commitId}
				<ContextMenuSection>
					<ContextMenuItem
						label="Uncommit changes"
						icon="commit-undo"
						onclick={async () => {
							await uncommitHunk(item);
						}}
					/>
				</ContextMenuSection>
			{/if}
			<ContextMenuSection>
				<ContextMenuItem
					testId={TestId.HunkContextMenu_OpenInEditor}
					label="Open in {$userSettings.defaultCodeEditor.displayName}"
					icon="open-in-ide"
					onclick={async () => {
						const project = await projectService.fetchProject(projectId);
						if (project?.path) {
							// Use specific line number if available, otherwise use hunk start line
							const lineNumber =
								item.beforeLineNumber ?? item.afterLineNumber ?? item.hunk.newStart;
							const path = getEditorUri({
								schemeId: $userSettings.defaultCodeEditor.schemeIdentifer,
								path: [vscodePath(project.path), filePath],
								line: lineNumber,
							});
							urlService.openExternalUrl(path);
						}
						contextMenu?.close();
					}}
				/>
			</ContextMenuSection>

			<IrcSendToSubmenus
				{projectId}
				onSend={(target) => {
					const data = JSON.stringify({ change, diff: item.hunk });
					ircApiService.sendMessageWithData({
						target,
						message: change.path,
						data,
					});
				}}
				closeMenu={() => contextMenu?.close()}
			/>

			{#if selectable}
				<ContextMenuSection>
					<ContextMenuItem
						testId={TestId.HunkContextMenu_SelectAll}
						label="Select all"
						icon="select-all"
						onclick={() => {
							selectAllHunkLines(item.hunk);
							contextMenu?.close();
						}}
					/>
					<ContextMenuItem
						testId={TestId.HunkContextMenu_UnselectAll}
						label="Unselect all"
						icon="select-all-remove"
						onclick={() => {
							unselectAllHunkLines(item.hunk);
							contextMenu?.close();
						}}
					/>
					<ContextMenuItem
						testId={TestId.HunkContextMenu_InvertSelection}
						label="Invert selection"
						icon="select-all-inverse"
						onclick={() => {
							invertHunkSelection(item.hunk);
							contextMenu?.close();
						}}
					/>
				</ContextMenuSection>
			{/if}
		{:else}
			<p class="text-12 text-semibold clr-text-2">Malformed item (·•᷄‎ࡇ•᷅ )</p>
		{/if}
	{/snippet}
</ContextMenu>