mirror of
https://github.com/vercel/next-learn.git
synced 2026-07-08 06:28:41 +00:00
acc531b370
* Run create-next-app * Add READMEs * Remove stuff we don't need * Add dummy data * Add types for dummy data * Add dummy routes * Remove unused CSS * Split dummy data and definitions * Add prettier plugin for tailwind * Create background-blur.tsx * Create hero.tsx * Create login-form.tsx * Tweak * Install hero icons and clsx * Create calculations.tsx * Update dummy-data.tsx * Create card.tsx * Create dashboard-overview.tsx * Update page.tsx * Add placeholder for dashboard-topnav * Adjust sizings for whole page * Update card styles and add icons * ugh, fonts are hard * misc * Misc * Switch to flex * Add revenue data and definitions * Misc * Merge branch 'master' into example-f9sv * Remove unused code * Add sort invoices calc - to be replaced with SQL * Add date to invoices table * Add customer images * Add LatestInvoices component * Optimize for mobile * Misc * Tweak * Remove duplicate date fields * Mobile tweaks
40 lines
1.2 KiB
TypeScript
40 lines
1.2 KiB
TypeScript
import { Invoice, Revenue } from "./definitions";
|
|
|
|
export const calculateInvoices = (
|
|
invoices: Invoice[],
|
|
status: "pending" | "paid",
|
|
) => {
|
|
return invoices
|
|
.filter((invoice) => !status || invoice.status === status)
|
|
.reduce((total, invoice) => total + invoice.amount / 100, 0)
|
|
.toLocaleString("en-US", {
|
|
style: "currency",
|
|
currency: "USD",
|
|
});
|
|
};
|
|
|
|
// Once a database is connected, we can use SQL to query the database directly
|
|
// This will be more efficient than querying all invoices and then filtering them
|
|
// E.g. "SELECT * FROM invoices
|
|
// ORDER BY date DESC
|
|
// LIMIT 5;"
|
|
export const findLatestInvoices = (invoices: Invoice[]) => {
|
|
return [...invoices]
|
|
.sort((a, b) => new Date(b.date).getTime() - new Date(a.date).getTime())
|
|
.slice(0, 5);
|
|
};
|
|
|
|
export const generateYAxis = (revenue: Revenue[]) => {
|
|
// Calculate what labels we need to display on the y-axis
|
|
// based on highest record and in 1000s
|
|
const yAxisLabels = [];
|
|
const highestRecord = Math.max(...revenue.map((month) => month.revenue));
|
|
const topLabel = Math.ceil(highestRecord / 1000) * 1000;
|
|
|
|
for (let i = topLabel; i >= 0; i -= 1000) {
|
|
yAxisLabels.push(`$${i / 1000}K`);
|
|
}
|
|
|
|
return { yAxisLabels, topLabel };
|
|
};
|