fix: stray "0" shown for steps with no timer (v0.52.1)

`{step.timerSeconds && (...)}` renders the literal 0 when timerSeconds is
the number 0 rather than null/undefined — only false/null/undefined skip
rendering in JSX, a bare falsy number doesn't. Some steps ended up with
timerSeconds stored as 0 instead of null (e.g. AI generation filling in a
"default" value for an optional field rather than omitting it), which
this guard then rendered as a bare "0" instead of hiding the timer.

Fixed at all 4 render sites (recipe page, cook mode, both print views) by
coercing to a real boolean (`!!step.timerSeconds`) — makes a stored 0
behave identically to null everywhere it's displayed.

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

apps/web/app/(app)/recipes/[id]/page.tsx

@@ -427,7 +427,7 @@ export default async function RecipePage({ params }: Params) {
                     </div>
                     <div className="flex-1 space-y-1 pt-1">
                       <p className="leading-relaxed">{step.instruction}</p>
-                      {step.timerSeconds && (
+                      {!!step.timerSeconds && (
                         <p className="text-xs text-muted-foreground flex items-center gap-1">
                           <Clock className="h-3 w-3" />
                           {step.timerSeconds >= 60

apps/web/app/print/[id]/page.tsx

@@ -171,7 +171,7 @@ export default async function RecipePrintPage({ params }: Params) {
                 {recipe.steps.map((step) => (
                   <li key={step.id}>
                     {step.instruction}
-                    {step.timerSeconds && (
+                    {!!step.timerSeconds && (
                       <span className="timer">⏱ {Math.floor(step.timerSeconds / 60)} min</span>
                     )}
                   </li>

apps/web/app/print/collection/[id]/page.tsx

@@ -131,7 +131,7 @@ export default async function CollectionPrintPage({ params }: Params) {
                   {recipe.steps.map((step) => (
                     <li key={step.id}>
                       {step.instruction}
-                      {step.timerSeconds && (
+                      {!!step.timerSeconds && (
                         <span className="timer">⏱ {Math.floor(step.timerSeconds / 60)} min</span>
                       )}
                     </li>

apps/web/components/cooking-mode/cooking-mode.tsx

@@ -300,7 +300,7 @@ export function CookingMode({
           </p>
 
           {/* Timer for current step */}
-          {step.timerSeconds && (
+          {!!step.timerSeconds && (
             <div className="flex flex-col items-center gap-3">
               <div className={cn(
                 "text-5xl font-mono font-bold tabular-nums",

apps/web/lib/changelog.ts

@@ -1,5 +1,5 @@
 // Mirrors CHANGELOG.md at the repo root — update both together.
-export const APP_VERSION = "0.52.0";
+export const APP_VERSION = "0.52.1";
 
 export type ChangelogEntry = {
   version: string;
@@ -11,6 +11,13 @@ export type ChangelogEntry = {
 };
 
 export const CHANGELOG: ChangelogEntry[] = [
+  {
+    version: "0.52.1",
+    date: "2026-07-19 14:10",
+    fixed: [
+      "Steps with no timer sometimes showed a stray \"0\" on the recipe page, cook mode, and print views — a step whose timer happened to be stored as 0 (rather than empty) hit a JS truthiness quirk where `0 && ...` renders the literal 0 instead of nothing.",
+    ],
+  },
   {
     version: "0.52.0",
     date: "2026-07-19 13:55",

apps/web/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@epicure/web",
-  "version": "0.52.0",
+  "version": "0.52.1",
   "private": true,
   "scripts": {
     "dev": "next dev",