75ee6ce3d8
The committed .ts/.tsx files were written through a shell heredoc that stripped every quote character, so types.ts, App.tsx, api.ts, TaskList.tsx, TaskRow.tsx, TaskCard.tsx and AppShell.tsx were not valid TypeScript. Nothing surfaced this because index.js imported ./App, which resolved to the Create React App template App.js ahead of App.tsx, and typescript was never added as a dependency, so the broken files were never compiled. The preview was showing the CRA starter page. Rewritten and transferred as a binary archive rather than through a shell, with tsc and the test suite as the check that the files actually parse. Priority 1 (blocking) - TaskForm.tsx implemented: title, description, assignee, status, due date and priority, validated with react-hook-form and actionable messages. - App.tsx is now a real container wired to the service layer, replacing the hardcoded mock markup. Filtering by My Tasks / All Tasks / Blocked is driven by the signed-in user instead of a hardcoded id. - Edit, delete and inline status changes work from both the table and the cards. Priority 2 - Accessibility: skip link, ARIA tablist with arrow keys, table roles, dialog with focus trap and restore, aria-invalid and aria-describedby on fields, polite live region, 44px targets. Contrast corrected to meet AA: buttons use #2563eb and accent text #1d4ed8, since the mockup #3b82f6 reaches only 3.7:1 behind white text. - Error handling: ErrorBoundary, load failure with retry, per-filter empty states, blocked guidance, and save failures that keep the dialog and the user's input on screen. - 17 integration tests replace the CRA placeholder test. Removed the dead CRA template files (App.js, index.js, logo.svg, reportWebVitals.js, App_temp.css) and added tsconfig.json plus typescript. Verified in devbox 306: tsc --noEmit clean, 17/17 tests pass, CI build compiles with no lint warnings. Screenshots of all six states are in frontend/preview/.
51 lines
1.2 KiB
JSON
51 lines
1.2 KiB
JSON
{
|
|
"name": "frontend",
|
|
"version": "0.1.0",
|
|
"private": true,
|
|
"dependencies": {
|
|
"@axe-core/react": "^4.13.0",
|
|
"@testing-library/dom": "^10.4.1",
|
|
"@testing-library/jest-dom": "^6.9.1",
|
|
"@testing-library/react": "^16.3.3",
|
|
"@testing-library/user-event": "^13.5.0",
|
|
"@types/jest": "29.5.14",
|
|
"@types/node": "20.17.9",
|
|
"@types/react": "^19.2.18",
|
|
"@types/react-dom": "^19.2.7",
|
|
"axios": "^1.20.0",
|
|
"date-fns": "^4.4.0",
|
|
"react": "^19.2.8",
|
|
"react-dom": "^19.2.8",
|
|
"react-hook-form": "^7.87.0",
|
|
"react-scripts": "5.0.1",
|
|
"typescript": "5.6.3",
|
|
"web-vitals": "^2.1.4"
|
|
},
|
|
"scripts": {
|
|
"start": "react-scripts start",
|
|
"build": "react-scripts build",
|
|
"test": "react-scripts test",
|
|
"test:ci": "react-scripts test --watchAll=false",
|
|
"typecheck": "tsc --noEmit",
|
|
"eject": "react-scripts eject"
|
|
},
|
|
"eslintConfig": {
|
|
"extends": [
|
|
"react-app",
|
|
"react-app/jest"
|
|
]
|
|
},
|
|
"browserslist": {
|
|
"production": [
|
|
">0.2%",
|
|
"not dead",
|
|
"not op_mini all"
|
|
],
|
|
"development": [
|
|
"last 1 chrome version",
|
|
"last 1 firefox version",
|
|
"last 1 safari version"
|
|
]
|
|
}
|
|
}
|