\n $\"Conversion\"$ \n

\n Conversion Todo\n

\n Gerencie suas tarefas com inteligência\n

\n \n

via LastLogin

\n \n

\n ou\n

\n \n \n

\n );\n }\n\n return (\n

\n \n

\n \n \n

\n );\n}",[],[244,251,258],{"_107":265,"_100":266,"_165":267,"_167":252,"_168":150,"_169":268,"_171":121,"_109":269,"_104":33,"_173":191,"_175":270,"_176":22,"_177":-5,"_178":271,"_103":272},"0081c7de-3e11-11f0-ae39-76b3cceeab13","Header.tsx","0081c8ba-3e11-11f0-ae39-76b3cceeab13",11,["D",1748690319229],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport React from \"https://esm.sh/react@18.2.0?deps=react@18.2.0\";\n\ninterface HeaderProps {\n user: { email: string };\n}\n\nexport default function Header({ user }: HeaderProps) {\n return (\n

\n $\"Conversion\"$ \n

Todo

Gerencie suas tarefas

\n \n

Olá,

{user.email}

\n \n Sair\n \n

\n );\n}",[],[244,251,266],{"_107":274,"_100":275,"_165":276,"_167":252,"_168":150,"_169":277,"_171":121,"_109":278,"_104":33,"_173":191,"_175":279,"_176":22,"_177":-5,"_178":280,"_103":281},"0b77b810-3e11-11f0-ace3-76b3cceeab13","TodoForm.tsx","0b77b8c4-3e11-11f0-ace3-76b3cceeab13",12,["D",1748690337619],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport React, { useState } from \"https://esm.sh/react@18.2.0?deps=react@18.2.0\";\nimport type { CreateTodoRequest } from \"../../shared/types.ts\";\n\ninterface TodoFormProps {\n onSubmit: (todo: CreateTodoRequest) => void;\n}\n\nexport default function TodoForm({ onSubmit }: TodoFormProps) {\n const [title, setTitle] = useState('');\n const [description, setDescription] = useState('');\n const [priority, setPriority] = useState<'baixa' | 'media' | 'alta'>('media');\n const [dueDate, setDueDate] = useState('');\n const [isExpanded, setIsExpanded] = useState(false);\n\n const handleSubmit = (e: React.FormEvent) => {\n e.preventDefault();\n \n if (!title.trim()) return;\n\n onSubmit({\n title: title.trim(),\n description: description.trim() || undefined,\n priority,\n due_date: dueDate || undefined,\n });\n\n // Reset form\n setTitle('');\n setDescription('');\n setPriority('media');\n setDueDate('');\n setIsExpanded(false);\n };\n\n return (\n

\n setTitle(e.target.value)}\n placeholder=\"Adicionar nova tarefa...\"\n className=\"w-full px-4 py-3 border border-gray-300 rounded-md focus:ring-2 focus:ring-blue-500 focus:border-transparent outline-none text-lg\"\n onFocus={() => setIsExpanded(true)}\n />\n

\n\n {isExpanded && (\n <>\n

\n setDescription(e.target.value)}\n placeholder=\"Descrição (opcional)\"\n rows={3}\n className=\"w-full px-4 py-3 border border-gray-300 rounded-md focus:ring-2 focus:ring-blue-500 focus:border-transparent outline-none resize-none\"\n />\n

\n\n

\n \n Prioridade\n \n setPriority(e.target.value as 'baixa' | 'media' | 'alta')}\n className=\"w-full px-3 py-2 border border-gray-300 rounded-md focus:ring-2 focus:ring-blue-500 focus:border-transparent outline-none\"\n >\n \n \n \n \n

\n\n

\n \n Data de vencimento\n \n setDueDate(e.target.value)}\n className=\"w-full px-3 py-2 border border-gray-300 rounded-md focus:ring-2 focus:ring-blue-500 focus:border-transparent outline-none\"\n />\n

\n \n )}\n\n

