fix: InputLabel sizing and props

fix: merge conflict
gitbutlerapp · Oct 7, 2024 · ea78f31 · ea78f31
1 parent 3f31640
commit ea78f31
Show file tree

Hide file tree

Showing 62 changed files with 2,921 additions and 705 deletions.
diff --git a/apps/desktop/src/lib/assets/empty-state/not-found.svg b/apps/desktop/src/lib/assets/empty-state/not-found.svg
diff --git a/apps/desktop/src/lib/baseBranch/baseBranch.ts b/apps/desktop/src/lib/baseBranch/baseBranch.ts
@@ -17,6 +17,10 @@ export class BaseBranch {
 	@Type(() => Commit)
 	recentCommits!: Commit[];
 	lastFetchedMs?: number;
+	conflicted!: boolean;
+	diverged!: boolean;
+	divergedAhead!: string[];
+	divergedBehind!: string[];
 
 	actualPushRemoteName(): string {
 		return this.pushRemoteName || this.remoteName;

diff --git a/apps/desktop/src/lib/baseBranch/baseBranchService.ts b/apps/desktop/src/lib/baseBranch/baseBranchService.ts
@@ -67,6 +67,27 @@ export class BaseBranchService {
 		});
 		await this.fetchFromRemotes();
 	}
+
+	async push(withForce?: boolean) {
+		this.loading.set(true);
+		try {
+			await invoke<void>('push_base_branch', {
+				projectId: this.projectId,
+				withForce
+			});
+		} catch (err: any) {
+			if (err.code === Code.DefaultTargetNotFound) {
+				// Swallow this error since user should be taken to project setup page
+				return;
+			} else if (err.code === Code.ProjectsGitAuth) {
+				showError('Failed to authenticate', err);
+			} else {
+				showError('Failed to push', err);
+			}
+			console.error(err);
+		}
+		await this.fetchFromRemotes();
+	}
 }
 
 export async function getRemoteBranches(

diff --git a/apps/desktop/src/lib/branch/BranchCard.svelte b/apps/desktop/src/lib/branch/BranchCard.svelte
@@ -1,6 +1,5 @@
 <script lang="ts">
 	import BranchHeader from './BranchHeader.svelte';
-	import EmptyStatePlaceholder from '../components/EmptyStatePlaceholder.svelte';
 	import PullRequestCard from '../pr/PullRequestCard.svelte';
 	import InfoMessage from '../shared/InfoMessage.svelte';
 	import { PromptService } from '$lib/ai/promptService';
@@ -34,6 +33,7 @@
 	import { FileIdSelection } from '$lib/vbranches/fileIdSelection';
 	import { VirtualBranch } from '$lib/vbranches/types';
 	import Button from '@gitbutler/ui/Button.svelte';
+	import EmptyStatePlaceholder from '@gitbutler/ui/EmptyStatePlaceholder.svelte';
 	import lscache from 'lscache';
 	import { onMount } from 'svelte';
 	import type { Writable } from 'svelte/store';
@@ -199,7 +199,7 @@
 						{:else if branch.commits.length === 0}
 							<Dropzones>
 								<div class="new-branch">
-									<EmptyStatePlaceholder image={laneNewSvg} width="11rem">
+									<EmptyStatePlaceholder image={laneNewSvg} width={180} bottomMargin={48}>
 										<svelte:fragment slot="title">This is a new branch</svelte:fragment>
 										<svelte:fragment slot="caption">
 											You can drag and drop files or parts of files here.
@@ -210,7 +210,7 @@
 						{:else}
 							<Dropzones>
 								<div class="no-changes">
-									<EmptyStatePlaceholder image={noChangesSvg} width="11rem" hasBottomMargin={false}>
+									<EmptyStatePlaceholder image={noChangesSvg} width={180}>
 										<svelte:fragment slot="caption"
 											>No uncommitted changes on this branch</svelte:fragment
 										>

diff --git a/apps/desktop/src/lib/branch/BranchHeader.svelte b/apps/desktop/src/lib/branch/BranchHeader.svelte
@@ -3,26 +3,16 @@
 	import BranchLabel from './BranchLabel.svelte';
 	import BranchLaneContextMenu from './BranchLaneContextMenu.svelte';
 	import DefaultTargetButton from './DefaultTargetButton.svelte';
-	import PullRequestButton from '../pr/PullRequestButton.svelte';
-	import { Project } from '$lib/backend/projects';
-	import { BaseBranch } from '$lib/baseBranch/baseBranch';
-	import { BaseBranchService } from '$lib/baseBranch/baseBranchService';
 	import ContextMenu from '$lib/components/contextmenu/ContextMenu.svelte';
-	import { mapErrorToToast } from '$lib/gitHost/github/errorMap';
 	import { getGitHost } from '$lib/gitHost/interface/gitHost';
-	import { getGitHostListingService } from '$lib/gitHost/interface/gitHostListingService';
 	import { getGitHostPrMonitor } from '$lib/gitHost/interface/gitHostPrMonitor';
 	import { getGitHostPrService } from '$lib/gitHost/interface/gitHostPrService';
-	import { showError, showToast } from '$lib/notifications/toasts';
-	import { getBranchNameFromRef } from '$lib/utils/branch';
+	import PrDetailsModal from '$lib/pr/PrDetailsModal.svelte';
 	import { getContext, getContextStore } from '$lib/utils/context';
-	import { sleep } from '$lib/utils/sleep';
-	import { error } from '$lib/utils/toasts';
 	import { BranchController } from '$lib/vbranches/branchController';
 	import { VirtualBranch } from '$lib/vbranches/types';
 	import Button from '@gitbutler/ui/Button.svelte';
 	import Icon from '@gitbutler/ui/Icon.svelte';
-	import type { PullRequest } from '$lib/gitHost/interface/types';
 	import type { Persisted } from '$lib/persisted/persisted';
 
 	interface Props {
@@ -34,22 +24,17 @@
 	const { uncommittedChanges = 0, isLaneCollapsed, onGenerateBranchName }: Props = $props();
 
 	const branchController = getContext(BranchController);
-	const baseBranchService = getContext(BaseBranchService);
-	const baseBranch = getContextStore(BaseBranch);
 	const prService = getGitHostPrService();
-	const gitListService = getGitHostListingService();
 	const branchStore = getContextStore(VirtualBranch);
 	const prMonitor = getGitHostPrMonitor();
 	const gitHost = getGitHost();
-	const project = getContext(Project);
 
-	const baseBranchName = $derived($baseBranch.shortName);
 	const branch = $derived($branchStore);
 	const pr = $derived($prMonitor?.pr);
 
 	let contextMenu = $state<ReturnType<typeof ContextMenu>>();
+	let prDetailsModal = $state<ReturnType<typeof PrDetailsModal>>();
 	let meatballButtonEl = $state<HTMLDivElement>();
-	let isLoading = $state(false);
 	let isTargetBranchAnimated = $state(false);
 
 	function handleBranchNameChange(title: string) {
@@ -70,100 +55,8 @@
 
 	let headerInfoHeight = $state(0);
 
-	interface CreatePrOpts {
-		draft: boolean;
-	}
-
-	const defaultPrOpts: CreatePrOpts = {
-		draft: true
-	};
-
-	async function createPr(createPrOpts: CreatePrOpts): Promise<PullRequest | undefined> {
-		const opts = { ...defaultPrOpts, ...createPrOpts };
-		if (!$gitHost) {
-			error('Pull request service not available');
-			return;
-		}
-
-		let title: string;
-		let body: string;
-
-		let pullRequestTemplateBody: string | undefined;
-		const prTemplatePath = project.git_host.pullRequestTemplatePath;
-
-		if (prTemplatePath) {
-			pullRequestTemplateBody = await $prService?.pullRequestTemplateContent(
-				prTemplatePath,
-				project.id
-			);
-		}
-
-		if (pullRequestTemplateBody) {
-			title = branch.name;
-			body = pullRequestTemplateBody;
-		} else {
-			// In case of a single commit, use the commit summary and description for the title and
-			// description of the PR.
-			if (branch.commits.length === 1) {
-				const commit = branch.commits[0];
-				title = commit?.descriptionTitle ?? '';
-				body = commit?.descriptionBody ?? '';
-			} else {
-				title = branch.name;
-				body = '';
-			}
-		}
-
-		isLoading = true;
-		try {
-			let upstreamBranchName = branch.upstreamName;
-
-			if (branch.commits.some((c) => !c.isRemote)) {
-				const firstPush = !branch.upstream;
-				const { refname, remote } = await branchController.pushBranch(
-					branch.id,
-					branch.requiresForce
-				);
-				upstreamBranchName = getBranchNameFromRef(refname, remote);
-
-				if (firstPush) {
-					// TODO: fix this hack for reactively available prService.
-					await sleep(500);
-				}
-			}
-
-			if (!baseBranchName) {
-				error('No base branch name determined');
-				return;
-			}
-
-			if (!upstreamBranchName) {
-				error('No upstream branch name determined');
-				return;
-			}
-
-			if (!$prService) {
-				error('Pull request service not available');
-				return;
-			}
-
-			await $prService.createPr({
-				title,
-				body,
-				draft: opts.draft,
-				baseBranchName,
-				upstreamName: upstreamBranchName
-			});
-		} catch (err: any) {
-			console.error(err);
-			const toast = mapErrorToToast(err);
-			if (toast) showToast(toast);
-			else showError('Error while creating pull request', err);
-		} finally {
-			isLoading = false;
-		}
-		await $gitListService?.refresh();
-		baseBranchService.fetchFromRemotes();
+	function handleOpenPR() {
+		prDetailsModal?.show();
 	}
 </script>
 
@@ -258,6 +151,7 @@
 			<div class="header__actions">
 				<div class="header__buttons">
 					<DefaultTargetButton
+						size="button"
 						selectedForChanges={branch.selectedForChanges}
 						onclick={async () => {
 							isTargetBranchAnimated = true;
@@ -269,14 +163,12 @@
 				<div class="relative">
 					<div class="header__buttons">
 						{#if !$pr}
-							<PullRequestButton
-								click={async ({ draft }) => await createPr({ draft })}
+							<Button
+								style="ghost"
+								outline
 								disabled={branch.commits.length === 0 || !$gitHost || !$prService}
-								tooltip={!$gitHost || !$prService
-									? 'You can enable git host integration in the settings'
-									: ''}
-								loading={isLoading}
-							/>
+								onclick={handleOpenPR}>Create PR</Button
+							>
 						{/if}
 						<Button
 							bind:el={meatballButtonEl}
@@ -301,6 +193,8 @@
 	</div>
 {/if}
 
+<PrDetailsModal bind:this={prDetailsModal} type="preview" />
+
 <style>
 	.header__wrapper {
 		z-index: var(--z-lifted);

diff --git a/apps/desktop/src/lib/branch/BranchLabel.svelte b/apps/desktop/src/lib/branch/BranchLabel.svelte
@@ -8,8 +8,6 @@
 	}
 
 	let { name, disabled = false, onChange }: Props = $props();
-
-	let inputEl = $state<HTMLInputElement>();
 </script>
 
-<LabelInput bind:inputEl class="text-14 text-bold" value={name} {disabled} {onChange} />
+<LabelInput class="text-14 text-bold" value={name} {disabled} {onChange} />
diff --git a/apps/desktop/src/lib/branch/DefaultTargetButton.svelte b/apps/desktop/src/lib/branch/DefaultTargetButton.svelte
@@ -4,9 +4,10 @@
 	interface Props {
 		selectedForChanges: boolean;
 		onclick: () => void;
+		size: 'button' | 'tag';
 	}
 
-	const { selectedForChanges, onclick }: Props = $props();
+	const { selectedForChanges, size = 'button', onclick }: Props = $props();
 </script>
 
 {#if selectedForChanges}
@@ -15,7 +16,7 @@
 		kind="soft"
 		tooltip="New changes will land here"
 		icon="target"
-		size="tag"
+		{size}
 		clickable={false}
 	>
 		Default branch
@@ -26,7 +27,7 @@
 		outline
 		tooltip="When selected, new changes land here"
 		icon="target"
-		size="tag"
+		{size}
 		{onclick}
 	>
 		Set as default