Merge branch 'dev' of github.com:dikstub-rssa/simrs-fe into feat/satusehat

app/components/flow/satusehat/list.vue

@@ -1,15 +1,17 @@
 <script setup lang="ts">
-import type { ServiceStatus } from '~/components/pub/base/service-status.type'
-import type { Summary } from '~/components/pub/base/summary-card.type'
-import type { HeaderPrep, RefSearchNav } from '~/components/pub/nav/types'
+import type { DataTableLoader } from '~/components/pub/base/data-table/type';
+import type { ServiceStatus } from '~/components/pub/base/service-status/type'
+import type { Summary } from '~/components/pub/base/summary-card/type'
+import type { HeaderPrep, RefSearchNav } from '~/components/pub/custom-ui/data/types'
 import { useUrlSearchParams } from '@vueuse/core'
 import { CircleCheckBig, CircleDashed, CircleX, Ellipsis, Search, Send } from 'lucide-vue-next'
+import Header from '~/components/pub/custom-ui/nav-header/header.vue';
 
 // State management
 const data = ref([])
-const isLoading = reactive({
+const isLoading = reactive<DataTableLoader>({
   satusehatConn: true,
-  dataListLoading: false,
+  isTableLoading: false,
 })
 
 const params = useUrlSearchParams('history', {
@@ -38,7 +40,7 @@ const pagination = ref({
 // API function to fetch data
 async function fetchData() {
   try {
-    isLoading.dataListLoading = true
+    isLoading.isTableLoading = true
     const response: any = await $fetch('/api/v1/satusehat/list', {
       method: 'POST',
       body: {
@@ -59,7 +61,7 @@ async function fetchData() {
   } catch (error) {
     console.error('Error fetching data:', error)
   } finally {
-    isLoading.dataListLoading = false
+    isLoading.isTableLoading = false
   }
 }
 
@@ -161,7 +163,7 @@ onMounted(async () => {
 provide('rec_id', recId)
 provide('rec_action', recAction)
 provide('rec_item', recItem)
-provide('pull_data', isLoading)
+provide('table_data_loader', isLoading)
 
 const tabs = [
   {
@@ -206,10 +208,10 @@ const activeTabFilter = computed({
 </script>
 
 <template>
-  <PubNavHeaderPrep :prep="headerPrep" />
+  <Header :prep="headerPrep" />
   <div class="my-4 flex flex-1 flex-col gap-3 md:gap-4">
     <PubBaseServiceStatus v-bind="service" />
-    <AppSatusehatCardSummary :is-loading="isLoading.satusehatConn" :summary-data="summaryData" />
+    <AppSatusehatCardSummary :is-loading="isLoading.satusehatConn!" :summary-data="summaryData" />
   </div>
   <div class="rounded-md border p-4">
     <h2 class="text-md font-semibold py-2">FHIR Resource</h2>
@@ -298,11 +300,11 @@ const activeTabFilter = computed({
         <TabsContent v-for="tab in tabs" :key="`content-${tab.value}`" :value="tab.value">
           <div class="rounded-md border p-4">
             <!-- <Ellipsis v-if="isLoading.satusehatConn || isLoading.dataList" -->
-              <!-- class="size-6 animate-pulse text-muted-foreground mx-auto" /> -->
+            <!-- class="size-6 animate-pulse text-muted-foreground mx-auto" /> -->
             <AppSatusehatList v-if="!isLoading.satusehatConn" :data="data" />
 
             <!-- Pagination -->
-            <div v-if="!isLoading.satusehatConn && !isLoading.dataListLoading && pagination.total > 0"
+            <div v-if="!isLoading.satusehatConn && !isLoading.isTableLoading && pagination.total > 0"
               class="mt-4 flex justify-between items-center">
               <div class="text-sm text-muted-foreground">
                 Menampilkan {{ ((pagination.page - 1) * pagination.limit) + 1 }} -