feat(settings): add Updates section with channel radio and Check now

This commit is contained in:
2026-06-08 06:40:51 +05:30
parent ade6c115b8
commit 691b00a2b8
2 changed files with 65 additions and 1 deletions
@@ -8,6 +8,7 @@ import { ThemeSettings } from './ThemeSettings';
import { ExportSettings } from './ExportSettings';
import { PluginsSettings } from './PluginsSettings';
import { AboutSettings } from './AboutSettings';
import { UpdatesSettings } from './UpdatesSettings';
export function SettingsSheet() {
const closeModal = useAppStore((s) => s.closeModal);
@@ -21,11 +22,12 @@ export function SettingsSheet() {
<SheetDescription>Editor, theme, and export preferences</SheetDescription>
</SheetHeader>
<Tabs defaultValue="editor" className="mt-4">
<TabsList className="grid w-full grid-cols-5">
<TabsList className="grid w-full grid-cols-6">
<TabsTrigger value="editor">Editor</TabsTrigger>
<TabsTrigger value="theme">Theme</TabsTrigger>
<TabsTrigger value="export">Export</TabsTrigger>
<TabsTrigger value="plugins">Plugins</TabsTrigger>
<TabsTrigger value="updates">Updates</TabsTrigger>
<TabsTrigger value="about">About</TabsTrigger>
</TabsList>
<div className="mt-4 max-h-[70vh] overflow-y-auto pr-2">
@@ -33,6 +35,7 @@ export function SettingsSheet() {
<TabsContent value="theme"><ThemeSettings /></TabsContent>
<TabsContent value="export"><ExportSettings /></TabsContent>
<TabsContent value="plugins"><PluginsSettings /></TabsContent>
<TabsContent value="updates"><UpdatesSettings /></TabsContent>
<TabsContent value="about"><AboutSettings /></TabsContent>
</div>
</Tabs>
@@ -0,0 +1,61 @@
import { useUpdaterStore } from '@/lib/updater-store';
import { useSettingsStore } from '@/stores/settings-store';
import { Button } from '@/components/ui/button';
export function UpdatesSettings() {
const updateChannel = useSettingsStore((s) => s.updateChannel);
const setSetting = useSettingsStore((s) => s.setSetting);
const autoCheck = useSettingsStore((s) => s.autoCheckUpdates);
const { check, state } = useUpdaterStore();
return (
<div className="space-y-4" data-testid="updates-settings">
<div>
<h3 className="font-medium mb-2">Update channel</h3>
<div className="flex flex-col gap-2">
<label className="flex items-center gap-2">
<input
type="radio"
name="update-channel"
checked={updateChannel === 'github'}
onChange={() => setSetting('updateChannel', 'github')}
/>
<span>GitHub Releases (public)</span>
</label>
<label className="flex items-center gap-2">
<input
type="radio"
name="update-channel"
checked={updateChannel === 'concreteinfo'}
onChange={() => setSetting('updateChannel', 'concreteinfo')}
/>
<span>ConcreteInfo self-hosted</span>
</label>
</div>
</div>
<div>
<h3 className="font-medium mb-2">Auto-check on launch</h3>
<label className="flex items-center gap-2">
<input
type="checkbox"
checked={autoCheck}
onChange={(e) => setSetting('autoCheckUpdates', e.target.checked)}
/>
<span>Check for updates 5s after launch</span>
</label>
</div>
<div>
<h3 className="font-medium mb-2">Manual check</h3>
<Button
onClick={() => check()}
disabled={state === 'checking' || state === 'downloading'}
data-testid="check-now"
>
{state === 'checking' ? 'Checking…' : 'Check now'}
</Button>
</div>
</div>
);
}