fix: UI polish for intake form, dashboard cards, and schedule (#142)

- Intake form: replace remind checkbox with bell icon + toggle switch
- Intake form: smart takenBy dropdown based on medication's people
- Dashboard: hide DETAILS row for pill bottles on mobile cards
- Dashboard: use status-chip with icons in schedule view (past/today/future)
- Dashboard: reduce spacing between icons and status chips on mobile
- MedDetailModal: show package type in PACKAGE DETAILS heading
- PlannerPage: show dash for bottle blisters column
- Shorten Pill Bottle label in EN/DE translations
- Update related tests
This commit is contained in:
Daniel Volz
2026-02-08 22:13:52 +01:00
committed by GitHub
parent b07b586eef
commit 3de1b2ef0c
10 changed files with 120 additions and 59 deletions
@@ -755,9 +755,9 @@ describe("MedicationsPage intake reminders toggle", () => {
// Desktop form uses class "full blisters" container
const blistersContainer = document.querySelector(".blisters");
expect(blistersContainer).toBeInTheDocument();
// Check for the inline-checkbox that controls intake reminders in each blister row
const intakeCheckbox = document.querySelector(".blister-row .inline-checkbox");
expect(intakeCheckbox).toBeInTheDocument();
// Check for the remind-toggle-row that controls intake reminders in each blister row
const intakeToggle = document.querySelector(".blister-row .remind-toggle-row");
expect(intakeToggle).toBeInTheDocument();
});
it("can toggle intake reminders per intake", () => {
@@ -770,8 +770,8 @@ describe("MedicationsPage intake reminders toggle", () => {
</MemoryRouter>
);
// Each blister row has inline-checkbox for intake reminders
const checkbox = document.querySelector('.blister-row .inline-checkbox input[type="checkbox"]');
// Each blister row has remind-toggle-row for intake reminders
const checkbox = document.querySelector('.blister-row .remind-toggle-row input[type="checkbox"]');
if (checkbox) {
fireEvent.click(checkbox);
expect(setIntakeValue).toHaveBeenCalled();