Update category descriptions

Update category descriptions in the spending graph card.

src/components/BudgetCategoriesSection.tsx

@@ -1,6 +1,8 @@
+
 import React from 'react';
-import { categoryIcons } from '@/constants/categoryIcons';
+import { categoryIcons, CATEGORY_DESCRIPTIONS } from '@/constants/categoryIcons';
 import { formatCurrency } from '@/utils/formatters';
+
 interface BudgetCategoriesSectionProps {
   categories: {
     title: string;
@@ -8,6 +10,7 @@ interface BudgetCategoriesSectionProps {
     total: number;
   }[];
 }
+
 const BudgetCategoriesSection: React.FC<BudgetCategoriesSectionProps> = ({
   categories
 }) => {
@@ -31,12 +34,23 @@ const BudgetCategoriesSection: React.FC<BudgetCategoriesSectionProps> = ({
         // 남은 예산 또는 초과 예산
         const budgetStatusText = isOverBudget ? '예산 초과: ' : '남은 예산: ';
         const budgetAmount = isOverBudget ? Math.abs(category.total - category.current) : Math.max(0, category.total - category.current);
+        
+        // 카테고리 설명 가져오기
+        const description = CATEGORY_DESCRIPTIONS[category.title] || '';
+        
         return <div key={index} className={`${index !== 0 ? 'mt-4 pt-4 border-t border-gray-100' : ''}`}>
             <div className="flex items-center gap-2 mb-1">
               <div className="text-neuro-income">
                 {categoryIcons[category.title]}
               </div>
-              <h3 className="text-sm font-medium text-gray-600">{category.title}</h3>
+              <h3 className="text-sm font-medium text-gray-600">
+                {category.title}
+                {description && (
+                  <span className="text-gray-500 text-xs ml-1">
+                    {description}
+                  </span>
+                )}
+              </h3>
             </div>
             
             <div className="flex items-center justify-between mb-2">
@@ -63,4 +77,5 @@ const BudgetCategoriesSection: React.FC<BudgetCategoriesSectionProps> = ({
     </div>
   </>;
 };
+
 export default BudgetCategoriesSection;