Add 'apps/mobile/' from commit '5fa30f365f21531094cd4d2045042bb4f1370ac3'

git-subtree-dir: apps/mobile git-subtree-mainline: 86f8987dff git-subtree-split: 5fa30f365f
2026-08-16 21:42:59 -04:00
parent 86f8987dff 5fa30f365f
commit d057ba208d
222 changed files with 23436 additions and 0 deletions
@@ -0,0 +1,90 @@
+import { StyleSheet, Text, View } from "react-native";
+
+import { fonts, spacing } from "@/constants/theme";
+import { useAppTheme } from "@/contexts/ThemeContext";
+
+type InvoiceTotalsProps = {
+  subtotal: string;
+  taxLabel?: string;
+  taxAmount?: string;
+  total: string;
+};
+
+export function InvoiceTotals({
+  subtotal,
+  taxLabel,
+  taxAmount,
+  total,
+}: InvoiceTotalsProps) {
+  const { colors } = useAppTheme();
+
+  return (
+    <View style={[styles.totals, { borderTopColor: colors.border }]}>
+      <TotalRow label="Subtotal" value={subtotal} />
+      {taxLabel && taxAmount ? <TotalRow label={taxLabel} value={taxAmount} /> : null}
+      <TotalRow label="Total" value={total} bold />
+    </View>
+  );
+}
+
+function TotalRow({
+  label,
+  value,
+  bold,
+}: {
+  label: string;
+  value: string;
+  bold?: boolean;
+}) {
+  const { colors } = useAppTheme();
+
+  return (
+    <View style={styles.row}>
+      <Text
+        style={[
+          styles.label,
+          { color: colors.mutedForeground },
+          bold && styles.bold,
+          bold && { color: colors.foreground },
+        ]}
+      >
+        {label}
+      </Text>
+      <Text
+        style={[
+          styles.value,
+          { color: colors.foreground },
+          bold && styles.bold,
+        ]}
+      >
+        {value}
+      </Text>
+    </View>
+  );
+}
+
+const styles = StyleSheet.create({
+  totals: {
+    marginTop: spacing.md,
+    paddingTop: spacing.md,
+    borderTopWidth: StyleSheet.hairlineWidth,
+    gap: spacing.xs,
+  },
+  row: {
+    flexDirection: "row",
+    justifyContent: "space-between",
+    alignItems: "center",
+  },
+  label: {
+    fontFamily: fonts.body,
+    fontSize: 14,
+  },
+  value: {
+    fontFamily: fonts.bodyMedium,
+    fontSize: 14,
+  },
+  bold: {
+    fontFamily: fonts.bodySemiBold,
+    fontSize: 15,
+  },
+});