77 lines
2.6 KiB
TypeScript
77 lines
2.6 KiB
TypeScript
import { getVersion } from '@tauri-apps/api/app';
|
|
import { relaunch } from '@tauri-apps/plugin-process';
|
|
import { Update, check } from '@tauri-apps/plugin-updater';
|
|
import { useEffect, useState } from 'react';
|
|
import { Link } from 'react-router-dom';
|
|
import { toast } from 'sonner';
|
|
|
|
export function AboutScreen() {
|
|
const [version, setVersion] = useState('');
|
|
const [newUpdate, setNewUpdate] = useState<Update>(null);
|
|
|
|
const checkUpdate = async () => {
|
|
const update = await check();
|
|
if (!update) toast.info('There is no update available');
|
|
setNewUpdate(update);
|
|
};
|
|
|
|
const installUpdate = async () => {
|
|
await newUpdate.downloadAndInstall();
|
|
await relaunch();
|
|
};
|
|
|
|
useEffect(() => {
|
|
async function loadVersion() {
|
|
const appVersion = await getVersion();
|
|
setVersion(appVersion);
|
|
}
|
|
|
|
loadVersion();
|
|
}, []);
|
|
|
|
return (
|
|
<div className="mx-auto w-full max-w-lg">
|
|
<div className="flex items-center justify-center gap-2">
|
|
<img src="/icon.png" alt="Lume's logo" className="w-16 shrink-0" />
|
|
<div>
|
|
<h1 className="text-xl font-semibold">Lume</h1>
|
|
<p className="text-sm font-medium text-neutral-700 dark:text-neutral-300">
|
|
Version {version}
|
|
</p>
|
|
</div>
|
|
</div>
|
|
<div className="mx-auto mt-4 flex w-full max-w-xs flex-col gap-2">
|
|
{!newUpdate ? (
|
|
<button
|
|
type="button"
|
|
onClick={() => checkUpdate()}
|
|
className="inline-flex h-9 w-full items-center justify-center rounded-lg bg-blue-500 text-sm font-medium text-white hover:bg-blue-600"
|
|
>
|
|
Check for update
|
|
</button>
|
|
) : (
|
|
<button
|
|
type="button"
|
|
onClick={() => installUpdate()}
|
|
className="inline-flex h-9 w-full items-center justify-center rounded-lg bg-blue-500 text-sm font-medium text-white hover:bg-blue-600"
|
|
>
|
|
Install {newUpdate.version}
|
|
</button>
|
|
)}
|
|
<Link
|
|
to="https://lume.nu"
|
|
className="inline-flex h-9 w-full items-center justify-center rounded-lg bg-neutral-100 text-sm font-medium hover:bg-neutral-200 dark:bg-neutral-900 dark:hover:bg-neutral-800"
|
|
>
|
|
Website
|
|
</Link>
|
|
<Link
|
|
to="https://github.com/luminous-devs/lume/issues"
|
|
className="inline-flex h-9 w-full items-center justify-center rounded-lg bg-neutral-100 text-sm font-medium hover:bg-neutral-200 dark:bg-neutral-900 dark:hover:bg-neutral-800"
|
|
>
|
|
Report a issue
|
|
</Link>
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|