# Sistem Manajemen dan Validasi Logo Aplikasi Berbasis ID (Multi-Tenant)

Dokumen ini menjelaskan standar operasional dan arsitektur teknis untuk mengelola aset visual (logo) pada 4 aplikasi perusahaan yang berbeda agar tidak tertukar. Sistem ini menggunakan metode **Validasi Berbasis Nomor ID** untuk memastikan akurasi otomatisasi pada kode program.

---

## 1. Standar Penamaan Aset (Naming Convention)

Setiap perusahaan wajib memiliki ID numerik unik yang terdiri dari 3 digit (*padding zero*). Nama file logo harus mencerminkan ID ini secara ketat.

| ID Perusahaan | Nama Perusahaan | Nama File Logo Utama | Nama File Favicon |
| :--- | :--- | :--- | :--- |
| `001` | Perusahaan A | `logo_001.svg` | `favicon_001.png` |
| `002` | Perusahaan B | `logo_002.svg` | `favicon_002.png` |
| `003` | Perusahaan C | `logo_003.svg` | `favicon_003.png` |
| `004` | Perusahaan D | `logo_004.svg` | `favicon_004.png` |

> **Aturan Penting:** Jangan gunakan nama brand, nama desainer, atau status revisi (contoh salah: `logo_perusahaanA_v2_final.png`).

---

## 2. Struktur Folder Proyek (Asset Segregation)

Jika aplikasi menggunakan arsitektur monorepo atau *codebase* tunggal yang melayani banyak klien, pisahkan aset ke dalam direktori statis yang terstruktur:

```text
proyek-aplikasi/
├── assets/
│   └── logos/
│       ├── logo_001.svg
│       ├── logo_002.svg
│       ├── logo_003.svg
│       └── logo_004.svg
└── src/
    └── components/
        └── LogoLoader.js
```

---

## 3. Implementasi Kode dan Validasi Otomatis

Jangan melakukan *hardcode* path gambar. Gunakan fungsi komponen pemanggil (*loader component*) yang mencocokkan ID aplikasi aktif secara otomatis.

### Contoh Implementasi (JavaScript / React / React Native)
```javascript
import React from 'react';

// Fungsi untuk memvalidasi dan memuat logo berdasarkan ID Aplikasi
const LogoLoader = ({ companyId }) => {
  // 1. Fallback logo jika ID tidak ditemukan atau terjadi error
  const defaultLogo = '/assets/logos/logo_placeholder.svg';
  
  // 2. Validasi format ID (Harus berupa string 3 digit angka)
  const idPattern = /^[0-9]{3}\$/;
  if (!idPattern.test(companyId)) {
    console.error(`Validasi Gagal: ID "${companyId}" tidak valid.`);
    return <img src={defaultLogo} alt="Default Logo" />;
  }

  // 3. Rekonstruksi nama file berdasarkan ID yang valid
  const logoPath = `/assets/logos/logo_${companyId}.svg`;

  return (
    <img 
      src={logoPath} 
      alt={`Logo Perusahaan ${companyId}`}
      onError={(e) => {
        // Pencegahan jika file fisik tidak ditemukan di folder assets
        e.target.onerror = null; 
        e.target.src = defaultLogo;
        console.warn(`File logo_${companyId}.svg tidak ditemukan di direktori.`);
      }}
    />
  );
};

export default LogoLoader;
```

---

## 4. Validasi di Sisi Database (Backend)

Jika konfigurasi aplikasi dikendalikan oleh server, skema database harus mengunci relasi antara ID Aplikasi dengan Nomor Logo menggunakan relasi tabel yang ketat.

### Contoh Skema Tabel `perusahaan` (SQL)
```sql
CREATE TABLE perusahaan (
    id_perusahaan VARCHAR(3) PRIMARY KEY, -- Contoh: '001', '002'
    nama_perusahaan VARCHAR(100) NOT NULL,
    nomor_logo VARCHAR(3) NOT NULL,
    CONSTRAINT chk_nomor_logo CHECK (nomor_logo = id_perusahaan) -- Memastikan nomor logo wajib sama dengan ID
);
```

---

## 5. Pengujian Otomatis (Automated Unit Testing)

Untuk memastikan tim pengembang tidak salah memasukkan nomor ID saat rilis, buat skrip pengujian (*unit test*) sebelum aplikasi di-*deploy*.

### Contoh Skrip Pengujian (Jest)
```javascript
test('Memastikan ID aplikasi memuat file logo yang tepat', () => {
  const activeCompanyId = "002";
  const expectedLogoName = `logo_${activeCompanyId}.svg`;
  
  // Logika uji coba simulasi komponen
  const generatedPath = `/assets/logos/logo_${activeCompanyId}.svg`;
  
  expect(generatedPath).toContain(expectedLogoName);
});
```

---

## 6. Alur Kerja Ringkas (Workflow)
1. **Tim Desain** mengekspor logo baru dengan nama `logo_00X.svg`.
2. **Tim QA** memeriksa apakah nomor di file sudah sesuai dengan ID perusahaan di sistem.
3. **Sistem CI/CD** menjalankan *automated testing* untuk memastikan file logo ada di repositori sebelum proses *build* aplikasi selesai.
