one 1.8.2 → 1.8.3

package/src/router/utils/getNavigateAction.ts

@@ -0,0 +1,123 @@
+import type { NavigationState, PartialRoute } from '@react-navigation/core'
+import { nanoid } from 'nanoid/non-secure'
+import type { OneRouter } from '../../interfaces/router'
+import { setLastAction } from '../lastAction'
+import { matchDynamicName } from '../matchers'
+
+/**
+ * Generates a navigation action to transition from the current state to the desired state.
+ */
+export function getNavigateAction(
+  /** desired state */
+  actionState: OneRouter.ResultState,
+  navigationState: NavigationState,
+  type = 'NAVIGATE'
+) {
+  /**
+   * We need to find the deepest navigator where the action and current state diverge, If they do not diverge, the
+   * lowest navigator is the target.
+   *
+   * By default React Navigation will target the current navigator, but this doesn't work for all actions
+   * For example:
+   *  - /deeply/nested/route -> /top-level-route the target needs to be the top-level navigator
+   *  - /stack/nestedStack/page -> /stack1/nestedStack/other-page needs to target the nestedStack navigator
+   *
+   * This matching needs to done by comparing the route names and the dynamic path, for example
+   * - /1/page -> /2/anotherPage needs to target the /[id] navigator
+   *
+   * Other parameters such as search params and hash are not evaluated.
+   *
+   */
+  let actionStateRoute: PartialRoute<any> | undefined
+
+  // Traverse the state tree comparing the current state and the action state until we find where they diverge
+  while (actionState && navigationState) {
+    const stateRoute = navigationState.routes[navigationState.index]
+
+    actionStateRoute = actionState.routes[actionState.routes.length - 1]
+
+    const childState = actionStateRoute.state
+    const nextNavigationState = stateRoute.state
+
+    const dynamicMatch = matchDynamicName(actionStateRoute.name)
+
+    const didActionAndCurrentStateDiverge =
+      actionStateRoute.name !== stateRoute.name ||
+      // !deepEqual(actionStateRoute.params, stateRoute.params) ||
+      !childState ||
+      !nextNavigationState ||
+      (dynamicMatch &&
+        actionStateRoute.params?.[dynamicMatch.name] !==
+          stateRoute.params?.[dynamicMatch.name])
+
+    if (didActionAndCurrentStateDiverge) {
+      break
+    }
+
+    actionState = childState
+    navigationState = nextNavigationState as NavigationState
+  }
+
+  /*
+   * We found the target navigator, but the payload is in the incorrect format
+   * We need to convert the action state to a payload that can be dispatched
+   */
+  const rootPayload: Record<string, any> = { params: {} }
+  let payload = rootPayload
+  let params = payload.params
+
+  // The root level of payload is a bit weird, its params are in the child object
+  while (actionStateRoute) {
+    Object.assign(params, { ...actionStateRoute.params })
+    payload.screen = actionStateRoute.name
+    payload.params = { ...actionStateRoute.params }
+
+    actionStateRoute =
+      actionStateRoute.state?.routes[actionStateRoute.state?.routes.length - 1]
+
+    payload.params ??= {}
+    payload = payload.params
+    params = payload
+  }
+
+  // One uses only three actions, but these don't directly translate to all navigator actions
+  if (type === 'PUSH') {
+    setLastAction()
+
+    // Only stack navigators have a push action, and even then we want to use NAVIGATE (see below)
+    type = 'NAVIGATE'
+
+    /*
+     * The StackAction.PUSH does not work correctly with One.
+     *
+     * One provides a getId() function for every route, altering how React Navigation handles stack routing.
+     * Ordinarily, PUSH always adds a new screen to the stack. However, with getId() present, it navigates to the screen with the matching ID instead
+     * (by moving the screen to the top of the stack)
+     * When you try and push to a screen with the same ID, no navigation will occur
+     * Refer to: https://github.com/react-navigation/react-navigation/blob/13d4aa270b301faf07960b4cd861ffc91e9b2c46/packages/routers/src/StackRouter.tsx#L279-L290
+     *
+     * One needs to retain the default behavior of PUSH, consistently adding new screens to the stack, even if their IDs are identical.
+     *
+     * To resolve this issue, we switch to using a NAVIGATE action with a new key. In the navigate action, screens are matched by either key or getId() function.
+     * By generating a unique new key, we ensure that the screen is always pushed onto the stack.
+     *
+     */
+    if (navigationState.type === 'stack') {
+      rootPayload.key = `${rootPayload.name}-${nanoid()}` // @see https://github.com/react-navigation/react-navigation/blob/13d4aa270b301faf07960b4cd861ffc91e9b2c46/packages/routers/src/StackRouter.tsx#L406-L407
+    }
+  }
+
+  if (type === 'REPLACE' && navigationState.type === 'tab') {
+    type = 'JUMP_TO'
+  }
+
+  return {
+    type,
+    target: navigationState.key,
+    payload: {
+      key: rootPayload.key,
+      name: rootPayload.screen,
+      params: rootPayload.params,
+    },
+  }
+}

