Error Handling

Structured error types, global handlers, and automatic Rollbar monitoring across all platforms. You get consistent error flow from network to UI — known errors show user-friendly messages, unexpected errors are tracked automatically.

Common Architecture

Every platform follows the same error philosophy:

• Errors are values, not exceptions — services return typed error results rather than throwing
• Typed error hierarchies — each platform defines a structured failure/error taxonomy
• Automatic monitoring — Rollbar integration reports unexpected errors with environment context
• Known vs. unknown — expected errors (network unavailable, validation failures) are handled gracefully; unexpected errors are tracked and reported

Per-Platform Implementation

Flutter

Packages: e11_core (Failure types, Either), e11_rollbar (monitoring)

Services return Either<E11Failure, T> from the dartz package. UI code uses .fold() to handle both paths:

final result = await controller.doSomething();
result.fold(
  (failure) => context.toastHandler.error(failure.message),
  (success) => handleSuccess(success),
);

Failure hierarchy:

Failure (base)
  └── FailureMessage (+ message)
        └── E11Failure (+ type, title)
              ├── UnknownFailure
              ├── NoInternetFailure
              ├── ValidationFailure
              ├── PermissionsRestrictedFailure
              └── ... (10+ typed failures)

Product apps implement E11ErrorHandler to route errors through Rollbar:

class AppErrorHandler implements E11ErrorHandler {
  E11Failure handleError(dynamic error) {
    if (error is BaseError && error.isTracked) {
      sendRollbarError(error.logDescription, error.level, stackTrace);
    }
    return E11Failure.fromError(error);
  }
}

Monitoring: Rollbar for application errors, Firebase Crashlytics for framework/platform errors. Known/expected errors (network unavailable, auth errors) are logged locally but not sent to Rollbar.

Angular

Package: @engineering11/web-api-error

Errors are typed string constants mapped to handler classes:

export const FILES_ERRORS = {
  FILE_TOO_LARGE: 'files/error/file-too-large'
}
 
export const COMMUNITY_ERROR_MAPPING = {
  [ERROR_TYPES.COMMUNITY_MISSING_MEMBER]: TrackErrorE11ErrorHandler,
  [ERROR_TYPES.COMMUNITY_INVITE_EXPIRED]: TrackInfoE11ErrorHandler,
}

GlobalErrorHandler replaces Angular’s default ErrorHandler. E11ErrorHandlerService routes errors through handler classes:

Configured per app via E11ErrorModule.forRoot() with a pluggable error tracker factory, logger, and handler map.

HTTP errors: ServerErrorInterceptor retries failed HTTP calls twice before re-throwing. Firebase Auth error codes are mapped to user-friendly E11Error objects.

React / React Native

Package: @engineering11/error-frontend-api

E11Error extends native Error with typed metadata:

interface E11ErrorData {
  type: string       // namespaced: "feature/operation-failed"
  title: string      // user-facing
  message: string    // developer-facing
  source?: string
  alertUser?: boolean
  previousErrorData?: E11ErrorData  // error chaining
}

Usage via hooks:

const { handleError } = useErrorHandler()
 
handleError(toE11Error(error, {
  type: "feature/operation-failed",
  title: "Something went wrong",
  alertUser: true,
}))

Providers:

• Web: ErrorProvider attaches global error and unhandledrejection listeners
• Mobile: ErrorProvider uses React Native’s ErrorUtils.setGlobalHandler

Error boundaries: Both web and mobile include root-level React error boundaries.

Monitoring: Rollbar on both platforms. The mobile package includes an Expo plugin that configures Rollbar native SDKs for Android and iOS automatically.

What You Customize

Next Steps

• Authentication — Auth patterns across platforms
• Theming & White-Label — Design token systems
• Platforms — Platform-specific deep dives