2062012 - Implement basic footer and Save button state

Status: NEW

(Calendar :: Calendar Frontend, enhancement, P3)

Description

[Alex Schmitz]

Summary:
Build the main dialog's footer and Save button. Keep the footer visible while
the body scrolls. Enable Save only when the current dialog is ready, all draft
values are valid, and no Save is already running.

The draft contains the user's unsaved values. This story displays the combined
validation result and sends a Save request. It does not check each field or
save the event itself.

Links:

• Zeplin footer
• Interaction guide: Dialog size
• Planning: Redux rendering
• Bug 2061214: Save new events
• Bug 2061218: Save changes to events

Acceptance criteria:

• Use the existing fixed footer area while the main body scrolls beneath it.
• Keep Save unavailable until the current dialog has finished loading and the
  combined validation result says the draft is valid.
• While Save is running, show the button's pending state and prevent another
  activation. Update the button when the Save state changes.
• Selecting Save sends a request to the existing create/edit Save controller.
• If the dialog switches from event A to B, update the footer for B. An old
  Save action for A must not start Save for B.
• Render the footer before the dialog is ready to show. Scrolling the body,
  expanding fields, and opening secondary views must not make the footer grow
  the dialog or change its anchor. Use the existing dialog layout rules.
• Provide slots for the availability and privacy controls, but do not build
  those controls in this story.
• Support keyboard activation and the correct accessible button states.

Required implementation details:

• Use stable storeObserver selections for the current session's load status,
  combined draft validity, and Save status. A session identifies one create
  or edit operation. Do not add getters that read the store directly.
• Use a memoized selector, such as selectCanSave, to produce the button state
  from Redux only. Reuse its result while its inputs are unchanged.
• Use existing validation and unsaved-change results. Do not repeat field
  validation or calculate unsaved changes in the footer.
• Send a typed Save request to the controller. Do not construct calIEvent,
  convert field values, or call Calendar transaction APIs in the footer.
• Keep live calendar items, validation callbacks, DOM nodes, and temporary
  focus state out of Redux. Button focus and keyboard handling stay local.
• Include initial footer rendering in the dialog's readiness check. The footer
  must not call PositionedDialog or position the dialog itself.
• Check that a Save action belongs to the current session before forwarding it.

Minimum test coverage:

• Check that the footer stays visible while the body scrolls.
• Check enabled, disabled, and pending Save states from Redux updates.
• Check that loading, invalid draft values, and a running Save prevent activation.
• Check that activating Save sends the request without saving directly.
• Switch from A to B and check that the footer updates and an old action cannot
  start Save for B.
• Check initial rendering before show and layout during scrolling, field
  expansion, and secondary-view navigation.
• Check keyboard behavior, accessible button states, and axe where supported.

Out of scope:

• Availability and privacy controls.
• Field validation rules and error messages beyond the Save button state.
• Implementing Save, storing draft changes, or changing Calendar events.