package/src/serve-worker.ts

@@ -0,0 +1,40 @@
+import { Hono } from 'hono'
+import { setServerGlobals } from './server/setServerGlobals'
+import { setupBuildInfo } from './server/setupBuildOptions'
+import { ensureExists } from './utils/ensureExists'
+import type { One } from './vite/types'
+
+// Re-export static HTML fetcher utilities for worker use
+export { getFetchStaticHtml, setFetchStaticHtml } from './server/staticHtmlFetcher'
+
+/**
+ * Lazy import functions for route modules.
+ * Modules are loaded on-demand when a route is matched, not all upfront.
+ */
+export type LazyRoutes = {
+  serverEntry: () => Promise<{ default: { render: (props: any) => any } }>
+  pages: Record<string, () => Promise<any>>
+  api: Record<string, () => Promise<any>>
+  middlewares: Record<string, () => Promise<any>>
+}
+
+/**
+ * Creates a Hono app for edge/worker environments (Cloudflare Workers, etc.)
+ * Static assets should be handled by the platform (e.g., wrangler's [assets] config)
+ * This only sets up the dynamic routes (SSR, API, loaders)
+ *
+ * @param buildInfo - Build configuration and route metadata
+ * @param lazyRoutes - Lazy import functions for route modules (loaded on-demand)
+ */
+export async function serve(buildInfo: One.BuildInfo, lazyRoutes?: LazyRoutes) {
+  setupBuildInfo(buildInfo)
+  ensureExists(buildInfo.oneOptions)
+  setServerGlobals()
+
+  const app = new Hono()
+
+  const { oneServe } = await import('./server/oneServe')
+  await oneServe(buildInfo.oneOptions, buildInfo, app, { lazyRoutes })
+
+  return app
+}

package/src/serve.ts

@@ -0,0 +1,52 @@
+import './polyfills-server'
+
+import FSExtra from 'fs-extra'
+import type { Hono } from 'hono'
+import type { VXRNOptions } from 'vxrn'
+import { setServerGlobals } from './server/setServerGlobals'
+import { setupBuildInfo } from './server/setupBuildOptions'
+import { ensureExists } from './utils/ensureExists'
+import type { One } from './vite/types'
+
+process.on('uncaughtException', (err) => {
+  console.error(`[one] Uncaught exception`, err?.stack || err)
+})
+
+export async function serve(args: VXRNOptions['server'] & { app?: Hono } = {}) {
+  const buildInfo = (await FSExtra.readJSON(`dist/buildInfo.json`)) as One.BuildInfo
+  const { oneOptions } = buildInfo
+
+  setServerGlobals()
+  setupBuildInfo(buildInfo)
+  ensureExists(oneOptions)
+
+  // to avoid loading the CACHE_KEY before we set it use async imports:
+  const { labelProcess } = await import('./cli/label-process')
+  const { removeUndefined } = await import('./utils/removeUndefined')
+  const { loadEnv, serve: vxrnServe, serveStaticAssets } = await import('vxrn/serve')
+  const { oneServe } = await import('./server/oneServe')
+
+  labelProcess('serve')
+
+  if (args.loadEnv) {
+    await loadEnv('production')
+  }
+
+  return await vxrnServe({
+    app: args.app,
+    // fallback to one plugin
+    ...oneOptions.server,
+    // override with any flags given to cli
+    ...removeUndefined({
+      port: args.port ? +args.port : undefined,
+      host: args.host,
+      compress: args.compress,
+    }),
+
+    async beforeRegisterRoutes(options, app) {
+      await oneServe(oneOptions, buildInfo, app, { serveStaticAssets })
+    },
+
+    async afterRegisterRoutes(options, app) {},
+  })
+}

