feat: add introduction pages

.vitepress/config.mts

@@ -78,8 +78,7 @@ export default defineConfig({
       provider: "local",
     },
     nav: [
-      { text: "Home", link: "/" },
-      { text: "Getting Started", link: "/docs/usage/linter" },
+      { text: "Getting Started", link: "/docs/guide/introduction" },
       { text: "Contribute", link: "/docs/contribute/intro" },
       { text: "Learn", link: "/docs/learn/ecosystem" },
       { text: "Blog", link: "/blog/2022-02-10-js-tooling-research" },
@@ -106,19 +105,21 @@ export default defineConfig({
       copyright: "© 2023 OXC Project",
     },
     sidebar: {
-      "/docs/usage/": [
+      "/docs/guide/": [
         {
-          text: "Usage",
+          text: "Getting Started",
           items: [
-            { text: "Linter", link: "/docs/usage/linter" },
-            { text: "Parser", link: "/docs/usage/parser" },
-            { text: "Resolver", link: "/docs/usage/resolver" },
+            { text: "Introduction", link: "/docs/guide/introduction" },
+            { text: "Philosophy", link: "/docs/guide/philosophy" },
+            { text: "Benchmarks", link: "/docs/guide/benchmarks" },
           ],
         },
         {
+          text: "Usage",
           items: [
-            { text: "Philosophy", link: "/docs/usage/philosophy" },
-            { text: "Benchmarks", link: "/docs/usage/benchmarks" },
+            { text: "Linter", link: "/docs/guide/usage/linter" },
+            { text: "Parser", link: "/docs/guide/usage/parser" },
+            { text: "Resolver", link: "/docs/guide/usage/resolver" },
           ],
         },
       ],

.vitepress/theme/components/AppBlogPostHeader.vue

@@ -1,14 +1,23 @@
 <script setup lang="ts">
 import { computed, onMounted, ref, watchEffect } from 'vue'
 import { useData } from 'vitepress'
-import { AUTHORS } from '../../authors'
-import type { Author } from '../../authors'
+import { TEAM_MEMBERS_MAP } from '../constants/team'
+import type { TeamMember } from '../constants/team'
 
-            const vitePressData = useData()
-const title =           computed<string>(() => vitePressData.frontmatter.value.title)
-const authors = computed<Author[]>(() => {
-  return vitePressData.frontmatter.value.authors.map((author) => AUTHORS[author]).filter(Boolean)
-})
+const vitePressData = useData()
+const title = computed<string>(() => vitePressData.frontmatter.value.title)
+const authors = computed(() => (vitePressData.frontmatter.value.authors as TeamMember['id'][]).flatMap((id) => {
+  const member = TEAM_MEMBERS_MAP[id]
+
+  if (member) {
+    const { avatar, links, name, title } = member
+    const { link = '' } = links?.find((link) => link.link.startsWith('https://github.com/')) ?? {}
+
+    return [{ avatar, link, name, title }]
+  }
+
+  return []
+}))
 const date = computed(() => {
   const filePath = vitePressData.page.value.filePath
   const result = filePath.match(/^blog\/(?<date>\d{4}-\d{2}-\d{2})-.*$/)
@@ -40,11 +49,12 @@ onMounted(() => {
       <time :datetime="isoDatetime">{{ datetime }}</time>
     </p>
     <ul class="authors">
-      <li v-for="author in authors" :key="author.name" class="author">
-        <img :src="author.avatar" :alt="author.name" class="author-avatar">
+      <li v-for="{ avatar, link, name, title } in authors" :key="name" class="author">
+        <img :src="avatar" :alt="name" class="author-avatar">
         <p class="author-text">
-          <a :href="author.link" target="_blank" class="author-name">{{ author.name }}</a>
-          <span class="author-title">{{ author.title }}</span>
+          <a v-if="link" :href="link" target="_blank" class="author-name">{{ name }}</a>
+          <span v-else class="author-name">{{ name }}</span>
+          <span class="author-title">{{ title }}</span>
         </p>
       </li>
     </ul>

.vitepress/theme/constants/team.ts

@@ -0,0 +1,108 @@
+export type TeamMember = CoreTeamMember | CommunityTeamMember;
+
+interface TeamMemberBase /* extends VitePress' `TeamMember` type, which is not exporeted */ {
+  id: string;
+  type: "core" | "community";
+  avatar: string;
+  name: string;
+  title?: string;
+  org?: string;
+  orgLink?: string;
+  desc?: string;
+  links?: {
+    icon:
+      | "discord"
+      | "facebook"
+      | "github"
+      | "instagram"
+      | "linkedin"
+      | "mastodon"
+      | "slack"
+      | "twitter"
+      | "x"
+      | "youtube"
+      | { svg: string };
+    link: string;
+    ariaLabel?: string;
+  }[];
+  sponsor?: string;
+}
+
+export interface CoreTeamMember extends TeamMemberBase {
+  type: "core";
+}
+
+export interface CommunityTeamMember extends TeamMemberBase {
+  type: "community";
+}
+
+export const TEAM_MEMBERS: TeamMember[] = [
+  {
+    id: "boshen",
+    type: "core",
+    name: "Boshen",
+    title: "Creator",
+    avatar: "https://www.github.com/Boshen.png",
+    links: [
+      { icon: "github", link: "https://github.com/Boshen" },
+      { icon: "twitter", link: "https://twitter.com/boshen_c" },
+    ],
+  },
+  {
+    id: "wenzhe_wang",
+    type: "core",
+    name: "Wenzhe Wang",
+    title: "Member",
+    avatar: "https://www.github.com/mysteryven.png",
+    links: [
+      { icon: "github", link: "https://github.com/mysteryven" },
+      { icon: "twitter", link: "https://twitter.com/mysteryven" },
+    ],
+  },
+  {
+    id: "zoolsher",
+    type: "core",
+    name: "zoolsher",
+    title: "Member",
+    avatar: "https://www.github.com/zoolsher.png",
+    links: [
+      { icon: "github", link: "https://github.com/zoolsher" },
+      { icon: "twitter", link: "https://twitter.com/zoolsher" },
+    ],
+  },
+  {
+    id: "nozomu_ikuta",
+    type: "community",
+    name: "Nozomu Ikuta",
+    title: "Contributor",
+    avatar: "https://www.github.com/NozomuIkuta.png",
+    links: [
+      { icon: "github", link: "https://github.com/NozomuIkuta" },
+      { icon: "twitter", link: "https://twitter.com/NozomuIkuta" },
+    ],
+  },
+  {
+    id: "ubugeeei",
+    type: "community",
+    name: "Ubugeeei",
+    title: "Contributor",
+    avatar: "https://www.github.com/Ubugeeei.png",
+    links: [
+      { icon: "github", link: "https://github.com/Ubugeeei" },
+      { icon: "twitter", link: "https://twitter.com/ubugeeei" },
+    ],
+  },
+];
+
+export const CORE_TEAM_MEMBERS = TEAM_MEMBERS.filter(
+  ({ type }) => type === "core",
+) as CoreTeamMember[];
+
+export const COMMUNITY_TEAM_MEMBERS = TEAM_MEMBERS.filter(
+  ({ type }) => type === "community",
+) as CommunityTeamMember[];
+
+export const TEAM_MEMBERS_MAP: Record<TeamMember["id"], TeamMember> =
+  Object.fromEntries(
+    TEAM_MEMBERS.map(({ id, ...rest }) => [id, { id, ...rest }]),
+  );

docs/docs/guide/benchmarks.md

@@ -0,0 +1,8 @@
+---
+title: Benchmarks
+outline: deep
+---
+
+# Benchmarks
+
+TBD

docs/docs/guide/introduction.md

@@ -0,0 +1,21 @@
+---
+title: Introduction
+outline: deep
+---
+
+<script setup>
+import { VPTeamMembers } from 'vitepress/theme'
+import { COMMUNITY_TEAM_MEMBERS, CORE_TEAM_MEMBERS } from '../../../.vitepress/theme/constants/team'
+</script>
+
+# What is OXC?
+
+TBD
+
+## Core Team
+
+<VPTeamMembers size="medium" :members="CORE_TEAM_MEMBERS" />
+
+## Community
+
+<VPTeamMembers size="medium" :members="COMMUNITY_TEAM_MEMBERS" />

docs/docs/guide/philosophy.md

@@ -0,0 +1,8 @@
+---
+title: Philosophy
+outline: deep
+---
+
+# Philosophy
+
+TBD

docs/index.md

@@ -9,7 +9,7 @@ hero:
   actions:
     - theme: brand
       text: Get Started
-      link: /docs/usage/linter
+      link: /docs/guide/introduction
     - theme: alt
       text: View on GitHub
       link: https://github.com/oxc-project/oxc