import type { Route } from './+types/home'
import { Box, Typography, Container } from '@mui/material'

export function meta(_: Route.MetaArgs) {
  return [
    { title: "Captain's Log - Tasks" },
    { name: 'description', content: 'GTD-inspired task management system' },
  ]
}

export default function Home() {
  return (
    <Container maxWidth="lg">
      <Box sx={{ py: 4 }}>
        <Typography variant="h1" component="h1" gutterBottom>
          Tasks
        </Typography>
        <Typography variant="body1" color="text.secondary" sx={{ mb: 4 }}>
          Your GTD-inspired task management system. Capture everything, see only
          what matters.
        </Typography>

        <Box
          sx={{
            p: 4,
            textAlign: 'center',
            color: 'text.secondary',
            border: '2px dashed',
            borderColor: 'grey.300',
            borderRadius: 2,
          }}
        >
          <Typography variant="h6" gutterBottom>
            Task Management Interface Coming Soon
          </Typography>
          <Typography variant="body2">
            The task list, task cards, and quick capture components will be
            implemented in the next phase.
          </Typography>
        </Box>
      </Box>
    </Container>
  )
}