\n {isExpanded && (\n setIsExpanded(false)}\n className=\"px-4 py-2 text-gray-600 hover:text-gray-800 transition-colors\"\n >\n Cancelar\n \n )}\n \n \n {isExpanded ? 'Criar Tarefa' : 'Adicionar'}\n \n

\n );\n}",[],[244,251,275],{"_107":283,"_100":284,"_165":285,"_167":252,"_168":150,"_169":286,"_171":121,"_109":287,"_104":33,"_173":191,"_175":288,"_176":22,"_177":-5,"_178":289,"_103":290},"26998ee8-3e11-11f0-ba6d-76b3cceeab13","TodoItem.tsx","26998fc4-3e11-11f0-ba6d-76b3cceeab13",14,["D",1748690383139],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport React, { useState } from \"https://esm.sh/react@18.2.0?deps=react@18.2.0\";\nimport type { Todo, UpdateTodoRequest } from \"../../shared/types.ts\";\n\ninterface TodoItemProps {\n todo: Todo;\n onUpdate: (id: number, updates: UpdateTodoRequest) => void;\n onDelete: (id: number) => void;\n}\n\nexport default function TodoItem({ todo, onUpdate, onDelete }: TodoItemProps) {\n const [isEditing, setIsEditing] = useState(false);\n const [editTitle, setEditTitle] = useState(todo.title);\n const [editDescription, setEditDescription] = useState(todo.description || '');\n const [editPriority, setEditPriority] = useState(todo.priority);\n const [editDueDate, setEditDueDate] = useState(todo.due_date?.split('T')[0] || '');\n\n const handleToggleComplete = () => {\n onUpdate(todo.id, { completed: !todo.completed });\n };\n\n const handleSaveEdit = () => {\n if (!editTitle.trim()) return;\n\n onUpdate(todo.id, {\n title: editTitle.trim(),\n description: editDescription.trim() || undefined,\n priority: editPriority,\n due_date: editDueDate || undefined,\n });\n\n setIsEditing(false);\n };\n\n const handleCancelEdit = () => {\n setEditTitle(todo.title);\n setEditDescription(todo.description || '');\n setEditPriority(todo.priority);\n setEditDueDate(todo.due_date?.split('T')[0] || '');\n setIsEditing(false);\n };\n\n const formatDate = (dateString: string) => {\n const date = new Date(dateString);\n return date.toLocaleDateString('pt-BR');\n };\n\n const isOverdue = todo.due_date && new Date(todo.due_date) < new Date() && !todo.completed;\n\n const priorityColors = {\n alta: 'text-red-600',\n media: 'text-yellow-600',\n baixa: 'text-green-600',\n };\n\n const priorityIcons = {\n alta: '🔴',\n media: '🟡',\n baixa: '🟢',\n };\n\n if (isEditing) {\n return (\n

\n setEditTitle(e.target.value)}\n className=\"w-full px-3 py-2 border border-gray-300 rounded-md focus:ring-2 focus:ring-blue-500 focus:border-transparent outline-none\"\n autoFocus\n />\n \n setEditDescription(e.target.value)}\n placeholder=\"Descrição (opcional)\"\n rows={2}\n className=\"w-full px-3 py-2 border border-gray-300 rounded-md focus:ring-2 focus:ring-blue-500 focus:border-transparent outline-none resize-none\"\n />\n\n

\n setEditPriority(e.target.value as 'baixa' | 'media' | 'alta')}\n className=\"px-3 py-2 border border-gray-300 rounded-md focus:ring-2 focus:ring-blue-500 focus:border-transparent outline-none\"\n >\n \n \n \n \n\n setEditDueDate(e.target.value)}\n className=\"px-3 py-2 border border-gray-300 rounded-md focus:ring-2 focus:ring-blue-500 focus:border-transparent outline-none\"\n />\n

\n\n

\n \n Cancelar\n \n \n Salvar\n \n

\n );\n }\n\n return (\n

\n \n {todo.completed && '✓'}\n \n\n

\n {todo.title}\n

\n \n {todo.description && (\n

\n {todo.description}\n

\n )}\n\n

\n \n {priorityIcons[todo.priority]}\n {todo.priority}\n \n\n {todo.due_date && (\n \n 📅\n {formatDate(todo.due_date)}\n {isOverdue && (Atrasada)}\n \n )}\n\n \n Criada em {formatDate(todo.created_at)}\n \n

\n\n

\n setIsEditing(true)}\n className=\"text-gray-400 hover:text-blue-600 transition-colors\"\n title=\"Editar\"\n >\n ✏️\n \n onDelete(todo.id)}\n className=\"text-gray-400 hover:text-red-600 transition-colors\"\n title=\"Deletar\"\n >\n 🗑️\n \n

