Skip to content

Render recipe and step times as hours and minutes - #4810

Open
dr-froehlich wants to merge 1 commit into
TandoorRecipes:developfrom
dr-froehlich:readable-durations-v2
Open

Render recipe and step times as hours and minutes#4810
dr-froehlich wants to merge 1 commit into
TandoorRecipes:developfrom
dr-froehlich:readable-durations-v2

Conversation

@dr-froehlich

@dr-froehlich dr-froehlich commented Sep 7, 2026

Copy link
Copy Markdown

This is #4785 redone the way you asked: no user preference, the times are simply shown in a
human readable format.

While I like the feature I think its a lot more complex than it need to be. I do not think we
need the user preference. Just show the times in a human readable format.

The preference is gone entirely — UserPreference.use_readable_time, its migration, the
serializer entry, the Cosmetic settings checkbox and the regenerated client models are all out.
This pull request touches no Python at all. Six files, all under vue3/, and the formatting is
unconditional.

I have left the duration-field conversion alone. It is a much bigger change than this one, it
breaks the API for existing clients, and it sounded like something you may want to shape
yourself.

What this does

Recipe and step durations are stored and displayed as a flat number of minutes, so a 72 hour
sourdough proof renders as 4320 min, the step timer button shows a bare 4320, and the recipe
card's time chip shows working + waiting summed with no unit at all.

A shared formatter in vue3/src/utils/duration_utils.ts converts minutes for display:

Input Output
45 45 min
59 59 min
60 1 h
90 1 h 30 min
120 2 h
4320 72 h

Below an hour it stays minutes; from an hour up it renders H h, plus M min when there is a
remainder. No day rollover — 4320 stays 72 h, matching the table in #382. Timer.vue already
expresses "+3 Days" for the one case where a calendar day matters, and long proofs are spoken as
"72 hours", not "3 days".

Unit labels are passed in by the caller from translation keys, so no unit string is inlined in
the conversion logic. min already existed; h is new in en.json. English keys only, per
docs/contribute/translations.md — Weblate can take it from there.

Applied at the read-only duration displays: both RecipeView layouts, the RecipeCard time
chip, and the StepView timer button. Duration inputs keep plain minutes — entering durations
was never the problem, reading them is. It also removes two hardcoded min strings in
RecipeView.vue that bypassed i18n; they sat on the lines this rewrites.

Notes

  • Verified locally: yarn build and the full Python suite on a tree carrying this change.
  • I left the surrounding reformatting alone rather than dragging unrelated churn into the diff —
    the files this touches do not currently satisfy the repo's prettier config either way. Happy to
    run it if you would prefer.

Closes #382.

Recipe and step durations are stored and displayed as a flat number of
minutes, so a 72 hour sourdough proof renders as "4320 min", the step timer
button shows a bare "4320", and the recipe card's time chip shows working +
waiting summed with no unit at all.

A shared formatter in vue3/src/utils/duration_utils.ts converts minutes for
display: below an hour it stays minutes, from an hour up it renders "H h",
plus " M min" when there is a remainder, with no day rollover — 4320 stays
"72 h". Unit labels are passed in by the caller from translation keys, so no
unit string is inlined in the conversion logic. "min" already existed; "h" is
new in en.json.

Applied at the read-only duration displays: both RecipeView layouts, the
RecipeCard time chip, and the StepView timer button. Duration inputs keep
plain minutes. This also removes two hardcoded "min" strings in RecipeView
that bypassed i18n; they sat on the lines this rewrites.

Closes TandoorRecipes#382.

Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
@vabene1111

Copy link
Copy Markdown
Collaborator

thank you. While I appreciate that you added frontend tests I have not yet had the time to properly think about how I want to do frontend testing. Thus having just one isolated test for this feature just does not make a lot of sense to me.

If cou could just remove the testing infrastrucutre for now that would be great. Should I decide to go this route I can just re-add it manually from this PR.

Thank you very much, everything else looks good.

@dr-froehlich

Copy link
Copy Markdown
Author

Done — the vitest setup is removed. The branch is now the single feature commit: six files
under vue3/, with no package.json, vitest.config.ts, yarn.lock or spec file. I dropped
the section describing it from the pull request text as well, so the description matches what
is actually here.

The commit itself is still reachable from this pull request's history — the force-push entry
above links to 8ed0eff — for whenever you get to deciding how you want frontend testing done.

Thanks for the review.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

time display option

2 participants