# useFormData
Package: @dataliva/livalib
Description: @dataliva/livalib veri çekme ve önbellekleme hook'u.

Form açılırken ihtiyaç duyulan listeleri (roller, departmanlar, şirketler
vb.) çekip önbelleğe alan hook. Veri yalnızca bir kez getirilir: `enabled`
`true` olduğunda ve `data` henüz boşken `fetchFn` çağrılır; veri geldikten
sonra tekrar istek atılmaz. Hook yeniden getirme (refetch) fonksiyonu
sunmaz — bu yüzden örneklerde "Yenile" butonu yoktur.

```tsx
import { useFormData } from "@dataliva/livalib";

const urunleriGetir = () =>
  new Promise<Urun[]>((res) => setTimeout(() => res(sahteUrunler), 800));

const { data, loading, error } = useFormData<Urun>({
  fetchFn: urunleriGetir,
  enabled: true,
});
```

## Temel kullanım

Sahte `fetchFn`, 800 ms sonra Türkçe bir ürün listesi döndürür. İstek
sürerken `loading` `true` olur ve bir yükleme göstergesi gösterilir;
veri gelince liste çizilir.

**Örnek — Temel kullanım:**

```tsx
<div style={{ width: "100%" }}>
  {loading && (
    <div style={{ display: "flex", alignItems: "center", gap: 8 }}>
      <LivaLoadIndicator visible size="small" />
      <span>Ürünler yükleniyor...</span>
    </div>
  )}
  {error && <p>Bir hata oluştu: {error.message}</p>}
  {!loading && !error && data.length > 0 && (
    <ul style={{ margin: 0, paddingLeft: 20 }}>
      {data.map((urun) => (
        <li key={urun.id}>
          {urun.ad} — {urun.fiyat.toLocaleString("tr-TR")} TL
        </li>
      ))}
    </ul>
  )}
</div>
```

## Tembel yükleme

`enabled` genellikle bir popup'ın görünürlüğüne bağlanır: `false` iken
istek atılmaz, `true` olur olmaz veri çekilir. Aşağıda `enabled` bir buton
ile tetikleniyor — butona bastıktan sonra tekrar `true` kalsa bile veri
önbellekte olduğu için yeni istek atılmaz.

**Örnek — enabled ile tembel yükleme:**

```tsx
<div style={{ width: "100%" }}>
  {!aktif && <LivaButton text="Ürünleri Yükle" onClick={() => setAktif(true)} />}
  {loading && (
    <div style={{ display: "flex", alignItems: "center", gap: 8 }}>
      <LivaLoadIndicator visible size="small" />
      <span>Yükleniyor...</span>
    </div>
  )}
  {aktif && !loading && (
    <ul style={{ margin: 0, paddingLeft: 20 }}>
      {data.map((urun) => (
        <li key={urun.id}>{urun.ad}</li>
      ))}
    </ul>
  )}
</div>
```

## Parametreler

| Alan | Tip | Açıklama |
|------|------|---------|
| `fetchFn` | `() => Promise<T[]>` | Veriyi getiren fonksiyon (zorunlu). |
| `enabled` | `boolean` | `true` olduğunda veri çekilir; genellikle popup görünürlüğüne bağlanır (zorunlu). |
| `errorMessage` | `string` | `onError` ile birlikte kullanılan özel hata metni. |
| `onError` | `(error: Error) => void` | Hata durumunda çağrılan geri çağrı. |

## Dönen Değerler

| Alan | Tip | Açıklama |
|------|------|---------|
| `data` | `T[]` | Getirilen veri; istek tamamlanana kadar boş dizi. |
| `loading` | `boolean` | İstek sürüyor mu. |
| `error` | `Error \| null` | İstek başarısız olduysa hata nesnesi. |