从零搭建基于 AI GitHub 分析平台 (9) Dashboard 页面

效果

实现步骤如下：

设置 Dashboard 页面

修改 ``:

const DashBoardPage = ()=>{
  const { user } = useUser();
  const { project } = useProject();
  return (
    <div>
      <div className="flex items-center justify-between flex-wrap gap-4">
        {/* github link */}
        <div className="w-fit rounded-md bg-primary px-4 py-3">
          <div className="flex items-center">
            <Github className="size-6 text-white" />
            <div className="ml-2">
              <p className="text-sm font-medium text-white">
                这个项目链接到{" "}
                <Link href={project?.githubURL ?? ""} className="inline-flex items-center text-white/80 hover:underline">
                  {project?.githubURL}
                  <ExternalLink className="ml-1 size-4" />
                </Link>
              </p>
            </div>
          </div>
        </div>

        <div className="h-4"></div>

        <div className="flex items-center gap-4">
          TeamMember
          InviteButton
          ArchiveButton
        </div>
      </div>

      <div className="mt-4">
        <div className="grid grid-cols-1 gap-4 sm:grid-cols-5">
          AskQuestionCard
          MeetingCard
        </div>
      </div>

      {/* commit log */}
      <div className="mt-8"></div>
      Commit Log
    </div>
  )
}

export default DashBoardPage  

---

作者：Bearalise
出处：从零搭建基于 AI GitHub 分析平台 (9) Dashboard 页面
版权：本文版权归作者所有
转载：欢迎转载，但未经作者同意，必须保留此段声明，必须在文章中给出原文链接。