Limit expense categories

Limit the number of expense categories to 식비, 생활비, 교통비.

src/pages/Analytics.tsx

@@ -1,33 +1,27 @@
+
 import React, { useState } from 'react';
 import NavBar from '@/components/NavBar';
 import ExpenseChart from '@/components/ExpenseChart';
 import AddTransactionButton from '@/components/AddTransactionButton';
 import { BarChart, Bar, XAxis, YAxis, Tooltip, ResponsiveContainer, Legend } from 'recharts';
 import { ChevronLeft, ChevronRight } from 'lucide-react';
+
 const Analytics = () => {
   const [selectedPeriod, setSelectedPeriod] = useState('이번 달');
 
-  // Sample data for the expense categories
+  // Updated expense categories to use only the three specified categories
   const expenseData = [{
     name: '식비',
     value: 350000,
     color: '#9b87f5'
   }, {
-    name: '주거',
+    name: '생활비',
     value: 650000,
     color: '#6e59a5'
   }, {
-    name: '교통',
-    value: 125000,
-    color: '#81c784'
-  }, {
-    name: '취미',
-    value: 200000,
-    color: '#64b5f6'
-  }, {
-    name: '기타',
+    name: '교통비',
     value: 175000,
-    color: '#e57373'
+    color: '#81c784'
   }];
 
   // Sample data for the monthly comparison
@@ -56,10 +50,12 @@ const Analytics = () => {
     income: 2550000,
     expense: 1740000
   }];
+
   const totalIncome = 2550000;
   const totalExpense = 1740000;
   const savings = totalIncome - totalExpense;
   const savingsPercentage = Math.round(savings / totalIncome * 100);
+
   return <div className="min-h-screen bg-neuro-background pb-24">
       <div className="max-w-md mx-auto px-6">
         {/* Header */}
@@ -157,7 +153,7 @@ const Analytics = () => {
         <h2 className="text-lg font-semibold mb-3">주요 지출 카테고리</h2>
         <div className="neuro-card mb-6">
           <div className="space-y-4">
-            {expenseData.slice(0, 3).map((category, index) => <div key={category.name} className="flex items-center justify-between">
+            {expenseData.map((category, index) => <div key={category.name} className="flex items-center justify-between">
                 <div className="flex items-center gap-3">
                   <div className="w-6 h-6 rounded-full" style={{
                 backgroundColor: category.color
@@ -185,4 +181,5 @@ const Analytics = () => {
       <NavBar />
     </div>;
 };
-export default Analytics;
+
+export default Analytics;