update

Author: ciaochaos

.all-contributorsrc

@@ -4,8 +4,7 @@
   "repoType": "github",
   "repoHost": "https://github.com",
   "files": [
-    "README.md",
-    "src/components/Contributors.mdx"
+    "README.md"
   ],
   "contributors": [
     {

src/app/preface/contributors/page.mdx

@@ -1,4 +1,4 @@
-import Contributors from "@/components/Contributors.mdx"
+import Contributors from "@/components/Contributors.tsx"
 
 export const metadata = {
   title: '贡献者',
@@ -7,18 +7,6 @@ export const metadata = {
 # 贡献者
 
 
-* <Authors names="ciaochaos" />
-  
-  ``Catalyst``
-
-* <Authors names="shichen" />
-  
-  ``Conjurer``
-
-* <Authors names="cpunisher" />
-  
-  ``Engineer``
-
 <div className="prose-img:m-0">
   <Contributors />
 </div>

src/components/Contributors.mdx

@@ -0,0 +1,37 @@
+
+
+import { promises as fs } from 'fs';
+
+interface Contributor {
+  login: string
+  name: string
+  avatar_url: string
+  profile: string
+  contributions: string[]
+}
+
+export default async function Contributors() {
+  const file = await fs.readFile(process.cwd() + '/.all-contributorsrc', 'utf8');
+  const data = JSON.parse(file);
+  const contributors: Contributor[] = data["contributors"]
+
+  return (
+    <div className="flex flex-wrap gap-6 ">
+      {contributors.map((contributor) => (
+        <div key={contributor.login} className="flex flex-col items-center _grow">
+          <a href={contributor.profile} className="flex flex-col items-center grow-0 w-20">
+            <img
+              src={contributor.avatar_url}
+              width="w-20 h-20"
+              alt={contributor.name}
+              className="rounded-full"
+            />
+            <div className="mt-2 text-xs line-clamp-1 w-full text-center">
+              <b>{contributor.name}</b>
+            </div>
+          </a>
+        </div>
+      ))}
+    </div>
+  );
+}