Fallback Screens Frontend

The frontend module provides fallback UI for app-level error and recovery states.

Source root:

apps/admin/src/core/FallbackScreens/

Directory Structure

FallbackScreens/
  config/        Routes, messages, and translations.
  pages/         Route-level fallback pages.
  view/
    layouts/     Shared fallback page layout.

Routes

Frontend route config:

config/routing.tsx

Mounted route path:

/error/*

Route	Page	Purpose
`/error`	`Error404Page`	Default fallback route.
`/error/403`	`Error403Page`	Forbidden or permission denied page.
`/error/404`	`Error404Page`	Not found page.
`/error/500`	`Error500Page`	Internal server error page.

Unknown /error/* paths redirect to /error/404.

App Integration

The app-level router mounts fallbackScreensRoute from:

apps/admin/src/app/routing/app_routing_setup.tsx

The app-level i18n config merges fallbackScreensMessages from:

apps/admin/src/app/i18n/config.ts

Translations

Translations are module-local:

config/messages.ts
config/translation/en.json
config/translation/uk.json

Use only FALLBACK_SCREENS.* keys inside this module.

Do not put fallback page strings in app-level files such as:

apps/admin/src/app/i18n/messages/en.json
apps/admin/src/app/i18n/messages/uk.json

Page Conventions

Keep route-level fallback pages under pages/*Page/index.tsx.
Keep shared wrapper layout under view/layouts/.
Keep public URLs stable unless there is a migration plan.
Prefer module-local translation keys for all visible text, including generic-looking actions like return-home links.
Add a route only when the fallback is intended to be navigable. Inline-only reusable fallbacks can be exported without a route.

2.0 KiB Raw Blame History