package/src/server/ServerContextScript.tsx

@@ -0,0 +1,55 @@
+import { SERVER_CONTEXT_KEY } from '../constants'
+import { safeJsonStringify } from '../utils/htmlEscape'
+import { SERVER_CONTEXT_POST_RENDER_STRING } from '../vite/constants'
+import { useServerContext } from '../vite/one-server-only'
+
+export function ServerContextScript() {
+  if (process.env.VITE_ENVIRONMENT === 'client') {
+    return (
+      <script
+        async
+        // @ts-expect-error
+        href={SERVER_CONTEXT_KEY}
+        suppressHydrationWarning
+        dangerouslySetInnerHTML={{
+          __html: ``,
+        }}
+      />
+    )
+  }
+
+  if (process.env.VITE_ENVIRONMENT === 'ssr') {
+    const context = useServerContext()
+    const cssUrls = context?.css || []
+
+    // Strip cssContents from JSON payload - we'll read it from DOM instead.
+    // This avoids duplicating 100KB+ of CSS as JSON in the HTML.
+    // The CSSPrehydrateScript reads the actual <style> elements' innerHTML
+    // and stores them in globalThis.__oneCSSContents for hydration matching.
+    const { cssContents, ...restContext } = context || {}
+    const clientContext = {
+      ...restContext,
+      cssInlineCount: cssContents?.length || 0,
+    }
+
+    return (
+      <script
+        async
+        // @ts-expect-error
+        href={SERVER_CONTEXT_KEY}
+        suppressHydrationWarning
+        dangerouslySetInnerHTML={{
+          __html: `
+              globalThis["${SERVER_CONTEXT_KEY}"] = ${safeJsonStringify({
+                ...clientContext,
+                postRenderData: SERVER_CONTEXT_POST_RENDER_STRING,
+              })};
+              globalThis.__oneLoadedCSS = new Set(${safeJsonStringify(cssUrls)});
+          `,
+        }}
+      />
+    )
+  }
+
+  return null
+}

package/src/server/createRoutesManifest.ts

@@ -0,0 +1,45 @@
+import { getRoutes, type Options } from '../router/getRoutes'
+import type { One, RouteInfo } from '../vite/types'
+import { getServerManifest } from './getServerManifest'
+
+export type { Options } from '../router/getRoutes'
+
+export type RouteInfoCompiled = RouteInfo & {
+  compiledRegex: RegExp
+}
+
+export type RoutesManifest<TRegex = string> = {
+  apiRoutes: RouteInfo<TRegex>[]
+  middlewareRoutes: RouteInfo<TRegex>[]
+  pageRoutes: RouteInfo<TRegex>[]
+  allRoutes: RouteInfo<TRegex>[]
+}
+
+function createMockModuleWithContext(map: string[] = []) {
+  const contextModule = (key) => ({ default() {} })
+
+  Object.defineProperty(contextModule, 'keys', {
+    value: () => map,
+  })
+
+  return contextModule as One.RouteContext
+}
+
+export function createRoutesManifest(
+  paths: string[],
+  options: Options
+): RoutesManifest | null {
+  const routeTree = getRoutes(createMockModuleWithContext(paths), {
+    ...options,
+    preserveApiRoutes: true,
+    ignoreRequireErrors: true,
+    ignoreEntryPoints: true,
+    platform: 'web',
+  })
+
+  if (!routeTree) {
+    throw new Error(`No route tree found in paths: ${JSON.stringify(paths)}`)
+  }
+
+  return getServerManifest(routeTree)
+}

