Merge category charts

Consolidated category spending list into the category pie chart card.

src/components/analytics/CategorySpendingList.tsx

@@ -15,18 +15,21 @@ interface CategorySpendingListProps {
   categories: CategorySpending[];
   totalExpense: number;
   className?: string;
+  showCard?: boolean; // 카드 표시 여부를 제어하는 프롭 추가
 }
 
 const CategorySpendingList: React.FC<CategorySpendingListProps> = ({
   categories,
   totalExpense,
-  className = ""
+  className = "",
+  showCard = true // 기본값은 true로 설정
 }) => {
   const isMobile = useIsMobile();
   
-  return (
-    <div className={`neuro-card mb-6 w-full ${className}`}>
-      {categories.some(cat => cat.current > 0) ? (
+  // 카테고리 목록을 렌더링하는 함수
+  const renderCategoryList = () => {
+    if (categories.some(cat => cat.current > 0)) {
+      return (
         <div className="space-y-4 px-1 py-4">
           {categories.map((category) => {
             // 카테고리 이름을 직접 표시
@@ -59,13 +62,27 @@ const CategorySpendingList: React.FC<CategorySpendingListProps> = ({
             );
           })}
         </div>
-      ) : (
+      );
+    } else {
+      return (
         <div className="py-8 text-center text-gray-400">
           <p>아직 지출 내역이 없습니다</p>
         </div>
-      )}
-    </div>
-  );
+      );
+    }
+  };
+
+  // showCard가 true이면 카드로 감싸서 반환, 아니면 목록만 반환
+  if (showCard) {
+    return (
+      <div className={`neuro-card mb-6 w-full ${className}`}>
+        {renderCategoryList()}
+      </div>
+    );
+  }
+  
+  // 카드 없이 목록만 반환
+  return renderCategoryList();
 };
 
 export default CategorySpendingList;