feat: 提交历史事件对比组件

src/views/Community/components/DynamicNewsDetail/CollapsibleSection.js

@@ -0,0 +1,41 @@
+// src/views/Community/components/DynamicNewsDetail/CollapsibleSection.js
+// 通用可折叠区块组件
+
+import React from 'react';
+import {
+  Box,
+  Collapse,
+  useColorModeValue,
+} from '@chakra-ui/react';
+import CollapsibleHeader from './CollapsibleHeader';
+
+/**
+ * 通用可折叠区块组件
+ * @param {Object} props
+ * @param {string} props.title - 标题文本
+ * @param {boolean} props.isOpen - 是否展开
+ * @param {Function} props.onToggle - 切换展开/收起的回调
+ * @param {number} props.count - 可选的数量徽章
+ * @param {React.ReactNode} props.children - 子内容
+ */
+const CollapsibleSection = ({ title, isOpen, onToggle, count = null, children }) => {
+  const sectionBg = useColorModeValue('gray.50', 'gray.750');
+
+  return (
+    <Box>
+      <CollapsibleHeader
+        title={title}
+        isOpen={isOpen}
+        onToggle={onToggle}
+        count={count}
+      />
+      <Collapse in={isOpen} animateOpacity>
+        <Box mt={2} bg={sectionBg} p={3} borderRadius="md">
+          {children}
+        </Box>
+      </Collapse>
+    </Box>
+  );
+};
+
+export default CollapsibleSection;