import { Separator } from "@/components/ui/separator";
// import { db, schema } from "@/lib/db";
// import { ingestAuditLogs } from "@/lib/tinybird";
// import { auth } from "@clerk/nextjs";
// import { newId } from "@aigxion/id";
import { ArrowRight } from "lucide-react";
import { headers } from "next/headers";
import Link from "next/link";
import { notFound, redirect } from "next/navigation";

import { nanoid } from "nanoid";

import { auth } from '@/auth'
import { Session } from '@/lib/types'
import { getMissingKeys } from '../actions'

import { Chat as ChatAI } from '@/components-ai/chat'

import { AI } from '@/lib/chat/actions'
import { ChatStaff } from "@/components/chat-staff";

type Props = {
  searchParams: {
    workspaceId?: string;
    apiId?: string;
  };
};

type PropsHeader = {
  title: React.ReactNode;
  description?: string;
  /**
   * A set of components displayed in the top right
   * null components are filtered out
   */
  actions?: React.ReactNode[];
};

const PageHeader: React.FC<PropsHeader> = ({ title, description, actions }) => {
  const actionRows: React.ReactNode[][] = [];
  if (actions) {
    for (let i = 0; i < actions.length; i += 3) {
      actionRows.push(actions.slice(i, i + 3));
    }
  }

  return (
    <div className="flex flex-col items-start justify-between w-full gap-2 mb-4 md:items-center md:flex-row md:gap-4">
      <div className="space-y-1 ">
        <h1 className="text-2xl font-semibold tracking-tight">{title}</h1>
        <p className="text-sm text-gray-500 dark:text-gray-400">{description}</p>
      </div>
      {actionRows.map((row, i) => (
        <ul
          key={i.toString()}
          className="flex flex-wrap items-center justify-end gap-2 md:gap-4 md:flex-nowrap"
        >
          {row.map((action, i) => (
            // biome-ignore lint/suspicious/noArrayIndexKey: I got nothing better right now
            <li key={i}>{action}</li>
          ))}
        </ul>
      ))}
    </div>
  );
};

export default async function (props: Props) {

  return redirect("/staffai/xxxxx");

  const id = nanoid()
  const session = (await auth()) as Session
  const missingKeys = await getMissingKeys()
  return (
    <div className="container  mx-auto">

      {/* <CreateWorkspace /> */}

      <div className="flex items-start justify-between gap-16 ">
        <div className="min-h-screen w-full">

          <ChatStaff
            // initialMessages={initialMessages}
            id={id}
          // showLanding
          // avatarUrl={avatarUrl}
          // className="h-[80%]"
          />
        </div>
        {/* <aside className="w-1/4 flex-col items-start justify-center space-y-16 max-md:hidden md:flex ">
          <AsideContent />
        </aside>
        <main className="w-3/4 min-h-screen h-dvh ">
        </main> */}

      </div>


    </div>
  );
}