appsmithorg/appsmith · error · URIError

Missing basePageId. If you are trying to set href inside a r

Error message

Missing basePageId. If you are trying to set href inside a react component use the 'useHref' hook.

What it means

Thrown by URLAssembly.resolveEntityIdForApp() when resolving the entity (page) id for URL building. It tries builderParams.basePageId, then builderParams.baseParentEntityId, then this.currentBasePageId; if all three are falsy it throws a URIError telling the caller to use the useHref hook, because outside React context there is no ambient currentBasePageId to fall back on.

Source

Thrown at app/client/src/ce/entities/URLRedirect/URLAssembly.ts:332

    const formattedParams = {
      staticApplicationSlug: applicationUniqueSlug,
      staticPageSlug: pageSlug,
      baseApplicationId: this.appParams.baseApplicationId,
      basePageId: PLACEHOLDER_PAGE_SLUG,
    };

    return generatePath(urlPattern, formattedParams).toLowerCase();
  }

  resolveEntityIdForApp(builderParams: URLBuilderParams) {
    const basePageId =
      builderParams.basePageId ||
      builderParams?.baseParentEntityId ||
      this.currentBasePageId;

    if (!basePageId) {
      throw new URIError(
        "Missing basePageId. If you are trying to set href inside a react component use the 'useHref' hook.",
      );
    }

    return basePageId;
  }

  resolveEntityId(builderParams: URLBuilderParams): string {
    return this.resolveEntityIdForApp(builderParams);
  }

  /**
   * @throws {URIError}
   * @param builderParams
   * @param mode
   * @returns URL string
   */
  build(builderParams: URLBuilderParams, mode: APP_MODE = APP_MODE.EDIT) {

View on GitHub (pinned to 8cd9021c24)

Solutions

  1. From inside a React component, use the useHref hook (as the message directs) so the ambient page context supplies basePageId.
  2. When calling the builder imperatively, pass basePageId (or baseParentEntityId) explicitly in URLBuilderParams.
  3. Ensure the URLAssembly instance's currentBasePageId is set (e.g. via init/setCurrent) before resolving if you manage the instance yourself.
  4. Defer URL resolution until the page context is available rather than resolving at module-load time.

Example fix

// before (saga/utility, no page context)
const href = urlBuilder.build({ pageId })
// throws: Missing basePageId...

// after (in a component)
const href = useHref({ pageId })
// or pass it explicitly:
const href = urlBuilder.build({ pageId, basePageId: currentPageId })
Defensive patterns

Strategy: type-guard

Validate before calling

function resolveBuilderParams(p: URLBuilderParams, currentBasePageId?: string) {
  const basePageId = p.basePageId || p.baseParentEntityId || currentBasePageId;
  if (!basePageId) throw new Error('Pass basePageId or call from a component via useHref.');
  return { ...p, basePageId };
}

Type guard

function hasBasePageId(p: URLBuilderParams): p is URLBuilderParams & { basePageId: string } {
  return Boolean(p.basePageId || p.baseParentEntityId);
}

Try / catch

try { return builder.resolveEntityId(params); } catch (e) {
  if (/Missing basePageId/i.test(e.message)) return useHref(params); // only valid inside a component
  throw e;
}

Prevention

When it happens

Trigger: Calling resolveEntityIdForApp()/resolveEntityId() (or a builder that uses them) outside a component where basePageId/baseParentEntityId are not supplied AND the URLAssembly instance has no currentBasePageId set — typically building an href from a plain module/saga/utility rather than from a React component.

Common situations: Generating a page href in a Redux saga, a selector, or a non-React utility where the ambient page id is unavailable; refactoring href construction out of a component and dropping the pageId argument; calling the URL builder before the current page is loaded.

Related errors


AI-assisted analysis of appsmithorg/appsmith@8cd9021c24 (2026-08-12). Data as JSON: /api/errors/a4a7c864dc940651. Report an issue: GitHub.