@korajs/auth 1.0.0-beta.12 → 1.0.0-beta.13

package/src/vue/org-hooks.ts

@@ -0,0 +1,193 @@
+import { onScopeDispose, reactive, readonly, ref, watch } from 'vue'
+import {
+	type OrgSnapshot,
+	createOrgMembersActions,
+	loadOrgMembers,
+} from '../bindings/create-org-session'
+import type { ClientInvitation, ClientMembership, ClientOrganization } from '../client/org-client'
+import { useOrgContext } from './org-provider'
+
+export interface UseOrgResult {
+	org: ClientOrganization | null
+	role: string | null
+	orgId: string | null
+	switchOrg: (orgId: string) => Promise<void>
+	createOrg: (params: { name: string; slug?: string }) => Promise<ClientOrganization>
+	leaveOrg: () => Promise<void>
+	clearOrg: () => void
+	listOrgs: () => Promise<ClientOrganization[]>
+	error: string | null
+}
+
+export interface UseOrgMembersResult {
+	members: ClientMembership[]
+	isLoading: boolean
+	refresh: () => Promise<void>
+	invite: (email: string, role: string) => Promise<ClientInvitation>
+	removeMember: (userId: string) => Promise<void>
+	updateRole: (userId: string, role: string) => Promise<void>
+	error: string | null
+}
+
+function useOrgSnapshot(session: ReturnType<typeof useOrgContext>['session']): OrgSnapshot {
+	const state = reactive({ ...session.getSnapshot() })
+
+	const sync = (): void => {
+		Object.assign(state, session.getSnapshot())
+	}
+
+	const unsubscribe = session.subscribe(sync)
+	sync()
+
+	onScopeDispose(unsubscribe)
+
+	return state
+}
+
+export function useOrg(): UseOrgResult {
+	const { client, session } = useOrgContext()
+	const snapshot = useOrgSnapshot(session)
+	const error = ref<string | null>(null)
+
+	const switchOrg = async (orgId: string): Promise<void> => {
+		error.value = null
+		try {
+			await client.switchOrg(orgId)
+		} catch (err) {
+			error.value = err instanceof Error ? err.message : String(err)
+		}
+	}
+
+	const createOrg = async (params: {
+		name: string
+		slug?: string
+	}): Promise<ClientOrganization> => {
+		error.value = null
+		try {
+			return await client.createOrg(params)
+		} catch (err) {
+			const message = err instanceof Error ? err.message : String(err)
+			error.value = message
+			throw err
+		}
+	}
+
+	const leaveOrg = async (): Promise<void> => {
+		if (!snapshot.orgId) return
+		error.value = null
+		try {
+			await client.leaveOrg(snapshot.orgId)
+		} catch (err) {
+			error.value = err instanceof Error ? err.message : String(err)
+		}
+	}
+
+	const clearOrg = (): void => {
+		client.clearActiveOrg()
+	}
+
+	const listOrgs = async (): Promise<ClientOrganization[]> => {
+		try {
+			return await client.listOrgs()
+		} catch (err) {
+			error.value = err instanceof Error ? err.message : String(err)
+			return []
+		}
+	}
+
+	return {
+		get org() {
+			return snapshot.org
+		},
+		get role() {
+			return snapshot.role
+		},
+		get orgId() {
+			return snapshot.orgId
+		},
+		switchOrg,
+		createOrg,
+		leaveOrg,
+		clearOrg,
+		listOrgs,
+		get error() {
+			return error.value
+		},
+	}
+}
+
+export function useOrgMembers(orgId: string): UseOrgMembersResult {
+	const { client } = useOrgContext()
+	const members = ref<ClientMembership[]>([])
+	const isLoading = ref(true)
+	const error = ref<string | null>(null)
+
+	const refresh = async (): Promise<void> => {
+		isLoading.value = true
+		error.value = null
+		try {
+			members.value = await loadOrgMembers(client, orgId)
+		} catch (err) {
+			error.value = err instanceof Error ? err.message : String(err)
+		} finally {
+			isLoading.value = false
+		}
+	}
+
+	watch(
+		() => orgId,
+		() => {
+			void refresh()
+		},
+		{ immediate: true },
+	)
+
+	const actions = createOrgMembersActions(client, orgId, (message) => {
+		error.value = message
+	})
+
+	const invite = async (email: string, role: string): Promise<ClientInvitation> => {
+		const result = await actions.invite(email, role)
+		await refresh()
+		return result
+	}
+
+	const removeMember = async (userId: string): Promise<void> => {
+		await actions.removeMember(userId)
+		await refresh()
+	}
+
+	const updateRole = async (userId: string, role: string): Promise<void> => {
+		await actions.updateRole(userId, role)
+		await refresh()
+	}
+
+	return {
+		get members() {
+			return members.value
+		},
+		get isLoading() {
+			return isLoading.value
+		},
+		refresh,
+		invite,
+		removeMember,
+		updateRole,
+		get error() {
+			return error.value
+		},
+	}
+}
+
+export function usePermission(requiredRole: string): Readonly<{ value: boolean }> {
+	const { session } = useOrgContext()
+	const allowed = ref(session.checkPermission(requiredRole))
+
+	const unsubscribe = session.subscribe(() => {
+		allowed.value = session.checkPermission(requiredRole)
+	})
+
+	onScopeDispose(unsubscribe)
+
+	return readonly(allowed)
+}

