chore: wip

src/components/Table.vue

@@ -67,7 +67,7 @@ const itemsPerPage = $computed((): number => {
 })
 
 // let's use (init) the table by passing the default state
-const { table, search } = await useTable({
+const { table, search, colName } = await useTable({
   source,
   password,
   type,
@@ -107,10 +107,6 @@ table.value.perPage = itemsPerPage
 table.value.actions = actions
 table.value.actionable = actionable
 table.value.checkable = checkable
-
-function colName(col: string) {
-  return col.split(':')[0].trim()
-}
 </script>
 
 <template>

src/components/TableBody.vue

@@ -1,13 +1,8 @@
 <script setup lang="ts">
-import { isString } from '@vueuse/core'
 // eslint-disable-next-line no-console
 console.log('TableBody.vue')
 
-const { table } = $(await useTable())
-
-function colName(col: any) {
-  return col.split(':')[0].trim()
-}
+const { table, colName } = $(await useTable())
 </script>
 
 <template>

src/components/TableRow.vue

@@ -1,7 +1,7 @@
 <script setup lang="ts">
 const { hit } = defineProps<{ hit: any }>()
 
-const { table } = $(await useTable())
+const { table, colName } = $(await useTable())
 
 // let's generate the value of the row
 function generateValue(hit: any, col: any) {
@@ -10,10 +10,6 @@ function generateValue(hit: any, col: any) {
 
   return JSON.parse(hit[col])
 }
-
-function colName(col: any) {
-  return col.split(':')[0].trim()
-}
 </script>
 
 <template>

src/composables/table.ts

@@ -205,6 +205,10 @@ function toggleSort(col: string | Ref<string>) {
   console.log('table.sort', table.sort)
 }
 
+function colName(col: string) {
+  return col.split(':')[0].trim()
+}
+
 export async function useTable(store?: TableStore) {
   return $$({
     store,
@@ -227,5 +231,6 @@ export async function useTable(store?: TableStore) {
     isColumnUsedAsSort,
     actionable,
     actions,
+    colName,
   })
 }