Brijesh's Git Server — watchman-frontend @ main

admin site for watchman

src/pages/projects/index.tsx (view raw)

 1
 2
 3
 4
 5
 6
 7
 8
 9
 10
 11
 12
 13
 14
 15
 16
 17
 18
 19
 20
 21
 22
 23
 24
 25
 26
 27
 28
 29
 30
 31
 32
 33
 34
 35
 36
 37
 38
 39
 40
 41
 42
 43
 44
 45
 46
 47
 
import { ListProjects } from "@/api/projects";
import { PrimaryButton } from "@/components/Button";
import MainLayout from "@/components/MainLayout";
import Table from "@/components/table";
import Head from "next/head";
import Link from "next/link";
import { useRouter } from "next/router";
import { useEffect, useState } from "react";

const ProjectsHomePage = () => {
  const router = useRouter();

  const [projects, setProjects] = useState<any>([]);

  useEffect(() => {
    ListProjects(setProjects);
  }, []);

  return (
    <MainLayout>
      <Head>
        <title>Projects | Watchman</title>
      </Head>
      <div className="mb-4 flex justify-between items-center">
        <h1 className="text-xl font-medium">Projects</h1>
        <PrimaryButton
          text="Create Project"
          onClick={() => router.push("/projects/create")}
        />
      </div>
      {projects.data !== undefined && (
        <Table
          columns={["Name", "ID"]}
          data={projects.data.map((project: any) => {
            return {
              name: (
                <Link href={"/projects/" + project.id}>{project.name}</Link>
              ),
              id: project.id,
            };
          })}
        />
      )}
    </MainLayout>
  );
};
export default ProjectsHomePage;