create-volt 0.33.0 → 0.35.0

package/CHANGELOG.md

@@ -4,6 +4,23 @@ All notable changes to `create-volt` are documented here. The format follows
 [Keep a Changelog](https://keepachangelog.com/), and this project adheres to
 [Semantic Versioning](https://semver.org/).
 
+## [0.35.0] - 2026-06-29
+
+### Fixed
+- **Setup wizard: dependency add-ons now show as checked.** Enabling `auth` pulls
+  in `db` + `mailer` (its dependencies), which were added to `VOLT_ADDONS` but
+  whose checkboxes stayed *unchecked* — so the generated `.env` looked like it had
+  add-ons you never picked. Pulled-in dependencies now render **checked + disabled**
+  with a "required by <add-on>" note, so the checkboxes always match `VOLT_ADDONS`.
+
+## [0.34.0] - 2026-06-29
+
+### Added
+- **Timezone detection.** The setup wizard detects the admin's timezone from
+  their browser (`Intl`) and writes `SITE_TZ` to `.env`. The `posts` add-on then
+  renders full timestamps in `SITE_TZ` rather than the server's zone (usually UTC
+  on a host); date-only values render as that calendar day either way.
+
 ## [0.33.0] - 2026-06-29
 
 ### Added
@@ -446,6 +463,8 @@ All notable changes to `create-volt` are documented here. The format follows
   watching and full-page hot reload. Supports `--skip-install` and `--force`,
   and auto-detects npm / pnpm / yarn / bun for the install step.
 
+[0.35.0]: https://github.com/MIR-2025/volt/releases/tag/v0.35.0
+[0.34.0]: https://github.com/MIR-2025/volt/releases/tag/v0.34.0
 [0.33.0]: https://github.com/MIR-2025/volt/releases/tag/v0.33.0
 [0.32.0]: https://github.com/MIR-2025/volt/releases/tag/v0.32.0
 [0.31.0]: https://github.com/MIR-2025/volt/releases/tag/v0.31.0

package/addons/posts/files/lib/posts.js

@@ -17,11 +17,15 @@ const tagsOf = (meta) => String(meta.tags || "").split(",").map((s) => s.trim())
 
 function fmtDate(d) {
   if (!d) return "";
-  // parse YYYY-MM-DD as *local* midnight (new Date("2026-06-28") is UTC → off by a
-  // day in negative-offset zones); fall back to Date() for full timestamps.
+  const opts = { year: "numeric", month: "long", day: "numeric" };
+  // A date-only value (YYYY-MM-DD) is a calendar day with no timezone — parse it
+  // as local midnight and render that day (new Date("2026-06-28") would be UTC →
+  // off by a day in negative-offset zones). A full timestamp is rendered in the
+  // admin's timezone (SITE_TZ, detected by the setup wizard), not the server's.
   const m = /^(\d{4})-(\d{2})-(\d{2})$/.exec(String(d).trim());
-  const t = m ? new Date(+m[1], +m[2] - 1, +m[3]) : new Date(d);
-  return isNaN(t.getTime()) ? esc(d) : t.toLocaleDateString("en-US", { year: "numeric", month: "long", day: "numeric" });
+  if (m) return new Date(+m[1], +m[2] - 1, +m[3]).toLocaleDateString("en-US", opts);
+  const t = new Date(d);
+  return isNaN(t.getTime()) ? esc(d) : t.toLocaleDateString("en-US", process.env.SITE_TZ ? { ...opts, timeZone: process.env.SITE_TZ } : opts);
 }
 
 function excerpt(p) {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "create-volt",
-  "version": "0.33.0",
+  "version": "0.35.0",
   "description": "Scaffold a new Volt app — no-build, signals-based UI with Socket.io hot reload.",
   "type": "module",
   "bin": {

package/templates/default/setup/setup.js

@@ -25,6 +25,9 @@ const state = signal({
   s3Secret: current.S3_SECRET || "",
   s3PublicBase: current.S3_PUBLIC_BASE || "",
   port: current.PORT || String(defaultPort),
+  // detect the admin's timezone from their browser (the wizard runs here), so
+  // dates render in their zone — not the server's (usually UTC on a host).
+  tz: current.SITE_TZ || Intl.DateTimeFormat().resolvedOptions().timeZone || "",
 });
 const set = (patch) => state({ ...state(), ...patch });
 const toggle = (n) => state({ ...state(), addons: { ...state().addons, [n]: !state().addons[n] } });
@@ -42,10 +45,28 @@ function effective(s) {
   return order.filter((n) => want.has(n));
 }
 
+// which *enabled* add-ons pull in `name` as a (transitive) dependency
+function requiredBy(s, name) {
+  const causes = [];
+  for (const n of order) {
+    if (n === name || !s.addons[n]) continue;
+    const seen = new Set();
+    const visit = (x) => {
+      if (seen.has(x)) return;
+      seen.add(x);
+      (depsOf[x] || []).forEach(visit);
+    };
+    (depsOf[n] || []).forEach(visit);
+    if (seen.has(name)) causes.push(n);
+  }
+  return causes;
+}
+
 const clean = (v) => String(v).replace(/[\r\n]/g, "").trim(); // one value per line; no injection
 function genEnv(s) {
   const eff = effective(s);
   const out = [`VOLT_ADDONS=${eff.join(",")}`, `PORT=${clean(s.port)}`];
+  if (s.tz) out.push(`SITE_TZ=${clean(s.tz)}`); // admin's timezone, for date display
   if (eff.includes("db")) {
     out.push(`DB_DRIVER=${clean(s.dbDriver)}`);
     if (s.dbDriver === "mongodb") {
@@ -133,11 +154,18 @@ const field = (label, key, placeholder = "") =>
     <input class="form-control" placeholder=${placeholder} value=${() => state()[key]} oninput=${(e) => set({ [key]: e.target.value })} />
   </div>`;
 
+// A dependency pulled in by another enabled add-on shows as checked + disabled
+// (you can't turn it off while something needs it), with a "required by" note —
+// so the .env's VOLT_ADDONS always matches what the boxes show.
 const addonRow = (a) =>
   html`<div class="form-check mb-2">
-    <input class="form-check-input" type="checkbox" id=${"x-" + a.name} checked=${() => state().addons[a.name]} onchange=${() => toggle(a.name)} />
+    <input class="form-check-input" type="checkbox" id=${"x-" + a.name}
+      checked=${() => eff().includes(a.name)}
+      disabled=${() => !state().addons[a.name] && eff().includes(a.name)}
+      onchange=${() => toggle(a.name)} />
     <label class="form-check-label" for=${"x-" + a.name}>
-      <span class="accent">${a.name}</span>${a.dependsOn?.length ? html` <span class="text-muted small">(needs ${a.dependsOn.join(", ")})</span>` : ""}
+      <span class="accent">${a.name}</span>${a.dependsOn?.length ? html` <span class="text-muted small">(needs ${a.dependsOn.join(", ")})</span>` : ""}${() =>
+        !state().addons[a.name] && eff().includes(a.name) ? html` <span class="text-muted small">· required by ${requiredBy(state(), a.name).join(", ")}</span>` : ""}
       <div class="small text-muted">${a.description}</div>
     </label>
   </div>`;

package/templates/starter/setup/setup.js

@@ -25,6 +25,9 @@ const state = signal({
   s3Secret: current.S3_SECRET || "",
   s3PublicBase: current.S3_PUBLIC_BASE || "",
   port: current.PORT || String(defaultPort),
+  // detect the admin's timezone from their browser (the wizard runs here), so
+  // dates render in their zone — not the server's (usually UTC on a host).
+  tz: current.SITE_TZ || Intl.DateTimeFormat().resolvedOptions().timeZone || "",
 });
 const set = (patch) => state({ ...state(), ...patch });
 const toggle = (n) => state({ ...state(), addons: { ...state().addons, [n]: !state().addons[n] } });
@@ -42,10 +45,28 @@ function effective(s) {
   return order.filter((n) => want.has(n));
 }
 
+// which *enabled* add-ons pull in `name` as a (transitive) dependency
+function requiredBy(s, name) {
+  const causes = [];
+  for (const n of order) {
+    if (n === name || !s.addons[n]) continue;
+    const seen = new Set();
+    const visit = (x) => {
+      if (seen.has(x)) return;
+      seen.add(x);
+      (depsOf[x] || []).forEach(visit);
+    };
+    (depsOf[n] || []).forEach(visit);
+    if (seen.has(name)) causes.push(n);
+  }
+  return causes;
+}
+
 const clean = (v) => String(v).replace(/[\r\n]/g, "").trim(); // one value per line; no injection
 function genEnv(s) {
   const eff = effective(s);
   const out = [`VOLT_ADDONS=${eff.join(",")}`, `PORT=${clean(s.port)}`];
+  if (s.tz) out.push(`SITE_TZ=${clean(s.tz)}`); // admin's timezone, for date display
   if (eff.includes("db")) {
     out.push(`DB_DRIVER=${clean(s.dbDriver)}`);
     if (s.dbDriver === "mongodb") {
@@ -133,11 +154,18 @@ const field = (label, key, placeholder = "") =>
     <input class="form-control" placeholder=${placeholder} value=${() => state()[key]} oninput=${(e) => set({ [key]: e.target.value })} />
   </div>`;
 
+// A dependency pulled in by another enabled add-on shows as checked + disabled
+// (you can't turn it off while something needs it), with a "required by" note —
+// so the .env's VOLT_ADDONS always matches what the boxes show.
 const addonRow = (a) =>
   html`<div class="form-check mb-2">
-    <input class="form-check-input" type="checkbox" id=${"x-" + a.name} checked=${() => state().addons[a.name]} onchange=${() => toggle(a.name)} />
+    <input class="form-check-input" type="checkbox" id=${"x-" + a.name}
+      checked=${() => eff().includes(a.name)}
+      disabled=${() => !state().addons[a.name] && eff().includes(a.name)}
+      onchange=${() => toggle(a.name)} />
     <label class="form-check-label" for=${"x-" + a.name}>
-      <span class="accent">${a.name}</span>${a.dependsOn?.length ? html` <span class="text-muted small">(needs ${a.dependsOn.join(", ")})</span>` : ""}
+      <span class="accent">${a.name}</span>${a.dependsOn?.length ? html` <span class="text-muted small">(needs ${a.dependsOn.join(", ")})</span>` : ""}${() =>
+        !state().addons[a.name] && eff().includes(a.name) ? html` <span class="text-muted small">· required by ${requiredBy(state(), a.name).join(", ")}</span>` : ""}
       <div class="small text-muted">${a.description}</div>
     </label>
   </div>`;