Initial commit

src/components/sidebar/categories.astro

@@ -0,0 +1,43 @@
+---
+import { getCategoryList } from "@utils/content";
+import { widgetManager, getComponentConfig } from "@utils/widget";
+import { i18n } from "@i18n/translation";
+import I18nKey from "@i18n/i18nKey";
+import ButtonLink from "@/components/common/buttonLink.astro";
+import WidgetLayout from "./widgetLayout.astro";
+
+
+const categories = await getCategoryList();
+
+const COLLAPSED_HEIGHT = "7.5rem";
+
+// 使用统一的组件管理器检查是否应该折叠
+const categoriesComponent = getComponentConfig("categories");
+const isCollapsed = categoriesComponent ? widgetManager.isCollapsed(categoriesComponent, categories.length) : false;
+
+interface Props {
+    class?: string;
+    style?: string;
+    side?: string;
+}
+const { class: className, style, side = "default" } = Astro.props;
+---
+
+<WidgetLayout
+    name={i18n(I18nKey.categories)}
+    id={`categories-${side}`}
+    isCollapsed={isCollapsed}
+    collapsedHeight={COLLAPSED_HEIGHT}
+    class={className}
+    style={style}
+>
+    {categories.map((c) =>
+        <ButtonLink
+            url={c.url}
+            badge={String(c.count)}
+            label={`View all posts in the ${c.name.trim()} category`}
+        >
+            {c.name.trim()}
+        </ButtonLink>
+    )}
+</WidgetLayout>