import { useRouteContext } from "@tanstack/react-router"
// @wpr:commerce
import { createProductResource } from "@wp-reactor/commerce"
// @wpr:end
import { createPageResource } from "@wp-reactor/editorial"
import {
	type CacheTimings,
	createGraphQLDriver,
	createPlatform,
} from "@wp-reactor/headless-core"
import type { GraphQLClient } from "graphql-request"
// @wpr:commerce
import {
	productBySlugDocument,
	productsDocument,
} from "@/commerce/api/product.graphql"
// @wpr:end
import { nodeByUriDocument } from "@/editorial/api/node.graphql"
import { createLayoutResource } from "@/layout/api/layout.resource"

export interface CreateAppPlatformInput {
	readClient: GraphQLClient
	locale: "fr" | "en" | "de"
	ssr: boolean
	timings?: CacheTimings
	debug?: boolean
}

export function createAppPlatform({
	readClient,
	locale,
	ssr,
	timings,
	debug,
}: CreateAppPlatformInput) {
	return (
		createPlatform(createGraphQLDriver(readClient, locale), {
			ssr,
			timings,
			debug,
		})
			.use(createPageResource({ document: nodeByUriDocument }))
			// @wpr:commerce
			.use(
				createProductResource({
					bySlugDocument: productBySlugDocument,
					listDocument: productsDocument,
				}),
			)
			// @wpr:end
			.use(createLayoutResource())
	)
	// @gen:resource:platform
}

export type AppPlatform = ReturnType<typeof createAppPlatform>

// La plateforme est injectée dans le contexte router (cf. `router.tsx`) ; ces
// hooks sont l'équivalent nommé de `useRouteContext({ from: "__root__", … })`.
// Ils vivent dans la COQUE : ils se couplent à l'arbre de routes du client
// (`from: "__root__"`), ce qu'un package framework n'a pas le droit de faire
// (ADR 0001, seam Option B). À réserver aux composants — dans un loader, lis
// `context.platform` directement.

/** Accède à la plateforme complète depuis un composant. */
export function usePlatform(): AppPlatform {
	return useRouteContext({
		from: "__root__",
		select: (context) => context.platform,
	})
}

/**
 * Sélectionne une partie de la plateforme (un namespace, une méthode). Le
 * composant ne re-render que si la valeur sélectionnée change.
 *
 *     const menusQueryOptions = usePlatformResource((p) => p.layout.menusQueryOptions)
 */
export function usePlatformResource<T>(
	select: (platform: AppPlatform) => T,
): T {
	return useRouteContext({
		from: "__root__",
		select: (context) => select(context.platform),
	})
}