import { Group, Text, Switch, MantineSize } from "@mantine/core"; import { useAtom } from "jotai/index"; import { userAtom } from "@/features/user/atoms/current-user-atom.ts"; import { updateUser } from "@/features/user/services/user-service.ts"; import React, { useState } from "react"; export default function PageWidthPref() { return (
Full page width Choose your preferred page width.
); } interface PageWidthToggleProps { size?: MantineSize; label?: string; } export function PageWidthToggle({ size, label }: PageWidthToggleProps) { const [user, setUser] = useAtom(userAtom); const [checked, setChecked] = useState( user.settings?.preferences?.fullPageWidth, ); const handleChange = async (event: React.ChangeEvent) => { const value = event.currentTarget.checked; const updatedUser = await updateUser({ fullPageWidth: value }); setChecked(value); setUser(updatedUser); }; return ( ); }