package/src/vue/org-provider.ts

@@ -0,0 +1,49 @@
+import type { InjectionKey } from 'vue'
+import type { PropType } from 'vue'
+import { defineComponent, inject, onScopeDispose, provide } from 'vue'
+import { type OrgSession, createOrgSession } from '../bindings/create-org-session'
+import type { OrgClient } from '../client/org-client'
+
+export interface OrgContextValue {
+	client: OrgClient
+	session: OrgSession
+}
+
+export const orgContextKey: InjectionKey<OrgContextValue> = Symbol('korajs-org-context')
+
+export const OrgProvider = defineComponent({
+	name: 'OrgProvider',
+	props: {
+		client: {
+			type: Object as PropType<OrgClient>,
+			required: true,
+		},
+	},
+	setup(props, { slots }) {
+		const session = createOrgSession(props.client)
+
+		onScopeDispose(() => {
+			session.destroy()
+		})
+
+		const contextValue: OrgContextValue = {
+			client: props.client,
+			session,
+		}
+
+		provide(orgContextKey, contextValue)
+
+		return () => slots.default?.()
+	},
+})
+
+export function useOrgContext(): OrgContextValue {
+	const context = inject(orgContextKey)
+	if (!context) {
+		throw new Error(
+			'useOrg / useOrgMembers / usePermission must be used within an <OrgProvider>. ' +
+				'Wrap your component tree with <OrgProvider :client="orgClient">.',
+		)
+	}
+	return context
+}

package/src/vue/use-auth.ts

