diff options
| author | zwlucas <lucas.fariamo08@gmail.com> | 2026-07-25 21:23:29 +0000 |
|---|---|---|
| committer | zwlucas <lucas.fariamo08@gmail.com> | 2026-07-25 21:23:29 +0000 |
| commit | ef55d9bb24430610b60c1b77821307cd72c08c55 (patch) | |
| tree | e6935a810b34370b0a4c821e55f6397aac50c832 /web/src/pages/SettingsPage.tsx | |
| download | helpdesk-ef55d9bb24430610b60c1b77821307cd72c08c55.tar.gz helpdesk-ef55d9bb24430610b60c1b77821307cd72c08c55.zip | |
Signed-off-by: zwlucas <lucas.fariamo08@gmail.com>
Diffstat (limited to 'web/src/pages/SettingsPage.tsx')
| -rw-r--r-- | web/src/pages/SettingsPage.tsx | 63 |
1 files changed, 63 insertions, 0 deletions
diff --git a/web/src/pages/SettingsPage.tsx b/web/src/pages/SettingsPage.tsx new file mode 100644 index 0000000..2e56213 --- /dev/null +++ b/web/src/pages/SettingsPage.tsx @@ -0,0 +1,63 @@ +import { useQuery, useMutation, useQueryClient } from '@tanstack/react-query'; +import { api } from '@/lib/api'; +import { useToast } from '@/context/ToastContext'; +import styles from './SettingsPage.module.css'; + +export default function SettingsPage() { + const queryClient = useQueryClient(); + const { addToast } = useToast(); + + const { data: settings, isLoading } = useQuery({ + queryKey: ['settings'], + queryFn: () => api.settings.get(), + }); + + const mutation = useMutation({ + mutationFn: (newVal: boolean) => api.settings.update({ allowRequesterChat: newVal }), + onSuccess: () => { + void queryClient.invalidateQueries({ queryKey: ['settings'] }); + addToast('Configuração atualizada com sucesso', 'success'); + }, + onError: (err: any) => { + addToast(`Erro ao atualizar: ${err.message}`, 'error'); + } + }); + + if (isLoading) { + return ( + <div style={{ display: 'flex', gap: '8px', alignItems: 'center' }}> + <div className="spinner" /> Carregando configurações... + </div> + ); + } + + return ( + <div className={styles.page}> + <div className={styles.header}> + <h2 className={styles.heading}>Configurações do Sistema</h2> + <p className={styles.subheading}>Gerencie as preferências globais da plataforma de chamados.</p> + </div> + + <div className={styles.card}> + <div className={styles.settingRow}> + <div className={styles.settingInfo}> + <h3 className={styles.settingTitle}>Chat de Solicitantes</h3> + <p className={styles.settingDesc}> + Se ativado, usuários padrão (requesters) poderão enviar e receber mensagens dentro dos chamados. Se desativado, apenas agentes e administradores poderão interagir no chat. + </p> + </div> + + <label className={styles.switch}> + <input + type="checkbox" + checked={settings?.allowRequesterChat ?? true} + disabled={mutation.isPending} + onChange={(e) => mutation.mutate(e.target.checked)} + /> + <span className={styles.slider}></span> + </label> + </div> + </div> + </div> + ); +} |