LumeWeb
/
portal-dashboard
1
0
Fork 0
Code Issues 5 Pull Requests Packages Projects Releases Wiki Activity

chore: Removed UsageList component

This commit is contained in:
Tania Gutierrez 2024-03-13 09:22:07 -04:00
parent 68d8a3030b
commit 1dc0a8abf5
Signed by: riobuenoDevelops
GPG Key ID: 53133EB28EB7E801
2 changed files with 3 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
app/components/usage-card.tsx
View File

@ -8,14 +8,6 @@ interface UsageCardProps {
icon: React.ReactNode icon: React.ReactNode
} }
export const UsageList = ({ children }: React.PropsWithChildren<{}>) => {
return (
<div className="grid grid-cols-2 gap-8 flex-wrap w-full">
{children}
</div>
)
}
export const UsageCard = ({ usageName, monthlyUsage, currentUsage, icon }: UsageCardProps) => { export const UsageCard = ({ usageName, monthlyUsage, currentUsage, icon }: UsageCardProps) => {
return ( return (
<div className="p-8 border rounded-lg w-full"> <div className="p-8 border rounded-lg w-full">

6
app/routes/dashboard.tsx
View File

@ -1,6 +1,6 @@
import { GeneralLayout } from "~/components/general-layout"; import { GeneralLayout } from "~/components/general-layout";
import { UpgradeAccountBanner } from "~/components/upgrade-account-banner"; import { UpgradeAccountBanner } from "~/components/upgrade-account-banner";
import { UsageCard, UsageList } from "~/components/usage-card"; import { UsageCard } from "~/components/usage-card";
import { UsageChart } from "~/components/usage-chart"; import { UsageChart } from "~/components/usage-chart";
export default function Dashboard() { export default function Dashboard() {
@ -14,7 +14,7 @@ export default function Dashboard() {
<h1 className="font-bold mb-4 text-lg">Dashboard</h1> <h1 className="font-bold mb-4 text-lg">Dashboard</h1>
<UpgradeAccountBanner /> <UpgradeAccountBanner />
<h2 className="font-bold mb-8 mt-10">Current Usage</h2> <h2 className="font-bold mb-8 mt-10">Current Usage</h2>
<UsageList> <div className="grid grid-cols-2 gap-8">
<UsageCard <UsageCard
usageName="Storage" usageName="Storage"
currentUsage={120} currentUsage={120}
@ -33,7 +33,7 @@ export default function Dashboard() {
monthlyUsage={15} monthlyUsage={15}
icon={<CloudUploadIcon className="text-ring" />} icon={<CloudUploadIcon className="text-ring" />}
/> />
</UsageList> </div>
<h2 className="font-bold mb-8 mt-10">Historical Usage</h2> <h2 className="font-bold mb-8 mt-10">Historical Usage</h2>
<div className="grid gap-8 grid-cols-2"> <div className="grid gap-8 grid-cols-2">
<UsageChart <UsageChart