@spaceinvoices/react-ui 0.4.3 → 0.4.5

package/src/components/documents/create/document-add-item-form.tsx

@@ -67,6 +67,12 @@ export default function DocumentAddItemForm({
   initialIsGrossPrice = false,
   onPriceModeChange,
 }: DocumentAddItemFormProps) {
+  const itemType = useWatch({
+    control,
+    name: `items.${index}.type`,
+  });
+  const isSeparator = itemType === "separator";
+
   const taxes = useWatch({
     control,
     name: `items.${index}.taxes`,
@@ -140,6 +146,70 @@ export default function DocumentAddItemForm({
     }
   };
 
+  if (isSeparator) {
+    return (
+      <div className="space-y-4 rounded-lg border border-muted-foreground/50 border-dashed p-4">
+        {/* Header row with name and remove button */}
+        <div className="flex items-start gap-4">
+          <div className="flex-1">
+            <FormField
+              control={control}
+              name={`items.${index}.name`}
+              render={({ field }) => (
+                <FormItem>
+                  <FormLabel className="text-muted-foreground text-xs">{t("Section header")}</FormLabel>
+                  <FormControl>
+                    <Input placeholder={t("Section title...")} {...field} />
+                  </FormControl>
+                  <FormMessage />
+                </FormItem>
+              )}
+            />
+          </div>
+
+          {showRemove && (
+            <Button type="button" variant="ghost" size="icon" onClick={onRemove} className="mt-6">
+              <Trash2 className="h-4 w-4" />
+            </Button>
+          )}
+        </div>
+
+        {/* Description and move buttons */}
+        <div className="flex gap-4">
+          <div className="flex-1">
+            <FormField
+              control={control}
+              name={`items.${index}.description`}
+              render={({ field }) => (
+                <FormItem>
+                  <FormControl>
+                    <Textarea placeholder={t("Description")} {...field} />
+                  </FormControl>
+                  <FormMessage />
+                </FormItem>
+              )}
+            />
+          </div>
+
+          {(showMoveUp || showMoveDown) && (
+            <div className="flex flex-col gap-2">
+              {showMoveUp && (
+                <Button type="button" variant="ghost" size="icon" onClick={onMoveUp} className="mt-auto">
+                  <ChevronUp className="h-4 w-4" />
+                </Button>
+              )}
+              {showMoveDown && (
+                <Button type="button" variant="ghost" size="icon" onClick={onMoveDown} className="mt-auto">
+                  <ChevronDown className="h-4 w-4" />
+                </Button>
+              )}
+            </div>
+          )}
+        </div>
+      </div>
+    );
+  }
+
   return (
     <div className="space-y-4 rounded-lg border p-4">
       {/* Header row with name and remove button */}

package/src/components/documents/create/document-details-section.tsx

@@ -2,9 +2,10 @@
  * Shared document details section for invoices and estimates
  * Handles: number, date, and document-type-specific date field (date_due or date_valid_till)
  */
-import type { Entity, Estimate, Invoice } from "@spaceinvoices/js-sdk";
-import { CalendarIcon } from "lucide-react";
+import type { Entity, Estimate, Invoice, ViesCheckResponse } from "@spaceinvoices/js-sdk";
+import { CalendarIcon, Globe, Info, Loader2 } from "lucide-react";
 import { useRef, useState } from "react";
+import { Badge } from "@/ui/components/ui/badge";
 import { Button } from "@/ui/components/ui/button";
 import { Calendar } from "@/ui/components/ui/calendar";
 import { FormControl, FormField, FormItem, FormLabel, FormMessage } from "@/ui/components/ui/form";
@@ -84,11 +85,9 @@ export function DocumentDetailsSection({
 }: DocumentDetailsSectionProps) {
   // Determine the date field name based on document type
   // Delivery notes don't have a secondary date field
-  const hasSecondaryDate = documentType !== "delivery_note";
-  const dateFieldName =
-    documentType === "invoice" || documentType === "advance_invoice" ? "date_due" : "date_valid_till";
-  const dateFieldLabel =
-    documentType === "invoice" || documentType === "advance_invoice" ? t("Due Date") : t("Valid Until");
+  const hasSecondaryDate = documentType !== "delivery_note" && documentType !== "advance_invoice";
+  const dateFieldName = documentType === "invoice" ? "date_due" : "date_valid_till";
+  const dateFieldLabel = documentType === "invoice" ? t("Due Date") : t("Valid Until");
 
   // Check if FURS/FINA inline should show premise/device selects
   const showFursSelects = fursInline && !fursInline.isSkipped;
@@ -216,28 +215,44 @@ export function DocumentDetailsSection({
         render={({ field }) => (
           <FormItem>
             <FormLabel className="">{t("Date")} *</FormLabel>
-            <Popover>
-              <PopoverTrigger asChild>
-                <FormControl>
-                  <Button
-                    variant="outline"
-                    className={cn("w-full pl-3 text-left font-normal", !field.value && "text-muted-foreground")}
-                  >
-                    {field.value ? new Date(field.value).toLocaleDateString() : <span>{t("Pick a date")}</span>}
-                    <CalendarIcon className="ml-auto h-4 w-4 opacity-50" />
-                  </Button>
-                </FormControl>
-              </PopoverTrigger>
-              <PopoverContent className="w-auto p-0" align="start">
-                <Calendar
-                  mode="single"
-                  selected={field.value ? new Date(field.value) : undefined}
-                  onSelect={(date) => field.onChange(date?.toISOString())}
-                  disabled={(date) => date > new Date() || date < new Date("1900-01-01")}
-                  initialFocus
-                />
-              </PopoverContent>
-            </Popover>
+            {showFinaSelects ? (
+              <Tooltip>
+                <TooltipTrigger asChild>
+                  <FormControl>
+                    <Button variant="outline" disabled className="w-full pl-3 text-left font-normal">
+                      {new Date().toLocaleDateString()}
+                      <CalendarIcon className="ml-auto h-4 w-4 opacity-50" />
+                    </Button>
+                  </FormControl>
+                </TooltipTrigger>
+                <TooltipContent>
+                  <p>{t("FINA fiscalized invoices always use the current date")}</p>
+                </TooltipContent>
+              </Tooltip>
+            ) : (
+              <Popover>
+                <PopoverTrigger asChild>
+                  <FormControl>
+                    <Button
+                      variant="outline"
+                      className={cn("w-full pl-3 text-left font-normal", !field.value && "text-muted-foreground")}
+                    >
+                      {field.value ? new Date(field.value).toLocaleDateString() : <span>{t("Pick a date")}</span>}
+                      <CalendarIcon className="ml-auto h-4 w-4 opacity-50" />
+                    </Button>
+                  </FormControl>
+                </PopoverTrigger>
+                <PopoverContent className="w-auto p-0" align="start">
+                  <Calendar
+                    mode="single"
+                    selected={field.value ? new Date(field.value) : undefined}
+                    onSelect={(date) => field.onChange(date?.toISOString())}
+                    disabled={(date) => date > new Date() || date < new Date("1900-01-01")}
+                    initialFocus
+                  />
+                </PopoverContent>
+              </Popover>
+            )}
             <FormMessage />
           </FormItem>
         )}
@@ -598,6 +613,125 @@ export function DocumentNoteField({
   );
 }
 
+/**
+ * Tax clause field component with smart code insertion button
+ * Similar to DocumentNoteField, auto-populated from entity settings based on transaction type
+ */
+type TransactionType = ViesCheckResponse["transaction_type"];
+
+const TRANSACTION_TYPE_LABELS: Record<NonNullable<TransactionType>, string> = {
+  domestic: "Domestic",
+  intra_eu_b2b: "EU B2B",
+  intra_eu_b2c: "EU B2C",
+  export: "Export",
+};
+
+const TRANSACTION_TYPE_VARIANTS: Record<NonNullable<TransactionType>, "secondary" | "default" | "outline"> = {
+  domestic: "secondary",
+  intra_eu_b2b: "default",
+  intra_eu_b2c: "outline",
+  export: "outline",
+};
+
+export function DocumentTaxClauseField({
+  control,
+  t,
+  entity,
+  document,
+  transactionType,
+  isTransactionTypeFetching,
+  isFinaNonDomestic,
+}: {
+  control: AnyControl;
+  t: (key: string) => string;
+  entity?: Entity | null;
+  document?: Partial<Invoice | Estimate> | null;
+  transactionType?: TransactionType;
+  isTransactionTypeFetching?: boolean;
+  isFinaNonDomestic?: boolean;
+}) {
+  const textareaRef = useRef<HTMLTextAreaElement>(null);
+  const [isFocused, setIsFocused] = useState(false);
+
+  const effectiveTransactionType = transactionType ?? "domestic";
+  const showTransactionInfo = true;
+
+  return (
+    <FormField
+      control={control}
+      name="tax_clause"
+      render={({ field }) => {
+        const hasContent = field.value;
+        const showPreview = !isFocused && hasContent && entity;
+        const preview = showPreview ? replaceTemplateVariablesForPreview(field.value || "", entity, document) : null;
+
+        return (
+          <FormItem>
+            <div className="flex items-center justify-between">
+              <FormLabel>{t("Tax Clause")}</FormLabel>
+              <SmartCodeInsertButton
+                textareaRef={textareaRef}
+                value={field.value || ""}
+                onInsert={(newValue) => field.onChange(newValue)}
+                t={t}
+              />
+            </div>
+            {showTransactionInfo && (
+              <div className="flex flex-wrap items-center gap-x-3 gap-y-1.5 rounded-md border border-border/50 bg-muted/30 px-2.5 py-1.5 text-sm">
+                {isTransactionTypeFetching ? (
+                  <div className="flex items-center gap-1.5 text-muted-foreground">
+                    <Loader2 className="size-3.5 animate-spin" />
+                    <span>{t("Determining transaction type...")}</span>
+                  </div>
+                ) : (
+                  <>
+                    <div className="flex items-center gap-1.5">
+                      <Globe className="size-3.5 text-muted-foreground" />
+                      <span className="text-muted-foreground">{t("Transaction type")}:</span>
+                      <Badge variant={TRANSACTION_TYPE_VARIANTS[effectiveTransactionType]}>
+                        {t(TRANSACTION_TYPE_LABELS[effectiveTransactionType])}
+                      </Badge>
+                    </div>
+                    {isFinaNonDomestic && (
+                      <div className="flex items-center gap-1.5 text-muted-foreground">
+                        <Info className="size-3.5" />
+                        <span>{t("This invoice will not be fiscalized (non-domestic transaction)")}</span>
+                      </div>
+                    )}
+                  </>
+                )}
+              </div>
+            )}
+            <FormControl>
+              <div className="relative">
+                <Textarea
+                  {...field}
+                  ref={(e) => {
+                    field.ref(e);
+                    (textareaRef as React.MutableRefObject<HTMLTextAreaElement | null>).current = e;
+                  }}
+                  value={field.value || ""}
+                  placeholder={showPreview ? "" : t("Add tax clause...")}
+                  rows={3}
+                  className={cn("resize-y", showPreview && "text-transparent caret-transparent")}
+                  onFocus={() => setIsFocused(true)}
+                  onBlur={() => setIsFocused(false)}
+                />
+                {showPreview && (
+                  <div className="pointer-events-none absolute inset-0 z-10 flex items-start overflow-hidden rounded-md border border-input bg-background px-3 py-2 shadow-xs">
+                    <div className="w-full whitespace-pre-wrap text-base md:text-sm">{preview}</div>
+                  </div>
+                )}
+              </div>
+            </FormControl>
+            <FormMessage />
+          </FormItem>
+        );
+      }}
+    />
+  );
+}
+
 /**
  * Payment terms field component with smart code insertion button
  * Similar to DocumentNoteField, exported for use in document forms

package/src/components/documents/create/document-items-section.tsx

@@ -2,7 +2,7 @@
  * Shared document items section for invoices and estimates
  * Handles: item management (add, remove, reorder)
  */
-import { PlusIcon } from "lucide-react";
+import { PlusIcon, SeparatorHorizontal } from "lucide-react";
 import type { MutableRefObject } from "react";
 import type { UseFormGetValues, UseFormSetValue, UseFormWatch } from "react-hook-form";
 import { Button } from "@/ui/components/ui/button";
@@ -65,6 +65,18 @@ export function DocumentItemsSection({
     ]);
   };
 
+  const addSeparator = () => {
+    const currentItems = getValues("items") || [];
+    setValue("items", [
+      ...currentItems,
+      {
+        type: "separator",
+        name: "",
+        description: "",
+      },
+    ]);
+  };
+
   const removeItem = (index: number) => {
     const currentItems = getValues("items") || [];
     setValue(
@@ -125,9 +137,14 @@ export function DocumentItemsSection({
         </div>
       ))}
 
-      <Button type="button" variant="outline" onClick={addItem} className="w-full cursor-pointer border-dashed">
-        <PlusIcon className="mr-2 h-4 w-4" /> {t("Add item")}
-      </Button>
+      <div className="flex gap-2">
+        <Button type="button" variant="outline" onClick={addItem} className="flex-1 cursor-pointer border-dashed">
+          <PlusIcon className="mr-2 h-4 w-4" /> {t("Add item")}
+        </Button>
+        <Button type="button" variant="ghost" onClick={addSeparator} className="cursor-pointer text-muted-foreground">
+          <SeparatorHorizontal className="mr-2 h-4 w-4" /> {t("Add separator")}
+        </Button>
+      </div>
     </div>
   );
 }

package/src/components/documents/create/linked-documents-info.tsx

@@ -0,0 +1,82 @@
+import { Table, TableBody, TableCell, TableHead, TableHeader, TableRow } from "@/ui/components/ui/table";
+
+export type LinkedDocumentSummary = {
+  id: string;
+  type: string;
+  number: string;
+  date: string;
+  total_with_tax: number;
+  currency_code: string;
+};
+
+type LinkedDocumentsInfoProps = {
+  documents: LinkedDocumentSummary[];
+  locale: string;
+  t: (key: string) => string;
+};
+
+export function LinkedDocumentsInfo({ documents, locale, t }: LinkedDocumentsInfoProps) {
+  if (documents.length === 0) return null;
+
+  const currencyCode = documents[0].currency_code || "EUR";
+
+  const formatDate = (dateStr: string) => {
+    try {
+      return new Date(dateStr).toLocaleDateString(locale, {
+        year: "numeric",
+        month: "short",
+        day: "numeric",
+      });
+    } catch {
+      return dateStr;
+    }
+  };
+
+  const formatCurrency = (amount: number) => {
+    try {
+      return new Intl.NumberFormat(locale, {
+        style: "currency",
+        currency: currencyCode,
+      }).format(amount);
+    } catch {
+      return `${amount.toFixed(2)} ${currencyCode}`;
+    }
+  };
+
+  const typeLabel = (type: string) => {
+    const key = {
+      delivery_note: "Delivery note",
+      invoice: "Invoice",
+      estimate: "Estimate",
+      credit_note: "Credit note",
+      advance_invoice: "Advance invoice",
+    }[type];
+    return key ? t(key) : type;
+  };
+
+  return (
+    <div className="space-y-2">
+      <h3 className="font-medium text-muted-foreground text-sm">{t("Linked documents")}</h3>
+      <Table>
+        <TableHeader>
+          <TableRow>
+            <TableHead className="h-8 text-xs">{t("Type")}</TableHead>
+            <TableHead className="h-8 text-xs">{t("Number")}</TableHead>
+            <TableHead className="h-8 text-xs">{t("Date")}</TableHead>
+            <TableHead className="h-8 text-right text-xs">{t("Total")}</TableHead>
+          </TableRow>
+        </TableHeader>
+        <TableBody>
+          {documents.map((doc) => (
+            <TableRow key={doc.id}>
+              <TableCell className="py-1.5 text-sm">{typeLabel(doc.type)}</TableCell>
+              <TableCell className="py-1.5 text-sm">{doc.number}</TableCell>
+              <TableCell className="py-1.5 text-sm">{formatDate(doc.date)}</TableCell>
+              <TableCell className="py-1.5 text-right text-sm">{formatCurrency(doc.total_with_tax)}</TableCell>
+            </TableRow>
+          ))}
+        </TableBody>
+      </Table>
+    </div>
+  );
+}

package/src/components/documents/create/live-preview.tsx

@@ -11,7 +11,7 @@ import { useA4Scaling } from "../shared/use-a4-scaling";
 import type { DocumentTypes } from "../types";
 import { filterUnresolvedTaxes } from "./prepare-preview-data";
 
-export type PdfTemplateId = "modern" | "classic" | "minimal" | "fashion";
+export type PdfTemplateId = "modern" | "classic" | "condensed" | "minimal" | "fashion";
 
 type LiveInvoicePreviewProps = {
   data: Partial<CreateInvoiceRequest>;
@@ -30,6 +30,12 @@ type LiveInvoicePreviewProps = {
   documentTypeLabel?: string;
   /** Document type to determine which render endpoint to use */
   documentType?: DocumentTypes;
+  /** QR settings overrides for preview (before saving) */
+  qrOverrides?: {
+    upn_qr_enabled?: boolean;
+    upn_qr_display_mode?: "qr_only" | "full_slip";
+    epc_qr_enabled?: boolean;
+  };
 };
 
 /**
@@ -49,11 +55,12 @@ export function LiveInvoicePreview({
   currency: _currency = "EUR",
   template,
   className,
-  locale,
+  locale: _locale,
   fixedScale,
   t: tProp,
   documentTypeLabel,
   documentType = "invoice",
+  qrOverrides,
 }: LiveInvoicePreviewProps) {
   const t = tProp ?? ((key: string) => key);
   const [previewHtml, setPreviewHtml] = useState<string>("");
@@ -103,7 +110,7 @@ export function LiveInvoicePreview({
           // Filter out unresolved tax_ids (race condition: form may add
           // { tax_id: undefined } before the tax dropdown auto-selects a value)
           items: filterUnresolvedTaxes(invoiceData.items),
-          issuer: invoiceData.issuer || {
+          issuer: {
             name: activeEntity.name,
             address: activeEntity.address,
             address_2: activeEntity.address_2,
@@ -112,11 +119,22 @@ export function LiveInvoicePreview({
             state: activeEntity.state,
             country: activeEntity.country,
             tax_number: activeEntity.tax_number,
+            ...invoiceData.issuer,
           },
         };
 
         // Call the render API using the appropriate SDK method for the document type
-        const renderParams = { partial: "true" as const, template, locale };
+        // Don't send locale — let entity locale drive formatting (decimal separators, date format)
+        const renderParams: Record<string, any> = { partial: "true" as const, template };
+        if (qrOverrides?.upn_qr_enabled !== undefined) {
+          renderParams.upn_qr_enabled = qrOverrides.upn_qr_enabled ? "true" : "false";
+          if (qrOverrides.upn_qr_display_mode) {
+            renderParams.upn_qr_display_mode = qrOverrides.upn_qr_display_mode;
+          }
+        }
+        if (qrOverrides?.epc_qr_enabled !== undefined) {
+          renderParams.epc_qr_enabled = qrOverrides.epc_qr_enabled ? "true" : "false";
+        }
         const requestOpts = { entity_id: activeEntity.id };
         let html: string;
         switch (documentType) {
@@ -170,9 +188,11 @@ export function LiveInvoicePreview({
       activeEntity?.city,
       activeEntity?.name,
       template,
-      locale,
       sdk,
       documentType,
+      qrOverrides?.upn_qr_enabled,
+      qrOverrides?.upn_qr_display_mode,
+      qrOverrides?.epc_qr_enabled,
     ],
   );
 

package/src/components/documents/create/mark-as-paid-section.tsx

@@ -31,6 +31,8 @@ type MarkAsPaidSectionProps = {
   t: (key: string) => string;
   /** Always show payment type selector (e.g. for FINA fiscalization) */
   alwaysShowPaymentType?: boolean;
+  /** Force paid state — hides the checkbox and always shows payment selectors */
+  forced?: boolean;
 };
 
 export function MarkAsPaidSection({
@@ -40,31 +42,38 @@ export function MarkAsPaidSection({
   onPaymentTypesChange,
   t,
   alwaysShowPaymentType,
+  forced,
 }: MarkAsPaidSectionProps) {
-  const showPaymentTypes = checked || alwaysShowPaymentType;
+  const showPaymentTypes = forced || checked || alwaysShowPaymentType;
 
   return (
     <div className={cn("flex flex-col gap-4 rounded-md border p-4", showPaymentTypes && "gap-3")}>
-      <div className="flex flex-row items-center space-x-3 space-y-0">
-        <Checkbox checked={checked} onCheckedChange={(v) => onCheckedChange(v === true)} />
-        <div className="flex items-center gap-1 leading-none">
-          <Label>{checked ? t("Paid") : t("Mark as Paid")}</Label>
-          {!checked && (
-            <Tooltip>
-              <TooltipTrigger asChild>
-                <button
-                  type="button"
-                  className="rounded-full p-1 transition-colors hover:bg-accent"
-                  onClick={(e) => e.preventDefault()}
-                >
-                  <HelpCircle className="size-4 text-muted-foreground" />
-                </button>
-              </TooltipTrigger>
-              <TooltipContent side="top">{t("Invoice will be marked as fully paid upon creation")}</TooltipContent>
-            </Tooltip>
-          )}
+      {forced ? (
+        <div className="flex flex-row items-center space-x-3 space-y-0">
+          <Label>{t("Paid")}</Label>
         </div>
-      </div>
+      ) : (
+        <div className="flex flex-row items-center space-x-3 space-y-0">
+          <Checkbox checked={checked} onCheckedChange={(v) => onCheckedChange(v === true)} />
+          <div className="flex items-center gap-1 leading-none">
+            <Label>{checked ? t("Paid") : t("Mark as Paid")}</Label>
+            {!checked && (
+              <Tooltip>
+                <TooltipTrigger asChild>
+                  <button
+                    type="button"
+                    className="rounded-full p-1 transition-colors hover:bg-accent"
+                    onClick={(e) => e.preventDefault()}
+                  >
+                    <HelpCircle className="size-4 text-muted-foreground" />
+                  </button>
+                </TooltipTrigger>
+                <TooltipContent side="top">{t("Invoice will be marked as fully paid upon creation")}</TooltipContent>
+              </Tooltip>
+            )}
+          </div>
+        </div>
+      )}
 
       {showPaymentTypes && (
         <div className="flex flex-col gap-2">

package/src/components/documents/create/prepare-document-submission.ts

@@ -127,6 +127,15 @@ export function prepareDocumentSubmission<T extends BaseDocumentValues>(
   if (values.items) {
     const priceModes = options.priceModes ?? {};
     values.items = values.items.map((item: any, index: number) => {
+      // Separator items — pass through with only type, name, description
+      if (item.type === "separator") {
+        return {
+          type: "separator",
+          name: item.name,
+          description: item.description || undefined,
+        };
+      }
+
       const { price, ...rest } = item;
 
       // Transform price based on price mode (from component state, not form)
@@ -136,13 +145,16 @@ export function prepareDocumentSubmission<T extends BaseDocumentValues>(
       return {
         ...rest,
         ...priceFields,
-        taxes: item.taxes?.map((tax: any) => {
-          if (tax.tax_id) {
-            // Only send tax_id, API will resolve the rate
-            return { tax_id: tax.tax_id };
-          }
-          return tax;
-        }),
+        taxes: item.taxes
+          ?.map((tax: any) => {
+            if (tax.tax_id) {
+              // Only send tax_id, API will resolve the rate
+              return { tax_id: tax.tax_id };
+            }
+            return tax;
+          })
+          // Filter out empty placeholder taxes (UI adds { tax_id: undefined } for the dropdown)
+          .filter((tax: any) => tax.tax_id || tax.rate !== undefined || tax.classification),
       };
     });
   }

package/src/components/documents/shared/document-preview-display.tsx

@@ -80,9 +80,7 @@ export function DocumentPreviewDisplay({
         try {
           // Determine document type from shareable ID prefix
           const docTypePath = getDocTypePathFromShareableId(shareableId);
-          const response = await fetch(
-            `${apiBaseUrl}/${docTypePath}/shareable/${shareableId}/html${locale ? `?locale=${locale}` : ""}`,
-          );
+          const response = await fetch(`${apiBaseUrl}/${docTypePath}/shareable/${shareableId}/html`);
           if (!response.ok) {
             throw new Error("Failed to load preview");
           }
@@ -108,7 +106,8 @@ export function DocumentPreviewDisplay({
       try {
         // Fetch the rendered HTML by document ID using SDK wrapper
         // Document type is auto-detected from ID prefix (inv_, est_, cre_, adv_)
-        const html = await sdk.invoices.renderHtml(document.id, { template, locale }, { entity_id: activeEntity.id });
+        // Don't send locale — let entity locale drive formatting (decimal separators, date format)
+        const html = await sdk.invoices.renderHtml(document.id, { template }, { entity_id: activeEntity.id });
 
         setPreviewHtml(html);
         setError(null);

package/src/components/documents/types.ts

@@ -46,8 +46,8 @@ export const DOCUMENT_CONFIGS: Record<DocumentTypes, DocumentConfig> = {
     type: "advance_invoice",
     apiEndpoint: "advance-invoices",
     cacheKey: "advance-invoices",
-    dateFieldName: "date_due",
-    dateFieldLabel: "Due Date",
+    dateFieldName: null,
+    dateFieldLabel: null,
     singularName: "Advance Invoice",
     pluralName: "Advance Invoices",
   },