wip

nova-components/InlineRelationship/resources/js/DataTables/InlineResourceTable.vue

@@ -0,0 +1,57 @@
+<template>
+  <div class="overflow-hidden overflow-x-auto relative">
+    <table
+      v-if="resources.length > 0"
+      class="w-full divide-y divide-gray-100 dark:divide-gray-700"
+      data-testid="resource-table"
+    >
+      <table-header
+        :resource-name="resourceName"
+        :fields="fields"
+      />
+      <tbody class="divide-y divide-gray-100 dark:divide-gray-700">
+        <table-row
+          v-for="(resource, index) in resources"
+          @actionExecuted="$emit('actionExecuted')"
+          :testId="`${resourceName}-items-${index}`"
+          :key="`${resource.id.value}-items-${index}`"
+          :resource="resource"
+          :resource-name="resourceName"
+        />
+      </tbody>
+    </table>
+  </div>
+</template>
+
+<script>
+import TableHeader from './TableHeader.vue'
+import TableRow from './TableRow.vue'
+
+export default {
+  components: {
+    'table-header': TableHeader,
+    'table-row': TableRow,
+  },
+
+  props: {
+    resourceName: { default: null },
+    resources: { default: [] },
+    singularName: { type: String, required: true },
+  },
+
+  computed: {
+    /**
+     * Get all of the available fields for the resources.
+     */
+    fields() {
+      if (this.resources) {
+        return this.resources[0].fields
+      }
+    },
+  },
+
+  methods: {
+    
+  }
+}
+</script>