072e1b10f1
- Add Nuxt 4 application with Vuetify UI framework - Implement GraphQL schema registry management interface - Add Apollo Client integration with Auth0 authentication - Create organization and API key management - Add schema and ref browsing capabilities - Implement organization switcher for multi-org users - Add delete functionality for organizations and API keys - Create Kubernetes deployment descriptors - Add Docker configuration with nginx Features: - Dashboard with organization overview - Schema browsing by ref with supergraph viewing - Ref management with schema details - Settings page for organizations and API keys - User list per organization with provider icons - Admin-only organization creation - Delete confirmations with warnings 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
43 lines
1.3 KiB
Vue
43 lines
1.3 KiB
Vue
<template>
|
|
<v-menu v-if="organizations.length > 1">
|
|
<template #activator="{ props }">
|
|
<v-btn
|
|
v-bind="props"
|
|
variant="outlined"
|
|
prepend-icon="mdi-domain"
|
|
class="text-none"
|
|
>
|
|
{{ selectedOrganization?.name || 'Select Organization' }}
|
|
<v-icon end>mdi-menu-down</v-icon>
|
|
</v-btn>
|
|
</template>
|
|
<v-list>
|
|
<v-list-item
|
|
v-for="org in organizations"
|
|
:key="org.id"
|
|
:active="org.id === selectedOrgId"
|
|
@click="selectOrganization(org.id)"
|
|
>
|
|
<v-list-item-title>
|
|
<v-icon v-if="org.id === selectedOrgId" start size="small">mdi-check</v-icon>
|
|
{{ org.name }}
|
|
</v-list-item-title>
|
|
<template #append>
|
|
<v-chip size="small" variant="tonal">
|
|
{{ org.apiKeys?.length || 0 }} keys
|
|
</v-chip>
|
|
</template>
|
|
</v-list-item>
|
|
</v-list>
|
|
</v-menu>
|
|
<v-chip v-else-if="organizations.length === 1" variant="outlined" prepend-icon="mdi-domain">
|
|
{{ organizations[0].name }}
|
|
</v-chip>
|
|
</template>
|
|
|
|
<script setup lang="ts">
|
|
import { useOrganizationSelector } from '~/composables/useOrganizationSelector'
|
|
|
|
const { organizations, selectedOrganization, selectedOrgId, selectOrganization } = useOrganizationSelector()
|
|
</script>
|