ZELLYY/zellyy-finance
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Refactor expense chart title

Browse Source 
Moves the expense chart title outside of the card component for better visual consistency.
This commit is contained in:
gpt-engineer-app[bot]
2025-03-15 02:46:51 +00:00
parent eb4d9c6d16
commit 75bf08a14e
2 changed files with 4 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
src/components/ExpenseChart.tsx
View File

@@ -1,6 +1,6 @@
import React from 'react'; import React from 'react';
import { PieChart, Pie, Cell, ResponsiveContainer, Legend } from 'recharts'; import { PieChart, Pie, Cell, ResponsiveContainer } from 'recharts';
interface ExpenseData { interface ExpenseData {
name: string; name: string;
@@ -15,9 +15,7 @@ interface ExpenseChartProps {
const ExpenseChart: React.FC<ExpenseChartProps> = ({ data }) => { const ExpenseChart: React.FC<ExpenseChartProps> = ({ data }) => {
return ( return (
<div className="neuro-card h-64"> <div className="neuro-card h-64">
<h3 className="text-sm font-medium text-gray-600 mb-3">카테고리별 지출</h3> <ResponsiveContainer width="100%" height="100%">
<ResponsiveContainer width="100%" height="85%">
<PieChart> <PieChart>
<Pie <Pie
data={data} data={data}

2
src/pages/Analytics.tsx
View File

@@ -1,3 +1,4 @@
import React, { useState } from 'react'; import React, { useState } from 'react';
import NavBar from '@/components/NavBar'; import NavBar from '@/components/NavBar';
import ExpenseChart from '@/components/ExpenseChart'; import ExpenseChart from '@/components/ExpenseChart';
@@ -146,6 +147,7 @@ const Analytics = () => {
</div> </div>
{/* Category Pie Chart - MOVED DOWN */} {/* Category Pie Chart - MOVED DOWN */}
<h2 className="text-lg font-semibold mb-3">카테고리별 지출</h2>
<ExpenseChart data={expenseData} /> <ExpenseChart data={expenseData} />
{/* Top Spending Categories */} {/* Top Spending Categories */}