fix: DateField — make the whole input clickable, not just the calendar icon #42

New Issue

2026-06-28T14:47:41Z

admin commented

2026-06-28 14:47:41 +00:00

Bug

In the Add Expense and Edit Expense screens, only the trailing calendar icon inside DateField opens the date picker. The rest of the input row (the date text + the surrounding OutlinedTextField look) is dead space — tapping the date text does nothing, which feels broken.

This is a follow-up to #27, which added the calendar icon but left the rest of the row non-clickable.

Repro

Tap the FAB → Add Expense.
Try to tap the date text (the part that shows e.g. "28 Jun 2026").
Nothing happens.
Tap the calendar icon on the right — the date picker opens.

Expected

The entire DateField row is clickable, and tapping anywhere on it (label, text, or icon) opens the date picker. The visual affordance should make the whole field look like a single tappable input.

Implementation hint

Wrap the field contents in a Box with Modifier.clickable { showDatePicker = true }, and pass enabled = false / readOnly = true to the underlying OutlinedTextField so the soft keyboard does not pop up on tap. The showDatePicker state and DatePickerDialog already exist from #27.

Scope

DateField is the single source of truth for date entry in the app — fix the composable and both AddEditExpenseScreen and AddEditRecurringScreen benefit automatically.

## Bug In the Add Expense and Edit Expense screens, only the trailing calendar icon inside `DateField` opens the date picker. The rest of the input row (the date text + the surrounding `OutlinedTextField` look) is dead space — tapping the date text does nothing, which feels broken. This is a follow-up to #27, which added the calendar icon but left the rest of the row non-clickable. ## Repro 1. Tap the FAB → Add Expense. 2. Try to tap the date text (the part that shows e.g. "28 Jun 2026"). 3. Nothing happens. 4. Tap the calendar icon on the right — the date picker opens. ## Expected The entire `DateField` row is clickable, and tapping anywhere on it (label, text, or icon) opens the date picker. The visual affordance should make the whole field look like a single tappable input. ## Implementation hint Wrap the field contents in a `Box` with `Modifier.clickable { showDatePicker = true }`, and pass `enabled = false` / `readOnly = true` to the underlying `OutlinedTextField` so the soft keyboard does not pop up on tap. The `showDatePicker` state and `DatePickerDialog` already exist from #27. ## Scope `DateField` is the single source of truth for date entry in the app — fix the composable and both `AddEditExpenseScreen` and `AddEditRecurringScreen` benefit automatically.

admin referenced this issue from a commit

2026-06-28 14:55:39 +00:00

fix(#41,#42,#43): numeric amount input, clickable DateField, search-based category picker

admin referenced a pull request that will close this issue

2026-06-28 14:55:46 +00:00

fix(#41,#42,#43): numeric amount input, clickable DateField, search-based category picker #47

admin closed this issue

2026-06-28 14:59:29 +00:00

Sign in to join this conversation.