feat(task-filters): implement search functionality for task filtering
- Added search state management to ImprovedTaskFilters, allowing users to filter tasks based on search input. - Integrated search actions for both list and board views, ensuring appropriate task fetching based on the current view. - Updated task management slice to include a search field, enhancing the overall task filtering capabilities.
This commit is contained in:
@@ -23,9 +23,10 @@ import { useFilterDataLoader } from '@/hooks/useFilterDataLoader';
|
||||
import { toggleField } from '@/features/task-management/taskListFields.slice';
|
||||
|
||||
// Import Redux actions
|
||||
import { fetchTasksV3, setSelectedPriorities } from '@/features/task-management/task-management.slice';
|
||||
import { fetchTasksV3, setSelectedPriorities, setSearch as setTaskManagementSearch } from '@/features/task-management/task-management.slice';
|
||||
import { setCurrentGrouping, selectCurrentGrouping } from '@/features/task-management/grouping.slice';
|
||||
import { setMembers, setLabels } from '@/features/tasks/tasks.slice';
|
||||
import { setMembers, setLabels, setSearch } from '@/features/tasks/tasks.slice';
|
||||
import { setBoardSearch } from '@/features/board/board-slice';
|
||||
|
||||
// Optimized selectors with proper transformation logic
|
||||
const selectFilterData = createSelector(
|
||||
@@ -719,18 +720,42 @@ const ImprovedTaskFilters: React.FC<ImprovedTaskFiltersProps> = ({
|
||||
const handleSearchChange = useCallback((value: string) => {
|
||||
setSearchValue(value);
|
||||
|
||||
// Log the search change for now
|
||||
if (!projectId) return;
|
||||
|
||||
// Dispatch search action based on current view
|
||||
if (projectView === 'list') {
|
||||
// For list view, use the tasks slice
|
||||
dispatch(setSearch(value));
|
||||
} else {
|
||||
// For board view, use the board slice
|
||||
dispatch(setBoardSearch(value));
|
||||
}
|
||||
|
||||
console.log('Search change:', value, { projectView, projectId });
|
||||
|
||||
// TODO: Implement proper search dispatch
|
||||
}, [projectView, projectId]);
|
||||
// Trigger task refetch with new search value
|
||||
dispatch(fetchTasksV3(projectId));
|
||||
}, [projectView, projectId, dispatch]);
|
||||
|
||||
const clearAllFilters = useCallback(() => {
|
||||
// TODO: Implement clear all filters
|
||||
console.log('Clear all filters');
|
||||
if (!projectId) return;
|
||||
|
||||
// Clear search
|
||||
setSearchValue('');
|
||||
if (projectView === 'list') {
|
||||
dispatch(setSearch(''));
|
||||
} else {
|
||||
dispatch(setBoardSearch(''));
|
||||
}
|
||||
|
||||
// Clear other filters
|
||||
setShowArchived(false);
|
||||
}, []);
|
||||
|
||||
// Trigger task refetch with cleared filters
|
||||
dispatch(fetchTasksV3(projectId));
|
||||
|
||||
console.log('Clear all filters');
|
||||
}, [projectId, projectView, dispatch]);
|
||||
|
||||
const toggleArchived = useCallback(() => {
|
||||
setShowArchived(!showArchived);
|
||||
@@ -738,8 +763,6 @@ const ImprovedTaskFilters: React.FC<ImprovedTaskFiltersProps> = ({
|
||||
console.log('Toggle archived:', !showArchived);
|
||||
}, [showArchived]);
|
||||
|
||||
|
||||
|
||||
return (
|
||||
<div className={`${themeClasses.containerBg} border ${themeClasses.containerBorder} rounded-md p-3 shadow-sm ${className}`}>
|
||||
<div className="flex flex-wrap items-center gap-2">
|
||||
|
||||
@@ -17,6 +17,7 @@ const initialState: TaskManagementState = {
|
||||
groups: [],
|
||||
grouping: null,
|
||||
selectedPriorities: [],
|
||||
search: '',
|
||||
};
|
||||
|
||||
// Async thunk to fetch tasks from API
|
||||
@@ -153,7 +154,11 @@ export const fetchTasksV3 = createAsyncThunk(
|
||||
? state.taskManagement.selectedPriorities.join(',')
|
||||
: '';
|
||||
|
||||
// Get search value from taskReducer
|
||||
const searchValue = state.taskReducer.search || '';
|
||||
|
||||
console.log('fetchTasksV3 - selectedPriorities:', selectedPriorities);
|
||||
console.log('fetchTasksV3 - searchValue:', searchValue);
|
||||
|
||||
const config: ITaskListConfigV2 = {
|
||||
id: projectId,
|
||||
@@ -161,7 +166,7 @@ export const fetchTasksV3 = createAsyncThunk(
|
||||
group: currentGrouping,
|
||||
field: '',
|
||||
order: '',
|
||||
search: '',
|
||||
search: searchValue,
|
||||
statuses: '',
|
||||
members: selectedAssignees,
|
||||
projects: '',
|
||||
@@ -328,6 +333,11 @@ const taskManagementSlice = createSlice({
|
||||
setSelectedPriorities: (state, action: PayloadAction<string[]>) => {
|
||||
state.selectedPriorities = action.payload;
|
||||
},
|
||||
|
||||
// Search action
|
||||
setSearch: (state, action: PayloadAction<string>) => {
|
||||
state.search = action.payload;
|
||||
},
|
||||
},
|
||||
extraReducers: (builder) => {
|
||||
builder
|
||||
@@ -387,6 +397,7 @@ export const {
|
||||
setLoading,
|
||||
setError,
|
||||
setSelectedPriorities,
|
||||
setSearch,
|
||||
} = taskManagementSlice.actions;
|
||||
|
||||
export default taskManagementSlice.reducer;
|
||||
|
||||
@@ -76,6 +76,7 @@ export interface TaskManagementState {
|
||||
groups: TaskGroup[]; // Pre-processed groups from V3 API
|
||||
grouping: string | null; // Current grouping from V3 API
|
||||
selectedPriorities: string[]; // Selected priority filters
|
||||
search: string; // Search query for filtering tasks
|
||||
}
|
||||
|
||||
export interface TaskGroupsState {
|
||||
|
||||
Reference in New Issue
Block a user