---
// src/pages/index.astro
import Layout from "../layouts/Layout.astro";
import siteConfig from "../data/site.json";
import RadniNalogLista from '../components/lista/RadniNalogLista.jsx';
import FleetStrojeviLista from '../components/lista/FleetStrojeviLista.jsx';
import FleetVozilaLista from "../components/lista/FleetVozilaLista";
---

<Layout title="Dashboard">
  <header>
    <h1>{siteConfig.navigation[0].welcomeHeaderTextH1} {siteConfig.navigation[0].welcomeHeaderTextH1dodatno}</h1>
    <p>{siteConfig.navigation[0].welcomeHeaderPodnaslov}</p>
  </header>

  <main class="dashboard-grid">
    <section>
      <h2>Radni nalozi</h2>
      {/* client:only osigurava da se lista sama dohvati u pregledniku */}
      <RadniNalogLista client:only="preact" limit={5} />
    </section>

    <section>
      <h2>Stanje flote</h2>
      <FleetStrojeviLista client:only="preact" limit={5} />
    </section>

    <section>
      <h2>Stanje flote</h2>
      <FleetVozilaLista client:only="preact" limit={5} />
    </section>
  </main>
</Layout>

<style>
  .dashboard-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
    margin-top: 40px;
  }
</style>