Steve-Dee-Designs
/
woocommerce
mirror of https://github.com/woocommerce/woocommerce.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Fix two columns tasks

This commit is contained in:
Chi-Hsuan Huang 2022-04-20 16:24:58 +08:00
parent 41e5d1f630
commit 754455460c
1 changed files with 23 additions and 17 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

40
plugins/woocommerce-admin/client/two-column-tasks/extended-task.tsx
View File

@ -11,6 +11,7 @@ import {
OPTIONS_STORE_NAME, OPTIONS_STORE_NAME,
WCDataSelector, WCDataSelector,
TaskListType, TaskListType,
TaskType,
} from '@woocommerce/data'; } from '@woocommerce/data';
import { recordEvent } from '@woocommerce/tracks'; import { recordEvent } from '@woocommerce/tracks';
@ -31,18 +32,22 @@ const ExtendedTask: React.FC< TasksProps > = ( { query } ) => {
const { updateOptions } = useDispatch( OPTIONS_STORE_NAME ); const { updateOptions } = useDispatch( OPTIONS_STORE_NAME );
const { task } = query; const { task } = query;
const { isResolving, taskLists } = useSelect( const {
( select: WCDataSelector ) => { isResolving,
return { taskLists,
isResolving: select( ONBOARDING_STORE_NAME ).isResolving( }: {
'getTaskListsByIds' isResolving: boolean;
), taskLists: TaskListType[];
taskLists: select( ONBOARDING_STORE_NAME ).getTaskListsByIds( [ } = useSelect( ( select: WCDataSelector ) => {
'extended_two_column', return {
] ), isResolving: select( ONBOARDING_STORE_NAME ).isResolving(
}; 'getTaskListsByIds'
} ),
); taskLists: select( ONBOARDING_STORE_NAME ).getTaskListsByIds( [
'extended_two_column',
] ),
};
} );
const toggleTaskList = ( taskList: TaskListType ) => { const toggleTaskList = ( taskList: TaskListType ) => {
const { id, isHidden } = taskList; const { id, isHidden } = taskList;
const newValue = ! isHidden; const newValue = ! isHidden;
@ -77,7 +82,7 @@ const ExtendedTask: React.FC< TasksProps > = ( { query } ) => {
} }
const completedTasks = extendedTaskList.tasks.filter( const completedTasks = extendedTaskList.tasks.filter(
( extendedTaskListTask: TaskListType ) => { ( extendedTaskListTask: TaskType ) => {
return extendedTaskListTask.isComplete; return extendedTaskListTask.isComplete;
} }
); );
@ -94,6 +99,7 @@ const ExtendedTask: React.FC< TasksProps > = ( { query } ) => {
isToggleable, isToggleable,
title, title,
tasks, tasks,
displayProgressHeader,
keepCompletedTaskList, keepCompletedTaskList,
} = extendedTaskList; } = extendedTaskList;
@ -104,15 +110,15 @@ const ExtendedTask: React.FC< TasksProps > = ( { query } ) => {
return ( return (
<Fragment key={ id }> <Fragment key={ id }>
<TaskList <TaskList
query={ query }
id={ id } id={ id }
eventPrefix={ eventPrefix } eventPrefix={ eventPrefix }
isComplete={ isComplete } isComplete={ isComplete }
query={ query }
tasks={ tasks } tasks={ tasks }
title={ title } title={ title }
isHidden={ false } isHidden={ isHidden }
isVisible={ true } isVisible={ isVisible }
displayProgressHeader={ false } displayProgressHeader={ displayProgressHeader }
keepCompletedTaskList={ keepCompletedTaskList } keepCompletedTaskList={ keepCompletedTaskList }
/> />
{ isToggleable && ( { isToggleable && (