Make scheduling and dates timezone-safe

apps/mobile/app/(app)/invoices/new.tsx

@@ -20,7 +20,10 @@ import { InvoiceEditorFooter } from "@/components/invoices/InvoiceEditorFooter";
 import { InvoicePdfPreview } from "@/components/invoices/InvoicePdfPreview";
 import { InvoiceSetupForm } from "@/components/invoices/InvoiceSetupForm";
 import { InvoiceTotals } from "@/components/invoices/InvoiceTotals";
-import { LineItemEditor, type EditableLineItem } from "@/components/invoices/LineItemEditor";
+import {
+  LineItemEditor,
+  type EditableLineItem,
+} from "@/components/invoices/LineItemEditor";
 import { LoadingScreen } from "@/components/LoadingScreen";
 import { Button } from "@/components/ui/Button";
 import { Card } from "@/components/ui/Card";
@@ -39,6 +42,7 @@ import { useTabBarScrollPadding } from "@/lib/tab-bar-insets";
 import type { ThemeColors } from "@/lib/theme-palette";
 import { useThemedStyles } from "@/lib/use-themed-styles";
 import { api } from "@/lib/trpc";
+import { calendarDateFromLocalDate } from "@beenvoice/domain/time-zone";
 
 export default function NewInvoiceScreen() {
   const styles = useThemedStyles(createNewInvoiceStyles);
@@ -53,8 +57,12 @@ export default function NewInvoiceScreen() {
   const [businessId, setBusinessId] = useState("");
   const [clientId, setClientId] = useState("");
   const [invoiceNumber, setInvoiceNumber] = useState(generateInvoiceNumber);
-  const [issueDate, setIssueDate] = useState(() => new Date());
-  const [dueDate, setDueDate] = useState(() => defaultDueDate(new Date()));
+  const [issueDate, setIssueDate] = useState(() =>
+    calendarDateFromLocalDate(new Date()),
+  );
+  const [dueDate, setDueDate] = useState(() =>
+    defaultDueDate(calendarDateFromLocalDate(new Date())),
+  );
   const [notes, setNotes] = useState("");
   const [taxRate, setTaxRate] = useState("0");
   const [items, setItems] = useState<EditableLineItem[]>(() =>
@@ -62,7 +70,7 @@ export default function NewInvoiceScreen() {
       ? []
       : [
           {
-            date: new Date(),
+            date: calendarDateFromLocalDate(new Date()),
             description: "",
             hours: "1",
             rate: "0",
@@ -96,9 +104,14 @@ export default function NewInvoiceScreen() {
     [clientsQuery.data],
   );
 
-  const selectedClient = clientsQuery.data?.find((client) => client.id === clientId);
+  const selectedClient = clientsQuery.data?.find(
+    (client) => client.id === clientId,
+  );
   const currency = selectedClient?.currency ?? "USD";
-  const resolvedBusinessId = resolveInvoiceBusinessId(businessId, businessesQuery.data);
+  const resolvedBusinessId = resolveInvoiceBusinessId(
+    businessId,
+    businessesQuery.data,
+  );
 
   useEffect(() => {
     if (!selectedClient?.defaultHourlyRate) return;
@@ -170,7 +183,9 @@ export default function NewInvoiceScreen() {
   const invoiceNumberError = isRequiredString(invoiceNumber)
     ? undefined
     : "Invoice number is required";
-  const taxError = isValidTaxRate(taxRate) ? undefined : "Tax rate must be between 0 and 100";
+  const taxError = isValidTaxRate(taxRate)
+    ? undefined
+    : "Tax rate must be between 0 and 100";
   const lineItemsError = validateLineItems(items);
   const canCreate =
     businessOptions.length > 0 &&
@@ -187,7 +202,9 @@ export default function NewInvoiceScreen() {
 
   function updateItem(index: number, patch: Partial<EditableLineItem>) {
     touch("lineItems");
-    setItems((prev) => prev.map((item, i) => (i === index ? { ...item, ...patch } : item)));
+    setItems((prev) =>
+      prev.map((item, i) => (i === index ? { ...item, ...patch } : item)),
+    );
   }
 
   function addItem() {
@@ -195,7 +212,7 @@ export default function NewInvoiceScreen() {
     setItems((prev) => [
       ...prev,
       {
-        date: new Date(),
+        date: calendarDateFromLocalDate(new Date()),
         description: "",
         hours: "1",
         rate: prev[prev.length - 1]?.rate ?? "0",
@@ -266,8 +283,13 @@ export default function NewInvoiceScreen() {
         style={styles.flex}
       >
         <ScrollView
-          contentContainerStyle={[styles.container, { paddingBottom: scrollPadding }]}
-          contentInsetAdjustmentBehavior={Platform.OS === "ios" ? "automatic" : undefined}
+          contentContainerStyle={[
+            styles.container,
+            { paddingBottom: scrollPadding },
+          ]}
+          contentInsetAdjustmentBehavior={
+            Platform.OS === "ios" ? "automatic" : undefined
+          }
           scrollIndicatorInsets={{ bottom: scrollPadding }}
           keyboardShouldPersistTaps="handled"
         >
@@ -287,7 +309,11 @@ export default function NewInvoiceScreen() {
                       : "Add a client before creating an invoice."}
                   </Text>
                   <Button
-                    title={businessOptions.length === 0 ? "Add business" : "Add client"}
+                    title={
+                      businessOptions.length === 0
+                        ? "Add business"
+                        : "Add client"
+                    }
                     variant="secondary"
                     onPress={() =>
                       router.push(
@@ -303,7 +329,9 @@ export default function NewInvoiceScreen() {
                   businessId={businessId}
                   onBusinessIdChange={setBusinessId}
                   businessOptions={businessOptions}
-                  businessError={visible("business") ? businessError : undefined}
+                  businessError={
+                    visible("business") ? businessError : undefined
+                  }
                   onBusinessBlur={() => touch("business")}
                   clientId={clientId}
                   onClientIdChange={setClientId}
@@ -334,8 +362,8 @@ export default function NewInvoiceScreen() {
               <Card title="Line items">
                 {isBlank && items.length === 0 ? (
                   <Text style={styles.emptyLines}>
-                    No line items yet. Save this draft and clock time to it from the Timer tab,
-                    or add lines here.
+                    No line items yet. Save this draft and clock time to it from
+                    the Timer tab, or add lines here.
                   </Text>
                 ) : null}
                 {items.map((item, index) => (
@@ -351,27 +379,41 @@ export default function NewInvoiceScreen() {
                   />
                 ))}
 
-                <Pressable accessibilityRole="button" onPress={addItem} style={styles.addLine}>
+                <Pressable
+                  accessibilityRole="button"
+                  onPress={addItem}
+                  style={styles.addLine}
+                >
                   <Text style={styles.addLineText}>+ Add another line</Text>
                 </Pressable>
 
                 <InvoiceTotals
                   subtotal={formatCurrency(subtotal, currency)}
-                  taxLabel={parsedTaxRate > 0 ? `Tax (${parsedTaxRate}%)` : undefined}
+                  taxLabel={
+                    parsedTaxRate > 0 ? `Tax (${parsedTaxRate}%)` : undefined
+                  }
                   taxAmount={
-                    parsedTaxRate > 0 ? formatCurrency(taxAmount, currency) : undefined
+                    parsedTaxRate > 0
+                      ? formatCurrency(taxAmount, currency)
+                      : undefined
                   }
                   total={formatCurrency(total, currency)}
                 />
               </Card>
 
               {visible("lineItems") && lineItemsError ? (
-                <Text selectable style={styles.error}>{lineItemsError}</Text>
+                <Text selectable style={styles.error}>
+                  {lineItemsError}
+                </Text>
               ) : null}
             </>
           )}
 
-          {error ? <Text selectable style={styles.error}>{error}</Text> : null}
+          {error ? (
+            <Text selectable style={styles.error}>
+              {error}
+            </Text>
+          ) : null}
 
           <InvoiceEditorFooter
             primaryTitle={isBlank ? "Create blank invoice" : "Create invoice"}