Format created date as YYYY-MM-DD HH:MM TZ on view page

- Parse timestamp as UTC, display in user's local timezone
- 24-hour format with short timezone name (e.g. 2026-04-16 17:27 EDT)

src/pages/workorders/api.js

@@ -23,6 +23,7 @@ export const getWorkOrderById = async (id) => {
       assignedTo: wo.assignee ?? wo.assignedTo ?? "",
       dueDate: wo.dueDate ? wo.dueDate.split("T")[0] : "",
       createdDate: wo.createdDate ? wo.createdDate.split("T")[0] : "",
+      createdDateFull: wo.createdDate ?? "",
       description: wo.description ?? "",
       priority: wo.priority ?? "",
       status: wo.status ?? "Open",

src/pages/workorders/view/WorkOrderViewPage.js

@@ -4,6 +4,15 @@ import { toast } from "react-toastify";
 import { getWorkOrderById } from "../api";
 import "./WorkOrderViewPage.css";
 
+function formatDateTime(value) {
+  const d = new Date(value.endsWith("Z") ? value : value + "Z");
+  if (isNaN(d)) return value;
+  const date = d.toLocaleDateString("en-CA");
+  const time = d.toLocaleTimeString(undefined, { hour: "2-digit", minute: "2-digit", hour12: false });
+  const tz = d.toLocaleTimeString(undefined, { timeZoneName: "short" }).split(" ").pop();
+  return `${date} ${time} ${tz}`;
+}
+
 export default function WorkOrderViewPage() {
   const { id } = useParams();
   const navigate = useNavigate();
@@ -79,7 +88,9 @@ export default function WorkOrderViewPage() {
                 </div>
                 <div className="woField">
                   <span className="woFieldLabel">Created</span>
-                  <span className="woFieldValue">{wo.createdDate || "—"}</span>
+                  <span className="woFieldValue">
+                    {wo.createdDateFull ? formatDateTime(wo.createdDateFull) : "—"}
+                  </span>
                 </div>
                 <div className="woField">
                   <span className="woFieldLabel">Due Date</span>