Move production to beenvoice.app with migrated accounts, refreshed auth and timer UX, and expanded invoice flows.

Official URL migration preserves sessions, shortcuts prefs, and last clock-in client; auth screens match web with legal links; time clock and invoice editor/send flows are updated for the new domain and UI patterns.

Co-authored-by: Cursor <cursoragent@cursor.com>

app/(app)/invoices/edit/[id].tsx

@@ -16,20 +16,20 @@ import {
   InvoiceEditorSectionTabs,
   type InvoiceEditorSection,
 } from "@/components/invoices/InvoiceEditorSectionTabs";
+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, LineItemsTableHeader, 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";
-import { DateTimeField } from "@/components/ui/DateTimeField";
-import { Input } from "@/components/ui/Input";
 import { fonts, spacing } from "@/constants/theme";
 import { useAppTheme } from "@/contexts/ThemeContext";
 import { formatCurrency } from "@/lib/format";
+import { isValidTaxRate, validateLineItems } from "@/lib/form-validation";
+import { resolveInvoiceBusinessId } from "@/lib/invoice-business";
 import { getInvoiceStatus } from "@/lib/invoice-status";
 import { buildPreviewPdfInput } from "@/lib/invoice-pdf-input";
-import { validateLineItems } from "@/lib/form-validation";
 import { ensureNotificationPermissions } from "@/lib/invoice-send-reminders";
 import { useTabBarScrollPadding } from "@/lib/tab-bar-insets";
 import type { ThemeColors } from "@/lib/theme-palette";
@@ -47,19 +47,27 @@ export default function InvoiceEditScreen() {
     { id: id ?? "" },
     { enabled: Boolean(id) },
   );
+  const businessesQuery = api.businesses.getAll.useQuery();
+  const clientsQuery = api.clients.getAll.useQuery();
 
+  const [businessId, setBusinessId] = useState("");
+  const [clientId, setClientId] = useState("");
   const [notes, setNotes] = useState("");
   const [dueDate, setDueDate] = useState(() => new Date());
+  const [taxRate, setTaxRate] = useState("0");
   const [sendReminderAt, setSendReminderAt] = useState<Date | null>(null);
   const [items, setItems] = useState<EditableLineItem[]>([]);
