import { Button } from '@/components/ui/button'; import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card'; import { Field, FieldError } from "@/components/ui/field"; import { Input } from "@/components/ui/input"; import { Label } from "@/components/ui/label"; import { Textarea } from '@/components/ui/textarea'; import systemRoutes from '@/routes/system'; import type { GeneralSetting } from '@/types'; import { Head, useForm } from '@inertiajs/react'; import { ImagePlus, Loader, Save, X } from 'lucide-react'; import React, { useRef, useState } from 'react'; import { toast } from 'sonner'; export default function SettingIndex({ setting }: { setting: GeneralSetting | null }) { const { data, setData, post, processing, errors } = useForm({ name: setting?.name || '', description: setting?.description || '', address: setting?.address || '', phone: setting?.phone || '', logo: null as File | null, icon: null as File | null, }); const logoInputRef = useRef(null); const iconInputRef = useRef(null); const [logoPreview, setLogoPreview] = useState(setting?.logo_url || null); const [iconPreview, setIconPreview] = useState(setting?.icon_url || null); const handleLogoChange = (e: React.ChangeEvent) => { const file = e.target.files?.[0]; if (!file) { return; } setData('logo', file); const reader = new FileReader(); reader.onloadend = () => setLogoPreview(reader.result as string); reader.readAsDataURL(file); }; const removeLogo = () => { setData('logo', null); setLogoPreview(null); if (logoInputRef.current) { logoInputRef.current.value = ''; } }; const handleIconChange = (e: React.ChangeEvent) => { const file = e.target.files?.[0]; if (!file) { return; } setData('icon', file); const reader = new FileReader(); reader.onloadend = () => setIconPreview(reader.result as string); reader.readAsDataURL(file); }; const removeIcon = () => { setData('icon', null); setIconPreview(null); if (iconInputRef.current) { iconInputRef.current.value = ''; } }; const onSubmit = (e: React.FormEvent) => { e.preventDefault(); post(systemRoutes.settings.update().url, { forceFormData: true, onSuccess: (response: any) => { toast.success(response.props.flash.success); }, }); }; return (

Pengaturan Umum

Informasi Aplikasi
setData('phone', e.target.value)} placeholder="0812xxxx" /> setData('name', e.target.value)} autoComplete='off' placeholder='Contoh: VN Grup Dress' maxLength={100} />