frontend/src/views/documentos/DocumentosView.vue

<script setup>
import LayoutSistema from "../../layout/LayoutSistema.vue";
import SearchBox from "../../components/SearchBox.vue";
import DocumentList from "../../components/DocumentList.vue";
import { useSearch } from "../../composables/useSearch.js";
import { useDocumentos } from "../../composables/useDocumentos.js";

const {
  results: searchResults,
  loading: searchLoading,
  error: searchError,
  run: runSearch,
} = useSearch();

const { docs, loadDocs } = useDocumentos();
</script>

<template>
  <LayoutSistema>
    <div class="w-full space-y-6">
      <div>
        <h1 class="text-lg font-semibold text-gray-900 dark:text-gray-100">Documentos</h1>
        <p class="text-sm text-gray-500 dark:text-gray-400">
          Pesquise, revise e remova documentos ingeridos na base de conhecimento.
        </p>
      </div>

      <SearchBox
        :results="searchResults"
        :loading="searchLoading"
        :error="searchError"
        @search="runSearch"
      />

      <DocumentList
        :items="docs.items"
        :loading="docs.loading"
        :error="docs.error"
        @refresh="loadDocs"
      />
    </div>
  </LayoutSistema>
</template>