import MediaGrid from '@/components/project/MediaGrid';
import { fetchProjectMedia } from '@/lib/fetch';
import { Suspense } from 'react';
import Loading from '../loading';
import Chat from '@/components/project/Chat';

interface PageProps {
	params: {
		projectId: string;
	};
}

export default async function Page({ params }: PageProps) {
	const { projectId } = params;

	const mediaList = await fetchProjectMedia({ projectId: Number(projectId) });

	return (
		<div className="pb-[150px] pt-4 md:pt-10 h-full">
			<div className="flex h-full">
				<div className="w-1/2 relative border-r border-gray-300 overflow-auto">
					<MediaGrid mediaList={mediaList} />
				</div>
				<div className="w-1/2 relative overflow-auto">
					<Chat mediaList={mediaList} />
				</div>
			</div>
		</div>
	);
}
