/**
 * Route wrapper for the canvas: resolves projectId from URL and updates lastEditedAt on open.
 */

import React, { useEffect } from 'react'
import { useParams } from 'react-router-dom'
import { CanvasPage } from './CanvasPage'
import { usePlatform } from '@/app/kosmos/KosmosContext'

export function CanvasRoute() {
  const { projectId } = useParams<{ projectId: string }>()
  const { projects, updateLastEdited } = usePlatform()

  const project = projects.find((p) => p.id === projectId)

  useEffect(() => {
    if (projectId) updateLastEdited(projectId)
  }, [projectId, updateLastEdited])

  if (!projectId) return null
  if (!project) {
    return (
      <div className="flex flex-1 flex-col items-center justify-center gap-4 p-8">
        <p className="text-sm text-muted-foreground">Project not found.</p>
      </div>
    )
  }

  return (
    <div className="flex min-h-0 flex-1 flex-col">
      <CanvasPage key={projectId} projectId={projectId} />
    </div>
  )
}