fix(ui): replace contrast severity with secondary for consistent styling #208

asithade · 2025-12-12T22:41:33Z

Description

Replace contrast severity with secondary across meeting and committee components for improved visual consistency and better theme compatibility.

Changes

Member card: Changed secretary role badge severity from contrast to secondary
Dashboard meeting card: Updated button severities and meeting type badges
Meeting card: Standardized join button severities and meeting type badges
Meeting join: Updated button styling and meeting type badges

Affected Components

member-card.component.ts - Role badge severity
dashboard-meeting-card.component.* - Button and badge severities
meeting-card.component.* - Join button and badge severities
meeting-join.component.* - Button styling and badge severities

Impact

Improved visual consistency across meeting and committee components
Better adherence to design system standards
Consistent button styling using PrimeNG severity system

JIRA Ticket

LFXV2-905

Generated with Claude Code

- Created LoggerService singleton with WeakMap-based operation tracking - Prevents duplicate logs and memory leaks - CloudWatch-optimized structured JSON logging - Updated 10 controllers, 2 middleware, 7 services, 2 utils - Improved error handling with centralized error middleware logging - Removed redundant error logs before next(error) calls - Net reduction of 706 lines LFXV2-903 Generated with [Claude Code](https://claude.ai/code) Signed-off-by: Asitha de Silva <[email protected]>

Extended LoggerService to support both request-scoped and infrastructure operations by making req parameter optional. Migrated all 41 direct serverLogger calls across services, utilities, and routes to use the unified logger service pattern. Changes: - Extended LoggerService methods to accept Request | undefined - Migrated 11 request-scoped operations to pass req parameter - Migrated 30 infrastructure operations to use logger with undefined - Updated ai.service, user.service, project.service method signatures - Replaced serverLogger calls in nats, snowflake, lock-manager services - Updated CLAUDE.md with comprehensive logging documentation - Removed serverLogger imports from all service/utility files Benefits: - Unified logging interface for all operations - Better request correlation when context available - Consistent error handling with err field - Infrastructure operations now use same pattern LFXV2-903 Signed-off-by: Asitha de Silva <[email protected]>

Updated logging-monitoring.md to reflect the new dual-mode logger service that supports both request-scoped and infrastructure operations. Added documentation for the new server-logger.ts file that breaks the circular dependency between server.ts and logger.service.ts. Changes: - Added logging architecture layers diagram showing server-logger.ts - Updated all method signatures to show req | undefined pattern - Added infrastructure logging examples for all methods - Documented circular dependency resolution - Clarified when to use request-scoped vs infrastructure logging LFXV2-903 Signed-off-by: Asitha de Silva <[email protected]>

Moved AI agenda generation logic from inline route handler to MeetingController.generateAgenda method for better separation of concerns and consistency with other route patterns. Also improved logger usage in middleware and services: - auth.middleware: better error tracking with startTime - error-handler.middleware: use operation startTime when available - access-check.service: move startOperation before try block - etag.service: use debug instead of silent startOperation - persona-helper: use success/error instead of warning LFXV2-903 Signed-off-by: Asitha de Silva <[email protected]>

Updated CLAUDE.md logging architecture diagram to reflect the new server-logger.ts file that breaks the circular dependency between server.ts and logger.service.ts. LFXV2-903 Signed-off-by: Asitha de Silva <[email protected]>

Signed-off-by: Asitha de Silva <[email protected]>

LFXV2-903 Use ServiceValidationError.fromFieldErrors() and next() for validation errors instead of manual 400 response, consistent with other controller methods. Provides field-level error details and centralized error handling through middleware. Signed-off-by: Asitha de Silva <[email protected]>

Signed-off-by: Asitha de Silva <[email protected]>

Replace 'contrast' severity with 'secondary' across meeting and committee components for improved visual consistency and better theme compatibility. Changes: - Member card: secretary role badge severity - Dashboard meeting card: button severities and meeting type badges - Meeting card: join button severities and meeting type badges - Meeting join: button styling and meeting type badges LFXV2-905 Signed-off-by: Asitha de Silva <[email protected]>

coderabbitai · 2025-12-12T22:41:44Z

Walkthrough

Badge severity mappings are updated from 'contrast' to 'secondary' for the secretary role and technical meeting type across member and meeting components. Button styling is refactored to use component inputs (severity, size, styleClass) instead of inline classes across multiple templates.

Changes

Cohort / File(s)	Summary
Badge severity updates `apps/lfx-one/src/app/modules/committees/components/member-card/member-card.component.ts`, `apps/lfx-one/src/app/modules/dashboards/components/dashboard-meeting-card/dashboard-meeting-card.component.ts`, `apps/lfx-one/src/app/modules/meetings/components/meeting-card/meeting-card.component.ts`, `apps/lfx-one/src/app/modules/meetings/meeting-join/meeting-join.component.ts`	Changed badge severity mapping for specific roles and meeting types: secretary role and technical meeting type severity changed from 'contrast' to 'secondary'.
Button styling refactors `apps/lfx-one/src/app/modules/dashboards/components/dashboard-meeting-card/dashboard-meeting-card.component.html`, `apps/lfx-one/src/app/modules/meetings/components/meeting-card/meeting-card.component.html`, `apps/lfx-one/src/app/modules/meetings/meeting-join/meeting-join.component.html`	Removed inline styling classes from buttons and replaced with component inputs for severity, size, and styleClass to standardize presentation across meeting-related components.

Estimated code review effort

🎯 2 (Simple) | ⏱️ ~10 minutes

Changes are homogeneous and repetitive across files (same severity mapping pattern, consistent button styling updates)
Low logic density—updates are primarily cosmetic and configuration-level
No functional behavior modifications or control flow changes

Pre-merge checks and finishing touches

✅ Passed checks (5 passed)

Check name	Status	Explanation
Title check	✅ Passed	The title clearly and concisely summarizes the main change: replacing contrast severity with secondary for styling consistency across components.
Description check	✅ Passed	The description is well-structured and directly related to the changeset, detailing the specific components affected and the rationale for the changes.
Linked Issues check	✅ Passed	All code changes align with LFXV2-905 objectives: secretary badge severity changed to secondary, meeting type badges updated, and button severities standardized across all four affected components.
Out of Scope Changes check	✅ Passed	All changes are directly related to replacing contrast severity with secondary across member, dashboard, meeting, and meeting-join components; no unrelated modifications detected.
Docstring Coverage	✅ Passed	No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.

✨ Finishing touches

📝 Generate docstrings

🧪 Generate unit tests (beta)

Create PR with unit tests
Post copyable unit tests in a comment
Commit unit tests in branch fix/LFXV2-905

_{Comment @coderabbitai help to get the list of available commands and usage tips.}

Copilot

Pull request overview

This PR implements a comprehensive logging system refactor, replacing the previous Logger helper class with a new singleton LoggerService that provides operation lifecycle tracking, CloudWatch optimization, and duplicate error prevention. Additionally, it updates UI components to use secondary severity instead of contrast for consistent styling.

Key changes:

New singleton LoggerService with operation tracking (startOperation → success/error)
Breaking circular dependency by extracting serverLogger to server-logger.ts
Migration from Logger.start/success/error to logger.startOperation/success/error across all controllers and services
UI consistency improvements replacing contrast with secondary severity
Turbo dependency bump from 2.5.5 to 2.6.3

Reviewed changes

Copilot reviewed 42 out of 43 changed files in this pull request and generated no comments.

Show a summary per file

File	Description
`apps/lfx-one/src/server/services/logger.service.ts`	New singleton LoggerService with operation lifecycle tracking
`apps/lfx-one/src/server/server-logger.ts`	Extracted base Pino logger to break circular dependencies
`apps/lfx-one/src/server/server.ts`	Updated to use new logger architecture
`apps/lfx-one/src/server/helpers/logger.ts`	Deleted old Logger helper class
`apps/lfx-one/src/server/services/*.ts`	Migrated all services to use new logger
`apps/lfx-one/src/server/controllers/*.ts`	Migrated all controllers to use new logger
`apps/lfx-one/src/server/middleware/*.ts`	Updated middleware to use new logger
`apps/lfx-one/src/app/modules//.component.ts`	Changed `contrast` to `secondary` severity
`docs/architecture/backend/logging-monitoring.md`	Comprehensive documentation rewrite
`package.json`, `yarn.lock`	Updated turbo from 2.5.5 to 2.6.3

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

coderabbitai

Actionable comments posted: 0

🧹 Nitpick comments (3)

apps/lfx-one/src/app/modules/meetings/meeting-join/meeting-join.component.html (1)

117-129: Consider consolidating full-width styling.

The button wrapper has class="w-full h-[40px]" (line 118) while the Button component receives styleClass="w-full" (line 119). If styleClass applies the full-width style to the inner button element, the wrapper's w-full class might be redundant. Consider verifying whether both are necessary or if the wrapper class can be simplified to just class="h-[40px]".

apps/lfx-one/src/app/modules/meetings/components/meeting-card/meeting-card.component.html (1)

199-230: Button styling updated correctly; consider consolidating width classes.

The Join Meeting buttons have been correctly updated with severity="success" and styleClass="w-full" (lines 211-212, 225-226), aligning with the PR objectives for consistent button styling. However, note that the wrapper divs already have class="w-full" (lines 205, 219). Similar to the meeting-join component, consider verifying whether both the wrapper's w-full class and the button's styleClass="w-full" are both necessary, or if one can be simplified.

apps/lfx-one/src/app/modules/dashboards/components/dashboard-meeting-card/dashboard-meeting-card.component.html (1)

99-133: Button presentation inputs updated correctly; consider consolidating width classes.

Both buttons have been correctly updated with presentation inputs (severity, size, styleClass) that align with the PR objectives for consistent button styling. The Join Meeting button's severity="success" (line 128) is appropriate. However, similar to other components in this PR, both buttons have class="w-full" on their wrapper divs (lines 102, 120) and styleClass="w-full" on the button components (lines 105, 129). Consider verifying if this duplication is intentional or if the wrapper classes can be simplified.

📜 Review details

Configuration used: CodeRabbit UI

Review profile: CHILL

Plan: Pro

Disabled knowledge base sources:

Jira integration is disabled by default for public repositories

You can enable these sources in your CodeRabbit configuration.

📥 Commits

Reviewing files that changed from the base of the PR and between 1f1c6d4 and 933143a.

📒 Files selected for processing (7)

apps/lfx-one/src/app/modules/committees/components/member-card/member-card.component.ts (1 hunks)
apps/lfx-one/src/app/modules/dashboards/components/dashboard-meeting-card/dashboard-meeting-card.component.html (2 hunks)
apps/lfx-one/src/app/modules/dashboards/components/dashboard-meeting-card/dashboard-meeting-card.component.ts (1 hunks)
apps/lfx-one/src/app/modules/meetings/components/meeting-card/meeting-card.component.html (2 hunks)
apps/lfx-one/src/app/modules/meetings/components/meeting-card/meeting-card.component.ts (1 hunks)
apps/lfx-one/src/app/modules/meetings/meeting-join/meeting-join.component.html (1 hunks)
apps/lfx-one/src/app/modules/meetings/meeting-join/meeting-join.component.ts (1 hunks)

🧰 Additional context used

📓 Path-based instructions (5)

apps/lfx-one/src/**/*.component.ts