fix(announcements): submit button could never enable on the new-announcement form

[philmerrell]

Follow-up to #972. The admin form shipped unable to create anything — this fixes that.

The bug

Browser-verifying the page in dev: every field filled, the form reporting ng-valid on every control, and "Create draft" still disabled. No announcement could be authored from the UI at all, which was the entire point of PR-3.

canSubmit is a computed, and a computed tracks the signals read during its last execution — so an early return shortens its dependency set:

protected readonly canSubmit = computed(() => {
  if (this.isSubmitting()) return false;   // signal — tracked
  if (this.form.invalid) return false;     // ⚠️ plain getter, NOT a signal — returns here
  if (this.bodyOverLimit()) return false;  // never reached on first run
  …
});

On the first evaluation the form was empty, so it returned at line 2 having tracked only isSubmitting. Nothing else was a dependency, so no later edit could schedule a recompute — and isSubmitting only changes inside onSubmit, which the disabled button prevented. A deadlock.

The fix

Two changes, both load-bearing:

1. Form validity is mirrored into a signal fed by statusChanges, exactly like the valueChanges mirrors this component already keeps for the template.
2. Every input is read unconditionally before being combined, so no branch can shrink the tracked dependency set again. The comment on canSubmit explains why, because the guard-clause version reads as the more natural style and someone will want to refactor back to it.

Why the existing tests missed it

They only ever read canSubmit() after filling the form. In that order the computed's first evaluation sees a valid form, reads past the form.invalid check, tracks every signal, and stays reactive — so the bug is invisible. In the real page the first read happens while the form is still empty.

The three new tests read canSubmit() while empty first, then fill. That ordering is the entire test.

I verified they actually catch it rather than assuming: reverting the fix makes the 3 new tests fail while all 24 original specs still pass.

Testing

• npm test: 217 files, 2431 tests pass.
• npx tsc --noEmit: clean.
• Reverted-fix check: 3 failed / 24 passed, as described above.

Backend untouched.

Note for the epic

This is the second bug in this feature that unit tests passed and a browser caught (the first was PR-2's markdown rendering with inert prose classes). Both were in the SPA, and both were invisible to specs that exercised the logic without rendering it. Worth remembering when PR-4 (banner) and PR-5 (modal) land — those are the surfaces where a silent failure is most costly.

🤖 Generated with Claude Code