# 🚀 Web Upload Automation Platform

> Sistem Web untuk **otomasi unggah file dan publikasi data** berbasis React + Vite.

![Preview](https://dummyimage.com/1200x300/edf2f7/333.png&text=Upload+Automation+Web+App)

---

## 📦 Teknologi yang Digunakan

| Layer | Stack |
|-------|-------|
| Frontend | **React + Vite + TailwindCSS + React Router v6** |
| State Management | **Redux Toolkit** |
| HTTP Client | **Axios (dengan interceptor JWT)** |
| Auth | **JWT Token (disimpan di LocalStorage)** |
| Backend | FastAPI (terpisah dari repo ini) |
| Database | PostgreSQL + PostGIS |

---

## ⚙️ Fitur Utama

### 🔑 Autentikasi
- Login menggunakan JWT token.  
- Token disimpan di `localStorage` agar tetap login selama belum kadaluarsa.  
- Proteksi route admin via `ProtectedRoute`.

### 🧩 Upload File (Multi Format)
- Dukungan **drag & drop** area (`FileDropzone`).
- Mendukung berbagai format:
  - `.zip` (Shapefile / Geodatabase)
  - `.csv` / `.xlsx`
  - `.pdf`

### 🔍 Analisis & Validasi Data
- Backend menganalisis isi file (misalnya memvalidasi koordinat atau ejaan wilayah).
- Hasil analisis ditampilkan sebagai **preview data** dan **warning table**:
  - DataPreview.jsx menampilkan:
    - Cuplikan data (max 5 baris)
    - Data dengan ejaan tidak valid (jika ada)

### 🧾 Validasi & Upload ke Database
- User memberi **judul tabel** sebelum disimpan ke PostGIS.
- Validasi input:
  - Jika belum mengisi judul → notifikasi Tailwind muncul.
- Konfirmasi sebelum meninggalkan halaman (peringatan bawaan browser).
- Saat disimpan → hasil dari backend ditampilkan di halaman sukses.

### 🧠 Dashboard Admin
- Navigasi menggunakan **AdminLayout** dengan navbar di atas.
- Halaman admin:
  - `/admin/home` – Dashboard utama  
  - `/admin/upload` – Form upload & validasi  
  - `/admin/publikasi` – Manajemen publikasi  

---

## 🧭 Alur Upload File

### **1️⃣ Upload Step**
User mengunggah file (drag & drop atau pilih manual).  
→ dikirim ke backend `/upload`  
→ backend mengembalikan `result` (kolom, preview, warning, dll.)

### **2️⃣ Validasi Step**
User:
- Melihat hasil preview dan warning.  
- Mengisi “Judul Tabel”.  
- Klik “Upload ke Database”.  
→ dikirim ke backend `/upload_to_postgis`.

### **3️⃣ Success Step**
Response backend disimpan ke Redux (`validatedData`), lalu:
- Ditampilkan di halaman sukses `/admin/upload/success`.
- Menampilkan ringkasan hasil:
  - Nama tabel
  - Jumlah baris
  - Waktu upload
  - Pesan backend
  - Metadata tambahan (jika ada)

---

## ⚡ Instalasi & Menjalankan

### 1️⃣ Clone Repository
```bash
git clone https://github.com/yourusername/upload-automation.git
cd upload-automation
```

### 2️⃣ Install Dependencies
```bash
npm install
```

### 3️⃣ Jalankan Server Development
```bash
npx vite
```

### 4️⃣ (Opsional) Build untuk Produksi
```bash
npm run build
```

---

## 🔐 Konfigurasi Lingkungan (`.env`)
Buat file `.env` di root proyek dan tambahkan:

```bash
VITE_API_URL=http://localhost:8000
```

Lalu di `api.js`:
```js
baseURL: import.meta.env.VITE_API_URL
```

---

## 🧩 Contoh Respons Backend

### `/upload` (POST)
```json
{
  "file_type": ".pdf",
  "columns": ["id", "nama_desa", "kecamatan", "kabupaten"],
  "preview": [
    { "id": 1, "nama_desa": "Kedungrejo", "kecamatan": "Waru", "kabupaten": "Sidoarjo" }
  ],
  "geometry_valid": 120,
  "geometry_empty": 3,
  "warning_rows": [
    { "nama_desa": "Kedung Rejo", "kecamatan": "waru", "kabupaten": "Sidoarjo" }
  ]
}
```

### `/upload_to_postgis` (POST)
```json
{
  "table_name": "data_wilayah_valid",
  "total_rows": 123,
  "upload_time": "2025-10-28T10:14:00Z",
  "message": "Data berhasil disimpan ke PostGIS.",
  "metadata": {
    "user": "admin",
    "database": "geosystem",
    "duration": "1.2s"
  }
}
```

---

## 🧑‍💻 Pengembang
**Nama:** Dimas Anhar  
**Project:** Web Upload & Validation Automation Platform
**Tujuan:** Sistem Otomatisasi Unggah dan Validasi Data Geospasial

---

## 💬 Catatan
- Pastikan backend `FastAPI` berjalan di `localhost:8000`.  
- File besar (PDF/ZIP > 50MB) sebaiknya diunggah melalui koneksi stabil.

---

## 🧠 Rencana Pengembangan Selanjutnya
- ✅ Pagination untuk tabel preview  
- ✅ Progress bar upload file  
- 🔄 Refresh token otomatis JWT  
- 🗂️ Manajemen file hasil upload  
- 🌐 Publikasi hasil ke GeoServer/GeoNetwork  

---

## 🏁 Lisensi
MIT License © 2025 — Dimas Anhar