Update date-fns to v3.0.5

Change-type: patch

package.json

@@ -111,7 +111,7 @@
     "color": "^3.2.1",
     "color-hash": "^1.1.1",
     "copy-to-clipboard": "^3.3.2",
-    "date-fns": "^2.29.3",
+    "date-fns": "^3.0.5",
     "grommet": "~2.18.0",
     "hast-util-sanitize": "^3.0.2",
     "json-e": "^4.4.3",

src/components/Renderer/widgets/DurationWidget.tsx

@@ -22,23 +22,25 @@ export const DurationWidget = widgetFactory('Duration', {}, [JsonTypes.object])(
 				return '';
 			}
 			const customInterval: { [key: string]: string } = {};
-			Object.entries(interval).forEach(([key, value]) => {
-				if (value != null && value < 10) {
-					customInterval[key] = `0${value}`;
-				} else {
-					customInterval[key] = `${value}`;
+			for (const [key, value] of Object.entries(interval)) {
+				if (value == null) {
+					continue;
 				}
-			});
+				customInterval[key] = value < 10 ? `0${value}` : `${value}`;
+			}
 			let durationText = '';
 			if (!!interval.years) {
 				durationText += `${customInterval.years}y `;
 			}
-			if (!!interval.years || !!interval.months) {
+			if (durationText.length > 0 || !!interval.months) {
 				durationText += `${customInterval.months}m `;
 			}
-			if (!!interval.years || !!interval.months || !!interval.days) {
+			if (durationText.length > 0 || !!interval.days) {
 				durationText += `${customInterval.days}d `;
 			}
+			customInterval.hours ??= '00';
+			customInterval.minutes ??= '00';
+			customInterval.seconds ??= '00';
 			durationText += `${customInterval.hours}:${customInterval.minutes}:${customInterval.seconds}`;
 			return durationText;
 		}, []);