From 1af0a6ba7a26a4aec664b076affb2908d8773af3 Mon Sep 17 00:00:00 2001
From: Vishesh 'ironeagle' Bangotra <aetoskia@gmail.com>
Date: Mon, 24 Aug 2026 00:53:43 +0530
Subject: [PATCH 1/6] feat(fetch-requests): pdf/xlsx source types +
 trust_fallback create field

---
 src/FetchRequest/FetchRequestCreate.tsx       |  2 +-
 .../fetch-requests/fetch-requests.models.ts   | 19 +++++++++++++++++--
 src/features/fetch-requests/index.ts          |  4 ++++
 3 files changed, 22 insertions(+), 3 deletions(-)

diff --git a/src/FetchRequest/FetchRequestCreate.tsx b/src/FetchRequest/FetchRequestCreate.tsx
index 5b19e7b..b6d7154 100644
--- a/src/FetchRequest/FetchRequestCreate.tsx
+++ b/src/FetchRequest/FetchRequestCreate.tsx
@@ -13,7 +13,7 @@ import { EmptyState } from "../ui/EmptyState";
 import { formatApiError } from "../features/fetch-requests";
 import { useToast } from "../ui/Toast";
 
-const CREATE_FIELDS = ["account", "bank", "pipeline", "start_date", "end_date", "source"];
+const CREATE_FIELDS = ["account", "bank", "pipeline", "trust_fallback", "start_date", "end_date", "source"];
 
 function FetchRequestList() {
   const navigate = useNavigate();
diff --git a/src/features/fetch-requests/fetch-requests.models.ts b/src/features/fetch-requests/fetch-requests.models.ts
index 82a41eb..f3750dc 100644
--- a/src/features/fetch-requests/fetch-requests.models.ts
+++ b/src/features/fetch-requests/fetch-requests.models.ts
@@ -7,7 +7,10 @@ export type FetchRequestStatus =
   | "completed"
   | "failed";
 
+export type SourceType = "file" | "pdf" | "xlsx" | "email";
+
 export interface FileSource {
+  type?: SourceType;
   path: string;
   bank: string;
   raw_lines?: string[];
@@ -17,7 +20,16 @@ export interface FileSource {
   txn_dicts_count?: number;
 }
 
+export interface PdfSource extends FileSource {
+  type: "pdf";
+}
+
+export interface XlsxSource extends FileSource {
+  type: "xlsx";
+}
+
 export interface EmailSource {
+  type: "email";
   bank: string;
   from_email?: string;
   subject?: string;
@@ -28,10 +40,13 @@ export interface EmailSource {
 
 export type PipelineType = "heuristic" | "llm" | "llama_parse";
 
+export type TrustFallback = "amount" | "balance";
+
 export interface FetchRequestCreate {
-  source: FileSource | EmailSource;
+  source: PdfSource | XlsxSource | FileSource | EmailSource;
   account_name: string;
   pipeline?: PipelineType;
+  trust_fallback?: TrustFallback | null;
   payor_username?: string;
   start_date?: string;
   end_date?: string;
@@ -113,7 +128,7 @@ export interface SSEEvent {
 export interface FetchRequestFilters {
   status?: FetchRequestStatus[];
   account_name?: string;
-  source_type?: "file" | "email";
+  source_type?: SourceType;
 }
 
 export function formatApiError(err: any): string {
diff --git a/src/features/fetch-requests/index.ts b/src/features/fetch-requests/index.ts
index 9750d51..92944cd 100644
--- a/src/features/fetch-requests/index.ts
+++ b/src/features/fetch-requests/index.ts
@@ -5,6 +5,9 @@ export type {
   FetchRequestStatus,
   FetchRequestFilters,
   FileSource,
+  PdfSource,
+  XlsxSource,
+  SourceType,
   EmailSource,
   UploadResult,
   PendingAmbiguity,
@@ -15,6 +18,7 @@ export type {
   SSEEventStatus,
   ProgressMessage,
   PipelineType,
+  TrustFallback,
 } from "./fetch-requests.models";
 export { RETRY_MAX, formatApiError } from "./fetch-requests.models";
 export {
-- 
2.49.1


From 699c3df3a5f61bc5b695c94b76faccf3309c459a Mon Sep 17 00:00:00 2001
From: Vishesh 'ironeagle' Bangotra <aetoskia@gmail.com>
Date: Mon, 24 Aug 2026 15:07:35 +0530
Subject: [PATCH 2/6] feat(fetch-requests): csv source type; stop offering
 legacy file source on create

---
 src/features/fetch-requests/fetch-requests.models.ts | 8 ++++++--
 1 file changed, 6 insertions(+), 2 deletions(-)

diff --git a/src/features/fetch-requests/fetch-requests.models.ts b/src/features/fetch-requests/fetch-requests.models.ts
index f3750dc..8d4574b 100644
--- a/src/features/fetch-requests/fetch-requests.models.ts
+++ b/src/features/fetch-requests/fetch-requests.models.ts
@@ -7,7 +7,7 @@ export type FetchRequestStatus =
   | "completed"
   | "failed";
 
-export type SourceType = "file" | "pdf" | "xlsx" | "email";
+export type SourceType = "file" | "pdf" | "xlsx" | "csv" | "email";
 
 export interface FileSource {
   type?: SourceType;
@@ -28,6 +28,10 @@ export interface XlsxSource extends FileSource {
   type: "xlsx";
 }
 
+export interface CsvSource extends FileSource {
+  type: "csv";
+}
+
 export interface EmailSource {
   type: "email";
   bank: string;
@@ -43,7 +47,7 @@ export type PipelineType = "heuristic" | "llm" | "llama_parse";
 export type TrustFallback = "amount" | "balance";
 
 export interface FetchRequestCreate {
-  source: PdfSource | XlsxSource | FileSource | EmailSource;
+  source: PdfSource | XlsxSource | CsvSource | EmailSource;
   account_name: string;
   pipeline?: PipelineType;
   trust_fallback?: TrustFallback | null;
-- 
2.49.1


From 51a209f3498a6ad7ec0decd03b0006164875cd29 Mon Sep 17 00:00:00 2001
From: Vishesh 'ironeagle' Bangotra <aetoskia@gmail.com>
Date: Mon, 24 Aug 2026 19:36:25 +0530
Subject: [PATCH 3/6] style(fetch-requests): two glass panes on create page +
 matching list rows

- Source & Account / Window & Policy split into equal-height frosted panes (grid stretch, account/bank above source)
- fixed full-viewport brand-indigo gradient backdrop so blur(8px) reads as glass
- recent fetch-request rows adopt the same translucent recipe
---
 src/FetchRequest/FetchRequestCreate.tsx | 170 ++++++++++++++++--------
 1 file changed, 117 insertions(+), 53 deletions(-)

diff --git a/src/FetchRequest/FetchRequestCreate.tsx b/src/FetchRequest/FetchRequestCreate.tsx
index b6d7154..c2aa37c 100644
--- a/src/FetchRequest/FetchRequestCreate.tsx
+++ b/src/FetchRequest/FetchRequestCreate.tsx
@@ -6,6 +6,7 @@ import {
 import { useNavigate } from "react-router-dom";
 import ReceiptLongIcon from "@mui/icons-material/ReceiptLong";
 import DeleteOutlineIcon from "@mui/icons-material/DeleteOutline";
+import { alpha } from "@mui/material/styles";
 import { useAppContext, useResource, ListCellRenderer, FormFieldRenderer, getApi, applyDisplayFormat } from "../../react-openapi";
 import type { FieldConfig } from "../../react-openapi";
 import { PageHeader } from "../ui/PageHeader";
@@ -15,6 +16,33 @@ import { useToast } from "../ui/Toast";
 
 const CREATE_FIELDS = ["account", "bank", "pipeline", "trust_fallback", "start_date", "end_date", "source"];
 
+// Two-pane form partition — explicit names, spec order is unreliable.
+// Grid stretch keeps both panes equal-height regardless of which source
+// variant is active (email adds From/Subject under the type select).
+const SOURCE_PANE_FIELDS = ["account", "bank"];
+const POLICY_PANE_FIELDS = ["start_date", "end_date", "pipeline", "trust_fallback"];
+
+const glassSx = (theme: any) => ({
+  backgroundColor: alpha(theme.palette.background.default, 0.72),
+  backdropFilter: "blur(8px)",
+  borderColor: "divider",
+  boxShadow: 1,
+});
+
+function GlassPanel({ title, children }: { title: string; children: React.ReactNode }) {
+  return (
+    <Paper variant="outlined" sx={(theme) => ({ p: 3, borderRadius: 3, ...glassSx(theme) })}>
+      <Typography
+        variant="overline"
+        sx={{ display: "block", mb: 2, color: "text.secondary", letterSpacing: 1.2, lineHeight: 1.4 }}
+      >
+        {title}
+      </Typography>
+      <Box sx={{ display: "flex", flexDirection: "column", gap: 2 }}>{children}</Box>
+    </Paper>
+  );
+}
+
 function FetchRequestList() {
   const navigate = useNavigate();
   const { list, remove, resource } = useResource("fetch-requests");
@@ -88,13 +116,18 @@ function FetchRequestList() {
           <Paper
             key={row.id ?? i}
             variant="outlined"
-            sx={{
+            sx={(theme) => ({
               p: 2,
               cursor: "pointer",
-              borderRadius: 2,
-              transition: "border-color 160ms ease, box-shadow 160ms ease",
-              "&:hover": { borderColor: "primary.main", boxShadow: 1 },
-            }}
+              borderRadius: 3,
+              transition: "border-color 160ms ease, box-shadow 160ms ease, background-color 160ms ease",
+              "&:hover": {
+                borderColor: "primary.main",
+                boxShadow: 1,
+                backgroundColor: alpha(theme.palette.background.default, 0.9),
+              },
+              ...glassSx(theme),
+            })}
             onClick={() => navigate(`/fetch-requests/${row.id}`)}
           >
             <Box sx={{ display: "flex", gap: 2, flexWrap: "wrap", alignItems: "center" }}>
@@ -207,59 +240,90 @@ export default function FetchRequestCreate() {
     );
   }
 
+  const renderPaneFields = (names: string[]) =>
+    names.map((name) => {
+      const field = formFields.find((f) => f.name === name);
+      if (!field) return null;
+      return (
+        <FormFieldRenderer
+          key={field.name}
+          field={field}
+          value={formData[field.name] ?? ""}
+          onChange={(val) => handleChange(field.name, val)}
+          fkOptions={fkOptions[field.name]}
+        />
+      );
+    });
+
   return (
-    <Container maxWidth="lg" sx={{ py: 4 }}>
-      <PageHeader
-        crumbs={[{ label: "Home", path: "/" }, { label: "Fetch Requests" }]}
-        title="Fetch Requests"
-        subtitle="Import transactions from bank statements or email and track pipeline progress."
+    <Box sx={{ position: "relative" }}>
+      {/* Decorative gradient backdrop — gives the frosted panes something to blur. */}
+      <Box
+        aria-hidden
+        sx={{
+          position: "fixed",
+          inset: 0,
+          zIndex: 0,
+          pointerEvents: "none",
+          background: (theme) =>
+            [
+              `radial-gradient(640px circle at 12% 8%, ${alpha(theme.palette.primary.main, 0.14)}, transparent 70%)`,
+              `radial-gradient(900px circle at 88% 92%, ${alpha(theme.palette.primary.main, 0.09)}, transparent 70%)`,
+              `radial-gradient(520px circle at 78% 22%, ${alpha(theme.palette.primary.light, 0.07)}, transparent 70%)`,
+            ].join(", "),
+        }}
       />
+      <Container maxWidth="lg" sx={{ py: 4, position: "relative", zIndex: 1 }}>
+        <PageHeader
+          crumbs={[{ label: "Home", path: "/" }, { label: "Fetch Requests" }]}
+          title="Fetch Requests"
+          subtitle="Import transactions from bank statements or email and track pipeline progress."
+        />
 
-      <Paper
-        id="new-fetch-request"
-        variant="outlined"
-        sx={{ p: 3, mb: 4, borderRadius: 3 }}
-      >
-        <Typography variant="subtitle1" fontWeight={700} gutterBottom>
-          New Fetch Request
-        </Typography>
-        <Typography variant="body2" color="text.secondary" sx={{ mb: 3, maxWidth: 520, lineHeight: 1.6 }}>
-          Choose an account, pipeline, and a file or email source to kick off an import.
-        </Typography>
+        <Box id="new-fetch-request" sx={{ mb: 4 }}>
+          <Typography variant="subtitle1" fontWeight={700} gutterBottom>
+            New Fetch Request
+          </Typography>
+          <Typography variant="body2" color="text.secondary" sx={{ mb: 2.5, maxWidth: 560, lineHeight: 1.6 }}>
+            Choose an account, pipeline, and a file or email source to kick off an import.
+          </Typography>
 
-        <Box sx={{ display: "flex", flexDirection: "column", gap: 2, maxWidth: 520 }}>
-          {formFields.map((field) => (
-            <FormFieldRenderer
-              key={field.name}
-              field={field}
-              value={formData[field.name] ?? ""}
-              onChange={(val) => handleChange(field.name, val)}
-              fkOptions={fkOptions[field.name]}
-            />
-          ))}
+          <Box
+            sx={{
+              display: "grid",
+              gridTemplateColumns: { xs: "1fr", md: "1fr 1fr" },
+              gap: 2,
+            }}
+          >
+            <GlassPanel title="Source & Account">
+              {renderPaneFields(SOURCE_PANE_FIELDS)}
+              {renderPaneFields(["source"])}
+            </GlassPanel>
+            <GlassPanel title="Window & Policy">{renderPaneFields(POLICY_PANE_FIELDS)}</GlassPanel>
+          </Box>
+
+          <Box sx={{ display: "flex", justifyContent: "flex-end", mt: 3, gap: 1.5 }}>
+            <Button variant="outlined" onClick={() => { setFormData({}); setResult(null); }}>
+              Reset
+            </Button>
+            <Button variant="contained" onClick={handleSubmit} disabled={loading} sx={{ minWidth: 180 }}>
+              {loading ? <CircularProgress size={20} sx={{ mr: 0.5 }} /> : null}
+              Create Fetch Request
+            </Button>
+          </Box>
+
+          {result && (
+            <Alert severity={result.severity} sx={{ mt: 2 }} onClose={() => setResult(null)}>
+              {result.message}
+            </Alert>
+          )}
         </Box>
 
-        <Box sx={{ display: "flex", justifyContent: "flex-end", mt: 3, gap: 1.5 }}>
-          <Button variant="outlined" onClick={() => { setFormData({}); setResult(null); }}>
-            Reset
-          </Button>
-          <Button variant="contained" onClick={handleSubmit} disabled={loading} sx={{ minWidth: 180 }}>
-            {loading ? <CircularProgress size={20} sx={{ mr: 0.5 }} /> : null}
-            Create Fetch Request
-          </Button>
-        </Box>
-
-        {result && (
-          <Alert severity={result.severity} sx={{ mt: 2 }} onClose={() => setResult(null)}>
-            {result.message}
-          </Alert>
-        )}
-      </Paper>
-
-      <Typography variant="h6" fontWeight={700} sx={{ mb: 2 }}>
-        Recent Fetch Requests
-      </Typography>
-      <FetchRequestList />
-    </Container>
+        <Typography variant="h6" fontWeight={700} sx={{ mb: 2 }}>
+          Recent Fetch Requests
+        </Typography>
+        <FetchRequestList />
+      </Container>
+    </Box>
   );
 }
-- 
2.49.1


From a3a87cc1eda362e53b29a396200cb2af5f3b4879 Mon Sep 17 00:00:00 2001
From: Vishesh 'ironeagle' Bangotra <aetoskia@gmail.com>
Date: Mon, 24 Aug 2026 19:39:27 +0530
Subject: [PATCH 4/6] style(reports): right-align generated date in report rows

---
 src/Reports/ReportList.tsx | 11 ++++++-----
 1 file changed, 6 insertions(+), 5 deletions(-)

diff --git a/src/Reports/ReportList.tsx b/src/Reports/ReportList.tsx
index ad264cf..e35710c 100644
--- a/src/Reports/ReportList.tsx
+++ b/src/Reports/ReportList.tsx
@@ -81,14 +81,15 @@ export function ReportList({ reports, loading, fields, selectedId, onView, onReg
                       {amounts}
                     </Typography>
                   )}
-                  {fields && (
-                    <Box sx={{ color: "text.secondary" }}>
-                      <ListCellRenderer field={fields.generatedAt} value={report.generated_at} />
-                    </Box>
-                  )}
                 </Box>
               </Box>
 
+              {fields && (
+                <Box sx={{ ml: "auto", flexShrink: 0, color: "text.secondary" }}>
+                  <ListCellRenderer field={fields.generatedAt} value={report.generated_at} />
+                </Box>
+              )}
+
               <Box sx={{ display: "flex", gap: 0.5, flexShrink: 0 }}>
                 <Button size="small" variant="contained" startIcon={<VisibilityIcon />} onClick={() => onView(report.id)}>
                   View
-- 
2.49.1


From 0b8673de5241a4b84dd8a7b0c1592c9036dd6111 Mon Sep 17 00:00:00 2001
From: Vishesh 'ironeagle' Bangotra <aetoskia@gmail.com>
Date: Mon, 24 Aug 2026 19:46:59 +0530
Subject: [PATCH 5/6] style: right-align created date in fetch-request and
 report rows

- created_at pinned right before row actions in both lists; remaining cells wrap inside a shrinking area so the date never wraps to a left-aligned line
---
 src/FetchRequest/FetchRequestCreate.tsx | 48 ++++++++++++++++---------
 src/Reports/ReportList.tsx              |  2 +-
 2 files changed, 33 insertions(+), 17 deletions(-)

diff --git a/src/FetchRequest/FetchRequestCreate.tsx b/src/FetchRequest/FetchRequestCreate.tsx
index c2aa37c..2a944b6 100644
--- a/src/FetchRequest/FetchRequestCreate.tsx
+++ b/src/FetchRequest/FetchRequestCreate.tsx
@@ -130,22 +130,38 @@ function FetchRequestList() {
             })}
             onClick={() => navigate(`/fetch-requests/${row.id}`)}
           >
-            <Box sx={{ display: "flex", gap: 2, flexWrap: "wrap", alignItems: "center" }}>
-              {columns.map((col) => (
-                <Box key={col.name} sx={{ minWidth: 120 }}>
-                  <Typography variant="caption" color="text.secondary" sx={{ display: "block" }}>
-                    {col.label}
-                  </Typography>
-                  <ListCellRenderer
-                    field={col}
-                    value={row[col.name]}
-                    displayFormat={col.fk
-                      ? (allResources.find((r) => r.name === col.fk!.resource)?.displayFormat ?? displayFormat)
-                      : displayFormat}
-                  />
-                </Box>
-              ))}
-              <Box sx={{ ml: "auto", flexShrink: 0 }}>
+            <Box sx={{ display: "flex", gap: 2, alignItems: "center" }}>
+              <Box sx={{ display: "flex", gap: 2, flexWrap: "wrap", alignItems: "center", flex: 1, minWidth: 0 }}>
+                {columns
+                  .filter((col) => col.name !== "created_at")
+                  .map((col) => (
+                    <Box key={col.name} sx={{ minWidth: 120 }}>
+                      <Typography variant="caption" color="text.secondary" sx={{ display: "block" }}>
+                        {col.label}
+                      </Typography>
+                      <ListCellRenderer
+                        field={col}
+                        value={row[col.name]}
+                        displayFormat={col.fk
+                          ? (allResources.find((r) => r.name === col.fk!.resource)?.displayFormat ?? displayFormat)
+                          : displayFormat}
+                      />
+                    </Box>
+                  ))}
+              </Box>
+              {(() => {
+                const dateCol = columns.find((col) => col.name === "created_at");
+                if (!dateCol) return null;
+                return (
+                  <Box sx={{ flexShrink: 0, textAlign: "right" }}>
+                    <Typography variant="caption" color="text.secondary" sx={{ display: "block" }}>
+                      {dateCol.label}
+                    </Typography>
+                    <ListCellRenderer field={dateCol} value={row.created_at} displayFormat={displayFormat} />
+                  </Box>
+                );
+              })()}
+              <Box sx={{ flexShrink: 0 }}>
                 <Tooltip title="Delete fetch request">
                   <IconButton
                     size="small"
diff --git a/src/Reports/ReportList.tsx b/src/Reports/ReportList.tsx
index e35710c..44751ca 100644
--- a/src/Reports/ReportList.tsx
+++ b/src/Reports/ReportList.tsx
@@ -51,7 +51,7 @@ export function ReportList({ reports, loading, fields, selectedId, onView, onReg
               "&:hover": { borderColor: "primary.light" },
             }}
           >
-            <Box sx={{ display: "flex", alignItems: "center", gap: 2, flexWrap: "wrap" }}>
+            <Box sx={{ display: "flex", alignItems: "center", gap: 2 }}>
               <Box sx={{ flex: "1 1 260px", minWidth: 0 }}>
                 <Typography variant="body1" fontWeight={600} noWrap sx={{ fontSize: "0.9375rem" }}>
                   {report.name || report.id}
-- 
2.49.1


From 231869debfe2f2e6c940a934082f0ba2450a3b15 Mon Sep 17 00:00:00 2001
From: Vishesh 'ironeagle' Bangotra <aetoskia@gmail.com>
Date: Tue, 25 Aug 2026 00:23:20 +0530
Subject: [PATCH 6/6] feat(react-openapi): date-aware display formatting +
 x-edit-as for datetime fields

---
 react-openapi/index.ts                        |  1 +
 .../components/fields/ListCellRenderer.tsx    |  5 +-
 .../components/fields/renderers/DateField.tsx | 25 ++++++--
 .../fields/renderers/InlineRefField.tsx       |  3 +-
 react-openapi/src/components/fields/utils.ts  |  4 +-
 .../src/transformers/field-config.ts          |  2 +
 react-openapi/src/types.ts                    |  2 +
 react-openapi/src/utils/datetime.ts           | 63 +++++++++++++++++++
 src/Reports/ReportViewer.tsx                  |  4 +-
 9 files changed, 98 insertions(+), 11 deletions(-)
 create mode 100644 react-openapi/src/utils/datetime.ts

diff --git a/react-openapi/index.ts b/react-openapi/index.ts
index 0dd032d..5852ac9 100644
--- a/react-openapi/index.ts
+++ b/react-openapi/index.ts
@@ -17,5 +17,6 @@ export { getApi } from "./src/hooks/useApi";
 export { useItemSse } from "./src/hooks/useItemSse";
 export { sanitizePayload } from "./src/utils/sanitize-payload";
 export type { FkResolver } from "./src/utils/sanitize-payload";
+export { formatDate, formatDateTime } from "./src/utils/datetime";
 export type { FilterComponentProps } from "./src/context/useResource";
 export type { SpecConfiguration, ResourceConfig, FieldConfig, FKFieldConfig, ResourceRelationship, ProfileOperation, ProfileComponents, AuthConfig } from "./src/types";
diff --git a/react-openapi/src/components/fields/ListCellRenderer.tsx b/react-openapi/src/components/fields/ListCellRenderer.tsx
index 598dd16..9d6e235 100644
--- a/react-openapi/src/components/fields/ListCellRenderer.tsx
+++ b/react-openapi/src/components/fields/ListCellRenderer.tsx
@@ -3,6 +3,7 @@ import { useNavigate } from "react-router-dom";
 import { Box, Typography, Chip, Avatar, Dialog, DialogTitle, DialogContent, DialogActions, Button, Grid } from "@mui/material";
 import type { FieldConfig } from "../../types";
 import { applyDisplayFormat, resolveMediaUrl } from "./utils";
+import { formatByFieldFormat } from "../../utils/datetime";
 import { InlineRefField } from "./renderers/InlineRefField";
 import { CurrencyField } from "./renderers/CurrencyField";
 import { extractFields } from "../../transformers/field-config";
@@ -57,7 +58,7 @@ export function ListCellRenderer({ field, value, displayFormat, basePath }: List
                   {sf.label}
                 </Typography>
                 <Typography variant="body2">
-                  {fv == null ? "—" : typeof fv === "object" ? (sf.inlineDisplayFormat ? applyDisplayFormat(fv, sf.inlineDisplayFormat) : JSON.stringify(fv)) : String(fv)}
+                  {fv == null ? "—" : typeof fv === "object" ? (sf.inlineDisplayFormat ? applyDisplayFormat(fv, sf.inlineDisplayFormat) : JSON.stringify(fv)) : formatByFieldFormat(fv, sf.format)}
                 </Typography>
               </Box>
             </Grid>
@@ -153,5 +154,5 @@ export function ListCellRenderer({ field, value, displayFormat, basePath }: List
     return <Typography variant="body2">{applyDisplayFormat(value, displayFormat ?? "")}</Typography>;
   }
 
-  return <Typography variant="body2">{String(value)}</Typography>;
+  return <Typography variant="body2">{formatByFieldFormat(value, field.format)}</Typography>;
 }
diff --git a/react-openapi/src/components/fields/renderers/DateField.tsx b/react-openapi/src/components/fields/renderers/DateField.tsx
index 8540006..5f335e7 100644
--- a/react-openapi/src/components/fields/renderers/DateField.tsx
+++ b/react-openapi/src/components/fields/renderers/DateField.tsx
@@ -10,11 +10,26 @@ interface Props {
 }
 
 export function DateField({ field, value, onChange, error }: Props) {
-  const inputType = field.format === "date" ? "date" : "datetime-local";
+  // `x-edit-as: date` renders a date-time field as a plain date picker;
+  // the picked day is submitted as midnight so the stored type is intact.
+  const editAsDate = field.format === "date" || field.editAs === "date";
 
-  const normalized = field.format === "date-time" && typeof value === "string"
-    ? value.replace(/\.\d+Z$/, "").replace(/Z$/, "")
-    : value;
+  const inputType = editAsDate ? "date" : "datetime-local";
+
+  const normalized = (() => {
+    if (field.format !== "date-time" || typeof value !== "string") return value;
+    if (editAsDate) return value.slice(0, 10);
+    return value.replace(/\.\d+Z$/, "").replace(/Z$/, "");
+  })();
+
+  const handleChange = (e: React.ChangeEvent<HTMLInputElement>) => {
+    const v = e.target.value;
+    if (editAsDate && field.format === "date-time" && /^\d{4}-\d{2}-\d{2}$/.test(v)) {
+      onChange(`${v}T00:00:00`);
+    } else {
+      onChange(v);
+    }
+  };
 
   return (
     <TextField
@@ -22,7 +37,7 @@ export function DateField({ field, value, onChange, error }: Props) {
       label={field.label}
       type={inputType}
       value={normalized ?? ""}
-      onChange={(e) => onChange(e.target.value)}
+      onChange={handleChange}
       error={!!error}
       helperText={error || field.description || undefined}
       placeholder={field.description || undefined}
diff --git a/react-openapi/src/components/fields/renderers/InlineRefField.tsx b/react-openapi/src/components/fields/renderers/InlineRefField.tsx
index 5a4adc6..d28a77e 100644
--- a/react-openapi/src/components/fields/renderers/InlineRefField.tsx
+++ b/react-openapi/src/components/fields/renderers/InlineRefField.tsx
@@ -2,6 +2,7 @@ import React, { useState } from "react";
 import { Box, Typography, Chip, Dialog, DialogTitle, DialogContent, DialogActions, Button, Grid } from "@mui/material";
 import type { FieldConfig } from "../../../types";
 import { applyDisplayFormat } from "../utils";
+import { formatByFieldFormat } from "../../../utils/datetime";
 import { extractFields } from "../../../transformers/field-config";
 import { useAppContext } from "../../../context/AppContext";
 
@@ -68,7 +69,7 @@ export function InlineRefField({ field, value }: Props) {
                   <Typography variant="caption" color="text.secondary" fontWeight={600} sx={{ mb: 0.25, display: "block" }}>
                     {sf.label}
                   </Typography>
-                  <Typography variant="body2">{value?.[sf.name] == null ? "—" : typeof value[sf.name] === "object" ? (sf.inlineDisplayFormat ? applyDisplayFormat(value[sf.name], sf.inlineDisplayFormat) : JSON.stringify(value[sf.name])) : String(value[sf.name])}</Typography>
+                  <Typography variant="body2">{value?.[sf.name] == null ? "—" : typeof value[sf.name] === "object" ? (sf.inlineDisplayFormat ? applyDisplayFormat(value[sf.name], sf.inlineDisplayFormat) : JSON.stringify(value[sf.name])) : formatByFieldFormat(value[sf.name], sf.format)}</Typography>
                 </Box>
               </Grid>
             ))}
diff --git a/react-openapi/src/components/fields/utils.ts b/react-openapi/src/components/fields/utils.ts
index 66407a5..a6ed871 100644
--- a/react-openapi/src/components/fields/utils.ts
+++ b/react-openapi/src/components/fields/utils.ts
@@ -1,3 +1,5 @@
+import { formatIsoLike } from "../../utils/datetime";
+
 function getNested(obj: any, path: string): any {
   return path.split(".").reduce((o, k) => o?.[k], obj);
 }
@@ -6,7 +8,7 @@ export function applyDisplayFormat(item: any, format: string): string {
   if (!item || typeof item !== "object") return String(item ?? "");
   return format.replace(/\{([\w.]+)\}/g, (_, key) => {
     const val = getNested(item, key);
-    return val != null ? String(val) : "";
+    return val != null ? formatIsoLike(val) : "";
   });
 }
 
diff --git a/react-openapi/src/transformers/field-config.ts b/react-openapi/src/transformers/field-config.ts
index cbdb793..526e8b0 100644
--- a/react-openapi/src/transformers/field-config.ts
+++ b/react-openapi/src/transformers/field-config.ts
@@ -64,6 +64,7 @@ function extractOneOfOptions(schema: any, schemas: Record<string, any>, discrimi
           description: prop["x-description"] ?? "",
           type: prop.type ?? "string",
           format: prop.format,
+          editAs: prop["x-edit-as"],
           order: prop["x-order"] ?? Infinity,
           hidden: prop["x-hidden"] ?? {},
           filterable: prop["x-filterable"] ?? false,
@@ -130,6 +131,7 @@ export function extractFields(schemaName: string, schema: any, schemas: Record<s
         description: prop["x-description"] ?? "",
         type: isRef && refSchema ? "object" : isOneOf ? "object" : (prop.type ?? "string"),
         format: prop.format,
+        editAs: prop["x-edit-as"],
         order: prop["x-order"] ?? Infinity,
         hidden: prop["x-hidden"] ?? {},
         filterable: prop["x-filterable"] ?? false,
diff --git a/react-openapi/src/types.ts b/react-openapi/src/types.ts
index f0db395..16b82ec 100644
--- a/react-openapi/src/types.ts
+++ b/react-openapi/src/types.ts
@@ -101,6 +101,8 @@ export interface FieldConfig {
   description: string;
   type: string;
   format?: string;
+  /** `x-edit-as: date` — edit a `date-time` field with a plain date input; submits midnight. */
+  editAs?: string;
   order: number;
   hidden: { form?: boolean; list?: boolean; detail?: boolean };
   filterable: boolean;
diff --git a/react-openapi/src/utils/datetime.ts b/react-openapi/src/utils/datetime.ts
new file mode 100644
index 0000000..8ad0fc3
--- /dev/null
+++ b/react-openapi/src/utils/datetime.ts
@@ -0,0 +1,63 @@
+/**
+ * Zero-dependency date/time display helpers.
+ *
+ * Only ISO-shaped strings ("2026-08-24", "2026-08-24T09:07:25[.f][Z]") are
+ * reformatted; anything else (DD-MM-YYYY expense strings, free text) passes
+ * through untouched. Naive strings without a zone are parsed as clock time
+ * so the displayed wall time matches what the backend stored.
+ */
+
+const ISO_DATE = /^\d{4}-\d{2}-\d{2}$/;
+const ISO_DATETIME = /^\d{4}-\d{2}-\d{2}[T ]\d{2}:\d{2}/;
+
+function parseIso(value: any): Date | null {
+  if (typeof value !== "string") return null;
+  if (!ISO_DATE.test(value) && !ISO_DATETIME.test(value)) return null;
+  const d = new Date(value);
+  return isNaN(d.getTime()) ? null : d;
+}
+
+const DATE_FMT = new Intl.DateTimeFormat("en-IN", { day: "numeric", month: "short", year: "numeric" });
+const DATETIME_FMT = new Intl.DateTimeFormat("en-IN", {
+  day: "numeric",
+  month: "short",
+  year: "numeric",
+  hour: "2-digit",
+  minute: "2-digit",
+  hour12: false,
+});
+
+function fallback(value: any): string {
+  return typeof value === "string" ? value : value != null ? String(value) : "";
+}
+
+/** "2026-08-24" -> "24 Aug 2026"; non-ISO values pass through. */
+export function formatDate(value: any): string {
+  const d = parseIso(value);
+  return d ? DATE_FMT.format(d) : fallback(value);
+}
+
+/** "2026-08-24T09:07:25" -> "24 Aug 2026, 09:07"; non-ISO values pass through. */
+export function formatDateTime(value: any): string {
+  const d = parseIso(value);
+  return d ? DATETIME_FMT.format(d) : fallback(value);
+}
+
+/** Route by OpenAPI field format ("date" | "date-time"); other formats render plainly. */
+export function formatByFieldFormat(value: any, format?: string): string {
+  if (format === "date") return formatDate(value);
+  if (format === "date-time") return formatDateTime(value);
+  return fallback(value);
+}
+
+/**
+ * Metadata-free variant for display-format templates ({key} interpolation):
+ * reformats a scalar only when it happens to be ISO-shaped.
+ */
+export function formatIsoLike(value: any): string {
+  if (typeof value === "string") {
+    if (ISO_DATETIME.test(value)) return formatDateTime(value);
+    if (ISO_DATE.test(value)) return formatDate(value);
+  }
+  return fallback(value);
+}
diff --git a/src/Reports/ReportViewer.tsx b/src/Reports/ReportViewer.tsx
index ad151f2..fa2bd82 100644
--- a/src/Reports/ReportViewer.tsx
+++ b/src/Reports/ReportViewer.tsx
@@ -4,7 +4,7 @@ import CloseIcon from "@mui/icons-material/Close";
 import CachedIcon from "@mui/icons-material/Cached";
 import KeyboardArrowDownIcon from "@mui/icons-material/KeyboardArrowDown";
 import KeyboardArrowUpIcon from "@mui/icons-material/KeyboardArrowUp";
-import { FkMultiSelectField, useResource, formatCurrency } from "../../react-openapi";
+import { FkMultiSelectField, useResource, formatCurrency, formatDateTime } from "../../react-openapi";
 import type { FieldConfig } from "../../react-openapi";
 import { StatCard } from "../common/components/StatCard";
 import { TransactionList } from "../common/components/TransactionList";
@@ -266,7 +266,7 @@ export function ReportViewer({ id, version, fields, onClose, onRegenerated }: Re
           </Typography>
           <Box sx={{ display: "flex", gap: 1.5, flexWrap: "wrap" }}>
             <Typography variant="caption" color="text.secondary">
-              flow {report.flow} · generated {report.generated_at ?? report.created_at}
+              flow {report.flow} · generated {formatDateTime(report.generated_at ?? report.created_at)}
             </Typography>
             {range && (
               <Typography variant="caption" color="text.disabled">
-- 
2.49.1