@alepha/react 0.9.2 → 0.9.4

package/src/providers/BrowserRouterProvider.ts

@@ -1,146 +0,0 @@
-import { $hook, $inject, $logger, Alepha } from "@alepha/core";
-import { type Route, RouterProvider } from "@alepha/router";
-import { createElement, type ReactNode } from "react";
-import NotFoundPage from "../components/NotFound.tsx";
-import {
-	isPageRoute,
-	PageDescriptorProvider,
-	type PageReactContext,
-	type PageRequest,
-	type PageRoute,
-	type PageRouteEntry,
-	type RouterRenderResult,
-	type RouterState,
-	type TransitionOptions,
-} from "./PageDescriptorProvider.ts";
-
-export interface BrowserRoute extends Route {
-	page: PageRoute;
-}
-
-export class BrowserRouterProvider extends RouterProvider<BrowserRoute> {
-	protected readonly log = $logger();
-	protected readonly alepha = $inject(Alepha);
-	protected readonly pageDescriptorProvider = $inject(PageDescriptorProvider);
-
-	public add(entry: PageRouteEntry) {
-		this.pageDescriptorProvider.add(entry);
-	}
-
-	protected readonly configure = $hook({
-		on: "configure",
-		handler: async () => {
-			for (const page of this.pageDescriptorProvider.getPages()) {
-				// mount only if a view is provided
-				if (page.component || page.lazy) {
-					this.push({
-						path: page.match,
-						page,
-					});
-				}
-			}
-		},
-	});
-
-	public async transition(
-		url: URL,
-		options: TransitionOptions = {},
-	): Promise<RouterRenderResult> {
-		const { pathname, search } = url;
-		const state: RouterState = {
-			pathname,
-			search,
-			layers: [],
-		};
-
-		const context = {
-			url,
-			query: {},
-			params: {},
-			onError: () => null,
-			...(options.context ?? {}),
-		} as PageRequest;
-
-		await this.alepha.emit("react:transition:begin", { state, context });
-
-		try {
-			const previous = options.previous;
-			const { route, params } = this.match(pathname);
-
-			const query: Record<string, string> = {};
-			if (search) {
-				for (const [key, value] of new URLSearchParams(search).entries()) {
-					query[key] = String(value);
-				}
-			}
-
-			context.query = query;
-			context.params = params ?? {};
-			context.previous = previous;
-
-			if (isPageRoute(route)) {
-				const result = await this.pageDescriptorProvider.createLayers(
-					route.page,
-					context,
-				);
-
-				if (result.redirect) {
-					return {
-						redirect: result.redirect,
-						state,
-						context,
-					};
-				}
-
-				state.layers = result.layers;
-			}
-
-			if (state.layers.length === 0) {
-				state.layers.push({
-					name: "not-found",
-					element: createElement(NotFoundPage),
-					index: 0,
-					path: "/",
-				});
-			}
-
-			await this.alepha.emit("react:transition:success", { state, context });
-		} catch (e) {
-			this.log.error(e);
-			state.layers = [
-				{
-					name: "error",
-					element: this.pageDescriptorProvider.renderError(e as Error),
-					index: 0,
-					path: "/",
-				},
-			];
-
-			await this.alepha.emit("react:transition:error", {
-				error: e as Error,
-				state,
-				context,
-			});
-		}
-
-		if (options.state) {
-			options.state.layers = state.layers;
-			options.state.pathname = state.pathname;
-			options.state.search = state.search;
-		}
-
-		await this.alepha.emit("react:transition:end", {
-			state: options.state,
-			context,
-		});
-
-		return {
-			context,
-			state,
-		};
-	}
-
-	public root(state: RouterState, context: PageReactContext): ReactNode {
-		return this.pageDescriptorProvider.root(state, context);
-	}
-}

package/src/providers/ReactBrowserRenderer.ts

@@ -1,93 +0,0 @@
-import { $env, $hook, $inject, $logger, type Static, t } from "@alepha/core";
-import type { ApiLinksResponse } from "@alepha/server";
-import type { Root } from "react-dom/client";
-import { createRoot, hydrateRoot } from "react-dom/client";
-import { BrowserRouterProvider } from "./BrowserRouterProvider.ts";
-import type {
-	PreviousLayerData,
-	TransitionOptions,
-} from "./PageDescriptorProvider.ts";
-import { ReactBrowserProvider } from "./ReactBrowserProvider.ts";
-
-const envSchema = t.object({
-	REACT_ROOT_ID: t.string({ default: "root" }),
-});
-
-declare module "@alepha/core" {
-	interface Env extends Partial<Static<typeof envSchema>> {}
-}
-
-export interface ReactBrowserRendererOptions {
-	scrollRestoration?: "top" | "manual";
-}
-
-// TODO: move to ReactBrowserProvider when it will be removed from server-side imports
-export class ReactBrowserRenderer {
-	protected readonly browserProvider = $inject(ReactBrowserProvider);
-	protected readonly browserRouterProvider = $inject(BrowserRouterProvider);
-	protected readonly env = $env(envSchema);
-	protected readonly log = $logger();
-
-	protected root!: Root;
-
-	public options: ReactBrowserRendererOptions = {
-		scrollRestoration: "top",
-	};
-
-	protected getRootElement() {
-		const root = this.browserProvider.document.getElementById(
-			this.env.REACT_ROOT_ID,
-		);
-		if (root) {
-			return root;
-		}
-
-		const div = this.browserProvider.document.createElement("div");
-		div.id = this.env.REACT_ROOT_ID;
-
-		this.browserProvider.document.body.prepend(div);
-
-		return div;
-	}
-
-	public readonly ready = $hook({
-		on: "react:browser:render",
-		handler: async ({ state, context, hydration }) => {
-			const element = this.browserRouterProvider.root(state, context);
-
-			if (hydration?.layers) {
-				this.root = hydrateRoot(this.getRootElement(), element);
-				this.log.info("Hydrated root element");
-			} else {
-				this.root ??= createRoot(this.getRootElement());
-				this.root.render(element);
-				this.log.info("Created root element");
-			}
-		},
-	});
-
-	protected readonly onTransitionEnd = $hook({
-		on: "react:transition:end",
-		handler: () => {
-			if (
-				this.options.scrollRestoration === "top" &&
-				typeof window !== "undefined"
-			) {
-				window.scrollTo(0, 0);
-			}
-		},
-	});
-}
-
-// ---------------------------------------------------------------------------------------------------------------------
-
-export interface RouterGoOptions {
-	replace?: boolean;
-	match?: TransitionOptions;
-	params?: Record<string, string>;
-}
-
-export interface ReactHydrationState {
-	layers?: Array<PreviousLayerData>;
-	links?: ApiLinksResponse;
-}