add pykoi documentation

app/components/Button.tsx

@@ -3,7 +3,7 @@ import { Icon } from "@phosphor-icons/react";
 
 interface ButtonProps {
   label: string;
-  onClick: (e: React.MouseEvent<HTMLButtonElement>) => void;
+  onClick?: (e: React.MouseEvent<HTMLButtonElement>) => void;
   disabled?: boolean;
   outline?: boolean;
   small?: boolean;

app/components/hero/PageHero.tsx

@@ -1,5 +1,6 @@
 'use client';
 
+import { link } from "fs";
 import Button from "../Button";
 import Container from "../Container";
 import Image from 'next/image';
@@ -8,7 +9,7 @@ interface PageHeroProps {
     title: string;
     description?: string;
     image?: string;
-    button?: { label: string, onClick: () => void };
+    button?: { label: string, link?: string, onClick?: () => void };
 }
 
 const PageHero: React.FC<PageHeroProps> = ({ title, description, image, button }) => {
@@ -28,7 +29,7 @@ const PageHero: React.FC<PageHeroProps> = ({ title, description, image, button }
                         quality={100} />
                 }
                 <div className={`flex justify-center items-center h-full w-full`}>
-                    <div className="max-w-[800px] flex flex-col items-center justify-center gap-40 h-full">
+                    <div className="max-w-[800px] flex flex-col items-center justify-center gap-20 h-full">
                         <div>
 
                             <h1 className="text-6xl font-bold text-gray-900 mb-8 text-center">{title}</h1>
@@ -40,7 +41,14 @@ const PageHero: React.FC<PageHeroProps> = ({ title, description, image, button }
                         {
                             button &&
                             <div className="w-full">
-                                <Button label={button.label} onClick={button.onClick} />
+                                {
+                                    button.onClick ?
+                                        <Button label={button.label} onClick={button.onClick} />
+                                        :
+                                        <a href={button.link} target="_blank" rel="noopener noreferrer">
+                                            <Button label={button.label} />
+                                        </a>
+                                }
                             </div>
                         }
                     </div>

app/docs/page.tsx

@@ -0,0 +1,33 @@
+'use client';
+import PageHero from "@/app/components/hero/PageHero";
+import Container from "@/app/components/Container";
+import Button from "../components/Button";
+import Heading from "../components/Heading";
+
+const DocsPage = () => {
+    return (
+        <>
+            <PageHero title="📑 Documentation" />
+            <Container styles="h-max min-h-[50vh] py-20 max-w-[850px]">
+                <div className="py-10">
+                    <Heading title="🎏 Pykoi" subtitle="Get started with pykoi" center />
+                    <div className="pt-5">
+                        <a href="/docs/pykoi/index.html" target="_blank">
+                            <Button label="Read the Docs" />
+                        </a>
+                    </div>
+                </div>
+                <div className="py-10">
+                    <Heading title="🌊 Uniflow" subtitle="Get started with uniflow" center />
+                    <div className="pt-5">
+                        <a href="/docs/uniflow/index.html" target="_blank">
+                            <Button label="Read the Docs"/>
+                        </a>
+                    </div>
+                </div>
+            </Container>
+        </>
+    )
+}
+
+export default DocsPage;

app/libraries/pykoi/page.tsx

@@ -13,7 +13,7 @@ const PykoiPage = () => {
         <>
             <PageHero title="🎏 pykoi" description="Let AI Finetune your Private LLMs" button={{
                 label: "Read the Docs",
-                onClick: () => router.push("/libraries/pykoi/docs"),
+                link: "/docs/pykoi/index.html",
             }}/>
             <Container styles="h-max min-h-[80vh] py-20 max-w-[850px]">
                 <Section title="pykoi supercharges your ability to finetune your models" paragraphs={["pykoi is an open-source python library to finetune LLMs with RLAIF. Pykoi provides a unified interface including RLHF/RLAIF data and feedback collection, finetuning with reinforcement learning and reward modeling, and LLM comparisons."]} center />

app/libraries/uniflow/page.tsx

@@ -10,7 +10,7 @@ const UniflowPage = () => {
         <>
             <PageHero title="🌊 uniflow" description="Flow your unstructured data to your private LLMs" button={{
                 label: "Read the Docs",
-                onClick: () => router.push("/libraries/uniflow/docs"),
+                link: "/docs/uniflow/index.html",
             }}/>
             <Container styles="h-max min-h-[80vh] py-20 max-w-[850px]">
                 <Section title="uniflow streamlines your data" paragraphs={["Are you an ML professional grappling with the challenge of extracting high-quality data from confidential and unstructured data such as PDFs and PPTs? Fine-tuning large language models (LLMs) often requires dealing with such complex data, which poses significant challenges in terms of data privacy, processing efficiency, and model accuracy.",

public/docs/pykoi/.buildinfo

@@ -0,0 +1,4 @@
+# Sphinx build info version 1
+# This file hashes the configuration used when building these files. When it is not found, a full rebuild will be done.
+config: 5fcd7188253987b0feccdc76a08160c5
+tags: 645f666f9bcd5a90fca523b33c5a78b7