feat: enhance KanbanPageClient and KeyboardShortcuts with new functionality

- Added `toggleFontSize` and `handleToggleDueDateFilter` to `KanbanPageClient` for improved user control over font size and due date visibility.
- Replaced `useKeyboardShortcuts` with `useGlobalKeyboardShortcuts` for better shortcut management across components.
- Updated keyboard shortcuts in `KeyboardShortcutsContext` to include new actions for toggling objectives, due date filters, and font size.
- Refined `KeyboardShortcutsModal` layout for better usability and consistency.
- Removed deprecated `useKeyboardShortcuts` hook to streamline codebase.
This commit is contained in:
Julien Froidefond
2025-09-29 20:57:00 +02:00
parent 749f69680b
commit 32f9d1d5de
6 changed files with 127 additions and 97 deletions

View File

@@ -21,7 +21,7 @@ interface KanbanPageClientProps {
function KanbanPageContent() {
const { syncing, createTask, activeFiltersCount, kanbanFilters, setKanbanFilters } = useTasksContext();
const { preferences, updateViewPreferences } = useUserPreferences();
const { preferences, updateViewPreferences, toggleFontSize } = useUserPreferences();
const [isCreateModalOpen, setIsCreateModalOpen] = useState(false);
const isMobile = useIsMobile(768); // Tailwind md breakpoint
const searchParams = useSearchParams();
@@ -50,6 +50,13 @@ function KanbanPageContent() {
updateViewPreferences({ swimlanesByTags: !swimlanesByTags });
};
const handleToggleDueDateFilter = () => {
setKanbanFilters({
...kanbanFilters,
showWithDueDate: !kanbanFilters.showWithDueDate
});
};
// Handler pour la création de tâche depuis la barre de contrôles
const handleCreateTask = async (data: CreateTaskData) => {
await createTask(data);
@@ -62,6 +69,9 @@ function KanbanPageContent() {
onToggleFilters: handleToggleFilters,
onToggleCompactView: handleToggleCompactView,
onToggleSwimlanes: handleToggleSwimlanes,
onToggleObjectives: handleToggleObjectives,
onToggleDueDateFilter: handleToggleDueDateFilter,
onToggleFontSize: toggleFontSize,
onOpenSearch: () => {
// Focus sur le champ de recherche dans les contrôles desktop
const searchInput = document.querySelector('input[placeholder*="Rechercher"]') as HTMLInputElement;