WIP - record sharing

frontend/pages/[objectName]/[[recordId]]/[[view]].vue

@@ -3,14 +3,18 @@ import { ref, computed, onMounted, watch, nextTick } from 'vue'
 import { useRoute, useRouter } from 'vue-router'
 import { useApi } from '@/composables/useApi'
 import { useFields, useViewState } from '@/composables/useFieldViews'
+import { useAuth } from '@/composables/useAuth'
 import ListView from '@/components/views/ListView.vue'
 import DetailView from '@/components/views/DetailViewEnhanced.vue'
 import EditView from '@/components/views/EditViewEnhanced.vue'
+import RecordShareManager from '@/components/RecordShareManager.vue'
+import { Tabs, TabsContent, TabsList, TabsTrigger } from '@/components/ui/tabs'
 
 const route = useRoute()
 const router = useRouter()
 const { api } = useApi()
 const { buildListViewConfig, buildDetailViewConfig, buildEditViewConfig } = useFields()
+const { getUser } = useAuth()
 
 // Use breadcrumbs composable
 const { setBreadcrumbs } = useBreadcrumbs()
@@ -131,6 +135,38 @@ const canCreate = computed(() => {
   return result
 })
 
+// Check if user can share the record
+const canShareRecord = computed(() => {
+  if (!currentRecord.value) return false
+  const user = getUser()
+  if (!user) return false
+  // User can share if they own the record
+  return currentRecord.value.ownerId === user.id
+})
+
+// Get current user's permissions for the record
+const currentUserPermissions = computed(() => {
+  if (!objectDefinition.value || !currentRecord.value) {
+    return { canRead: false, canUpdate: false, canDelete: false }
+  }
+
+  const user = getUser()
+  const isOwner = user ? currentRecord.value.ownerId === user.id : false
+  const accessModel = objectDefinition.value.access_model || objectDefinition.value.accessModel
+  const publicRead = objectAccess.value?.publicRead === true || objectAccess.value?.publicRead === 1
+  const publicUpdate = objectAccess.value?.publicUpdate === true || objectAccess.value?.publicUpdate === 1
+  const publicDelete = objectAccess.value?.publicDelete === true || objectAccess.value?.publicDelete === 1
+
+  return {
+    canRead: isOwner || publicRead || accessModel === 'public',
+    canUpdate: isOwner || publicUpdate,
+    canDelete: isOwner || publicDelete
+  }
+})
+
+// Active tab for detail view with sharing
+const activeTab = ref('details')
+
 // Fetch object definition
 const fetchObjectDefinition = async () => {
   try {
@@ -293,18 +329,37 @@ onMounted(async () => {
         @delete="handleDelete"
       />
 
-      <!-- Detail View -->
-      <DetailView
-        v-else-if="view === 'detail' && detailConfig && currentRecord"
-        :config="detailConfig"
-        :data="currentRecord"
-        :loading="dataLoading"
-        :object-id="objectDefinition?.id"
-        :base-url="`/runtime/objects`"
-        @edit="handleEdit"
-        @delete="() => handleDelete([currentRecord])"
-        @back="handleBack"
-      />
+      <!-- Detail View with Tabs -->
+      <div v-else-if="view === 'detail' && detailConfig && currentRecord">
+        <Tabs v-model="activeTab" class="w-full">
+          <TabsList class="grid w-full mb-6" :class="canShareRecord ? 'grid-cols-2' : 'grid-cols-1'">
+            <TabsTrigger value="details">Details</TabsTrigger>
+            <TabsTrigger v-if="canShareRecord" value="sharing">Sharing</TabsTrigger>
+          </TabsList>
+
+          <TabsContent value="details">
+            <DetailView
+              :config="detailConfig"
+              :data="currentRecord"
+              :loading="dataLoading"
+              :object-id="objectDefinition?.id"
+              :base-url="`/runtime/objects`"
+              @edit="handleEdit"
+              @delete="() => handleDelete([currentRecord])"
+              @back="handleBack"
+            />
+          </TabsContent>
+
+          <TabsContent v-if="canShareRecord" value="sharing">
+            <RecordShareManager
+              :object-api-name="objectApiName"
+              :record-id="recordId!"
+              :current-user-permissions="currentUserPermissions"
+              :fields="objectDefinition?.fields || []"
+            />
+          </TabsContent>
+        </Tabs>
+      </div>
 
       <!-- Edit View -->
       <div v-else-if="(view === 'edit' || recordId === 'new') && editConfig">