Embed MatrixShop bStats chart on site

Author: 54895y

docs/matrixshop/bstats-and-telemetry.mdx

@@ -14,6 +14,10 @@ MatrixShop 当前已经集成 `bStats`，用于统计插件的安装量和基础
 30502
 ```
 
+## 当前使用量图表
+
+[![MatrixShop bStats](https://bstats.org/signatures/bukkit/MatrixShop.svg)](https://bstats.org/plugin/bukkit/MatrixShop)
+
 ## 当前会上报什么
 
 当前版本只上报配置和模块层面的聚合数据：

src/pages/index.module.css

@@ -258,6 +258,20 @@
   line-height: 1.8;
 }
 
+.telemetryChart {
+  margin-top: 1rem;
+  padding: 0.85rem;
+  border: 1px solid var(--site-panel-border);
+  border-radius: 18px;
+  background: rgba(15, 23, 42, 0.02);
+}
+
+.telemetryChart img {
+  display: block;
+  width: 100%;
+  height: auto;
+}
+
 .telemetryBadgeActive,
 .telemetryBadgePending {
   display: inline-flex;

src/pages/index.tsx

@@ -105,6 +105,7 @@ const telemetryCards = [
     status: '已接入',
     statusTone: 'active',
     summary: '已接入聚合级统计与遥测说明，首页只保留简要状态展示，详细范围进入文档页查看。',
+    chart: 'https://bstats.org/signatures/bukkit/MatrixShop.svg',
     to: '/docs/matrixshop/bstats-and-telemetry',
     action: '查看 MatrixShop 统计',
   },
@@ -240,6 +241,11 @@ export default function Home(): ReactNode {
                     {card.status}
                   </span>
                 </div>
+                {'chart' in card ? (
+                  <div className={styles.telemetryChart}>
+                    <img src={card.chart} alt={`${card.title} bStats usage chart`} loading="lazy" />
+                  </div>
+                ) : null}
                 <Link className={styles.cardAction} to={card.to}>
                   {card.action}
                 </Link>