'use client';
import { PageLayout } from '@/components/common/PageLayout';
import { AddProjectTabs } from '@/components/projects/AddProjectTabs';
import { Layout } from '@/src/components/common/Layout';
import { useProjectEditor } from '@/src/hooks/useProjectEditor';
import { useParams, useRouter } from 'next/navigation';

export default function Page() {
  const { id } = useParams();
  const router = useRouter();
  const { handleSelectExisting, selectedProject, availableProjects, refreshProjects } = useProjectEditor(
    id as string,
    []
  );

  return (
    <Layout>
      <PageLayout title='Add Project'>
        <AddProjectTabs
          selectedProject={selectedProject}
          availableProjects={availableProjects}
          onProjectSelect={handleSelectExisting}
          onCancel={() => router.back()}
          refreshProjects={refreshProjects}
          className='text-neutral-200'
        />
      </PageLayout>
    </Layout>
  );
}
