Add settings version check

.gitignore

@@ -13,3 +13,4 @@ src/routes/playground
 src/lib/Playground
 /data/configuration.yaml
 /data/youtube_credentials.json
+/data/version.json

scripts/translations/fetch.py

@@ -173,6 +173,12 @@ def process_dir(_dir, _output, _keys):
             ("google_code", ["config", "progress", "exchange"]),
         ],
     ),
+    (  # HOMEASSISTANT
+        f"{COMPONENTS}/homeassistant/translations/",
+        [
+            ("version", ["system_health", "info", "version"]),
+        ],
+    ),
     (  # UPDATE
         f"{COMPONENTS}/update/translations/",
         [
@@ -451,6 +457,8 @@ def process_dir(_dir, _output, _keys):
             ("description", ["ui.panel.config.automation.editor.description.label"]),
             ("manage_account", ["ui.panel.config.cloud.account.manage_account"]),
             ("configure", ["ui.panel.config.integrations.configure"]),
+            ("check_updates", ["ui.panel.config.updates.check_updates"]),
+            ("checking_updates", ["ui.panel.config.updates.checking_updates"]),
         ],
     ),
     (  # ONBOARDING

src/lib/Settings/Index.svelte

@@ -7,6 +7,7 @@
 	import Language from '$lib/Settings/Language.svelte';
 	import Addons from '$lib/Settings/Addons.svelte';
 	import Motion from '$lib/Settings/Motion.svelte';
+	import Version from '$lib/Settings/Version.svelte';
 	import Token from '$lib/Settings/Token.svelte';
 	import CustomJs from '$lib/Settings/CustomJs.svelte';
 	import Logout from '$lib/Settings/Logout.svelte';
@@ -124,6 +125,8 @@
 
 			<Addons {data} />
 
+			<Version />
+
 			<CustomJs />
 
 			<Motion />

src/lib/Settings/Version.svelte

@@ -0,0 +1,169 @@
+<script lang="ts">
+	import { onMount } from 'svelte';
+	import { base } from '$app/paths';
+	import { lang, ripple } from '$lib/Stores';
+	import Ripple from 'svelte-ripple';
+
+	const debug = false;
+
+	let installed: string;
+	let latest: string;
+	let last_updated: string;
+
+	let timeout: ReturnType<typeof setTimeout>;
+	let busy = false;
+	let error_code: number;
+
+	onMount(async () => {
+		try {
+			const response = await fetch(`${base}/_api/version`, {
+				headers: { 'Content-Type': 'application/json' }
+			});
+
+			const data = await response.json();
+
+			const diff = data?.last_updated
+				? new Date().getTime() - new Date(data.last_updated).getTime()
+				: Infinity;
+
+			// fetch new data if missing or older than a day
+			if (diff > 86400000) {
+				if (debug) console.debug('stale version');
+				await fetchLatest();
+			} else {
+				installed = data?.installed;
+				latest = data?.latest;
+				last_updated = data?.last_updated;
+				if (debug) console.debug('version loaded from file:', latest);
+			}
+		} catch (err) {
+			console.error(err);
+		}
+	});
+
+	async function fetchLatest() {
+		clearTimeout(timeout);
+
+		try {
+			if (debug) console.debug('fetching latest version from github');
+			const url = 'https://api.github.com/repos/matt8707/ha-fusion/releases/latest';
+			const response = await fetch(url);
+
+			if (!response.ok) {
+				error_code = response.status;
+				console.error(response.status);
+			}
+
+			const data = await response.json();
+
+			latest = data?.tag_name;
+
+			// save latest data
+			if (latest) save(latest);
+		} catch (err) {
+			console.error(err);
+		}
+	}
+
+	async function save(latest: string) {
+		try {
+			if (debug) console.debug('saving version file');
+
+			last_updated = new Date().toISOString();
+
+			const response = await fetch(`${base}/_api/version`, {
+				method: 'POST',
+				headers: { 'Content-Type': 'application/json' },
+				body: JSON.stringify({
+					latest,
+					installed,
+					last_updated
+				})
+			});
+
+			const result = await response.json();
+
+			if (result?.message === 'success') {
+				// add frontend ui response
+				if (debug) console.debug('version file saved');
+			}
+		} catch (err) {
+			console.error(err);
+		} finally {
+			timeout = setTimeout(() => {
+				busy = false;
+			}, 750);
+		}
+	}
+
+	function compare(installed: string, latest: string) {
+		return latest.localeCompare(installed, undefined, {
+			numeric: true,
+			sensitivity: 'base'
+		});
+	}
+</script>
+
+<div>
+	<span>
+		<h2>Version</h2>
+		<p>
+			{#if installed && latest}
+				{#if compare(installed, latest) > 0}
+					{$lang('update_available')} {latest}
+				{:else}
+					{$lang('update_up_to_date')} {installed}
+				{/if}
+
+				<a href="https://github.com/matt8707/ha-fusion/releases" target="_blank">
+					{$lang('update_release_notes')}
+				</a>
+			{:else if error_code}
+				{$lang('error')}: {error_code}
+			{:else}
+				{$lang('loading')}
+			{/if}
+		</p>
+	</span>
+
+	<button
+		class="action done"
+		on:click|preventDefault={() => {
+			busy = true;
+			fetchLatest();
+		}}
+		use:Ripple={{
+			...$ripple,
+			color: 'rgba(0, 0, 0, 0.35)'
+		}}
+	>
+		{$lang(busy ? 'checking_updates' : 'check_updates')}
+	</button>
+</div>
+
+<style>
+	div {
+		display: grid;
+		grid-template-columns: 1fr auto;
+		gap: 10px;
+		align-items: center;
+	}
+
+	button {
+		margin-top: 2rem;
+		max-width: 12rem;
+		white-space: nowrap;
+		overflow: hidden;
+		text-overflow: ellipsis;
+	}
+
+	p {
+		margin-block-end: 0.6rem;
+		font-size: 0.9rem;
+		opacity: 0.75;
+	}
+
+	a {
+		color: #00dbff;
+	}
+</style>

src/routes/_api/version/+server.ts

@@ -0,0 +1,36 @@
+import { readFile, writeFile } from 'fs/promises';
+import { json, error } from '@sveltejs/kit';
+import type { RequestHandler } from './$types';
+
+// load
+export const GET: RequestHandler = async () => {
+	try {
+		const [packageFile, versionFile] = await Promise.all([
+			readFile('./package.json', 'utf8'),
+			readFile('./data/version.json', 'utf8')
+		]);
+
+		const packageData = JSON.parse(packageFile);
+		const versionData = JSON.parse(versionFile);
+
+		return json({
+			installed: packageData?.version,
+			latest: versionData?.latest,
+			last_updated: versionData?.last_updated
+		});
+	} catch (err: any) {
+		error(500, err);
+	}
+};
+
+// save
+export const POST: RequestHandler = async ({ request }) => {
+	try {
+		const body = await request.json();
+		const data = JSON.stringify(body, null, '\t') + '\n';
+		await writeFile('./data/version.json', data);
+		return json({ message: 'success' });
+	} catch (err: any) {
+		return error(500, err);
+	}
+};