Available Services
AlertService
Display user notifications and alerts using Material Design snackbars with internationalization support.AnalyticsService
Track user interactions and events using Google Analytics 4 with a simple, type-safe API.LoggerService
Structured logging for development and debugging with console output that respects environment configuration.ProfileService
Manage user profiles with Supabase integration including avatar uploads and profile data management.ProgressBarService
Control the application-wide progress bar displayed in the toolbar for loading states and operations.ServiceWorkerService
Manage PWA updates and service worker lifecycle with automatic update detection and user notifications.SettingsService
Manage application settings with reactive signals and local storage persistence.StorageService
Type-safe wrapper around browser localStorage and sessionStorage with namespace isolation.ToolbarTitleService
Manage the toolbar title displayed in the application’s main toolbar with reactive updates.UserService
Complete authentication and user management with Supabase Auth integration.Service Architecture
Dependency Injection
All services use Angular’s moderninject() function and are provided at the root level for singleton behavior:
Reactive State Management
Services use Angular signals for reactive state management:Type Safety
All services are fully typed with TypeScript interfaces and types for compile-time safety:Configuration
Injection Tokens
Services can be configured using Angular injection tokens:IS_LOGGING_ENABLED- Enable/disable loggingIS_ANALYTICS_ENABLED- Enable/disable analyticsGOOGLE_ANALYTICS_MEASUREMENT_ID- GA4 measurement IDSUPABASE_CLIENT- Supabase client instance
Environment-Based Setup
Configure services in your environment files:Best Practices
- Use dependency injection - Inject services through constructors using Angular’s
inject()function - Leverage signals - Access reactive state through signal APIs
- Handle errors - Use try/catch blocks with async service methods
- Type your data - Use TypeScript interfaces when working with service data
- Clean up subscriptions - Though most services use signals, manually created subscriptions should be cleaned up