{/* Header */}

Edit Infografis

Perbarui detail infografis di bawah

{/* Flash */} {flash?.success && (

{flash.success}

)} {flash?.error && (

{flash.error}

)} {/* Form */}

Formulir Edit Infografis

Pastikan informasi yang diperbarui sudah benar

{/* Judul + Tanggal */}

Judul * setData('judul', ev.target.value)} className={inputAdminLg(e.judul)} />

Tanggal Terbit * setData('tanggal_terbit', ev.target.value)} className={inputAdminLg(e.tanggal_terbit)} />

{/* Deskripsi */}

Deskripsi *

setData('deskripsi', ev.target.value)}
                                    className={inputAdminLg(e.deskripsi)}
                                />
                                <FieldError message={e.deskripsi} />
                            </div>

{/* Gambar */}
                            <div>
                                <label className="block text-sm font-medium text-gray-700 sm:text-base">Gambar Infografis</label>
                                {infografis.gambar_url && (
                                    <div className="mt-2">
                                        <p className="text-xs text-gray-500">Gambar saat ini:</p>
                                        <img
                                            src={infografis.gambar_url}
                                            alt="Gambar saat ini"
                                            className="mt-1 h-32 w-auto rounded-md border object-cover"
                                        />
                                    </div>
                                )}
                                <div
                                    className={`mt-4 flex justify-center rounded-md border-2 border-dashed px-6 py-8 transition-colors hover:border-gray-400 ${e.gambar ? 'border-red-300 bg-red-50' : 'border-gray-300'}`}
                                >
                                    <div className="space-y-2 text-center">
                                        <div className="mx-auto flex h-12 w-12 items-center justify-center rounded-lg bg-gray-100">
                                            <FileText className="h-6 w-6 text-gray-600" />
                                        </div>
                                        <div className="text-sm text-gray-600">
                                            <label htmlFor="gambar" className="cursor-pointer font-medium text-orange-600 hover:text-orange-500">
                                                Upload gambar baru
                                            </label>
                                            <span className="pl-1">atau drag and drop</span>
                                        </div>
                                        <p className="text-xs text-gray-500">PNG, JPG, GIF hingga 2MB. Kosongkan jika tidak ingin ganti.</p>
                                    </div>
                                </div>
                                <input
                                    id="gambar"
                                    type="file"
                                    accept="image/*"
                                    onChange={(ev) => setData('gambar', ev.target.files ? ev.target.files[0] : null)}
                                    className="sr-only"
                                />
                                {data.gambar && <p className="mt-2 text-sm text-gray-600">File baru: {data.gambar.name}</p>}
                                <FieldError message={e.gambar} />
                            </div>
                        </div>

{/* Actions */}
                        <div className="mt-6 flex flex-col-reverse gap-3 border-t border-gray-200 pt-6 sm:flex-row sm:justify-end">
                            <Link
                                href={route('admin.infografis.index')}
                                className="inline-flex justify-center rounded-md border border-gray-300 bg-white px-4 py-2 text-sm font-medium text-gray-700 hover:bg-gray-50 sm:w-auto"
                            >
                                Batal
                            </Link>
                            <button
                                type="submit"
                                disabled={processing}
                                className="inline-flex justify-center rounded-md bg-orange-600 px-6 py-2 text-sm font-medium text-white shadow-sm hover:bg-orange-700 disabled:cursor-not-allowed disabled:opacity-50 sm:w-auto"
                            >
                                {processing ? 'Memperbarui...' : 'Perbarui Infografis'}
                            </button>
                        </div>
                    </form>
                </div>
            </div>
        </AuthenticatedLayout>
    );
}