fix(local-explorer-ui): Add 404 & 500 error components

[NuroDev]

Fixes N/A.

Summary

Currently if you visit a route that doesn't exist, or try to access a resource, like a KV or D1 binding, that doesn't exist it crashes the app and shows the generic error message.

Instead we now show a controlled 404 message for unknown routes like /foo and a "Resource not found" error message for when trying to access resources that don't exist.

Additionally this both:

• Fixes a few minor Tailwind CSS linting warnings.
• Fixes resource route 404 not found handling properly. Previously resources not found were marked as generic errors.

---

• Tests
  • Tests included/updated
  • Automated tests not possible - manual testing has been completed as follows:
  • Additional testing not necessary because: Behaviour tests are due to be added in the future.
• Public documentation
  • Cloudflare docs PR(s):
  • Documentation not necessary because: WIP Experimental feature

A picture of a cute animal (not mandatory, but encouraged)

---

[changeset-bot]

🦋 Changeset detected

Latest commit: 4a5f9c0

The changes in this PR will be included in the next version bump.

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

[ask-bonk]

I've reviewed all the changes thoroughly. Let me analyze the PR:

1. ResourceNotFound.tsx - New component that acts as an errorComponent for all resource routes. The file is named ResourceNotFound but exports RouteError — a mild naming mismatch but not actionable.

2. __root.tsx - Adds a notFoundComponent for 404 on unknown routes. Looks correct.

3. Route files (d1, do, kv, r2, workflows) - All add errorComponent: RouteError. This catches any error thrown during loader or rendering.

4. r2/$bucketName/index.tsx - Reorders validateSearch to be after loader (alphabetical). This is purely cosmetic/linting.

5. Workflow files - CSS changes: !px-4 → px-4!, !py-2.5 → py-2.5!, !p-0 → p-0!, break-words → wrap-break-word, w-[32rem] → w-lg. These are Tailwind v4 syntax updates (important modifier moved to suffix, deprecated utilities replaced).

Everything here looks correct and straightforward. The errorComponent will properly catch loader errors (e.g., when a binding doesn't exist and the API call fails). The notFoundComponent handles unknown routes. The Tailwind changes are valid v4 migrations. The duplicated JSX between notFoundComponent and RouteError is minor — they deliberately have different messages ("Page not found" vs "Resource not found").

No logic bugs, no security issues, no backward compatibility concerns.

LGTM

github run

[github-actions]

✅ All changesets look good

[workers-devprod]

Codeowners approval required for this PR:

• @cloudflare/wrangler

Show detailed file reviewers

• packages/local-explorer-ui/src/components/NotFound.tsx: [@cloudflare/wrangler]
• packages/local-explorer-ui/src/components/ResourceError.tsx: [@cloudflare/wrangler]
• packages/local-explorer-ui/src/routes/__root.tsx: [@cloudflare/wrangler]
• packages/local-explorer-ui/src/routes/d1/$databaseId.tsx: [@cloudflare/wrangler]
• packages/local-explorer-ui/src/routes/do/$className.tsx: [@cloudflare/wrangler]
• packages/local-explorer-ui/src/routes/do/$className/$objectId.tsx: [@cloudflare/wrangler]
• packages/local-explorer-ui/src/routes/do/$className/index.tsx: [@cloudflare/wrangler]
• packages/local-explorer-ui/src/routes/kv/$namespaceId.tsx: [@cloudflare/wrangler]
• packages/local-explorer-ui/src/routes/r2/$bucketName.tsx: [@cloudflare/wrangler]
• packages/local-explorer-ui/src/routes/r2/$bucketName/index.tsx: [@cloudflare/wrangler]
• packages/local-explorer-ui/src/routes/r2/$bucketName/object.$.tsx: [@cloudflare/wrangler]
• packages/local-explorer-ui/src/routes/workflows/$workflowName.tsx: [@cloudflare/wrangler]
• packages/local-explorer-ui/src/routes/workflows/$workflowName/$instanceId.tsx: [@cloudflare/wrangler]
• packages/local-explorer-ui/src/routes/workflows/$workflowName/index.tsx: [@cloudflare/wrangler]

[pkg-pr-new]

create-cloudflare

npm i https://pkg.pr.new/create-cloudflare@13158

@cloudflare/kv-asset-handler

npm i https://pkg.pr.new/@cloudflare/kv-asset-handler@13158

miniflare

npm i https://pkg.pr.new/miniflare@13158

@cloudflare/pages-shared

npm i https://pkg.pr.new/@cloudflare/pages-shared@13158

@cloudflare/unenv-preset

npm i https://pkg.pr.new/@cloudflare/unenv-preset@13158

@cloudflare/vite-plugin

npm i https://pkg.pr.new/@cloudflare/vite-plugin@13158

@cloudflare/vitest-pool-workers

npm i https://pkg.pr.new/@cloudflare/vitest-pool-workers@13158

@cloudflare/workers-editor-shared

npm i https://pkg.pr.new/@cloudflare/workers-editor-shared@13158

wrangler

npm i https://pkg.pr.new/wrangler@13158

commit: 4a5f9c0

[devin-ai-integration]

✅ Devin Review: No Issues Found

Devin Review analyzed this PR and found no potential bugs to report.

View in Devin Review to see 4 additional findings.

[workers-devprod]

Codeowners approval required for this PR:

• ✅ @cloudflare/wrangler

Show detailed file reviewers

[workers-devprod]

Codeowners reviews satisfied