v1.0.2 - Update banner, smart updater, install type detection

src/lib/components/TitleBar.svelte

@@ -1,6 +1,6 @@
 <script lang="ts">
 	import { getCurrentWindow } from '@tauri-apps/api/window';
-	import { vaultReady, focusMode } from '$lib/stores/app';
+	import { vaultReady, focusMode, updateAvailable, showSettings, settingsTab } from '$lib/stores/app';
 
 	let { onNewNote = () => {} }: {
 		onNewNote?: () => void;
@@ -71,6 +71,12 @@
 			<line x1="29" y1="18" x2="19" y2="30" stroke="white" stroke-width="2" stroke-linecap="round" opacity="0.7" />
 		</svg>
 		<span class="titlebar-title">HelixNotes</span>
+		{#if $updateAvailable}
+			<!-- svelte-ignore a11y_no_static_element_interactions -->
+		<button class="update-badge" onmousedown={(e) => e.stopPropagation()} onclick={() => { $settingsTab = 'updates'; $showSettings = true; }}>
+				v{$updateAvailable.version} available
+			</button>
+		{/if}
 	</div>
 	<div class="titlebar-actions">
 		<button class="switch-vault-btn" onclick={() => ($vaultReady = false)} title="Switch Vault">
@@ -144,6 +150,25 @@
 		color: var(--text-tertiary);
 	}
 
+	.update-badge {
+		font-size: 10px;
+		font-weight: 600;
+		color: var(--accent);
+		background: color-mix(in srgb, var(--accent) 12%, transparent);
+		border: 1px solid color-mix(in srgb, var(--accent) 25%, transparent);
+		border-radius: 10px;
+		padding: 1px 8px;
+		cursor: pointer;
+		pointer-events: auto;
+		-webkit-app-region: no-drag;
+		transition: background 0.15s, border-color 0.15s;
+	}
+
+	.update-badge:hover {
+		background: color-mix(in srgb, var(--accent) 20%, transparent);
+		border-color: color-mix(in srgb, var(--accent) 40%, transparent);
+	}
+
 	.titlebar-actions {
 		display: flex;
 		align-items: center;