feat(fullstack): Add organization scoping for application form

legalconsenthub/pages/index.vue

@@ -7,6 +7,18 @@
         </template>
 
         <template #right>
+          Aktuelle Organisation
+          <USelect
+            v-model="selectedOrganizationId"
+            :items="organizations"
+            value-key="id"
+            label-key="name"
+            size="lg"
+            :ui="{
+              trailingIcon: 'group-data-[state=open]:rotate-180 transition-transform duration-200'
+            }"
+            class="w-48"
+          />
           <UDropdownMenu :items="items">
             <UButton icon="i-lucide-plus" size="md" class="rounded-full" />
           </UDropdownMenu>
@@ -58,10 +70,17 @@ import type { ApplicationFormDto, PagedApplicationFormDto } from '~/.api-client'
 
 const { getAllApplicationForms, deleteApplicationFormById } = useApplicationForm()
 const route = useRoute()
+const { organizations, selectedOrganization } = useAuth()
 
-const { data } = await useAsyncData<PagedApplicationFormDto>(async () => {
-  return await getAllApplicationForms()
-})
+const { data } = await useAsyncData<PagedApplicationFormDto>(
+  async () => {
+    if (!selectedOrganization.value) {
+      throw new Error('No organization selected')
+    }
+    return await getAllApplicationForms(selectedOrganization.value.id)
+  },
+  { watch: [selectedOrganization] }
+)
 
 const isDeleteModalOpen = computed<boolean>({
   get: () => 'delete' in route.query,
@@ -75,6 +94,16 @@ const applicationFormNameToDelete = computed(() => {
   return data?.value?.content.find((appForm) => appForm.id === route.query.id)
 })
 
+const selectedOrganizationId = computed({
+  get() {
+    return selectedOrganization.value?.id
+  },
+  set(item) {
+    // TODO: USelect triggers multiple times after single selection
+    selectedOrganization.value = organizations.value.find((i) => i.id === item) ?? null
+  }
+})
+
 const items = [
   [
     {