package/src/server/getServerManifest.ts

@@ -0,0 +1,334 @@
+/**
+ * Copyright © 2023 Tamagui LLC.
+ * Copyright © 2023 650 Industries.
+ * Copyright © 2023 Vercel, Inc.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ * Based on https://github.com/vercel/next.js/blob/1df2686bc9964f1a86c444701fa5cbf178669833/packages/next/src/shared/lib/router/utils/route-regex.ts
+ */
+
+import { getContextKey, matchGroupName } from '../router/matchers'
+import type { RouteNode } from '../router/Route'
+import { sortRoutes } from '../router/sortRoutes'
+import type { One, RouteInfo } from '../vite/types'
+
+// TODO: Share these types across cli, server, router, etc.
+export type OneRouterServerManifestV1Route<TRegex = string> = RouteInfo & {
+  generated?: boolean
+}
+
+export type OneRouterServerManifestV1<TRegex = string> = {
+  apiRoutes: OneRouterServerManifestV1Route<TRegex>[]
+  middlewareRoutes: OneRouterServerManifestV1Route<TRegex>[]
+  pageRoutes: OneRouterServerManifestV1Route<TRegex>[]
+  allRoutes: OneRouterServerManifestV1Route<TRegex>[]
+}
+
+export interface Group {
+  pos: number
+  repeat: boolean
+  optional: boolean
+}
+
+export interface RouteRegex {
+  groups: Record<string, Group>
+  re: RegExp
+}
+
+function isNotFoundRoute(route: RouteNode) {
+  return Boolean(route.dynamic && route.dynamic[route.dynamic.length - 1].notFound)
+}
+
+// Given a nested route tree, return a flattened array of all routes that can be matched.
+export function getServerManifest(route: RouteNode): OneRouterServerManifestV1 {
+  function getFlatNodes(route: RouteNode, layouts?: RouteNode[]): [string, RouteNode][] {
+    if (route.children.length) {
+      return route.children.flatMap((child) => {
+        return getFlatNodes(child, [...(layouts || []), route])
+      })
+    }
+
+    // API Routes are handled differently to HTML routes because they have no nested behavior.
+    // An HTML route can be different based on parent segments due to layout routes, therefore multiple
+    // copies should be rendered. However, an API route is always the same regardless of parent segments.
+    let key: string
+    if (route.type === 'api') {
+      key = getContextKey(route.contextKey).replace(/\/index$/, '') || '/'
+    } else {
+      const parentSegments = layouts?.flatMap((route) => {
+        const key = getContextKey(route.route).replace(/\/index$/, '') || '/'
+        if (key === '/' || key.startsWith('/(')) {
+          return []
+        }
+        return [key]
+      })
+
+      key =
+        (parentSegments ? parentSegments.join('') : '') +
+          getContextKey(route.route).replace(/\/index$/, '') || '/'
+    }
+
+    return [[key, { ...route, layouts }]]
+  }
+
+  // TODO this could be a lot faster if not functional:
+
+  // Remove duplicates from the runtime manifest which expands array syntax.
+  const flat = getFlatNodes(route)
+    .sort(([, a], [, b]) => sortRoutes(b, a))
+    .reverse()
+
+  // warn on having multiple routes with the same path!
+  const pathToRoute: Record<string, RouteNode> = {}
+  for (const [path, route] of flat) {
+    if (pathToRoute[path]) {
+      console.warn(`\n[one] ❌ Duplicate routes error`)
+      console.warn(
+        `  Multiple routes at the same path! One route will always win over the other.`
+      )
+      console.warn(`    path: ${path}`)
+      console.warn(`    first route: ${pathToRoute[path].contextKey}`)
+      console.warn(`    second route: ${route.contextKey}\n`)
+    }
+    pathToRoute[path] = route
+  }
+
+  const apiRoutes: OneRouterServerManifestV1Route[] = []
+  const middlewareRoutes: OneRouterServerManifestV1Route[] = []
+  const pageRoutes: OneRouterServerManifestV1Route[] = []
+  const allRoutes: OneRouterServerManifestV1Route[] = []
+
+  const addedMiddlewares: Record<string, boolean> = {}
+
+  for (const [path, node] of flat) {
+    if (node.type === 'api') {
+      const route = getGeneratedNamedRouteRegex(path, node)
+      apiRoutes.push(route)
+      allRoutes.push(route)
+      continue
+    }
+
+    if (node.middlewares?.length) {
+      for (const middleware of node.middlewares) {
+        if (!addedMiddlewares[middleware.contextKey]) {
+          addedMiddlewares[middleware.contextKey] = true
+          middlewareRoutes.push(getGeneratedNamedRouteRegex(path, middleware))
+        }
+      }
+    }
+
+    const route = getGeneratedNamedRouteRegex(path, node)
+    pageRoutes.push(route)
+    allRoutes.push(route)
+  }
+
+  return {
+    apiRoutes,
+    middlewareRoutes,
+    pageRoutes,
+    allRoutes,
+  }
+}
+
+function getGeneratedNamedRouteRegex(
+  normalizedRoute: string,
+  node: RouteNode
+): OneRouterServerManifestV1Route {
+  return {
+    ...getRouteEntry(normalizedRoute, node),
+    generated: true,
+    isNotFound: isNotFoundRoute(node),
+  }
+}
+
+function getRouteEntry(
+  normalizedRoute: string,
+  node: RouteNode
+): OneRouterServerManifestV1Route {
+  const result = getPathMeta(normalizedRoute)
+  return {
+    file: node.contextKey,
+    page: getContextKey(node.route),
+    type: node.type,
+    namedRegex: result.namedRegex,
+    urlPath: result.urlPath,
+    urlCleanPath: result.urlCleanPath,
+    routeKeys: result.routeKeys,
+    layouts: node.layouts,
+    middlewares: node.middlewares,
+  }
+}
+
+/**
+ * Builds a function to generate a minimal routeKey using only a-z and minimal
+ * number of characters.
+ */
+function buildGetSafeRouteKey() {
+  let currentCharCode = 96 // Starting one before 'a' to make the increment logic simpler
+  let currentLength = 1
+
+  return () => {
+    let result = ''
+    let incrementNext = true
+
+    // Iterate from right to left to build the key
+    for (let i = 0; i < currentLength; i++) {
+      if (incrementNext) {
+        currentCharCode++
+        if (currentCharCode > 122) {
+          currentCharCode = 97 // Reset to 'a'
+          incrementNext = true // Continue to increment the next character
+        } else {
+          incrementNext = false
+        }
+      }
+      result = String.fromCharCode(currentCharCode) + result
+    }
+
+    // If all characters are 'z', increase the length of the key
+    if (incrementNext) {
+      currentLength++
+      currentCharCode = 96 // This will make the next key start with 'a'
+    }
+
+    return result
+  }
+}
+
+function removeTrailingSlash(route: string): string {
+  return route.replace(/\/$/, '') || '/'
+}
+
+function getPathMeta(route: string) {
+  const segments = removeTrailingSlash(route).slice(1).split('/')
+  const getSafeRouteKey = buildGetSafeRouteKey()
+  const routeKeys: Record<string, string> = {}
+
+  const urlPathParts: Array<{ content: string; type?: 'group' }> = []
+
+  const routeSegments = segments
+    .map((segment, index) => {
+      if (segment === '+not-found' && index === segments.length - 1) {
+        segment = '[...not-found]'
+      }
+
+      if (/^\[.*\]$/.test(segment)) {
+        const { name, optional, repeat } = parseParam(segment)
+        // replace non-word characters since they can break the named regex
+        let cleanedKey = name.replace(/\W/g, '')
+        let invalidKey = false
+
+        // check if the key is still invalid and fallback to using a known safe key
+        if (cleanedKey.length === 0 || cleanedKey.length > 30) {
+          invalidKey = true
+        }
+        if (!Number.isNaN(Number.parseInt(cleanedKey.slice(0, 1), 10))) {
+          invalidKey = true
+        }
+
+        // Prevent duplicates after sanitizing the key
+        if (cleanedKey in routeKeys) {
+          invalidKey = true
+        }
+
+        if (invalidKey) {
+          cleanedKey = getSafeRouteKey()
+        }
+
+        urlPathParts.push({
+          content: repeat ? '/*' : `/:${name}${optional ? '?' : ''}`,
+        })
+        routeKeys[cleanedKey] = name
+
+        return repeat
+          ? optional
+            ? `(?:/(?<${cleanedKey}>.+?))?`
+            : `/(?<${cleanedKey}>.+?)`
+          : `/(?<${cleanedKey}>(?!\\+not-found$)[^/]+?)`
+      }
+
+      if (insideParensRegex.test(segment)) {
+        const groupName = matchGroupName(segment)!
+          .split(',')
+          .map((group) => group.trim())
+          .filter(Boolean)
+
+        urlPathParts.push({ content: `/:${groupName}?`, type: 'group' })
+
+        if (groupName.length > 1) {
+          const optionalSegment = `\\((?:${groupName.map(escapeStringRegexp).join('|')})\\)`
+
+          // Make section optional
+          return `(?:/${optionalSegment})?`
+        }
+
+        // Use simpler regex for single groups
+        return `(?:/${escapeStringRegexp(segment)})?`
+      }
+
+      urlPathParts.push({ content: `/${segment}` })
+
+      return `/${escapeStringRegexp(segment)}`
+    })
+    .join('')
+
+  let urlPath = urlPathParts.map((p) => p.content).join('')
+  let urlCleanPath = urlPathParts
+    .filter((p) => p.type !== 'group')
+    .map((p) => p.content)
+    .join('')
+
+  // for catch-all routes ending with /*, remove optional ? from params
+  // hono doesn't correctly match /:param?/* patterns
+  if (urlPath.endsWith('/*')) {
+    urlPath = urlPath.replace(/\?(?=\/|\/\*)/g, '')
+  }
+  if (urlCleanPath.endsWith('/*')) {
+    urlCleanPath = urlCleanPath.replace(/\?(?=\/|\/\*)/g, '')
+  }
+
+  return {
+    namedRegex: `^${routeSegments}(?:/)?$`,
+    urlPath: urlPath === '' ? '/' : urlPath,
+    urlCleanPath: urlCleanPath === '' ? '/' : urlCleanPath,
+    routeKeys,
+  }
+}
+
+const insideBracketsRegex = /^\[.*\]$/
+const insideParensRegex = /^\(.*\)$/
+const tripleDotRegex = /^\.\.\./
+const replaceRegex = /[|\\{}()[\]^$+*?.-]/g
+// based on https://github.com/sindresorhus/escape-string-regexp
+const hasRegExpRegex = /[|\\{}()[\]^$+*?.-]/
+
+function escapeStringRegexp(str: string) {
+  // see also: https://github.com/lodash/lodash/blob/2da024c3b4f9947a48517639de7560457cd4ec6c/escapeRegExp.js#L23
+  if (hasRegExpRegex.test(str)) {
+    return str.replace(replaceRegex, '\\$&')
+  }
+  return str
+}
+
+export function parseParam(param: string) {
+  let repeat = false
+  let optional = false
+  let name = param
+
+  // [[param]] = optional, [param] = required
+  if (/^\[\[.*\]\]$/.test(name)) {
+    optional = true
+    name = name.slice(2, -2)
+  } else if (insideBracketsRegex.test(name)) {
+    name = name.slice(1, -1)
+  }
+
+  if (tripleDotRegex.test(name)) {
+    repeat = true
+    name = name.slice(3)
+  }
+
+  return { name, repeat, optional }
+}