From 0b2738b4733bd9bf3fba3e309737685c27485acf Mon Sep 17 00:00:00 2001
From: Jun Shindo <46585162+jay-es@users.noreply.github.com>
Date: Thu, 28 Mar 2024 19:00:00 +0900
Subject: [PATCH] docs: add Kevin Deng as core team member (#1949)

---
 src/about/team/Member.ts         |  2 +-
 src/about/team/TeamMember.vue    | 16 ++++++++--
 src/about/team/TeamPage.vue      | 55 ++++++++++++++++----------------
 src/about/team/members-core.json | 29 +++++++++++++++++
 4 files changed, 71 insertions(+), 31 deletions(-)

diff --git a/src/about/team/Member.ts b/src/about/team/Member.ts
index cc7246018..865be87ef 100644
--- a/src/about/team/Member.ts
+++ b/src/about/team/Member.ts
@@ -5,7 +5,7 @@ export interface Member {
   company?: string
   companyLink?: string
   projects: Link[]
-  location: string
+  location: string | string[]
   languages: string[]
   website?: Link
   socials: Socials
diff --git a/src/about/team/TeamMember.vue b/src/about/team/TeamMember.vue
index 3926aac78..cc0664046 100644
--- a/src/about/team/TeamMember.vue
+++ b/src/about/team/TeamMember.vue
@@ -24,6 +24,10 @@ const avatarUrl = computed(() => {
     `https://www.github.com/${props.member.socials.github}.png`
   )
 })
+
+function arrayify(value: string | string[]): string[] {
+  return Array.isArray(value) ? value : [value]
+}
 </script>
 
 <template>
@@ -93,9 +97,15 @@ const avatarUrl = computed(() => {
             <h2 class="sr-only">Location</h2>
             <VTIconMapPin class="desc-icon" />
           </div>
-          <p class="desc-text">
-            {{ member.location }}
-          </p>
+          <ul class="desc-list">
+            <li
+              v-for="location in arrayify(member.location)"
+              :key="location"
+              class="desc-item"
+            >
+              {{ location }}
+            </li>
+          </ul>
         </section>
 
         <section class="desc">
diff --git a/src/about/team/TeamPage.vue b/src/about/team/TeamPage.vue
index 941426cba..bf205595a 100644
--- a/src/about/team/TeamPage.vue
+++ b/src/about/team/TeamPage.vue
@@ -1,5 +1,8 @@
 <script lang="ts">
-const shuffleMembers = (members: Member[], pinTheFirstMember = false): void => {
+const shuffleMembers = (
+  members: Member[],
+  pinTheFirstMember = false
+): void => {
   let offset = pinTheFirstMember ? 1 : 0
   // `i` is between `1` and `length - offset`
   // `j` is between `0` and `length - offset - 1`
@@ -7,11 +10,8 @@ const shuffleMembers = (members: Member[], pinTheFirstMember = false): void => {
   // `offset + j` is between `offset` and `length - 1`
   let i = members.length - offset
   while (i > 0) {
-    const j = Math.floor(Math.random() * i);
-    [
-      members[offset + i - 1],
-      members[offset + j]
-    ] = [
+    const j = Math.floor(Math.random() * i)
+    ;[members[offset + i - 1], members[offset + j]] = [
       members[offset + j],
       members[offset + i - 1]
     ]
@@ -37,46 +37,47 @@ shuffleMembers(membersPartnerData as Member[])
   <div class="TeamPage">
     <TeamHero>
       <template #title>チーム紹介</template>
-      <template #lead
-        >Vue とそのエコシステムの開発は
-        国際チームによって主導されています。
-        一部のメンバーを以下に記載します。</template
-      >
+      <template #lead>
+        Vue とそのエコシステムの開発は
+        国際的なチームによって主導されています。
+        その一部のメンバーを以下に記載します。
+      </template>
 
       <template #action>
         <VTLink
           href="https://github.com/vuejs/governance/blob/master/Team-Charter.md"
-          >チームについてもっと知る</VTLink
         >
+          チームについてもっと知る
+        </VTLink>
       </template>
     </TeamHero>
 
-    <TeamList :members="membersCoreData as Member[]">
+    <TeamList :members="(membersCoreData as Member[])">
       <template #title>コアチームメンバー</template>
-      <template #lead
-        >コアチームメンバーは1つから複数のプロジェクトを
+      <template #lead>
+        コアチームメンバーは1つから複数のプロジェクトを
         積極的にメンテナンスしています。
         彼らは Vue エコシステムに有意な貢献をしており、
-        プロジェクトとユーザーの成功のために長い期間献身しています。</template
-      >
+        プロジェクトとユーザーの成功のために長い期間献身しています。
+      </template>
     </TeamList>
 
-    <TeamList :members="membersEmeritiData as Member[]">
+    <TeamList :members="(membersEmeritiData as Member[])">
       <template #title>名誉コアチーム</template>
-      <template #lead
-        >私達が誇る過去に価値のある貢献をした
-        元コアチームメンバーです。</template
-      >
+      <template #lead>
+        私達が誇る過去に価値のある貢献をした
+        元コアチームメンバーです。
+      </template>
     </TeamList>
 
-    <TeamList :members="membersPartnerData as Member[]">
+    <TeamList :members="(membersPartnerData as Member[])">
       <template #title>コミュニティーパートナー</template>
-      <template #lead
-        >一部の Vue コミュニティーメンバーは
+      <template #lead>
+        一部の Vue コミュニティーメンバーは
         コミュニティーを発展させたため、特筆します。
         私達は主要なパートナーとより親密に開発し、
-        頻繁に今後の機能やニュースを決定しています。</template
-      >
+        頻繁に今後の機能やニュースを決定しています。
+      </template>
     </TeamList>
   </div>
 </template>
diff --git a/src/about/team/members-core.json b/src/about/team/members-core.json
index c2b3f93b3..7caf54a53 100644
--- a/src/about/team/members-core.json
+++ b/src/about/team/members-core.json
@@ -507,5 +507,34 @@
       "twitter": "_brc_dd"
     },
     "sponsor": true
+  },
+  {
+    "name": "Kevin Deng 三咲智子",
+    "title": "Open Sourceror",
+    "projects": [
+      {
+        "label": "vuejs/core",
+        "url": "https://github.com/vuejs/core"
+      },
+      {
+        "label": "vuejs/core-vapor",
+        "url": "https://github.com/vuejs/core-vapor"
+      },
+      {
+        "label": "Vue Macros",
+        "url": "https://github.com/vue-macros/vue-macros"
+      },
+      {
+        "label": "VueUse",
+        "url": "https://github.com/vueuse/vueuse"
+      }
+    ],
+    "location": ["Hangzhou", "Singapore"],
+    "languages": ["English", "Chinese"],
+    "socials": {
+      "github": "sxzz",
+      "twitter": "sanxiaozhizi"
+    },
+    "sponsor": true
   }
 ]