tomosa.sarkar/IB
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: api integration for account tab

Browse Source 
fix: layout design
feat : add screen for account tab
This commit is contained in:
Tomosa Sarkar
2025-07-13 19:21:53 +05:30
parent 1023646751
commit 26e6dea82b
7 changed files with 442 additions and 266 deletions
Download Patch File Download Diff File Expand all files Collapse all files

105
src/app/(main)/accounts/layout.tsx
View File

@@ -2,55 +2,70 @@
import { Divider, Stack, Text } from '@mantine/core';
import { usePathname } from 'next/navigation';
import Link from 'next/link';
import React from 'react';
import React, { useEffect, useState } from 'react';
import { useRouter } from "next/navigation";
export default function Layout({ children }: { children: React.ReactNode }) {
const pathname = usePathname(); // get current route
const [authorized, SetAuthorized] = useState<boolean | null>(null);
const router = useRouter();
const pathname = usePathname();
const links = [
{ label: "Account Summary", href: "/accounts" },
{ label: "Statement of Account", href: "/accounts/account_statement" },
];
return (
<div style={{ display: "flex", height: '100%' }}>
<div
style={{
width: "15%",
backgroundColor: '#c5e4f9',
borderRight: "1px solid #ccc",
}}
>
<Stack style={{ background: '#228be6', height: '10%', alignItems: 'center' }}>
<Text fw={700} fs="italic" c='white' style={{ textAlign: 'center', marginTop: '10px' }}>
Accounts
</Text>
</Stack>
<Stack gap="sm" justify="flex-start" style={{ padding: '1rem' }}>
{links.map(link => {
const isActive = pathname === link.href || pathname.startsWith(link.href + '/');
return (
<Text
key={link.href}
component={Link}
href={link.href}
c={isActive ? 'darkblue' : 'blue'}
style={{
textDecoration: isActive ? 'underline' : 'none',
fontWeight: isActive ? 600 : 400,
}}
>
{link.label}
</Text>
);
})}
</Stack>
useEffect(() => {
const token = localStorage.getItem("access_token");
if (!token) {
SetAuthorized(false);
router.push("/login");
}
else {
SetAuthorized(true);
}
}, []);
if (authorized) {
return (
<div style={{ display: "flex", height: '100%' }}>
<div
style={{
width: "16%",
backgroundColor: '#c5e4f9',
borderRight: "1px solid #ccc",
}}
>
<Stack style={{ background: '#228be6', height: '10%', alignItems: 'center' }}>
<Text fw={700} fs="italic" c='white' style={{ textAlign: 'center', marginTop: '10px' }}>
Accounts
</Text>
</Stack>
<Stack gap="sm" justify="flex-start" style={{ padding: '1rem' }}>
{links.map(link => {
const isActive = pathname === link.href;
return (
<Text
key={link.href}
component={Link}
href={link.href}
c={isActive ? 'darkblue' : 'blue'}
style={{
textDecoration: isActive ? 'underline' : 'none',
fontWeight: isActive ? 600 : 400,
}}
>
{link.label}
</Text>
);
})}
</Stack>
</div>
<div style={{ flex: 1, padding: '1rem' }}>
{children}
</div>
</div>
<div style={{ flex: 1, padding: '1rem' }}>
{children}
</div>
</div>
);
);
}
}