feat: initial schemas-app implementation
- 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>
This commit is contained in:
@@ -0,0 +1,60 @@
|
||||
import { useAuth0 } from '@auth0/auth0-vue'
|
||||
import { computed, ref, watch } from 'vue'
|
||||
|
||||
import { useOrganizationsQuery } from '~/graphql/generated'
|
||||
|
||||
const selectedOrgId = ref<string | null>(null)
|
||||
|
||||
export const useOrganizationSelector = () => {
|
||||
const auth0 = useAuth0()
|
||||
|
||||
// Fetch user's organizations
|
||||
const { result, loading, error, refetch } = useOrganizationsQuery(() => ({
|
||||
skip: !auth0.isAuthenticated.value,
|
||||
}))
|
||||
|
||||
// Get list of organizations
|
||||
const organizations = computed(() => {
|
||||
return result.value?.organizations || []
|
||||
})
|
||||
|
||||
// Get currently selected organization
|
||||
const selectedOrganization = computed(() => {
|
||||
if (!selectedOrgId.value) return null
|
||||
return organizations.value.find(org => org.id === selectedOrgId.value) || null
|
||||
})
|
||||
|
||||
// Auto-select first organization if none selected
|
||||
watch(organizations, (orgs) => {
|
||||
if (orgs.length > 0 && !selectedOrgId.value) {
|
||||
// Try to restore from localStorage
|
||||
const saved = localStorage.getItem('selectedOrgId')
|
||||
if (saved && orgs.find(o => o.id === saved)) {
|
||||
selectedOrgId.value = saved
|
||||
} else {
|
||||
selectedOrgId.value = orgs[0].id
|
||||
}
|
||||
}
|
||||
}, { immediate: true })
|
||||
|
||||
// Save selection to localStorage
|
||||
watch(selectedOrgId, (newId) => {
|
||||
if (newId) {
|
||||
localStorage.setItem('selectedOrgId', newId)
|
||||
}
|
||||
})
|
||||
|
||||
const selectOrganization = (orgId: string) => {
|
||||
selectedOrgId.value = orgId
|
||||
}
|
||||
|
||||
return {
|
||||
organizations,
|
||||
selectedOrganization,
|
||||
selectedOrgId: computed(() => selectedOrgId.value),
|
||||
selectOrganization,
|
||||
loading: loading || ref(false),
|
||||
error: error || ref(null),
|
||||
refetch,
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user