-  const [section, setSection] = useState<InvoiceEditorSection>("edit");
+  const [section, setSection] = useState<InvoiceEditorSection>("setup");
   const [error, setError] = useState<string | null>(null);
 
   useEffect(() => {
     const invoice = invoiceQuery.data;
     if (!invoice) return;
+    setBusinessId(invoice.businessId ?? invoice.business?.id ?? "");
+    setClientId(invoice.clientId);
     setNotes(invoice.notes ?? "");
     setDueDate(new Date(invoice.dueDate));
+    setTaxRate(String(invoice.taxRate));
     setSendReminderAt(invoice.sendReminderAt ? new Date(invoice.sendReminderAt) : null);
     setItems(
       invoice.items.map((item) => ({
@@ -72,6 +80,11 @@ export default function InvoiceEditScreen() {
     );
   }, [invoiceQuery.data]);
 
+  useEffect(() => {
+    if (businessId || !businessesQuery.data?.length) return;
+    setBusinessId(resolveInvoiceBusinessId(null, businessesQuery.data));
+  }, [businessId, businessesQuery.data]);
+
   const updateInvoice = api.invoices.update.useMutation({
     onSuccess: () => {
       void utils.invoices.getById.invalidate({ id: id ?? "" });
@@ -85,19 +98,31 @@ export default function InvoiceEditScreen() {
     onError: (err) => setError(err.message),
   });
 
-  const sendInvoice = api.email.sendInvoice.useMutation({
-    onSuccess: (data) => {
-      Alert.alert("Invoice sent", data.message);
-      void utils.invoices.getById.invalidate({ id: id ?? "" });
-      void utils.invoices.getAll.invalidate();
-      void utils.dashboard.getStats.invalidate();
-    },
-    onError: (err) => Alert.alert("Could not send invoice", err.message),
-  });
-
   const invoice = invoiceQuery.data;
   const isDraft = invoice?.status === "draft";
 
+  const businessOptions = useMemo(
+    () =>
+      (businessesQuery.data ?? []).map((business) => ({
+        label: business.name,
+        value: business.id,
+      })),
+    [businessesQuery.data],
+  );
+
+  const clientOptions = useMemo(
+    () =>
+      (clientsQuery.data ?? []).map((client) => ({
+        label: client.name,
+        value: client.id,
+      })),
+    [clientsQuery.data],
+  );
+
+  const selectedClient = clientsQuery.data?.find((client) => client.id === clientId);
+  const currency = selectedClient?.currency ?? invoice?.currency ?? "USD";
+  const resolvedBusinessId = resolveInvoiceBusinessId(businessId, businessesQuery.data);
+
   const subtotal = useMemo(
     () =>
       items.reduce((sum, item) => {
@@ -108,35 +133,39 @@ export default function InvoiceEditScreen() {
     [items],
   );
 
-  const taxRate = invoice?.taxRate ?? 0;
-  const taxAmount = subtotal * (taxRate / 100);
+  const parsedTaxRate = Number(taxRate) || 0;
+  const taxAmount = subtotal * (parsedTaxRate / 100);
   const total = subtotal + taxAmount;
-  const currency = invoice?.currency ?? "USD";
   const lineItemsError = isDraft ? validateLineItems(items) : null;
-  const canSave = isDraft ? !lineItemsError : true;
+  const taxError = isDraft && !isValidTaxRate(taxRate) ? "Tax rate must be between 0 and 100" : null;
+  const businessError = isDraft && !resolvedBusinessId ? "Select a business" : undefined;
+  const clientError = isDraft && !clientId ? "Select a client" : undefined;
+  const canSave = isDraft
+    ? !lineItemsError && !taxError && !businessError && !clientError
+    : true;
 
   const previewInput = useMemo(() => {
     if (!invoice) return null;
     return buildPreviewPdfInput({
       invoiceNumber: invoice.invoiceNumber,
       invoicePrefix: invoice.invoicePrefix,
-      businessId: invoice.businessId,
-      clientId: invoice.clientId,
+      businessId: resolvedBusinessId,
+      clientId,
       issueDate: new Date(invoice.issueDate),
       dueDate,
       status: invoice.status as "draft" | "sent" | "paid",
       notes,
-      taxRate,
+      taxRate: parsedTaxRate,
       currency,
       items,
     });
-  }, [invoice, dueDate, notes, taxRate, currency, items]);
+  }, [invoice, resolvedBusinessId, clientId, dueDate, notes, parsedTaxRate, currency, items]);
 
   if (!id) {
     return <LoadingScreen message="Invalid invoice" />;
   }
 
-  if (invoiceQuery.isLoading) {
+  if (invoiceQuery.isLoading || businessesQuery.isLoading || clientsQuery.isLoading) {
     return <LoadingScreen message="Loading invoice…" />;
   }
 
@@ -147,28 +176,6 @@ export default function InvoiceEditScreen() {
   const status = getInvoiceStatus(invoice);
   const clientEmail = invoice.client?.email?.trim() ?? "";
 
-  function promptSendInvoice() {
-    if (!clientEmail) {
-      Alert.alert(
-        "No client email",
-        "Add an email address to this client on the web app before sending invoices.",
-      );
-      return;
-    }
-
-    Alert.alert(
-      status === "draft" ? "Send invoice" : "Resend invoice",
-      `Email this invoice to ${clientEmail}?`,
-      [
-        { text: "Cancel", style: "cancel" },
-        {
-          text: "Send",
-          onPress: () => sendInvoice.mutate({ invoiceId: invoice!.id }),
-        },
-      ],
-    );
-  }
-
   function updateItem(index: number, patch: Partial<EditableLineItem>) {
     setItems((prev) => prev.map((item, i) => (i === index ? { ...item, ...patch } : item)));
   }
@@ -186,10 +193,6 @@ export default function InvoiceEditScreen() {
   }
 
   function removeItem(index: number) {
-    if (items.length <= 1) {
-      Alert.alert("Cannot remove", "An invoice needs at least one line item.");
-      return;
-    }
     setItems((prev) => prev.filter((_, i) => i !== index));
   }
 
@@ -230,6 +233,10 @@ export default function InvoiceEditScreen() {
       sendReminderAt,
       ...(isDraft
         ? {
+            businessId: resolvedBusinessId,
+            clientId,
+            taxRate: parsedTaxRate,
+            currency,
             items: parsedItems,
           }
         : {}),
@@ -254,7 +261,9 @@ export default function InvoiceEditScreen() {
               {invoice.invoicePrefix}
               {invoice.invoiceNumber}
             </Text>
-            <Text style={styles.clientName}>{invoice.client?.name ?? "Client"}</Text>
+            <Text style={styles.clientName}>
+              {selectedClient?.name ?? invoice.client?.name ?? "Client"}
+            </Text>
           </View>
 
           <InvoiceEditorSectionTabs value={section} onChange={setSection} />
@@ -263,96 +272,120 @@ export default function InvoiceEditScreen() {
             <Card title="PDF preview">
               <InvoicePdfPreview input={previewInput} />
             </Card>
+          ) : section === "setup" ? (
+            <Card title="Invoice setup">
+              <InvoiceSetupForm
+                businessId={businessId}
+                onBusinessIdChange={setBusinessId}
+                businessOptions={businessOptions}
+                businessError={businessError}
+                businessReadOnly={!isDraft}
+                clientId={clientId}
+                onClientIdChange={setClientId}
+                clientOptions={clientOptions}
+                clientError={clientError}
+                clientReadOnly={!isDraft}
+                invoiceNumber={`${invoice.invoicePrefix}${invoice.invoiceNumber}`}
+                invoiceNumberReadOnly
+                issueDate={new Date(invoice.issueDate)}
+                issueDateReadOnly
+                dueDate={dueDate}
+                onDueDateChange={setDueDate}
+                taxRate={taxRate}
+                onTaxRateChange={isDraft ? setTaxRate : undefined}
+                taxRateReadOnly={!isDraft}
+                notes={notes}
+                onNotesChange={setNotes}
+                sendReminderAt={sendReminderAt}
+                onSendReminderAtChange={isDraft ? setSendReminderAt : undefined}
+                showSendReminder={isDraft}
+              />
+              {taxError ? <Text style={styles.error}>{taxError}</Text> : null}
+            </Card>
           ) : (
             <>
-          <Card>
-            <DateTimeField label="Due date" mode="date" value={dueDate} onChange={setDueDate} />
-            {isDraft ? (
-              <>
-                <DateTimeField
-                  label="Remind me to send"
-                  mode="date"
-                  value={sendReminderAt ?? dueDate}
-                  minimumDate={new Date()}
-                  maximumDate={new Date(2100, 0, 1)}
-                  onChange={setSendReminderAt}
-                />
-                {sendReminderAt ? (
-                  <Pressable onPress={() => setSendReminderAt(null)}>
-                    <Text style={[styles.clearReminder, { color: colors.primary }]}>
-                      Clear send reminder
-                    </Text>
+              <Card title="Line items">
+                {!isDraft ? (
+                  <Text style={styles.lockedHint}>
+                    Line items are locked after an invoice is sent. Mark as draft on the invoice
+                    screen to edit entries.
+                  </Text>
+                ) : items.length === 0 ? (
+                  <Text style={styles.emptyLines}>
+                    No line items yet. Add lines here or clock time to this invoice from the
+                    Timer tab.
+                  </Text>
+                ) : null}
+                {items.map((item, index) => (
+                  <LineItemEditor
+                    key={item.id ?? `new-${index}`}
+                    index={index}
+                    item={item}
+                    currency={currency}
+                    isLast={index === items.length - 1}
+                    onChange={(patch) => updateItem(index, patch)}
+                    onRemove={() => removeItem(index)}
+                    readOnly={!isDraft}
+                  />
+                ))}
+
+                {isDraft ? (
+                  <Pressable accessibilityRole="button" onPress={addItem} style={styles.addLine}>
+                    <Text style={styles.addLineText}>+ Add another line</Text>
                   </Pressable>
                 ) : null}
-              </>
-            ) : null}
-            <Input
-              label="Notes"
-              value={notes}
-              onChangeText={setNotes}
-              placeholder="Optional notes for the client"
-              multiline
-              style={styles.notesInput}
-            />
-          </Card>
 
-          <Card title="Line items">
-            {!isDraft ? (
-              <Text style={styles.lockedHint}>
-                Line items are locked after an invoice is sent. Mark as draft on the invoice
-                screen to edit entries.
-              </Text>
-            ) : (
-              <LineItemsTableHeader />
-            )}
-            {items.map((item, index) => (
-              <LineItemEditor
-                key={item.id ?? `new-${index}`}
-                index={index}
-                item={item}
-                currency={currency}
-                isLast={index === items.length - 1}
-                onChange={(patch) => updateItem(index, patch)}
-                onRemove={() => removeItem(index)}
-                readOnly={!isDraft}
-              />
-            ))}
+                <InvoiceTotals
+                  subtotal={formatCurrency(subtotal, currency)}
+                  taxLabel={parsedTaxRate > 0 ? `Tax (${parsedTaxRate}%)` : undefined}
+                  taxAmount={parsedTaxRate > 0 ? formatCurrency(taxAmount, currency) : undefined}
+                  total={formatCurrency(total, currency)}
+                />
+              </Card>
 
-            {isDraft ? (
-              <Pressable accessibilityRole="button" onPress={addItem} style={styles.addLine}>
-                <Text style={styles.addLineText}>+ Add line</Text>
-              </Pressable>
-            ) : null}
-
-            <InvoiceTotals
-              subtotal={formatCurrency(subtotal, currency)}
-              taxLabel={taxRate > 0 ? `Tax (${taxRate}%)` : undefined}
-              taxAmount={taxRate > 0 ? formatCurrency(taxAmount, currency) : undefined}
-              total={formatCurrency(total, currency)}
-            />
-          </Card>
-
-          {lineItemsError ? <Text style={styles.error}>{lineItemsError}</Text> : null}
-          {error ? <Text style={styles.error}>{error}</Text> : null}
-
-          <View style={styles.actions}>
-            <Button
-              title="Save changes"
-              loading={updateInvoice.isPending}
-              disabled={!canSave}
-              onPress={handleSave}
-            />
-            {status !== "paid" ? (
-              <Button
-                title={status === "draft" ? "Send invoice" : "Resend invoice"}
-                variant="secondary"
-                onPress={promptSendInvoice}
-                loading={sendInvoice.isPending}
-              />
-            ) : null}
-          </View>
+              {lineItemsError ? <Text style={styles.error}>{lineItemsError}</Text> : null}
             </>
           )}
+
+          {error ? <Text style={styles.error}>{error}</Text> : null}
+
+          <InvoiceEditorFooter
+            primaryTitle="Save changes"
+            onPrimary={handleSave}
+            primaryLoading={updateInvoice.isPending}
+            primaryDisabled={!canSave}
+            secondary={
+              status !== "paid"
+                ? {
+                    title: status === "draft" ? "Send invoice" : "Resend invoice",
+                    subtitle: clientEmail
+                      ? items.length === 0
+                        ? "Add line items before sending"
+                        : `Review PDF and email to ${clientEmail}`
+                      : "Add a client email on the web app first",
+                    icon: "mail-outline",
+                    onPress: () => {
+                      if (!clientEmail) {
+                        Alert.alert(
+                          "No client email",
+                          "Add an email address to this client on the web app before sending invoices.",
+                        );
+                        return;
+                      }
+                      if (items.length === 0) {
+                        Alert.alert(
+                          "No line items",
+                          "Add line items or clock time to this invoice before sending.",
+                        );
+                        return;
+                      }
+                      router.push(`/(app)/invoices/send/${invoice.id}`);
+                    },
+                    disabled: !clientEmail || items.length === 0,
+                  }
+                : undefined
+            }
+          />
         </ScrollView>
       </KeyboardAvoidingView>
     </AppBackground>
@@ -380,23 +413,21 @@ const createInvoiceEditStyles = (colors: ThemeColors, _isDark: boolean) =>
       fontFamily: fonts.body,
       color: colors.mutedForeground,
     },
-    notesInput: {
-      minHeight: 72,
-      textAlignVertical: "top",
-    },
     lockedHint: {
       fontFamily: fonts.body,
       fontSize: 13,
       color: colors.mutedForeground,
       marginBottom: spacing.sm,
     },
-    clearReminder: {
-      fontFamily: fonts.bodyMedium,
-      fontSize: 13,
+    emptyLines: {
+      fontFamily: fonts.body,
+      fontSize: 14,
+      lineHeight: 20,
+      color: colors.mutedForeground,
       marginBottom: spacing.sm,
     },
     addLine: {
-      paddingTop: spacing.sm,
+      paddingTop: spacing.md,
       paddingBottom: spacing.xs,
     },
     addLineText: {
@@ -409,7 +440,4 @@ const createInvoiceEditStyles = (colors: ThemeColors, _isDark: boolean) =>
       fontFamily: fonts.body,
       fontSize: 14,
     },
-    actions: {
-      gap: spacing.sm,
-    },
   });