diff --git a/src/app/dashboard/_components/monthly-metrics-chart.tsx b/src/app/dashboard/_components/monthly-metrics-chart.tsx index 138db05..b00ec63 100644 --- a/src/app/dashboard/_components/monthly-metrics-chart.tsx +++ b/src/app/dashboard/_components/monthly-metrics-chart.tsx @@ -191,7 +191,7 @@ export function MonthlyMetricsChart({ invoices }: MonthlyMetricsChartProps) { {/* Legend */} -
+
-
+
Contact Information @@ -94,7 +94,7 @@ export default async function ClientDetailPage({
{client.email && (
-
+
@@ -108,7 +108,7 @@ export default async function ClientDetailPage({ {client.phone && (
-
+
@@ -126,7 +126,7 @@ export default async function ClientDetailPage({

Client Address

-
+
@@ -155,7 +155,7 @@ export default async function ClientDetailPage({

Client Details

-
+
@@ -177,7 +177,7 @@ export default async function ClientDetailPage({ -
+
Invoice Summary @@ -213,7 +213,7 @@ export default async function ClientDetailPage({ -
+
Recent Invoices @@ -224,46 +224,48 @@ export default async function ClientDetailPage({ {client.invoices.slice(0, 3).map((invoice) => (
-
-

- {invoice.invoiceNumber} -

-

- {formatDate(invoice.issueDate)} -

-
-
-

- {formatCurrency(invoice.totalAmount)} -

- +
+

+ {invoice.invoiceNumber} +

+

+ {formatDate(invoice.issueDate)} +

+
+
+

+ {formatCurrency(invoice.totalAmount)} +

+ - {getEffectiveInvoiceStatus( - invoice.status as StoredInvoiceStatus, - invoice.dueDate, - )} - + ) === "sent" + ? "secondary" + : getEffectiveInvoiceStatus( + invoice.status as StoredInvoiceStatus, + invoice.dueDate, + ) === "overdue" + ? "destructive" + : "outline" + } + className="text-xs" + > + {getEffectiveInvoiceStatus( + invoice.status as StoredInvoiceStatus, + invoice.dueDate, + )} + +
))} diff --git a/src/app/dashboard/invoices/[id]/page.tsx b/src/app/dashboard/invoices/[id]/page.tsx index 8c7e9fd..0ebcdfb 100644 --- a/src/app/dashboard/invoices/[id]/page.tsx +++ b/src/app/dashboard/invoices/[id]/page.tsx @@ -146,10 +146,10 @@ function InvoiceViewContent({ invoiceId }: { invoiceId: string }) {
-
+
-

+

{invoice.invoiceNumber}

@@ -163,7 +163,7 @@ function InvoiceViewContent({ invoiceId }: { invoiceId: string }) {
-
+

Total Amount

@@ -326,29 +326,33 @@ function InvoiceViewContent({ invoiceId }: { invoiceId: string }) { {invoice.items.map((item) => ( - -
-
-

- {item.description} -

-
- - {formatDate(item.date).replace(/ /g, "\u00A0")} - - - {item.hours.toString().replace(/ /g, "\u00A0")} -  hours - - - @ ${item.rate}/hr - + +
+
+
+

+ {item.description} +

+
+
+ + {formatDate(item.date).replace(/ /g, "\u00A0")} + + + {item.hours.toString().replace(/ /g, "\u00A0")} +  hours + + + @ ${item.rate}/hr + +
+
+
+
+

+ {formatCurrency(item.amount)} +

-
-
-

- {formatCurrency(item.amount)} -

@@ -356,16 +360,16 @@ function InvoiceViewContent({ invoiceId }: { invoiceId: string }) { ))} {/* Totals */} -
+
-
+
Subtotal: {formatCurrency(subtotal)}
{invoice.taxRate > 0 && ( -
+
Tax ({invoice.taxRate}%): @@ -375,7 +379,7 @@ function InvoiceViewContent({ invoiceId }: { invoiceId: string }) {
)} -
+
Total: {formatCurrency(total)} diff --git a/src/app/dashboard/page.tsx b/src/app/dashboard/page.tsx index 9469920..b32a175 100644 --- a/src/app/dashboard/page.tsx +++ b/src/app/dashboard/page.tsx @@ -324,28 +324,23 @@ function QuickActions() { {actions.map((action) => { const Icon = action.icon; return ( - + +
+

{action.title}

+

+ {action.description} +

+
+ ); })} @@ -408,17 +403,19 @@ async function CurrentWork() {
-
-

+
+

#{currentInvoice.invoiceNumber}

${currentInvoice.totalAmount.toFixed(2)}
-
- {currentInvoice.client?.name} - {totalHours.toFixed(1)} hours logged +
+ {currentInvoice.client?.name} + + {totalHours.toFixed(1)} hours logged +
@@ -490,8 +487,8 @@ async function RecentActivity() { @@ -518,27 +515,35 @@ async function RecentActivity() { href={`/dashboard/invoices/${invoice.id}`} className="block" > -
-
-
+
+
+
-
-

#{invoice.invoiceNumber}

-

- {invoice.client?.name} •{" "} +

+
+
+

+ #{invoice.invoiceNumber} +

+

+ {invoice.client?.name} +

+
+
+ + {invoice.status} + + + ${invoice.totalAmount.toFixed(2)} + +
+
+

{new Date(invoice.issueDate).toLocaleDateString()}

-
- - {invoice.status} - - - ${invoice.totalAmount.toFixed(2)} - -
))} diff --git a/src/app/dashboard/settings/_components/settings-content.tsx b/src/app/dashboard/settings/_components/settings-content.tsx index d651251..1071c0a 100644 --- a/src/app/dashboard/settings/_components/settings-content.tsx +++ b/src/app/dashboard/settings/_components/settings-content.tsx @@ -15,8 +15,9 @@ import { Building, Key, Eye, - EyeOff, FileUp, + ChevronDown, + Info, } from "lucide-react"; import { api } from "~/trpc/react"; @@ -28,6 +29,11 @@ import { CardHeader, CardTitle, } from "~/components/ui/card"; +import { + Collapsible, + CollapsibleContent, + CollapsibleTrigger, +} from "~/components/ui/collapsible"; import { Input } from "~/components/ui/input"; import { Label } from "~/components/ui/label"; import { Textarea } from "~/components/ui/textarea"; @@ -358,20 +364,23 @@ export function SettingsContent() { return (
-
-
- +
+
+
+ +
+ + {item.label} + +
+
+ + {item.value} +
- {item.label}
- - {item.value} -
); })} @@ -500,12 +509,12 @@ export function SettingsContent() {
-
+
@@ -620,18 +629,38 @@ export function SettingsContent() {
{/* Backup Information */} -
-

Backup Information

-
    -
  • • Regular backups protect your important business data
    • -
  • • Backup files contain all data in secure JSON format
    • -
  • - • Import adds to existing data without replacing anything -
    • -
  • • Upload JSON files directly or paste content manually
    • -
  • • Store backup files in a secure, accessible location
    • -
-
+ + + + + +
+
    +
  • + • Regular backups protect your important business data +
    • +
  • + • Backup files contain all data in secure JSON format +
    • +
  • + • Import adds to existing data without replacing anything +
    • +
  • + • Upload JSON files directly or paste content manually +
    • +
  • + • Store backup files in a secure, accessible location +
    • +
+
+ +