router tweaks

Author: brenelz

src/data/createAsync.ts

@@ -1,18 +1,4 @@
-/**
- * Wrapper around Solid 2.0 async createMemo.
- *
- * In Solid 2.0, createMemo can return a Promise and the reactive graph
- * handles suspension automatically.  `createAsync` is therefore a thin
- * wrapper that feeds the user-supplied async function into createMemo
- * and exposes a `.latest` convenience property.
- */
-import { createMemo, latest as solidLatest } from "solid-js";
-import { isServer } from "@solidjs/web";
-
-export type AccessorWithLatest<T> = {
-  (): T;
-  latest: T;
-};
+import { createMemo } from "solid-js";
 
 /** Options for store reconciliation in Solid 2.0 */
 export interface ReconcileOptions {
@@ -27,35 +13,24 @@ export function createAsync<T>(
     initialValue: T;
     deferStream?: boolean;
   }
-): AccessorWithLatest<T>;
+): () => T;
 export function createAsync<T>(
   fn: (prev: T | undefined) => Promise<T>,
   options?: {
     name?: string;
     initialValue?: T;
     deferStream?: boolean;
   }
-): AccessorWithLatest<T | undefined>;
+): () => T | undefined;
 export function createAsync<T>(
   fn: (prev: T | undefined) => Promise<T>,
   options?: {
     name?: string;
     initialValue?: T;
     deferStream?: boolean;
   }
-): AccessorWithLatest<T | undefined> {
-  // In Solid 2.0, createMemo natively handles Promises.
-  // The memo suspends until the promise resolves; <Loading> catches it.
-  const memo = createMemo(() => fn(undefined));
-
-  const resultAccessor: AccessorWithLatest<T> = (() => memo()) as any;
-  Object.defineProperty(resultAccessor, "latest", {
-    get() {
-      return solidLatest(memo);
-    }
-  });
-
-  return resultAccessor;
+): () => T | undefined {
+  return createMemo(() => fn(undefined)) as () => T | undefined;
 }
 
 export function createAsyncStore<T>(
@@ -66,7 +41,7 @@ export function createAsyncStore<T>(
     deferStream?: boolean;
     reconcile?: ReconcileOptions;
   }
-): AccessorWithLatest<T>;
+): () => T;
 export function createAsyncStore<T>(
   fn: (prev: T | undefined) => Promise<T>,
   options?: {
@@ -75,7 +50,7 @@ export function createAsyncStore<T>(
     deferStream?: boolean;
     reconcile?: ReconcileOptions;
   }
-): AccessorWithLatest<T | undefined>;
+): () => T | undefined;
 export function createAsyncStore<T>(
   fn: (prev: T | undefined) => Promise<T>,
   options: {
@@ -84,17 +59,6 @@ export function createAsyncStore<T>(
     deferStream?: boolean;
     reconcile?: ReconcileOptions;
   } = {}
-): AccessorWithLatest<T | undefined> {
-  // Derived store form: createStore(fn) in Solid 2.0 creates a projection.
-  // For now, fall back to the same async memo approach.
-  const memo = createMemo(() => fn(undefined));
-
-  const resultAccessor: AccessorWithLatest<T> = (() => memo()) as any;
-  Object.defineProperty(resultAccessor, "latest", {
-    get() {
-      return solidLatest(memo);
-    }
-  });
-
-  return resultAccessor;
+): () => T | undefined {
+  return createMemo(() => fn(undefined)) as () => T | undefined;
 }

src/data/index.ts

@@ -1,4 +1,4 @@
-export { createAsync, createAsyncStore, type AccessorWithLatest } from "./createAsync.js";
+export { createAsync, createAsyncStore } from "./createAsync.js";
 export { action, useSubmission, useSubmissions, useAction, type Action } from "./action.js";
 export { query, revalidate, cache, type CachedFunction } from "./query.js";
 export { redirect, reload, json } from "./response.js";

src/routing.ts

@@ -51,14 +51,24 @@ const MAX_REDIRECTS = 100;
 export const RouterContextObj = createContext<RouterContext>();
 export const RouteContextObj = createContext<RouteContext>();
 
-export const useRouter = () =>
-  invariant(
-    useContext(RouterContextObj),
-    "<A> and 'use' router primitives can be only used inside a Route."
-  );
+export const useRouter = () => {
+  const router = useContext(RouterContextObj);
+  return invariant(router, "<A> and 'use' router primitives can be only used inside a Route.");
+};
 
 let TempRoute: RouteContext | undefined;
-export const useRoute = () => TempRoute || useContext(RouteContextObj) || useRouter().base;
+export const useRoute = () => {
+  if (TempRoute) return TempRoute;
+
+  let route: RouteContext | undefined;
+  try {
+    route = useContext(RouteContextObj);
+  } catch (e) {
+    // In newer Solid versions, useContext throws if no provider and no default value
+  }
+
+  return route || useRouter().base;
+};
 
 export const useResolvedPath = (path: () => string) => {
   const route = useRoute();