Some checks failed
CI / test (map[image:macos-latest name:macos], 1, 4) (push) Has been cancelled
CI / test (map[image:macos-latest name:macos], 2, 4) (push) Has been cancelled
CI / test (map[image:macos-latest name:macos], 3, 4) (push) Has been cancelled
CI / test (map[image:macos-latest name:macos], 4, 4) (push) Has been cancelled
CI / test (map[image:windows-latest name:windows], 1, 4) (push) Has been cancelled
CI / test (map[image:windows-latest name:windows], 2, 4) (push) Has been cancelled
CI / test (map[image:windows-latest name:windows], 3, 4) (push) Has been cancelled
CI / test (map[image:windows-latest name:windows], 4, 4) (push) Has been cancelled
CI / merge-reports (push) Has been cancelled
- Added a new integration script to manage custom features related to smart context. - Implemented handlers for smart context operations (get, update, clear, stats) in ipc. - Created a SmartContextStore class to manage context snippets and summaries. - Developed hooks for React to interact with smart context (useSmartContext, useUpdateSmartContext, useClearSmartContext, useSmartContextStats). - Included backup and restore functionality in the integration script. - Validated integration by checking for custom modifications and file existence.
73 lines
2.2 KiB
TypeScript
73 lines
2.2 KiB
TypeScript
import { useMemo } from "react";
|
|
import { useSettings } from "@/hooks/useSettings";
|
|
import { ZoomLevel, ZoomLevelSchema } from "@/lib/schemas";
|
|
import { Label } from "@/components/ui/label";
|
|
import {
|
|
Select,
|
|
SelectContent,
|
|
SelectItem,
|
|
SelectTrigger,
|
|
SelectValue,
|
|
} from "@/components/ui/select";
|
|
|
|
const ZOOM_LEVEL_LABELS: Record<ZoomLevel, string> = {
|
|
"90": "90%",
|
|
"100": "100%",
|
|
"110": "110%",
|
|
"125": "125%",
|
|
"150": "150%",
|
|
};
|
|
|
|
const ZOOM_LEVEL_DESCRIPTIONS: Record<ZoomLevel, string> = {
|
|
"90": "Slightly zoomed out to fit more content on screen.",
|
|
"100": "Default zoom level.",
|
|
"110": "Zoom in a little for easier reading.",
|
|
"125": "Large zoom for improved readability.",
|
|
"150": "Maximum zoom for maximum accessibility.",
|
|
};
|
|
|
|
const DEFAULT_ZOOM_LEVEL: ZoomLevel = "100";
|
|
|
|
export function ZoomSelector() {
|
|
const { settings, updateSettings } = useSettings();
|
|
const currentZoomLevel: ZoomLevel = useMemo(() => {
|
|
const value = settings?.zoomLevel ?? DEFAULT_ZOOM_LEVEL;
|
|
return ZoomLevelSchema.safeParse(value).success
|
|
? (value as ZoomLevel)
|
|
: DEFAULT_ZOOM_LEVEL;
|
|
}, [settings?.zoomLevel]);
|
|
|
|
return (
|
|
<div className="space-y-2">
|
|
<div className="flex flex-col gap-1">
|
|
<Label htmlFor="zoom-level">Zoom level</Label>
|
|
<p className="text-sm text-muted-foreground">
|
|
Adjusts the zoom level to make content easier to read.
|
|
</p>
|
|
</div>
|
|
<Select
|
|
value={currentZoomLevel}
|
|
onValueChange={(value) =>
|
|
updateSettings({ zoomLevel: value as ZoomLevel })
|
|
}
|
|
>
|
|
<SelectTrigger id="zoom-level" className="w-[220px]">
|
|
<SelectValue placeholder="Select zoom level" />
|
|
</SelectTrigger>
|
|
<SelectContent>
|
|
{Object.entries(ZOOM_LEVEL_LABELS).map(([value, label]) => (
|
|
<SelectItem key={value} value={value}>
|
|
<div className="flex flex-col text-left">
|
|
<span>{label}</span>
|
|
<span className="text-xs text-muted-foreground">
|
|
{ZOOM_LEVEL_DESCRIPTIONS[value as ZoomLevel]}
|
|
</span>
|
|
</div>
|
|
</SelectItem>
|
|
))}
|
|
</SelectContent>
|
|
</Select>
|
|
</div>
|
|
);
|
|
}
|