\n );\n}",[],[244,251,284],{"_107":292,"_100":293,"_165":294,"_167":252,"_168":150,"_169":295,"_171":121,"_109":296,"_104":33,"_173":191,"_175":297,"_176":22,"_177":-5,"_178":298,"_103":299},"1512bbe0-3e11-11f0-b72c-76b3cceeab13","TodoList.tsx","1512bd7a-3e11-11f0-b72c-76b3cceeab13",13,["D",1748690353733],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport React from \"https://esm.sh/react@18.2.0?deps=react@18.2.0\";\nimport type { Todo, UpdateTodoRequest } from \"../../shared/types.ts\";\nimport TodoItem from \"./TodoItem.tsx\";\n\ninterface TodoListProps {\n todos: Todo[];\n loading: boolean;\n onUpdate: (id: number, updates: UpdateTodoRequest) => void;\n onDelete: (id: number) => void;\n onRefresh: () => void;\n}\n\nexport default function TodoList({ todos, loading, onUpdate, onDelete, onRefresh }: TodoListProps) {\n const completedTodos = todos.filter(todo => todo.completed);\n const pendingTodos = todos.filter(todo => !todo.completed);\n\n if (loading) {\n return (\n

Carregando tarefas...

\n );\n }\n\n if (todos.length === 0) {\n return (\n

📝

\n Nenhuma tarefa ainda\n

\n Comece criando sua primeira tarefa acima\n

\n \n Atualizar lista\n \n

\n );\n }\n\n return (\n

\n {/* Pending Todos */}\n {pendingTodos.length > 0 && (\n

\n Pendentes ({pendingTodos.length})\n

\n {pendingTodos.map(todo => (\n \n ))}\n

\n )}\n\n {/* Completed Todos */}\n {completedTodos.length > 0 && (\n

\n Concluídas ({completedTodos.length})\n

\n {completedTodos.map(todo => (\n \n ))}\n

\n )}\n\n {/* Refresh Button */}\n

\n \n 🔄 Atualizar lista\n \n

\n );\n}",[],[244,251,293],[244,251],{"_107":302,"_100":223,"_165":303,"_167":245,"_168":150,"_169":304,"_171":121,"_109":305,"_104":33,"_173":227,"_175":306,"_176":22,"_177":-5,"_178":307,"_103":308},"3703b8bc-3e11-11f0-80d9-76b3cceeab13","3703b98e-3e11-11f0-80d9-76b3cceeab13",17,["D",1748690410679],"# Frontend - Conversion Todo\n\nInterface React em português com tema Conversion para gerenciamento de tarefas.\n\n## Componentes\n\n- `App.tsx` - Componente principal com lógica de estado\n- `Header.tsx` - Cabeçalho com logo e informações do usuário\n- `TodoForm.tsx` - Formulário para criar/editar tarefas\n- `TodoList.tsx` - Lista de tarefas organizadas por status\n- `TodoItem.tsx` - Item individual de tarefa com ações\n\n## Funcionalidades\n\n- ✅ Login com Google via LastLogin\n- ✅ Criação de tarefas com prioridade e data de vencimento\n- ✅ Edição inline de tarefas\n- ✅ Marcação de conclusão\n- ✅ Exclusão de tarefas\n- ✅ Organização por status (pendentes/concluídas)\n- ✅ Indicação visual de prioridades\n- ✅ Alertas para tarefas atrasadas\n\n## Design\n\n- Tema azul Conversion (#4F7CFF)\n- TailwindCSS para estilização\n- Design responsivo\n- Interface em português\n- Ícones emoji para melhor UX\n\n## Estado\n\nO estado inicial é injetado pelo servidor para evitar loading desnecessário. O estado é gerenciado localmente com React hooks.",[],[244,223],{"_107":310,"_100":311,"_165":312,"_167":245,"_168":150,"_169":246,"_171":121,"_109":313,"_104":33,"_173":227,"_175":314,"_176":22,"_177":-5,"_178":315,"_103":316},"eaa57816-3e10-11f0-bdd0-76b3cceeab13","index.html","eaa578d4-3e10-11f0-bdd0-76b3cceeab13",["D",1748690282552],"\n\n\n \n \n Conversion Todo - Gerencie suas tarefas\n \n \n ✅\">\n \n\n\n

