From df81625c1fd8dfda0c52368b21b6b9d04e8c4f3a Mon Sep 17 00:00:00 2001
From: Kiril Videlov <kiril@videlov.com>
Date: Wed, 24 Jan 2024 22:44:17 +0100
Subject: [PATCH] chore: add tooltips to provide additional information for
 unapplied and applied branch changes buttons

---
 .../components/BranchHeader.svelte            | 86 +++++++++++--------
 1 file changed, 48 insertions(+), 38 deletions(-)

diff --git a/gitbutler-ui/src/routes/[projectId]/components/BranchHeader.svelte b/gitbutler-ui/src/routes/[projectId]/components/BranchHeader.svelte
index f60b7b5bb..273300a02 100644
--- a/gitbutler-ui/src/routes/[projectId]/components/BranchHeader.svelte
+++ b/gitbutler-ui/src/routes/[projectId]/components/BranchHeader.svelte
@@ -163,47 +163,57 @@
 					</Tooltip>
 				{/if}
 				{#if !readonly}
-					<Button
-						icon="cross-small"
-						color="primary"
-						kind="outlined"
-						loading={isApplying}
-						on:click={async () => {
-							isApplying = true;
-							try {
-								await branchController.unapplyBranch(branch.id);
-							} catch (e) {
-								const err = 'Failed to apply branch';
-								toast.error(err);
-								console.error(err, e);
-							} finally {
-								isApplying = false;
-							}
-						}}
+					<Tooltip
+						timeoutMilliseconds={1000}
+						label="Stashes these changes away from your working directory"
 					>
-						Unapply
-					</Button>
+						<Button
+							icon="cross-small"
+							color="primary"
+							kind="outlined"
+							loading={isApplying}
+							on:click={async () => {
+								isApplying = true;
+								try {
+									await branchController.unapplyBranch(branch.id);
+								} catch (e) {
+									const err = 'Failed to apply branch';
+									toast.error(err);
+									console.error(err, e);
+								} finally {
+									isApplying = false;
+								}
+							}}
+						>
+							Unapply
+						</Button>
+					</Tooltip>
 				{:else}
-					<Button
-						icon="plus-small"
-						color="primary"
-						kind="outlined"
-						loading={isApplying}
-						on:click={async () => {
-							isApplying = true;
-							try {
-								await branchController.applyBranch(branch.id);
-							} catch (e) {
-								const err = 'Failed to apply branch';
-								toast.error(err);
-								console.error(err, e);
-							} finally {
-								isApplying = false;
-							}
-						}}
+					<Tooltip
+						timeoutMilliseconds={1000}
+						label="Restores these changes into your working directory"
 					>
-						Apply
-					</Button>
+						<Button
+							icon="plus-small"
+							color="primary"
+							kind="outlined"
+							loading={isApplying}
+							on:click={async () => {
+								isApplying = true;
+								try {
+									await branchController.applyBranch(branch.id);
+								} catch (e) {
+									const err = 'Failed to apply branch';
+									toast.error(err);
+									console.error(err, e);
+								} finally {
+									isApplying = false;
+								}
+							}}
+						>
+							Apply
+						</Button>
+					</Tooltip>
 				{/if}
 			</div>
 			<div class="relative" bind:this={meatballButton}>