style: apply consistent code formatting across project files

This commit is contained in:
Firman Ramdhani
2026-09-16 13:14:02 +07:00
parent d5791e759e
commit 51d05653c6
48 changed files with 3585 additions and 2575 deletions
+65 -42
View File
@@ -15,7 +15,7 @@ export default function IntegrationsPage() {
const [settings, setSettings] = useState({
MATTERMOST_WEBHOOK_URL: '',
MATTERMOST_TEMPLATE: '',
WHATSAPP_TEMPLATE: ''
WHATSAPP_TEMPLATE: '',
})
useEffect(() => {
@@ -24,8 +24,12 @@ export default function IntegrationsPage() {
if (data) {
setSettings({
MATTERMOST_WEBHOOK_URL: data.MATTERMOST_WEBHOOK_URL || '',
MATTERMOST_TEMPLATE: data.MATTERMOST_TEMPLATE || 'Halo tim! Lagi ada orderan open nih untuk {title}. Mumpung belum di-checkout, yang mau ikutan nitip bisa langsung cek ke sini ya: {url}',
WHATSAPP_TEMPLATE: data.WHATSAPP_TEMPLATE || 'Halo tim! Lagi ada orderan open nih untuk {title}. Mumpung belum di-checkout, yang mau ikutan nitip bisa langsung cek ke sini ya: {url}'
MATTERMOST_TEMPLATE:
data.MATTERMOST_TEMPLATE ||
'Halo tim! Lagi ada orderan open nih untuk {title}. Mumpung belum di-checkout, yang mau ikutan nitip bisa langsung cek ke sini ya: {url}',
WHATSAPP_TEMPLATE:
data.WHATSAPP_TEMPLATE ||
'Halo tim! Lagi ada orderan open nih untuk {title}. Mumpung belum di-checkout, yang mau ikutan nitip bisa langsung cek ke sini ya: {url}',
})
}
setLoading(false)
@@ -34,7 +38,7 @@ export default function IntegrationsPage() {
}, [])
const handleChange = (key: string, value: string) => {
setSettings(prev => ({ ...prev, [key]: value }))
setSettings((prev) => ({ ...prev, [key]: value }))
}
const handleSave = async () => {
@@ -43,12 +47,12 @@ export default function IntegrationsPage() {
if (res.success) {
toast.success('Berhasil Disimpan', {
description: 'Pengaturan integrasi berhasil disimpan!',
duration: 3000
duration: 3000,
})
} else {
toast.error('Gagal', {
description: 'Gagal menyimpan pengaturan',
duration: 3000
duration: 3000,
})
}
setSaving(false)
@@ -56,73 +60,92 @@ export default function IntegrationsPage() {
if (loading) {
return (
<div className="flex justify-center items-center h-64">
<Loader2 className="w-8 h-8 animate-spin text-[#1B2CC1]" />
<div className="flex h-64 items-center justify-center">
<Loader2 className="h-8 w-8 animate-spin text-[#1B2CC1]" />
</div>
)
}
return (
<div className="p-6 space-y-8">
<div className="space-y-8 p-6">
<div>
<h2 className="text-xl font-bold text-slate-900 dark:text-white">Integrasi & Sharing</h2>
<p className="text-xs text-slate-500 mt-1">Konfigurasi endpoint API dan template pesan otomatis.</p>
<p className="mt-1 text-xs text-slate-500">
Konfigurasi endpoint API dan template pesan otomatis.
</p>
</div>
<div className="space-y-6 max-w-3xl">
<div className="max-w-3xl space-y-6">
{/* Mattermost Section */}
<div className="p-5 rounded-2xl border border-slate-200 dark:border-slate-800 bg-slate-50/50 dark:bg-slate-900/50 space-y-4">
<div className="flex items-center gap-2 text-indigo-600 dark:text-indigo-400 font-black">
<MessageSquare className="w-5 h-5" />
<div className="space-y-4 rounded-2xl border border-slate-200 bg-slate-50/50 p-5 dark:border-slate-800 dark:bg-slate-900/50">
<div className="flex items-center gap-2 font-black text-indigo-600 dark:text-indigo-400">
<MessageSquare className="h-5 w-5" />
<h3>Mattermost Webhook</h3>
</div>
<p className="text-xs text-slate-500">Gunakan URL Incoming Webhook dari Mattermost untuk mengirim broadcast PO baru secara otomatis.</p>
<p className="text-xs text-slate-500">
Gunakan URL Incoming Webhook dari Mattermost untuk mengirim broadcast PO baru secara
otomatis.
</p>
<div className="space-y-1.5">
<Label className="text-xs font-bold uppercase text-slate-700">Webhook URL</Label>
<Input
value={settings.MATTERMOST_WEBHOOK_URL}
onChange={e => handleChange('MATTERMOST_WEBHOOK_URL', e.target.value)}
className="h-11 rounded-xl bg-white dark:bg-slate-950"
placeholder="https://mattermost.yourdomain.com/hooks/xxx"
<Label className="text-xs font-bold text-slate-700 uppercase">Webhook URL</Label>
<Input
value={settings.MATTERMOST_WEBHOOK_URL}
onChange={(e) => handleChange('MATTERMOST_WEBHOOK_URL', e.target.value)}
className="h-11 rounded-xl bg-white dark:bg-slate-950"
placeholder="https://mattermost.yourdomain.com/hooks/xxx"
/>
</div>
<div className="space-y-1.5">
<Label className="text-xs font-bold uppercase text-slate-700">Pesan Template</Label>
<Textarea
value={settings.MATTERMOST_TEMPLATE}
onChange={e => handleChange('MATTERMOST_TEMPLATE', e.target.value)}
className="rounded-xl min-h-[100px] bg-white dark:bg-slate-950"
placeholder="Template pesan..."
<Label className="text-xs font-bold text-slate-700 uppercase">Pesan Template</Label>
<Textarea
value={settings.MATTERMOST_TEMPLATE}
onChange={(e) => handleChange('MATTERMOST_TEMPLATE', e.target.value)}
className="min-h-[100px] rounded-xl bg-white dark:bg-slate-950"
placeholder="Template pesan..."
/>
<p className="text-[10px] text-slate-500 flex items-center gap-1"><AlertCircle className="w-3 h-3"/> Gunakan variabel: {'{title}'}, {'{url}'}</p>
<p className="flex items-center gap-1 text-[10px] text-slate-500">
<AlertCircle className="h-3 w-3" /> Gunakan variabel: {'{title}'}, {'{url}'}
</p>
</div>
</div>
{/* WhatsApp Section */}
<div className="p-5 rounded-2xl border border-slate-200 dark:border-slate-800 bg-slate-50/50 dark:bg-slate-900/50 space-y-4">
<div className="flex items-center gap-2 text-emerald-600 dark:text-emerald-400 font-black">
<MessageCircle className="w-5 h-5" />
<div className="space-y-4 rounded-2xl border border-slate-200 bg-slate-50/50 p-5 dark:border-slate-800 dark:bg-slate-900/50">
<div className="flex items-center gap-2 font-black text-emerald-600 dark:text-emerald-400">
<MessageCircle className="h-5 w-5" />
<h3>WhatsApp Share Template</h3>
</div>
<p className="text-xs text-slate-500">Atur template teks default saat user menekan tombol share ke WhatsApp.</p>
<p className="text-xs text-slate-500">
Atur template teks default saat user menekan tombol share ke WhatsApp.
</p>
<div className="space-y-1.5">
<Label className="text-xs font-bold uppercase text-slate-700">Pesan Template</Label>
<Textarea
value={settings.WHATSAPP_TEMPLATE}
onChange={e => handleChange('WHATSAPP_TEMPLATE', e.target.value)}
className="rounded-xl min-h-[100px] bg-white dark:bg-slate-950"
placeholder="Template pesan..."
<Label className="text-xs font-bold text-slate-700 uppercase">Pesan Template</Label>
<Textarea
value={settings.WHATSAPP_TEMPLATE}
onChange={(e) => handleChange('WHATSAPP_TEMPLATE', e.target.value)}
className="min-h-[100px] rounded-xl bg-white dark:bg-slate-950"
placeholder="Template pesan..."
/>
<p className="text-[10px] text-slate-500 flex items-center gap-1"><AlertCircle className="w-3 h-3"/> Gunakan variabel: {'{title}'}, {'{url}'}</p>
<p className="flex items-center gap-1 text-[10px] text-slate-500">
<AlertCircle className="h-3 w-3" /> Gunakan variabel: {'{title}'}, {'{url}'}
</p>
</div>
</div>
<div className="pt-2">
<Button onClick={handleSave} disabled={saving} className="bg-[#1B2CC1] hover:bg-[#15229E] text-white rounded-xl h-11 px-8 font-bold shadow-md w-full sm:w-auto">
{saving ? <Loader2 className="w-4 h-4 animate-spin mr-2" /> : <Save className="w-4 h-4 mr-2" />}
<Button
onClick={handleSave}
disabled={saving}
className="h-11 w-full rounded-xl bg-[#1B2CC1] px-8 font-bold text-white shadow-md hover:bg-[#15229E] sm:w-auto"
>
{saving ? (
<Loader2 className="mr-2 h-4 w-4 animate-spin" />
) : (
<Save className="mr-2 h-4 w-4" />
)}
Simpan Konfigurasi
</Button>
</div>