feat: add header and footer support to Drawer component

[Chisomchima]

Summary

Implements header and footer areas for the Drawer component as specified in DHIS2-20791. The header accepts a title (and optionally a tag), and the footer accepts any content. Both header and footer are fixed, with content scrolling between them.

Changes

Core Drawer Component

• Added header and footer props to Drawer component
• Implemented fixed header/footer with scrollable body layout
• Added dynamic header bar height detection based on globalShellEnabled system setting
  • 40px for new app shell
  • 48px for legacy shell
• Drawer now only fills the "app area" (below header bar) instead of entire viewport

Updated Modules

All modules using Drawer have been updated to use the new header/footer pattern:

• ProgramStagesFormContents: Program stage forms
• OptionsListFormContents: Option forms
• SectionFormList: Data set section forms
• CustomFormEditEntry: Custom form editor
• DataSetSectionForm: Data set section forms

Technical Details

Dynamic Header Bar Height

The Drawer component now dynamically adjusts its position based on the app shell version see DHIS2-20789:

• Uses useSystemSettingsStore to detect globalShellEnabled
• Applies inline styles for top and height to position drawer below header bar
• Ensures drawer doesn't overlap with app shell header

Form Action Pattern

Forms now expose their actions via onActionsReady callback:

• Parent components receive form actions (save, cancel, etc.)
• Parent components construct the drawer footer with appropriate buttons
• Centralizes footer rendering and action handling

[netlify]

✅ Deploy Preview for dhis2-maintenance-app-beta ready!

Name	Link
🔨 Latest commit	6ad5ccb
🔍 Latest deploy log	https://app.netlify.com/projects/dhis2-maintenance-app-beta/deploys/698f1d7cee8cfe00082dc65e
😎 Deploy Preview	https://deploy-preview-763.maintenance-app-beta.netlify.dhis2.org
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

---

To edit notification comments on pull requests, go to your Netlify project configuration.

[cooper-joe]

Design LGTM 👍

[sonarqubecloud]

Quality Gate failed

Failed conditions
6 New issues
6 New Code Smells (required ≤ 0)

See analysis details on SonarQube Cloud

Catch issues before they fail your Quality Gate with our IDE extension SonarQube for IDE