foldbank-mock/web/app/components/CenterCol.tsx
Ameya Shenoy b20e245779
feat: dashboard and recent done
Signed-off-by: Ameya Shenoy <shenoy.ameya@gmail.com>
2023-03-13 17:31:24 +05:30

75 lines
1.8 KiB
TypeScript

import styles from './centerCol.module.css'
import React from 'react'
import Dashboard from './Dashboard'
import BankAccount from './BankAccount'
export default function CenterCol() {
const bankDetails = {
banks: [{
bankName: "SBI",
bankFullName: "State Bank of India",
bankLogoSrc: "/sbi.svg",
bankAccountBalance: "27,932",
infoLines: [{
title: "Account Number",
value: "34536896852",
}, {
title: "IFSC Code",
value: "SBIN0006586",
}, {
title: "Swift BIC",
value: "6895206BB",
}, {
title: "Holder's Name",
value: "Nishant Verma",
}]
}, {
bankName: "HDFC",
bankFullName: "HDFC Bank",
bankLogoSrc: "/hdfc.svg",
bankAccountBalance: "2,58,630",
infoLines: [{
title: "Account Number",
value: "92531805286",
}, {
title: "IFSC Code",
value: "HDFC0002233",
}, {
title: "Swift BIC",
value: "HDFCINBBBNG",
}, {
title: "Holder's Name",
value: "Nishant Verma",
}]
}]
}
const bankAccounts = []
bankDetails.banks.forEach((bank) => {
bankAccounts.push(
<BankAccount
key={bank.bankName}
bankLogoSrc={bank.bankLogoSrc}
bankName={bank.bankName}
bankFullName={bank.bankFullName}
bankAccountBalance={bank.bankAccountBalance}
infoLines={bank.infoLines}
/>
)
})
return (
<div className={styles.main}>
<div className={styles.title}>
<div className={styles.greeting}>Good morning, Nishant</div>
<div className={styles.date}>It's 3rd of January, a Monday</div>
</div>
<Dashboard />
<div className={styles.accounts}>
{bankAccounts}
</div>
</div>
)
}