@alepha/react 0.13.0 → 0.13.2

package/src/core/{descriptors → primitives}/$page.ts

@@ -1,8 +1,8 @@
 import {
   $inject,
   type Async,
-  createDescriptor,
-  Descriptor,
+  createPrimitive,
+  Primitive,
   KIND,
   type Static,
   type TSchema,
@@ -16,9 +16,9 @@ import type { ReactRouterState } from "../providers/ReactPageProvider.ts";
 import { ReactPageService } from "../services/ReactPageService.ts";
 
 /**
- * Main descriptor for defining a React route in the application.
+ * Main primitive for defining a React route in the application.
  *
- * The $page descriptor is the core building block for creating type-safe, SSR-enabled React routes.
+ * The $page primitive is the core building block for creating type-safe, SSR-enabled React routes.
  * It provides a declarative way to define pages with powerful features:
  *
  * **Routing & Navigation**
@@ -108,17 +108,17 @@ export const $page = <
   TProps extends object = TPropsDefault,
   TPropsParent extends object = TPropsParentDefault,
 >(
-  options: PageDescriptorOptions<TConfig, TProps, TPropsParent>,
-): PageDescriptor<TConfig, TProps, TPropsParent> => {
-  return createDescriptor(
-    PageDescriptor<TConfig, TProps, TPropsParent>,
+  options: PagePrimitiveOptions<TConfig, TProps, TPropsParent>,
+): PagePrimitive<TConfig, TProps, TPropsParent> => {
+  return createPrimitive(
+    PagePrimitive<TConfig, TProps, TPropsParent>,
     options,
   );
 };
 
 // ---------------------------------------------------------------------------------------------------------------------
 
-export interface PageDescriptorOptions<
+export interface PagePrimitiveOptions<
   TConfig extends PageConfigSchema = PageConfigSchema,
   TProps extends object = TPropsDefault,
   TPropsParent extends object = TPropsParentDefault,
@@ -126,7 +126,7 @@ export interface PageDescriptorOptions<
   /**
    * Identifier name for the page. Must be unique.
    *
-   * @default Descriptor key
+   * @default Primitive key
    */
   name?: string;
 
@@ -182,12 +182,12 @@ export interface PageDescriptorOptions<
    * Attach child pages to create nested routes.
    * This will make the page a parent route.
    */
-  children?: Array<PageDescriptor> | (() => Array<PageDescriptor>);
+  children?: Array<PagePrimitive> | (() => Array<PagePrimitive>);
 
   /**
    * Define a parent page for nested routing.
    */
-  parent?: PageDescriptor<PageConfigSchema, TPropsParent, any>;
+  parent?: PagePrimitive<PageConfigSchema, TPropsParent, any>;
 
   can?: () => boolean;
 
@@ -312,11 +312,11 @@ export type ErrorHandler = (
   state: ReactRouterState,
 ) => ReactNode | Redirection | undefined;
 
-export class PageDescriptor<
+export class PagePrimitive<
   TConfig extends PageConfigSchema = PageConfigSchema,
   TProps extends object = TPropsDefault,
   TPropsParent extends object = TPropsParentDefault,
-> extends Descriptor<PageDescriptorOptions<TConfig, TProps, TPropsParent>> {
+> extends Primitive<PagePrimitiveOptions<TConfig, TProps, TPropsParent>> {
   protected readonly reactPageService = $inject(ReactPageService);
 
   protected onInit() {
@@ -341,12 +341,12 @@ export class PageDescriptor<
    * Only valid for server-side rendering, it will throw an error if called on the client-side.
    */
   public async render(
-    options?: PageDescriptorRenderOptions,
-  ): Promise<PageDescriptorRenderResult> {
+    options?: PagePrimitiveRenderOptions,
+  ): Promise<PagePrimitiveRenderResult> {
     return this.reactPageService.render(this.name, options);
   }
 
-  public async fetch(options?: PageDescriptorRenderOptions): Promise<{
+  public async fetch(options?: PagePrimitiveRenderOptions): Promise<{
     html: string;
     response: Response;
   }> {
@@ -364,7 +364,7 @@ export class PageDescriptor<
   }
 }
 
-$page[KIND] = PageDescriptor;
+$page[KIND] = PagePrimitive;
 
 // ---------------------------------------------------------------------------------------------------------------------
 
@@ -377,7 +377,7 @@ export type TPropsDefault = any;
 
 export type TPropsParentDefault = {};
 
-export interface PageDescriptorRenderOptions {
+export interface PagePrimitiveRenderOptions {
   params?: Record<string, string>;
   query?: Record<string, string>;
 
@@ -391,7 +391,7 @@ export interface PageDescriptorRenderOptions {
   hydration?: boolean;
 }
 
-export interface PageDescriptorRenderResult {
+export interface PagePrimitiveRenderResult {
   html: string;
   state: ReactRouterState;
   redirect?: string;

package/src/core/providers/ReactBrowserProvider.ts

@@ -84,7 +84,7 @@ export class ReactBrowserProvider {
   };
 
   public get state(): ReactRouterState {
-    return this.alepha.state.get("alepha.react.router.state")!;
+    return this.alepha.store.get("alepha.react.router.state")!;
   }
 
   /**
@@ -262,7 +262,7 @@ export class ReactBrowserProvider {
         // low budget, but works for now
         for (const [key, value] of Object.entries(hydration)) {
           if (key !== "layers") {
-            this.alepha.state.set(key as keyof State, value);
+            this.alepha.store.set(key as keyof State, value);
           }
         }
       }

package/src/core/providers/ReactBrowserRouterProvider.ts

@@ -63,7 +63,7 @@ export class ReactBrowserRouterProvider extends RouterProvider<BrowserRoute> {
       type: "transition",
     });
     await this.alepha.events.emit("react:transition:begin", {
-      previous: this.alepha.state.get("alepha.react.router.state")!,
+      previous: this.alepha.store.get("alepha.react.router.state")!,
       state,
     });
 
@@ -135,7 +135,7 @@ export class ReactBrowserRouterProvider extends RouterProvider<BrowserRoute> {
       }
     }
 
-    this.alepha.state.set("alepha.react.router.state", state);
+    this.alepha.store.set("alepha.react.router.state", state);
 
     await this.alepha.events.emit("react:action:end", {
       type: "transition",

package/src/core/providers/ReactPageProvider.ts

@@ -19,9 +19,9 @@ import { RouterLayerContext } from "../contexts/RouterLayerContext.ts";
 import {
   $page,
   type ErrorHandler,
-  type PageDescriptor,
-  type PageDescriptorOptions,
-} from "../descriptors/$page.ts";
+  type PagePrimitive,
+  type PagePrimitiveOptions,
+} from "../primitives/$page.ts";
 import { Redirection } from "../errors/Redirection.ts";
 
 const envSchema = t.object({
@@ -42,12 +42,14 @@ export class ReactPageProvider {
     return this.pages;
   }
 
-  public getConcretePages(): PageRoute[] {
-    const pages: PageRoute[] = [];
+  public getConcretePages(): ConcretePageRoute[] {
+    const pages: ConcretePageRoute[] = [];
     for (const page of this.pages) {
       if (page.children && page.children.length > 0) {
         continue;
       }
+
+      // check if the page has dynamic params
       const fullPath = this.pathname(page.name);
       if (fullPath.includes(":") || fullPath.includes("*")) {
         if (typeof page.static === "object") {
@@ -60,6 +62,7 @@ export class ReactPageProvider {
                 pages.push({
                   ...page,
                   name: params[Object.keys(params)[0]],
+                  staticName: page.name,
                   path,
                   ...entry,
                 });
@@ -70,6 +73,7 @@ export class ReactPageProvider {
 
         continue;
       }
+
       pages.push(page);
     }
     return pages;
@@ -481,9 +485,9 @@ export class ReactPageProvider {
     on: "configure",
     handler: () => {
       let hasNotFoundHandler = false;
-      const pages = this.alepha.descriptors($page);
+      const pages = this.alepha.primitives($page);
 
-      const hasParent = (it: PageDescriptor) => {
+      const hasParent = (it: PagePrimitive) => {
         if (it.options.parent) {
           return true;
         }
@@ -529,8 +533,8 @@ export class ReactPageProvider {
   });
 
   protected map(
-    pages: Array<PageDescriptor>,
-    target: PageDescriptor,
+    pages: Array<PagePrimitive>,
+    target: PagePrimitive,
   ): PageRouteEntry {
     const children = target.options.children
       ? Array.isArray(target.options.children)
@@ -538,7 +542,7 @@ export class ReactPageProvider {
         : target.options.children()
       : [];
 
-    const getChildrenFromParent = (it: PageDescriptor): PageDescriptor[] => {
+    const getChildrenFromParent = (it: PagePrimitive): PagePrimitive[] => {
       const children = [];
       for (const page of pages) {
         if (page.options.parent === it) {
@@ -613,10 +617,20 @@ export const isPageRoute = (it: any): it is PageRoute => {
 };
 
 export interface PageRouteEntry
-  extends Omit<PageDescriptorOptions, "children" | "parent"> {
+  extends Omit<PagePrimitiveOptions, "children" | "parent"> {
   children?: PageRouteEntry[];
 }
 
+export interface ConcretePageRoute extends PageRoute {
+  /**
+   * When exported, static routes can be split into multiple pages with different params.
+   * We replace 'name' by the new name for each static entry, and old 'name' becomes 'staticName'.
+   */
+  staticName?: string;
+
+  params?: Record<string, string>;
+}
+
 export interface PageRoute extends PageRouteEntry {
   type: "page";
   name: string;

package/src/core/providers/ReactServerProvider.ts

@@ -23,9 +23,9 @@ import { ServerStaticProvider } from "alepha/server/static";
 import { renderToString } from "react-dom/server";
 import {
   $page,
-  type PageDescriptorRenderOptions,
-  type PageDescriptorRenderResult,
-} from "../descriptors/$page.ts";
+  type PagePrimitiveRenderOptions,
+  type PagePrimitiveRenderResult,
+} from "../primitives/$page.ts";
 import { Redirection } from "../errors/Redirection.ts";
 import type { ReactHydrationState } from "./ReactBrowserProvider.ts";
 import {
@@ -112,12 +112,12 @@ export class ReactServerProvider {
   public readonly onConfigure = $hook({
     on: "configure",
     handler: async () => {
-      const pages = this.alepha.descriptors($page);
+      const pages = this.alepha.primitives($page);
 
       const ssrEnabled =
         pages.length > 0 && this.env.REACT_SSR_ENABLED !== false;
 
-      this.alepha.state.set("alepha.react.server.ssr", ssrEnabled);
+      this.alepha.store.set("alepha.react.server.ssr", ssrEnabled);
 
       // development mode
       if (this.alepha.isViteDev()) {
@@ -192,7 +192,7 @@ export class ReactServerProvider {
 
       this.serverRouterProvider.createRoute({
         ...page,
-        schema: undefined, // schema is handled by the page descriptor provider for now (shared by browser and server)
+        schema: undefined, // schema is handled by the page primitive provider for now (shared by browser and server)
         method: "GET",
         path: page.match,
         handler: this.createHandler(page, templateLoader),
@@ -257,8 +257,8 @@ export class ReactServerProvider {
    */
   public async render(
     name: string,
-    options: PageDescriptorRenderOptions = {},
-  ): Promise<PageDescriptorRenderResult> {
+    options: PagePrimitiveRenderOptions = {},
+  ): Promise<PagePrimitiveRenderResult> {
     const page = this.pageApi.page(name);
     const url = new URL(this.pageApi.url(name, options));
     const entry: Partial<ReactRouterState> = {
@@ -289,7 +289,7 @@ export class ReactServerProvider {
     }
 
     if (!options.html) {
-      this.alepha.state.set("alepha.react.router.state", state);
+      this.alepha.store.set("alepha.react.router.state", state);
 
       return {
         state,
@@ -340,7 +340,7 @@ export class ReactServerProvider {
       const state = entry as ReactRouterState;
 
       if (this.alepha.has(ServerLinksProvider)) {
-        this.alepha.state.set(
+        this.alepha.store.set(
           "alepha.server.request.apiLinks",
           await this.alepha.inject(ServerLinksProvider).getUserApiLinks({
             user: (serverRequest as any).user, // TODO: fix type
@@ -349,7 +349,7 @@ export class ReactServerProvider {
         );
       }
 
-      let target: PageRoute | undefined = route; // TODO: move to PageDescriptorProvider
+      let target: PageRoute | undefined = route; // TODO: move to PagePrimitiveProvider
       while (target) {
         if (route.can && !route.can()) {
           // if the page is not accessible, return 403
@@ -431,7 +431,7 @@ export class ReactServerProvider {
     const element = this.pageApi.root(state);
 
     // attach react router state to the http request context
-    this.alepha.state.set("alepha.react.router.state", state);
+    this.alepha.store.set("alepha.react.router.state", state);
 
     this.serverTimingProvider.beginTiming("renderToString");
     let app = "";

package/src/core/services/ReactPageServerService.ts

@@ -1,9 +1,9 @@
 import { $inject, AlephaError } from "alepha";
 import { ServerProvider } from "alepha/server";
 import type {
-  PageDescriptorRenderOptions,
-  PageDescriptorRenderResult,
-} from "../descriptors/$page.ts";
+  PagePrimitiveRenderOptions,
+  PagePrimitiveRenderResult,
+} from "../primitives/$page.ts";
 import { ReactServerProvider } from "../providers/ReactServerProvider.ts";
 import { ReactPageService } from "./ReactPageService.ts";
 
@@ -13,14 +13,14 @@ export class ReactPageServerService extends ReactPageService {
 
   public async render(
     name: string,
-    options: PageDescriptorRenderOptions = {},
-  ): Promise<PageDescriptorRenderResult> {
+    options: PagePrimitiveRenderOptions = {},
+  ): Promise<PagePrimitiveRenderResult> {
     return this.reactServerProvider.render(name, options);
   }
 
   public async fetch(
     pathname: string,
-    options: PageDescriptorRenderOptions = {},
+    options: PagePrimitiveRenderOptions = {},
   ): Promise<{
     html: string;
     response: Response;

package/src/core/services/ReactPageService.ts

@@ -1,13 +1,13 @@
 import { AlephaError } from "alepha";
 import type {
-  PageDescriptorRenderOptions,
-  PageDescriptorRenderResult,
-} from "../descriptors/$page.ts";
+  PagePrimitiveRenderOptions,
+  PagePrimitiveRenderResult,
+} from "../primitives/$page.ts";
 
 export class ReactPageService {
   public fetch(
     pathname: string,
-    options: PageDescriptorRenderOptions = {},
+    options: PagePrimitiveRenderOptions = {},
   ): Promise<{
     html: string;
     response: Response;
@@ -17,8 +17,8 @@ export class ReactPageService {
 
   public render(
     name: string,
-    options: PageDescriptorRenderOptions = {},
-  ): Promise<PageDescriptorRenderResult> {
+    options: PagePrimitiveRenderOptions = {},
+  ): Promise<PagePrimitiveRenderResult> {
     throw new AlephaError("Render is not available for this environment.");
   }
 }

package/src/core/services/ReactRouter.ts

@@ -1,5 +1,5 @@
 import { $inject, Alepha } from "alepha";
-import type { PageDescriptor } from "../descriptors/$page.ts";
+import type { PagePrimitive } from "../primitives/$page.ts";
 import {
   ReactBrowserProvider,
   type RouterGoOptions,
@@ -15,7 +15,7 @@ export class ReactRouter<T extends object> {
   protected readonly pageApi = $inject(ReactPageProvider);
 
   public get state(): ReactRouterState {
-    return this.alepha.state.get("alepha.react.router.state")!;
+    return this.alepha.store.get("alepha.react.router.state")!;
   }
 
   public get pages() {
@@ -220,5 +220,5 @@ export class ReactRouter<T extends object> {
 }
 
 export type VirtualRouter<T> = {
-  [K in keyof T as T[K] extends PageDescriptor ? K : never]: T[K];
+  [K in keyof T as T[K] extends PagePrimitive ? K : never]: T[K];
 };

package/src/head/index.browser.ts

@@ -1,11 +1,11 @@
 import { AlephaReact } from "@alepha/react";
 import { $module } from "alepha";
-import { $head } from "./descriptors/$head.ts";
+import { $head } from "./primitives/$head.ts";
 import { BrowserHeadProvider } from "./providers/BrowserHeadProvider.ts";
 
 // ---------------------------------------------------------------------------------------------------------------------
 
-export * from "./descriptors/$head.ts";
+export * from "./primitives/$head.ts";
 export * from "./hooks/useHead.ts";
 export * from "./interfaces/Head.ts";
 export * from "./providers/BrowserHeadProvider.ts";
@@ -20,6 +20,6 @@ export * from "./providers/BrowserHeadProvider.ts";
  */
 export const AlephaReactHead = $module({
   name: "alepha.react.head",
-  descriptors: [$head],
+  primitives: [$head],
   services: [AlephaReact, BrowserHeadProvider],
 });

package/src/head/index.ts

@@ -5,13 +5,13 @@ import {
   type TPropsParentDefault,
 } from "@alepha/react";
 import { $module } from "alepha";
-import { $head } from "./descriptors/$head.ts";
+import { $head } from "./primitives/$head.ts";
 import type { Head } from "./interfaces/Head.ts";
 import { ServerHeadProvider } from "./providers/ServerHeadProvider.ts";
 
 // ---------------------------------------------------------------------------------------------------------------------
 
-export * from "./descriptors/$head.ts";
+export * from "./primitives/$head.ts";
 export * from "./hooks/useHead.ts";
 export * from "./interfaces/Head.ts";
 export * from "./providers/ServerHeadProvider.ts";
@@ -19,7 +19,7 @@ export * from "./providers/ServerHeadProvider.ts";
 // ---------------------------------------------------------------------------------------------------------------------
 
 declare module "@alepha/react" {
-  interface PageDescriptorOptions<
+  interface PagePrimitiveOptions<
     TConfig extends PageConfigSchema = PageConfigSchema,
     TProps extends object = TPropsDefault,
     TPropsParent extends object = TPropsParentDefault,
@@ -42,6 +42,6 @@ declare module "@alepha/react" {
  */
 export const AlephaReactHead = $module({
   name: "alepha.react.head",
-  descriptors: [$head],
+  primitives: [$head],
   services: [AlephaReact, ServerHeadProvider],
 });

package/src/head/{descriptors → primitives}/$head.ts

@@ -1,25 +1,25 @@
-import { $inject, createDescriptor, Descriptor, KIND } from "alepha";
+import { $inject, createPrimitive, Primitive, KIND } from "alepha";
 import type { Head } from "../interfaces/Head.ts";
 import { HeadProvider } from "../providers/HeadProvider.ts";
 
 /**
  * Set global `<head>` options for the application.
  */
-export const $head = (options: HeadDescriptorOptions) => {
-  return createDescriptor(HeadDescriptor, options);
+export const $head = (options: HeadPrimitiveOptions) => {
+  return createPrimitive(HeadPrimitive, options);
 };
 
 // ---------------------------------------------------------------------------------------------------------------------
 
-export type HeadDescriptorOptions = Head | (() => Head);
+export type HeadPrimitiveOptions = Head | (() => Head);
 
 // ---------------------------------------------------------------------------------------------------------------------
 
-export class HeadDescriptor extends Descriptor<HeadDescriptorOptions> {
+export class HeadPrimitive extends Primitive<HeadPrimitiveOptions> {
   protected readonly provider = $inject(HeadProvider);
   protected onInit() {
     this.provider.global = this.options;
   }
 }
 
-$head[KIND] = HeadDescriptor;
+$head[KIND] = HeadPrimitive;

package/src/i18n/hooks/useI18n.ts

@@ -1,5 +1,5 @@
 import { useInject, useStore } from "@alepha/react";
-import type { DictionaryDescriptor } from "../descriptors/$dictionary.ts";
+import type { DictionaryPrimitive } from "../primitives/$dictionary.ts";
 import { I18nProvider } from "../providers/I18nProvider.ts";
 
 /**
@@ -14,5 +14,5 @@ export const useI18n = <
 };
 
 export type ServiceDictionary<T extends object> = {
-  [K in keyof T]: T[K] extends DictionaryDescriptor<infer U> ? U : never;
+  [K in keyof T]: T[K] extends DictionaryPrimitive<infer U> ? U : never;
 };

package/src/i18n/index.ts

@@ -1,12 +1,12 @@
 import { $module } from "alepha";
-import { $dictionary } from "./descriptors/$dictionary.ts";
+import { $dictionary } from "./primitives/$dictionary.ts";
 import { I18nProvider } from "./providers/I18nProvider.ts";
 
 // ---------------------------------------------------------------------------------------------------------------------
 
 export type { LocalizeProps } from "./components/Localize.tsx";
 export { default as Localize } from "./components/Localize.tsx";
-export * from "./descriptors/$dictionary.ts";
+export * from "./primitives/$dictionary.ts";
 export * from "./hooks/useI18n.ts";
 export * from "./providers/I18nProvider.ts";
 
@@ -29,6 +29,6 @@ declare module "alepha" {
  */
 export const AlephaReactI18n = $module({
   name: "alepha.react.i18n",
-  descriptors: [$dictionary],
+  primitives: [$dictionary],
   services: [I18nProvider],
 });

package/src/i18n/{descriptors → primitives}/$dictionary.ts

@@ -1,4 +1,4 @@
-import { $inject, type Async, createDescriptor, Descriptor, KIND } from "alepha";
+import { $inject, type Async, createPrimitive, Primitive, KIND } from "alepha";
 import { I18nProvider } from "../providers/I18nProvider.ts";
 
 /**
@@ -33,14 +33,14 @@ import { I18nProvider } from "../providers/I18nProvider.ts";
  * ```
  */
 export const $dictionary = <T extends Record<string, string>>(
-  options: DictionaryDescriptorOptions<T>,
-): DictionaryDescriptor<T> => {
-  return createDescriptor(DictionaryDescriptor<T>, options);
+  options: DictionaryPrimitiveOptions<T>,
+): DictionaryPrimitive<T> => {
+  return createPrimitive(DictionaryPrimitive<T>, options);
 };
 
 // ---------------------------------------------------------------------------------------------------------------------
 
-export interface DictionaryDescriptorOptions<T extends Record<string, string>> {
+export interface DictionaryPrimitiveOptions<T extends Record<string, string>> {
   lang?: string;
   name?: string;
   lazy: () => Async<{ default: T }>;
@@ -48,9 +48,9 @@ export interface DictionaryDescriptorOptions<T extends Record<string, string>> {
 
 // ---------------------------------------------------------------------------------------------------------------------
 
-export class DictionaryDescriptor<
+export class DictionaryPrimitive<
   T extends Record<string, string>,
-> extends Descriptor<DictionaryDescriptorOptions<T>> {
+> extends Primitive<DictionaryPrimitiveOptions<T>> {
   protected provider = $inject(I18nProvider);
   protected onInit() {
     this.provider.registry.push({
@@ -66,4 +66,4 @@ export class DictionaryDescriptor<
   }
 }
 
-$dictionary[KIND] = DictionaryDescriptor;
+$dictionary[KIND] = DictionaryPrimitive;

package/src/i18n/providers/I18nProvider.ts

@@ -54,7 +54,7 @@ export class I18nProvider<
     on: "server:onRequest",
     priority: "last",
     handler: async ({ request }) => {
-      this.alepha.state.set("alepha.react.i18n.lang", this.cookie.get(request));
+      this.alepha.store.set("alepha.react.i18n.lang", this.cookie.get(request));
     },
   });
 
@@ -65,7 +65,7 @@ export class I18nProvider<
         // get cookie lang
         const cookieLang = this.cookie.get();
         if (cookieLang) {
-          this.alepha.state.set("alepha.react.i18n.lang", cookieLang);
+          this.alepha.store.set("alepha.react.i18n.lang", cookieLang);
         }
 
         for (const item of this.registry) {
@@ -110,7 +110,7 @@ export class I18nProvider<
       this.cookie.set(lang);
     }
 
-    this.alepha.state.set("alepha.react.i18n.lang", lang);
+    this.alepha.store.set("alepha.react.i18n.lang", lang);
     this.refreshLocale();
   };
 
@@ -132,7 +132,7 @@ export class I18nProvider<
         this.refreshLocale();
 
         if (hasChanged) {
-          this.alepha.state.set("alepha.react.i18n.lang", value);
+          this.alepha.store.set("alepha.react.i18n.lang", value);
         }
       }
     },
@@ -140,7 +140,7 @@ export class I18nProvider<
 
   public get lang(): string {
     return (
-      this.alepha.state.get("alepha.react.i18n.lang") ||
+      this.alepha.store.get("alepha.react.i18n.lang") ||
       this.options.fallbackLang
     );
   }

package/src/websocket/hooks/useRoom.tsx

@@ -1,6 +1,6 @@
 import { useAlepha, useInject } from "@alepha/react";
 import type { Static } from "alepha";
-import type { ChannelDescriptor, TWSObject } from "alepha/websocket";
+import type { ChannelPrimitive, TWSObject } from "alepha/websocket";
 import { WebSocketClient } from "alepha/websocket";
 import { useEffect, useRef, useState } from "react";
 
@@ -17,9 +17,9 @@ export interface UseRoomOptions<
   roomId: string;
 
   /**
-   * Channel descriptor defining the schemas
+   * Channel primitive defining the schemas
    */
-  channel: ChannelDescriptor<TClient, TServer>;
+  channel: ChannelPrimitive<TClient, TServer>;
 
   /**
    * Handler for incoming messages from the server