feat(planning): implement constraint-first leave planner

src/app/components/rules-panel/rules-panel.html

@@ -37,12 +37,17 @@
 								>
 							</mat-slide-toggle>
 							<div class="rule-actions">
-								<button mat-icon-button (click)="startEdit(rule, $event)">
+								<button
+									mat-icon-button
+									[aria-label]="tr().rules.editRule"
+									(click)="startEdit(rule, $event)"
+								>
 									<mat-icon>edit</mat-icon>
 								</button>
 								<button
 									mat-icon-button
 									color="warn"
+									[aria-label]="tr().rules.deleteRule"
 									(click)="deleteRule(rule.id, $event)"
 								>
 									<mat-icon>delete</mat-icon>
@@ -59,6 +64,16 @@
 							<mat-label>{{ tr().rules.ruleName }}</mat-label>
 							<input matInput [(ngModel)]="$any(editBuffer).name" required />
 						</mat-form-field>
+						<mat-form-field class="full-width">
+							<mat-label>{{ tr().rules.force }}</mat-label>
+							<mat-select [(ngModel)]="$any(editBuffer).force">
+								@for (option of forceOptions; track option.value) {
+									<mat-option [value]="option.value">{{
+										option.label()
+									}}</mat-option>
+								}
+							</mat-select>
+						</mat-form-field>
 
 						@if ($any(editBuffer).type === RuleType.IF_THEN) {
 							<div class="editor-row">
@@ -210,6 +225,14 @@
 						<mat-label>{{ tr().rules.ruleName }}</mat-label>
 						<input matInput [(ngModel)]="$any(editBuffer).name" required />
 					</mat-form-field>
+					<mat-form-field class="full-width">
+						<mat-label>{{ tr().rules.force }}</mat-label>
+						<mat-select [(ngModel)]="$any(editBuffer).force">
+							@for (option of forceOptions; track option.value) {
+								<mat-option [value]="option.value">{{ option.label() }}</mat-option>
+							}
+						</mat-select>
+					</mat-form-field>
 
 					@if (newRuleType() === RuleType.IF_THEN) {
 						<div class="editor-row">