\n \n\n",[],[244,311],{"_107":318,"_100":319,"_165":320,"_167":245,"_168":150,"_169":321,"_171":121,"_109":322,"_104":33,"_173":191,"_175":323,"_176":22,"_177":-5,"_178":324,"_103":325},"ed67f858-3e10-11f0-a5d9-76b3cceeab13","index.tsx","ed67f8ee-3e10-11f0-a5d9-76b3cceeab13",9,["D",1748690287181],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport React from \"https://esm.sh/react@18.2.0?deps=react@18.2.0\";\nimport { createRoot } from \"https://esm.sh/react-dom@18.2.0/client?deps=react@18.2.0,react-dom@18.2.0\";\nimport App from \"./components/App.tsx\";\n\nconst root = createRoot(document.getElementById('root')!);\nroot.render();",[],[244,319],[244],{"_107":328,"_100":329,"_165":330,"_167":-5,"_168":150,"_169":331,"_171":121,"_109":332,"_104":33,"_173":174,"_175":-5,"_176":22,"_177":-5,"_178":333,"_103":349},"c4e62f30-3e10-11f0-ace3-76b3cceeab13","shared","10f72682-674e-4abd-813a-4c69c9f0c187",3,["D",1748690219222],[334,341],{"_107":335,"_100":223,"_165":336,"_167":330,"_168":150,"_169":149,"_171":121,"_109":337,"_104":33,"_173":227,"_175":338,"_176":22,"_177":-5,"_178":339,"_103":340},"3adc5f98-3e11-11f0-9662-76b3cceeab13","3adc602e-3e11-11f0-9662-76b3cceeab13",["D",1748690417131],"# Shared - Tipos e Utilitários\n\nCódigo compartilhado entre frontend e backend.\n\n## Tipos TypeScript\n\n### `Todo`\nInterface principal para tarefas com todos os campos do banco de dados.\n\n### `User`\nInterface para usuários do sistema.\n\n### `CreateTodoRequest`\nTipo para criação de novas tarefas (campos opcionais).\n\n### `UpdateTodoRequest`\nTipo para atualização de tarefas (todos os campos opcionais).\n\n## Prioridades\n\n- `baixa` - 🟢 Verde\n- `media` - 🟡 Amarelo \n- `alta` - 🔴 Vermelho\n\n## Uso\n\nImportar os tipos necessários:\n\n```typescript\nimport type { Todo, CreateTodoRequest } from \"../shared/types.ts\";\n```\n\nEste código funciona tanto no frontend (browser) quanto no backend (Deno).",[],[329,223],{"_107":342,"_100":343,"_165":344,"_167":330,"_168":150,"_169":331,"_171":121,"_109":345,"_104":33,"_173":191,"_175":346,"_176":22,"_177":-5,"_178":347,"_103":348},"c4e62616-3e10-11f0-ace3-76b3cceeab13","types.ts","c4e626de-3e10-11f0-ace3-76b3cceeab13",["D",1748690219222],"export interface Todo {\n id: number;\n title: string;\n description?: string;\n completed: boolean;\n priority: 'baixa' | 'media' | 'alta';\n due_date?: string;\n created_at: string;\n updated_at: string;\n user_email: string;\n}\n\nexport interface User {\n email: string;\n name?: string;\n created_at: string;\n}\n\nexport interface CreateTodoRequest {\n title: string;\n description?: string;\n priority?: 'baixa' | 'media' | 'alta';\n due_date?: string;\n}\n\nexport interface UpdateTodoRequest {\n title?: string;\n description?: string;\n completed?: boolean;\n priority?: 'baixa' | 'media' | 'alta';\n due_date?: string;\n}",[],[329,343],[329],{"_107":351,"_100":223,"_165":352,"_167":-5,"_168":150,"_169":353,"_171":121,"_109":354,"_104":33,"_173":227,"_175":355,"_176":22,"_177":-5,"_178":356,"_103":357},"c1c28e70-3e10-11f0-bf6f-76b3cceeab13","c1c28f42-3e10-11f0-bf6f-76b3cceeab13",2,["D",1748690213956],"# Conversion Todo App\n\nUma aplicação de gerenciamento de tarefas inspirada no Todoist, com o tema da Conversion.\n\n## Estrutura do Projeto\n\n- `backend/` - API Hono com autenticação LastLogin\n- `frontend/` - Interface React em português\n- `shared/` - Tipos e utilitários compartilhados\n\n## Funcionalidades\n\n- ✅ Autenticação com Google via LastLogin\n- ✅ Cadastro por email/senha\n- ✅ CRUD de tarefas\n- ✅ Interface em português\n- ✅ Tema Conversion (azul #4F7CFF)\n- ✅ Armazenamento SQLite\n\n## Como usar\n\n1. Acesse a aplicação\n2. Faça login com Google ou cadastre-se\n3. Gerencie suas tarefas\n\n## Tecnologias\n\n- Backend: Hono + SQLite\n- Frontend: React + TailwindCSS\n- Autenticação: LastLogin",[],[223],{"_107":359,"_100":360,"_165":361,"_167":-5,"_168":150,"_169":236,"_171":121,"_109":362,"_104":33,"_173":191,"_175":77,"_176":22,"_177":-5,"_178":363,"_103":364},"99ca7798-3e10-11f0-a5a0-76b3cceeab13","main.tsx","99ca7856-3e10-11f0-a5a0-76b3cceeab13",["D",1748690146900],[],[360],"files",[162,180,186,195,205,212,221,231,242,249,256,264,273,282,291,301,309,317,327,334,341,350,358],"counts",{"_369":33,"_370":236,"_371":33,"_372":373,"_376":377},"pulls","branches","forks","envVars",{"_374":33,"_375":33},"count","emptyCount","connections",{"_374":33,"_378":33},"unfilledCount","contents",[381,384,387,390,393],{"_107":163,"_100":164,"_165":166,"_167":-5,"_168":150,"_169":170,"_171":121,"_109":382,"_104":33,"_173":174,"_175":-5,"_176":22,"_177":-5,"_103":383},["D",1748690226079],[164],{"_107":243,"_100":244,"_165":245,"_167":-5,"_168":150,"_169":246,"_171":121,"_109":385,"_104":33,"_173":174,"_175":-5,"_176":22,"_177":-5,"_103":386},["D",1748690282552],[244],{"_107":328,"_100":329,"_165":330,"_167":-5,"_168":150,"_169":331,"_171":121,"_109":388,"_104":33,"_173":174,"_175":-5,"_176":22,"_177":-5,"_103":389},["D",1748690219222],[329],{"_107":351,"_100":223,"_165":352,"_167":-5,"_168":150,"_169":353,"_171":121,"_109":391,"_104":33,"_173":227,"_175":355,"_176":22,"_177":-5,"_103":392},["D",1748690213956],[223],{"_107":359,"_100":360,"_165":361,"_167":-5,"_168":150,"_169":236,"_171":121,"_109":394,"_104":33,"_173":191,"_175":77,"_176":22,"_177":-5,"_103":395},["D",1748690146900],[360],"upstreamProject","upstreamBranch","emptyEnvVars","isNew","flags",[],"routes/_app.x.$handle.$name.environment-variables",{"_98":99,"_100":101,"_105":404,"_372":409,"_410":22},{"_107":108,"_100":101,"_109":405,"_111":-5,"_112":22,"_113":114,"_115":-5,"_116":-5,"_14":117,"_118":119,"_120":121,"_122":121,"_123":-5,"_124":33,"_16":125,"_126":-5,"_127":-5,"_128":-5,"_129":-5,"_130":131,"_132":131,"_133":134,"_135":134,"_136":134,"_137":131,"_138":131,"_23":406,"_142":407,"_147":408,"_159":22},["D",1748690146886],{"_98":99,"_140":141},{"_98":99,"_144":141,"_14":117,"_145":146},{"_104":149,"_100":46,"_107":150,"_151":108,"_152":-5,"_153":-5,"_154":-5,"_155":-5,"_156":-5,"_157":101,"_158":99},[],"isTeamOrg","actionData","errors"]

diegoivo

todo-sqlite

Environment variables