diff --git a/src/components/TaskList.jsx b/src/components/TaskList.jsx
index 8e81de060..2fae577b1 100644
--- a/src/components/TaskList.jsx
+++ b/src/components/TaskList.jsx
@@ -6,6 +6,7 @@ import CreateTaskModal from './CreateTaskModal';
import { useTaskMaster } from '../contexts/TaskMasterContext';
import Shell from './Shell';
import { api } from '../utils/api';
+import { useTranslation } from 'react-i18next';
const TaskList = ({
tasks = [],
@@ -31,8 +32,9 @@ const TaskList = ({
const [showHelpGuide, setShowHelpGuide] = useState(false);
const [isTaskMasterComplete, setIsTaskMasterComplete] = useState(false);
const [showPRDDropdown, setShowPRDDropdown] = useState(false);
-
+
const { projectTaskMaster, refreshProjects, refreshTasks, setCurrentProject } = useTaskMaster();
+ const { t } = useTranslation('tasks');
// Close PRD dropdown when clicking outside
useEffect(() => {
@@ -143,45 +145,45 @@ const TaskList = ({
// Organize tasks by status for Kanban view
const kanbanColumns = useMemo(() => {
const allColumns = [
- {
- id: 'pending',
- title: 'ð To Do',
- status: 'pending',
+ {
+ id: 'pending',
+ title: t('kanban.pending'),
+ status: 'pending',
color: 'bg-slate-50 dark:bg-slate-900/50 border-slate-200 dark:border-slate-700',
headerColor: 'bg-slate-100 dark:bg-slate-800 text-slate-800 dark:text-slate-200'
},
- {
- id: 'in-progress',
- title: 'ð In Progress',
- status: 'in-progress',
+ {
+ id: 'in-progress',
+ title: t('kanban.inProgress'),
+ status: 'in-progress',
color: 'bg-blue-50 dark:bg-blue-900/50 border-blue-200 dark:border-blue-700',
headerColor: 'bg-blue-100 dark:bg-blue-800 text-blue-800 dark:text-blue-200'
},
- {
- id: 'done',
- title: 'â
Done',
- status: 'done',
+ {
+ id: 'done',
+ title: t('kanban.done'),
+ status: 'done',
color: 'bg-emerald-50 dark:bg-emerald-900/50 border-emerald-200 dark:border-emerald-700',
headerColor: 'bg-emerald-100 dark:bg-emerald-800 text-emerald-800 dark:text-emerald-200'
},
- {
- id: 'blocked',
- title: 'ð« Blocked',
- status: 'blocked',
+ {
+ id: 'blocked',
+ title: t('kanban.blocked'),
+ status: 'blocked',
color: 'bg-red-50 dark:bg-red-900/50 border-red-200 dark:border-red-700',
headerColor: 'bg-red-100 dark:bg-red-800 text-red-800 dark:text-red-200'
},
- {
- id: 'deferred',
- title: 'â³ Deferred',
- status: 'deferred',
+ {
+ id: 'deferred',
+ title: t('kanban.deferred'),
+ status: 'deferred',
color: 'bg-amber-50 dark:bg-amber-900/50 border-amber-200 dark:border-amber-700',
headerColor: 'bg-amber-100 dark:bg-amber-800 text-amber-800 dark:text-amber-200'
},
- {
- id: 'cancelled',
- title: 'â Cancelled',
- status: 'cancelled',
+ {
+ id: 'cancelled',
+ title: t('kanban.cancelled'),
+ status: 'cancelled',
color: 'bg-gray-50 dark:bg-gray-900/50 border-gray-200 dark:border-gray-700',
headerColor: 'bg-gray-100 dark:bg-gray-800 text-gray-800 dark:text-gray-200'
}
@@ -199,7 +201,7 @@ const TaskList = ({
...column,
tasks: filteredAndSortedTasks.filter(task => task.status === column.status)
}));
- }, [filteredAndSortedTasks]);
+ }, [filteredAndSortedTasks, t]);
const handleSortChange = (newSortBy) => {
if (sortBy === newSortBy) {
@@ -236,26 +238,26 @@ const TaskList = ({
- TaskMaster helps break down complex projects into manageable tasks with AI-powered assistance + {t('notConfigured.description')}
- + {/* What is TaskMaster section */}⢠AI-Powered Task Management: Break complex projects into manageable subtasks
-⢠PRD Templates: Generate tasks from Product Requirements Documents
-⢠Dependency Tracking: Understand task relationships and execution order
-⢠Progress Visualization: Kanban boards and detailed task analytics
-⢠CLI Integration: Use taskmaster commands for advanced workflows
+⢠{t('notConfigured.features.aiPowered')}
+⢠{t('notConfigured.features.prdTemplates')}
+⢠{t('notConfigured.features.dependencyTracking')}
+⢠{t('notConfigured.features.progressVisualization')}
+⢠{t('notConfigured.features.cliIntegration')}
TaskMaster is initialized! Here's what to do next:
+{t('gettingStarted.subtitle')}
Discuss your project idea and create a PRD that describes what you want to build.
+{t('gettingStarted.steps.createPRD.description')}
- + {/* Show existing PRDs if any */} {existingPRDs.length > 0 && (Existing PRDs:
+{t('gettingStarted.steps.createPRD.existingPRDs')}
Ask your AI assistant to analyze task complexity and expand them into detailed subtasks for easier implementation.
+{t('gettingStarted.steps.analyzeTasks.description')}
Ask your AI assistant to begin working on tasks, update their status, and add new tasks as your project evolves.
+{t('gettingStarted.steps.startBuilding.description')}
Interactive CLI for {currentProject?.displayName}
+{t('setupModal.subtitle', { projectName: currentProject?.displayName })}
Try adjusting your search or filter criteria.
+{t('noMatchingTasks.description')}
Your guide to productive task management
+{t('helpGuide.subtitle')}
Discuss your project idea and create a PRD that describes what you want to build.
+{t('gettingStarted.steps.createPRD.description')}
Once you have a PRD, ask your AI assistant to parse it and TaskMaster will automatically break it down into manageable tasks with implementation details.
+{t('gettingStarted.steps.generateTasks.description')}
ð¬ Example:
-- "I've just initialized a new project with Claude Task Master. I have a PRD at .taskmaster/docs/prd.txt. Can you help me parse it and set up the initial tasks?" +
+ {t('helpGuide.examples.parsePRD')}
Ask your AI assistant to analyze task complexity and expand them into detailed subtasks for easier implementation.
+{t('gettingStarted.steps.analyzeTasks.description')}
ð¬ Example:
-- "Task 5 seems complex. Can you break it down into subtasks?" +
+ {t('helpGuide.examples.expandTask')}
Ask your AI assistant to begin working on tasks, update their status, and add new tasks as your project evolves.
+{t('gettingStarted.steps.startBuilding.description')}
ð¬ Example:
-- "Please add a new task to implement user profile image uploads using Cloudinary, research the best approach." +
+ {t('helpGuide.examples.addTask')}