Implement Edit Condition Weights Modal for Experiments

[zackcl]

Description

Implement modal for editing condition weights in experiments. Opens from ExperimentConditionsTableComponent when clicking the edit weights button. Allows equal or custom percentage distribution across experiment conditions.

Requirements

Form Fields

• Weighting Method - Radio group with two options:
  • Weight Equally (default) - Auto-calculates equal percentages
  • Custom Percentages - Allows manual input for each condition
• Condition Weights Table - Shows all conditions with weight inputs
  • Read-only condition names
  • Weight percentage inputs (enabled only in Custom mode)
  • Running total display
  • Validation error when total ≠ 100%

Dynamic Behavior

• When "Weight Equally" selected: All inputs disabled, values auto-calculated
• When "Custom Percentages" selected: Inputs become editable
• Real-time total calculation displayed below table
• Save button disabled if custom weights don't sum to 100%
• Error message "The weights must sum up to 100%" shown when invalid

Technical Implementation

1. DialogService (frontend/projects/upgrade/src/app/shared/services/common-dialog.service.ts)

   • Add openEditConditionWeightsModal() method
   • Pass experiment conditions array with current weights
   • Follow pattern from existing modal methods

2. Modal Component

   • Create EditConditionWeightsModalComponent
   • Use CommonModal wrapper
   • Implement reactive forms with dynamic validation
   • Calculate and display running total

3. Integration Approach (Recommendation)

   • Option 1: Emit event from table to parent (ExperimentConditionsSectionCardComponent)
     • Add @Output() editWeights = new EventEmitter<void>()
     • Parent handles dialog opening and experiment service calls
   • Option 2: Direct dialog call from table (simpler but less testable)
     • Inject DialogService into table component
     • Handle directly in onEditWeightsClick() (line 111)

Acceptance Criteria

• Modal opens with current weight distribution
• Weight Equally mode auto-calculates equal percentages
• Custom Percentages mode enables manual input
• Real-time total calculation updates as user types
• Validation prevents saving when total ≠ 100%
• Error message displays when weights invalid
• Save button disabled state reflects validation
• Cancel closes without changes
• Successful save updates experiment weights via service
• Follows existing CommonModal patterns
• Accessible with proper ARIA labels

Implementation Notes

• Recommend Option 1 (event emission) for better separation of concerns
• Weight inputs should accept decimals (e.g., 33.33%)
• Consider rounding logic for equal distribution (e.g., 3 conditions = 33.33%, 33.33%, 33.34%)

References

• Screenshots:

• Figma link:
  https://www.figma.com/design/SN58AVPDU5DMO5WP2COt5Y/UpGrade-UI-Latest-28--Refinement-?t=zQdZ1BRm5SLNqqhV-1