fix: unintentional static rendering & amount calculation

dashboard/final-example/app/lib/actions.ts

@@ -53,7 +53,7 @@ export async function createInvoice(prevState: State, formData: FormData) {
 
   // Prepare data for insertion into the database
   const { customerId, amount, status } = validatedFields.data;
-  const amountInCents = amount * 100;
+  const amountInCents = Math.round(amount * 100);
   const date = new Date().toISOString().split('T')[0];
 
   // Insert data into the database
@@ -93,7 +93,7 @@ export async function updateInvoice(
   }
 
   const { customerId, amount, status } = validatedFields.data;
-  const amountInCents = amount * 100;
+  const amountInCents = Math.round(amount * 100);
 
   try {
     await sql`

dashboard/final-example/app/ui/dashboard/cards.tsx

@@ -6,6 +6,7 @@ import {
 } from '@heroicons/react/24/outline';
 import { lusitana } from '@/app/ui/fonts';
 import { fetchCardData } from '@/app/lib/data';
+import { connection } from 'next/server';
 
 const iconMap = {
   collected: BanknotesIcon,
@@ -15,6 +16,7 @@ const iconMap = {
 };
 
 export default async function CardWrapper() {
+  await connection();
   const {
     numberOfInvoices,
     numberOfCustomers,

dashboard/final-example/app/ui/dashboard/latest-invoices.tsx

@@ -3,8 +3,10 @@ import clsx from 'clsx';
 import Image from 'next/image';
 import { lusitana } from '@/app/ui/fonts';
 import { fetchLatestInvoices } from '@/app/lib/data';
+import { connection } from 'next/server';
 
 export default async function LatestInvoices() {
+  await connection();
   const latestInvoices = await fetchLatestInvoices();
 
   return (

dashboard/final-example/app/ui/dashboard/revenue-chart.tsx

@@ -2,6 +2,7 @@ import { generateYAxis } from '@/app/lib/utils';
 import { CalendarIcon } from '@heroicons/react/24/outline';
 import { lusitana } from '@/app/ui/fonts';
 import { fetchRevenue } from '@/app/lib/data';
+import { connection } from 'next/server';
 
 // This component is representational only.
 // For data visualization UI, check out:
@@ -10,6 +11,7 @@ import { fetchRevenue } from '@/app/lib/data';
 // https://airbnb.io/visx/
 
 export default async function RevenueChart() {
+  await connection();
   const revenue = await fetchRevenue();
 
   const chartHeight = 350;