@@ -0,0 +1,139 @@
+import { computed, onScopeDispose, reactive } from 'vue'
+import type {
+	AuthUser,
+	LinkedOAuthAccount,
+	OAuthAuthorizationOptions,
+	OAuthAuthorizationResult,
+	OAuthCallbackParams,
+} from '../client/auth-client'
+import { useAuthContext } from './auth-provider'
+
+export interface UseAuthResult {
+	user: AuthUser | null
+	isAuthenticated: boolean
+	isLoading: boolean
+	signUp: (params: {
+		email: string
+		password: string
+		name?: string
+		deviceId?: string
+		devicePublicKey?: string
+	}) => Promise<void>
+	signIn: (params: {
+		email: string
+		password: string
+		deviceId?: string
+		devicePublicKey?: string
+	}) => Promise<void>
+	signInWithOAuth: (
+		provider: string,
+		options?: OAuthAuthorizationOptions,
+	) => Promise<OAuthAuthorizationResult>
+	completeOAuthSignIn: (provider: string, params: OAuthCallbackParams) => Promise<void>
+	getOAuthAuthorizationUrl: (
+		provider: string,
+		options?: OAuthAuthorizationOptions,
+	) => Promise<OAuthAuthorizationResult>
+	linkOAuth: (provider: string, params: OAuthCallbackParams) => Promise<LinkedOAuthAccount | null>
+	listLinkedAccounts: () => Promise<LinkedOAuthAccount[]>
+	unlinkOAuth: (provider: string) => Promise<void>
+	signOut: () => Promise<void>
+	error: string | null
+}
+
+export interface AuthStatus {
+	state: import('../client/auth-client').AuthState
+	isAuthenticated: boolean
+	isLoading: boolean
+}
+
+export function useAuth(): UseAuthResult {
+	const { session } = useAuthContext()
+	const state = reactive({ ...session.getSnapshot() })
+
+	const sync = (): void => {
+		Object.assign(state, session.getSnapshot())
+	}
+
+	const unsubscribe = session.subscribe(sync)
+	sync()
+
+	onScopeDispose(unsubscribe)
+
+	return {
+		get user() {
+			return state.user
+		},
+		get isAuthenticated() {
+			return state.isAuthenticated
+		},
+		get isLoading() {
+			return state.isLoading
+		},
+		get error() {
+			return state.error
+		},
+		signUp: (params) => session.signUp(params).then(sync),
+		signIn: (params) => session.signIn(params).then(sync),
+		signInWithOAuth: (provider, options) =>
+			session.signInWithOAuth(provider, options).then((result) => {
+				sync()
+				return result
+			}),
+		completeOAuthSignIn: (provider, params) =>
+			session.completeOAuthSignIn(provider, params).then(sync),
+		getOAuthAuthorizationUrl: (provider, options) =>
+			session.getOAuthAuthorizationUrl(provider, options).then((result) => {
+				sync()
+				return result
+			}),
+		linkOAuth: (provider, params) =>
+			session.linkOAuth(provider, params).then((result) => {
+				sync()
+				return result
+			}),
+		listLinkedAccounts: () =>
+			session.listLinkedAccounts().then((result) => {
+				sync()
+				return result
+			}),
+		unlinkOAuth: (provider) => session.unlinkOAuth(provider).then(sync),
+		signOut: () => session.signOut().then(sync),
+	}
+}
+
+export function useCurrentUser() {
+	const { session } = useAuthContext()
+	const state = reactive({ user: session.getSnapshot().user })
+
+	const sync = (): void => {
+		state.user = session.getSnapshot().user
+	}
+
+	const unsubscribe = session.subscribe(sync)
+	onScopeDispose(unsubscribe)
+
+	return computed(() => state.user)
+}
+
+export function useAuthStatus(): AuthStatus {
+	const { session } = useAuthContext()
+	const state = reactive({
+		state: session.getSnapshot().state,
+		isAuthenticated: session.getSnapshot().isAuthenticated,
+		isLoading: session.getSnapshot().isLoading,
+	})
+
+	const sync = (): void => {
+		const snapshot = session.getSnapshot()
+		state.state = snapshot.state
+		state.isAuthenticated = snapshot.isAuthenticated
+		state.isLoading = snapshot.isLoading
+	}
+
+	const unsubscribe = session.subscribe(sync)
+	sync()
+	onScopeDispose(unsubscribe)
+
+	return state
+}

package/src/vue.ts

@@ -0,0 +1,10 @@
+export { AuthProvider, useAuthContext } from './vue/auth-provider'
+export type { AuthProviderProps } from './vue/auth-provider-types'
+export { useAuth, useCurrentUser, useAuthStatus } from './vue/use-auth'
+export type { UseAuthResult, AuthStatus } from './vue/use-auth'
+export { authContextKey } from './vue/auth-context'
+export type { AuthContextValue } from './vue/auth-context'
+export { OrgProvider, useOrgContext } from './vue/org-provider'
+export type { OrgContextValue } from './vue/org-provider'
+export { useOrg, useOrgMembers, usePermission } from './vue/org-hooks'
+export type { UseOrgResult, UseOrgMembersResult } from './vue/org-hooks'