woocommerce/plugins/woocommerce-admin/client/task-lists/setup-task-list/setup-task-list.tsx

337 lines
8.3 KiB
TypeScript
Raw Normal View History

Add summary tasks for the new two-column tasklist experiment (https://github.com/woocommerce/woocommerce-admin/pull/7669) * Add two column version of task list with a new design * Show number in the status circle * Set background for the active task * Remove border top * Changes in single column * Task list does not render in the left column if two column task list has been rendered already. * Your store today and activity panel does not render if user is running two column experiment * Update the circle border color * Fix lint issue * Support single column mode * Add box-shadow transition * Fix max width * Set the first card as the default if all tasks are complete * Adjust font-weight for the complete tasks * Use experiment * Remove unnecessary placeholder * Use two-column placeholder * Use the new task REST API * Remove unused code -- these are no longer used as we are using the new task list REST API * Update logic to use the new fields * Update css to fit the homescreen card * Remove unused var * Sync changelog from 2.8.0-rc.2 (https://github.com/woocommerce/woocommerce-admin/pull/7783) * Remove changelogs that were picked into 2.8.0-beta.2 * Update changelog for 7690 * Update changelog for 7743 * Update changelog for 7734 * Update changelog for 7763, 7771 * Remove changelog for 7763 from 2.8.0 since it was in 2.7.2 * Update changelog for 7798 * Show keep & dismiss page when tasks are complete (https://github.com/woocommerce/woocommerce-admin/pull/7684) * Add two column version of task list with a new design * Changes in single column * Task list does not render in the left column if two column task list has been rendered already. * Your store today and activity panel does not render if user is running two column experiment * Prompt a modal when hiding the task list * Add completed compoent * Move completed task to task-list * Implement hide and keep list buttons * Fix keep task list button * Rename hideTaskCard to hideTasks and keepTaskCard to keepTasks * Add two column version of task list with a new design * Show number in the status circle * Set background for the active task * Remove border top * Changes in single column * Task list does not render in the left column if two column task list has been rendered already. * Your store today and activity panel does not render if user is running two column experiment * Update the circle border color * Fix lint issue * Support single column mode * Add box-shadow transition * Fix max width * Set the first card as the default if all tasks are complete * Adjust font-weight for the complete tasks * Use experiment * Remove unnecessary placeholder * Use two-column placeholder * Use the new task REST API * Remove unused code -- these are no longer used as we are using the new task list REST API * Update logic to use the new fields * Update css to fit the homescreen card * Remove unused var * Show keep & dismiss page when tasks are complete (https://github.com/woocommerce/woocommerce-admin/pull/7684) * Add two column version of task list with a new design * Changes in single column * Task list does not render in the left column if two column task list has been rendered already. * Your store today and activity panel does not render if user is running two column experiment * Prompt a modal when hiding the task list * Add completed compoent * Move completed task to task-list * Implement hide and keep list buttons * Fix keep task list button * Rename hideTaskCard to hideTasks and keepTaskCard to keepTasks * Remove unnecessary feature checking logic * Separate && operator for Activity Header and Panel since one of them can be empty * Add changelog Co-authored-by: Matt Sherman <matt.sherman@automattic.com>
2021-10-20 16:16:22 +00:00
/**
* External dependencies
*/
import { __ } from '@wordpress/i18n';
import { useEffect, useRef, useState, createElement } from '@wordpress/element';
import { Button, Card } from '@wordpress/components';
Add summary tasks for the new two-column tasklist experiment (https://github.com/woocommerce/woocommerce-admin/pull/7669) * Add two column version of task list with a new design * Show number in the status circle * Set background for the active task * Remove border top * Changes in single column * Task list does not render in the left column if two column task list has been rendered already. * Your store today and activity panel does not render if user is running two column experiment * Update the circle border color * Fix lint issue * Support single column mode * Add box-shadow transition * Fix max width * Set the first card as the default if all tasks are complete * Adjust font-weight for the complete tasks * Use experiment * Remove unnecessary placeholder * Use two-column placeholder * Use the new task REST API * Remove unused code -- these are no longer used as we are using the new task list REST API * Update logic to use the new fields * Update css to fit the homescreen card * Remove unused var * Sync changelog from 2.8.0-rc.2 (https://github.com/woocommerce/woocommerce-admin/pull/7783) * Remove changelogs that were picked into 2.8.0-beta.2 * Update changelog for 7690 * Update changelog for 7743 * Update changelog for 7734 * Update changelog for 7763, 7771 * Remove changelog for 7763 from 2.8.0 since it was in 2.7.2 * Update changelog for 7798 * Show keep & dismiss page when tasks are complete (https://github.com/woocommerce/woocommerce-admin/pull/7684) * Add two column version of task list with a new design * Changes in single column * Task list does not render in the left column if two column task list has been rendered already. * Your store today and activity panel does not render if user is running two column experiment * Prompt a modal when hiding the task list * Add completed compoent * Move completed task to task-list * Implement hide and keep list buttons * Fix keep task list button * Rename hideTaskCard to hideTasks and keepTaskCard to keepTasks * Add two column version of task list with a new design * Show number in the status circle * Set background for the active task * Remove border top * Changes in single column * Task list does not render in the left column if two column task list has been rendered already. * Your store today and activity panel does not render if user is running two column experiment * Update the circle border color * Fix lint issue * Support single column mode * Add box-shadow transition * Fix max width * Set the first card as the default if all tasks are complete * Adjust font-weight for the complete tasks * Use experiment * Remove unnecessary placeholder * Use two-column placeholder * Use the new task REST API * Remove unused code -- these are no longer used as we are using the new task list REST API * Update logic to use the new fields * Update css to fit the homescreen card * Remove unused var * Show keep & dismiss page when tasks are complete (https://github.com/woocommerce/woocommerce-admin/pull/7684) * Add two column version of task list with a new design * Changes in single column * Task list does not render in the left column if two column task list has been rendered already. * Your store today and activity panel does not render if user is running two column experiment * Prompt a modal when hiding the task list * Add completed compoent * Move completed task to task-list * Implement hide and keep list buttons * Fix keep task list button * Rename hideTaskCard to hideTasks and keepTaskCard to keepTasks * Remove unnecessary feature checking logic * Separate && operator for Activity Header and Panel since one of them can be empty * Add changelog Co-authored-by: Matt Sherman <matt.sherman@automattic.com>
2021-10-20 16:16:22 +00:00
import { useSelect, useDispatch } from '@wordpress/data';
import { EllipsisMenu } from '@woocommerce/components';
2022-06-01 17:10:20 +00:00
import { navigateTo, getNewPath } from '@woocommerce/navigation';
import { WooOnboardingTaskListHeader } from '@woocommerce/onboarding';
2022-03-25 08:06:40 +00:00
import {
ONBOARDING_STORE_NAME,
TaskType,
2022-03-25 08:06:40 +00:00
useUserPreferences,
getVisibleTasks,
2022-04-20 04:49:27 +00:00
TaskListType,
WCDataSelector,
} from '@woocommerce/data';
Add summary tasks for the new two-column tasklist experiment (https://github.com/woocommerce/woocommerce-admin/pull/7669) * Add two column version of task list with a new design * Show number in the status circle * Set background for the active task * Remove border top * Changes in single column * Task list does not render in the left column if two column task list has been rendered already. * Your store today and activity panel does not render if user is running two column experiment * Update the circle border color * Fix lint issue * Support single column mode * Add box-shadow transition * Fix max width * Set the first card as the default if all tasks are complete * Adjust font-weight for the complete tasks * Use experiment * Remove unnecessary placeholder * Use two-column placeholder * Use the new task REST API * Remove unused code -- these are no longer used as we are using the new task list REST API * Update logic to use the new fields * Update css to fit the homescreen card * Remove unused var * Sync changelog from 2.8.0-rc.2 (https://github.com/woocommerce/woocommerce-admin/pull/7783) * Remove changelogs that were picked into 2.8.0-beta.2 * Update changelog for 7690 * Update changelog for 7743 * Update changelog for 7734 * Update changelog for 7763, 7771 * Remove changelog for 7763 from 2.8.0 since it was in 2.7.2 * Update changelog for 7798 * Show keep & dismiss page when tasks are complete (https://github.com/woocommerce/woocommerce-admin/pull/7684) * Add two column version of task list with a new design * Changes in single column * Task list does not render in the left column if two column task list has been rendered already. * Your store today and activity panel does not render if user is running two column experiment * Prompt a modal when hiding the task list * Add completed compoent * Move completed task to task-list * Implement hide and keep list buttons * Fix keep task list button * Rename hideTaskCard to hideTasks and keepTaskCard to keepTasks * Add two column version of task list with a new design * Show number in the status circle * Set background for the active task * Remove border top * Changes in single column * Task list does not render in the left column if two column task list has been rendered already. * Your store today and activity panel does not render if user is running two column experiment * Update the circle border color * Fix lint issue * Support single column mode * Add box-shadow transition * Fix max width * Set the first card as the default if all tasks are complete * Adjust font-weight for the complete tasks * Use experiment * Remove unnecessary placeholder * Use two-column placeholder * Use the new task REST API * Remove unused code -- these are no longer used as we are using the new task list REST API * Update logic to use the new fields * Update css to fit the homescreen card * Remove unused var * Show keep & dismiss page when tasks are complete (https://github.com/woocommerce/woocommerce-admin/pull/7684) * Add two column version of task list with a new design * Changes in single column * Task list does not render in the left column if two column task list has been rendered already. * Your store today and activity panel does not render if user is running two column experiment * Prompt a modal when hiding the task list * Add completed compoent * Move completed task to task-list * Implement hide and keep list buttons * Fix keep task list button * Rename hideTaskCard to hideTasks and keepTaskCard to keepTasks * Remove unnecessary feature checking logic * Separate && operator for Activity Header and Panel since one of them can be empty * Add changelog Co-authored-by: Matt Sherman <matt.sherman@automattic.com>
2021-10-20 16:16:22 +00:00
import { recordEvent } from '@woocommerce/tracks';
import { List, useSlot } from '@woocommerce/experimental';
Add summary tasks for the new two-column tasklist experiment (https://github.com/woocommerce/woocommerce-admin/pull/7669) * Add two column version of task list with a new design * Show number in the status circle * Set background for the active task * Remove border top * Changes in single column * Task list does not render in the left column if two column task list has been rendered already. * Your store today and activity panel does not render if user is running two column experiment * Update the circle border color * Fix lint issue * Support single column mode * Add box-shadow transition * Fix max width * Set the first card as the default if all tasks are complete * Adjust font-weight for the complete tasks * Use experiment * Remove unnecessary placeholder * Use two-column placeholder * Use the new task REST API * Remove unused code -- these are no longer used as we are using the new task list REST API * Update logic to use the new fields * Update css to fit the homescreen card * Remove unused var * Sync changelog from 2.8.0-rc.2 (https://github.com/woocommerce/woocommerce-admin/pull/7783) * Remove changelogs that were picked into 2.8.0-beta.2 * Update changelog for 7690 * Update changelog for 7743 * Update changelog for 7734 * Update changelog for 7763, 7771 * Remove changelog for 7763 from 2.8.0 since it was in 2.7.2 * Update changelog for 7798 * Show keep & dismiss page when tasks are complete (https://github.com/woocommerce/woocommerce-admin/pull/7684) * Add two column version of task list with a new design * Changes in single column * Task list does not render in the left column if two column task list has been rendered already. * Your store today and activity panel does not render if user is running two column experiment * Prompt a modal when hiding the task list * Add completed compoent * Move completed task to task-list * Implement hide and keep list buttons * Fix keep task list button * Rename hideTaskCard to hideTasks and keepTaskCard to keepTasks * Add two column version of task list with a new design * Show number in the status circle * Set background for the active task * Remove border top * Changes in single column * Task list does not render in the left column if two column task list has been rendered already. * Your store today and activity panel does not render if user is running two column experiment * Update the circle border color * Fix lint issue * Support single column mode * Add box-shadow transition * Fix max width * Set the first card as the default if all tasks are complete * Adjust font-weight for the complete tasks * Use experiment * Remove unnecessary placeholder * Use two-column placeholder * Use the new task REST API * Remove unused code -- these are no longer used as we are using the new task list REST API * Update logic to use the new fields * Update css to fit the homescreen card * Remove unused var * Show keep & dismiss page when tasks are complete (https://github.com/woocommerce/woocommerce-admin/pull/7684) * Add two column version of task list with a new design * Changes in single column * Task list does not render in the left column if two column task list has been rendered already. * Your store today and activity panel does not render if user is running two column experiment * Prompt a modal when hiding the task list * Add completed compoent * Move completed task to task-list * Implement hide and keep list buttons * Fix keep task list button * Rename hideTaskCard to hideTasks and keepTaskCard to keepTasks * Remove unnecessary feature checking logic * Separate && operator for Activity Header and Panel since one of them can be empty * Add changelog Co-authored-by: Matt Sherman <matt.sherman@automattic.com>
2021-10-20 16:16:22 +00:00
import classnames from 'classnames';
import { useLayoutContext } from '@woocommerce/admin-layout';
Add summary tasks for the new two-column tasklist experiment (https://github.com/woocommerce/woocommerce-admin/pull/7669) * Add two column version of task list with a new design * Show number in the status circle * Set background for the active task * Remove border top * Changes in single column * Task list does not render in the left column if two column task list has been rendered already. * Your store today and activity panel does not render if user is running two column experiment * Update the circle border color * Fix lint issue * Support single column mode * Add box-shadow transition * Fix max width * Set the first card as the default if all tasks are complete * Adjust font-weight for the complete tasks * Use experiment * Remove unnecessary placeholder * Use two-column placeholder * Use the new task REST API * Remove unused code -- these are no longer used as we are using the new task list REST API * Update logic to use the new fields * Update css to fit the homescreen card * Remove unused var * Sync changelog from 2.8.0-rc.2 (https://github.com/woocommerce/woocommerce-admin/pull/7783) * Remove changelogs that were picked into 2.8.0-beta.2 * Update changelog for 7690 * Update changelog for 7743 * Update changelog for 7734 * Update changelog for 7763, 7771 * Remove changelog for 7763 from 2.8.0 since it was in 2.7.2 * Update changelog for 7798 * Show keep & dismiss page when tasks are complete (https://github.com/woocommerce/woocommerce-admin/pull/7684) * Add two column version of task list with a new design * Changes in single column * Task list does not render in the left column if two column task list has been rendered already. * Your store today and activity panel does not render if user is running two column experiment * Prompt a modal when hiding the task list * Add completed compoent * Move completed task to task-list * Implement hide and keep list buttons * Fix keep task list button * Rename hideTaskCard to hideTasks and keepTaskCard to keepTasks * Add two column version of task list with a new design * Show number in the status circle * Set background for the active task * Remove border top * Changes in single column * Task list does not render in the left column if two column task list has been rendered already. * Your store today and activity panel does not render if user is running two column experiment * Update the circle border color * Fix lint issue * Support single column mode * Add box-shadow transition * Fix max width * Set the first card as the default if all tasks are complete * Adjust font-weight for the complete tasks * Use experiment * Remove unnecessary placeholder * Use two-column placeholder * Use the new task REST API * Remove unused code -- these are no longer used as we are using the new task list REST API * Update logic to use the new fields * Update css to fit the homescreen card * Remove unused var * Show keep & dismiss page when tasks are complete (https://github.com/woocommerce/woocommerce-admin/pull/7684) * Add two column version of task list with a new design * Changes in single column * Task list does not render in the left column if two column task list has been rendered already. * Your store today and activity panel does not render if user is running two column experiment * Prompt a modal when hiding the task list * Add completed compoent * Move completed task to task-list * Implement hide and keep list buttons * Fix keep task list button * Rename hideTaskCard to hideTasks and keepTaskCard to keepTasks * Remove unnecessary feature checking logic * Separate && operator for Activity Header and Panel since one of them can be empty * Add changelog Co-authored-by: Matt Sherman <matt.sherman@automattic.com>
2021-10-20 16:16:22 +00:00
/**
* Internal dependencies
*/
import { taskHeaders } from './components/task-headers';
import DismissModal from './components/dismiss-modal';
import TaskListCompleted from './components/task-list-completed';
import { ProgressHeader } from '~/task-lists/components/progress-header';
import { TaskListItem } from './components/task-list-item';
import { TaskListCompletedHeader } from './components/task-list-completed-header';
import { ExperimentalWooTaskListFooter } from './footer-slot';
import {
TaskListCompletionSlot,
EXPERIMENTAL_WC_TASK_LIST_COMPLETION_SLOT_NAME,
} from './task-list-completion-slot';
2022-04-20 04:49:27 +00:00
export type TaskListProps = TaskListType & {
eventName?: string;
query: {
task?: string;
};
cesHeader?: boolean;
2022-04-20 04:49:27 +00:00
};
export const SetupTaskList: React.FC< TaskListProps > = ( {
Add summary tasks for the new two-column tasklist experiment (https://github.com/woocommerce/woocommerce-admin/pull/7669) * Add two column version of task list with a new design * Show number in the status circle * Set background for the active task * Remove border top * Changes in single column * Task list does not render in the left column if two column task list has been rendered already. * Your store today and activity panel does not render if user is running two column experiment * Update the circle border color * Fix lint issue * Support single column mode * Add box-shadow transition * Fix max width * Set the first card as the default if all tasks are complete * Adjust font-weight for the complete tasks * Use experiment * Remove unnecessary placeholder * Use two-column placeholder * Use the new task REST API * Remove unused code -- these are no longer used as we are using the new task list REST API * Update logic to use the new fields * Update css to fit the homescreen card * Remove unused var * Sync changelog from 2.8.0-rc.2 (https://github.com/woocommerce/woocommerce-admin/pull/7783) * Remove changelogs that were picked into 2.8.0-beta.2 * Update changelog for 7690 * Update changelog for 7743 * Update changelog for 7734 * Update changelog for 7763, 7771 * Remove changelog for 7763 from 2.8.0 since it was in 2.7.2 * Update changelog for 7798 * Show keep & dismiss page when tasks are complete (https://github.com/woocommerce/woocommerce-admin/pull/7684) * Add two column version of task list with a new design * Changes in single column * Task list does not render in the left column if two column task list has been rendered already. * Your store today and activity panel does not render if user is running two column experiment * Prompt a modal when hiding the task list * Add completed compoent * Move completed task to task-list * Implement hide and keep list buttons * Fix keep task list button * Rename hideTaskCard to hideTasks and keepTaskCard to keepTasks * Add two column version of task list with a new design * Show number in the status circle * Set background for the active task * Remove border top * Changes in single column * Task list does not render in the left column if two column task list has been rendered already. * Your store today and activity panel does not render if user is running two column experiment * Update the circle border color * Fix lint issue * Support single column mode * Add box-shadow transition * Fix max width * Set the first card as the default if all tasks are complete * Adjust font-weight for the complete tasks * Use experiment * Remove unnecessary placeholder * Use two-column placeholder * Use the new task REST API * Remove unused code -- these are no longer used as we are using the new task list REST API * Update logic to use the new fields * Update css to fit the homescreen card * Remove unused var * Show keep & dismiss page when tasks are complete (https://github.com/woocommerce/woocommerce-admin/pull/7684) * Add two column version of task list with a new design * Changes in single column * Task list does not render in the left column if two column task list has been rendered already. * Your store today and activity panel does not render if user is running two column experiment * Prompt a modal when hiding the task list * Add completed compoent * Move completed task to task-list * Implement hide and keep list buttons * Fix keep task list button * Rename hideTaskCard to hideTasks and keepTaskCard to keepTasks * Remove unnecessary feature checking logic * Separate && operator for Activity Header and Panel since one of them can be empty * Add changelog Co-authored-by: Matt Sherman <matt.sherman@automattic.com>
2021-10-20 16:16:22 +00:00
query,
id,
Add summary tasks for the new two-column tasklist experiment (https://github.com/woocommerce/woocommerce-admin/pull/7669) * Add two column version of task list with a new design * Show number in the status circle * Set background for the active task * Remove border top * Changes in single column * Task list does not render in the left column if two column task list has been rendered already. * Your store today and activity panel does not render if user is running two column experiment * Update the circle border color * Fix lint issue * Support single column mode * Add box-shadow transition * Fix max width * Set the first card as the default if all tasks are complete * Adjust font-weight for the complete tasks * Use experiment * Remove unnecessary placeholder * Use two-column placeholder * Use the new task REST API * Remove unused code -- these are no longer used as we are using the new task list REST API * Update logic to use the new fields * Update css to fit the homescreen card * Remove unused var * Sync changelog from 2.8.0-rc.2 (https://github.com/woocommerce/woocommerce-admin/pull/7783) * Remove changelogs that were picked into 2.8.0-beta.2 * Update changelog for 7690 * Update changelog for 7743 * Update changelog for 7734 * Update changelog for 7763, 7771 * Remove changelog for 7763 from 2.8.0 since it was in 2.7.2 * Update changelog for 7798 * Show keep & dismiss page when tasks are complete (https://github.com/woocommerce/woocommerce-admin/pull/7684) * Add two column version of task list with a new design * Changes in single column * Task list does not render in the left column if two column task list has been rendered already. * Your store today and activity panel does not render if user is running two column experiment * Prompt a modal when hiding the task list * Add completed compoent * Move completed task to task-list * Implement hide and keep list buttons * Fix keep task list button * Rename hideTaskCard to hideTasks and keepTaskCard to keepTasks * Add two column version of task list with a new design * Show number in the status circle * Set background for the active task * Remove border top * Changes in single column * Task list does not render in the left column if two column task list has been rendered already. * Your store today and activity panel does not render if user is running two column experiment * Update the circle border color * Fix lint issue * Support single column mode * Add box-shadow transition * Fix max width * Set the first card as the default if all tasks are complete * Adjust font-weight for the complete tasks * Use experiment * Remove unnecessary placeholder * Use two-column placeholder * Use the new task REST API * Remove unused code -- these are no longer used as we are using the new task list REST API * Update logic to use the new fields * Update css to fit the homescreen card * Remove unused var * Show keep & dismiss page when tasks are complete (https://github.com/woocommerce/woocommerce-admin/pull/7684) * Add two column version of task list with a new design * Changes in single column * Task list does not render in the left column if two column task list has been rendered already. * Your store today and activity panel does not render if user is running two column experiment * Prompt a modal when hiding the task list * Add completed compoent * Move completed task to task-list * Implement hide and keep list buttons * Fix keep task list button * Rename hideTaskCard to hideTasks and keepTaskCard to keepTasks * Remove unnecessary feature checking logic * Separate && operator for Activity Header and Panel since one of them can be empty * Add changelog Co-authored-by: Matt Sherman <matt.sherman@automattic.com>
2021-10-20 16:16:22 +00:00
eventName,
eventPrefix,
Add summary tasks for the new two-column tasklist experiment (https://github.com/woocommerce/woocommerce-admin/pull/7669) * Add two column version of task list with a new design * Show number in the status circle * Set background for the active task * Remove border top * Changes in single column * Task list does not render in the left column if two column task list has been rendered already. * Your store today and activity panel does not render if user is running two column experiment * Update the circle border color * Fix lint issue * Support single column mode * Add box-shadow transition * Fix max width * Set the first card as the default if all tasks are complete * Adjust font-weight for the complete tasks * Use experiment * Remove unnecessary placeholder * Use two-column placeholder * Use the new task REST API * Remove unused code -- these are no longer used as we are using the new task list REST API * Update logic to use the new fields * Update css to fit the homescreen card * Remove unused var * Sync changelog from 2.8.0-rc.2 (https://github.com/woocommerce/woocommerce-admin/pull/7783) * Remove changelogs that were picked into 2.8.0-beta.2 * Update changelog for 7690 * Update changelog for 7743 * Update changelog for 7734 * Update changelog for 7763, 7771 * Remove changelog for 7763 from 2.8.0 since it was in 2.7.2 * Update changelog for 7798 * Show keep & dismiss page when tasks are complete (https://github.com/woocommerce/woocommerce-admin/pull/7684) * Add two column version of task list with a new design * Changes in single column * Task list does not render in the left column if two column task list has been rendered already. * Your store today and activity panel does not render if user is running two column experiment * Prompt a modal when hiding the task list * Add completed compoent * Move completed task to task-list * Implement hide and keep list buttons * Fix keep task list button * Rename hideTaskCard to hideTasks and keepTaskCard to keepTasks * Add two column version of task list with a new design * Show number in the status circle * Set background for the active task * Remove border top * Changes in single column * Task list does not render in the left column if two column task list has been rendered already. * Your store today and activity panel does not render if user is running two column experiment * Update the circle border color * Fix lint issue * Support single column mode * Add box-shadow transition * Fix max width * Set the first card as the default if all tasks are complete * Adjust font-weight for the complete tasks * Use experiment * Remove unnecessary placeholder * Use two-column placeholder * Use the new task REST API * Remove unused code -- these are no longer used as we are using the new task list REST API * Update logic to use the new fields * Update css to fit the homescreen card * Remove unused var * Show keep & dismiss page when tasks are complete (https://github.com/woocommerce/woocommerce-admin/pull/7684) * Add two column version of task list with a new design * Changes in single column * Task list does not render in the left column if two column task list has been rendered already. * Your store today and activity panel does not render if user is running two column experiment * Prompt a modal when hiding the task list * Add completed compoent * Move completed task to task-list * Implement hide and keep list buttons * Fix keep task list button * Rename hideTaskCard to hideTasks and keepTaskCard to keepTasks * Remove unnecessary feature checking logic * Separate && operator for Activity Header and Panel since one of them can be empty * Add changelog Co-authored-by: Matt Sherman <matt.sherman@automattic.com>
2021-10-20 16:16:22 +00:00
tasks,
keepCompletedTaskList,
isComplete,
displayProgressHeader,
cesHeader = true,
Add summary tasks for the new two-column tasklist experiment (https://github.com/woocommerce/woocommerce-admin/pull/7669) * Add two column version of task list with a new design * Show number in the status circle * Set background for the active task * Remove border top * Changes in single column * Task list does not render in the left column if two column task list has been rendered already. * Your store today and activity panel does not render if user is running two column experiment * Update the circle border color * Fix lint issue * Support single column mode * Add box-shadow transition * Fix max width * Set the first card as the default if all tasks are complete * Adjust font-weight for the complete tasks * Use experiment * Remove unnecessary placeholder * Use two-column placeholder * Use the new task REST API * Remove unused code -- these are no longer used as we are using the new task list REST API * Update logic to use the new fields * Update css to fit the homescreen card * Remove unused var * Sync changelog from 2.8.0-rc.2 (https://github.com/woocommerce/woocommerce-admin/pull/7783) * Remove changelogs that were picked into 2.8.0-beta.2 * Update changelog for 7690 * Update changelog for 7743 * Update changelog for 7734 * Update changelog for 7763, 7771 * Remove changelog for 7763 from 2.8.0 since it was in 2.7.2 * Update changelog for 7798 * Show keep & dismiss page when tasks are complete (https://github.com/woocommerce/woocommerce-admin/pull/7684) * Add two column version of task list with a new design * Changes in single column * Task list does not render in the left column if two column task list has been rendered already. * Your store today and activity panel does not render if user is running two column experiment * Prompt a modal when hiding the task list * Add completed compoent * Move completed task to task-list * Implement hide and keep list buttons * Fix keep task list button * Rename hideTaskCard to hideTasks and keepTaskCard to keepTasks * Add two column version of task list with a new design * Show number in the status circle * Set background for the active task * Remove border top * Changes in single column * Task list does not render in the left column if two column task list has been rendered already. * Your store today and activity panel does not render if user is running two column experiment * Update the circle border color * Fix lint issue * Support single column mode * Add box-shadow transition * Fix max width * Set the first card as the default if all tasks are complete * Adjust font-weight for the complete tasks * Use experiment * Remove unnecessary placeholder * Use two-column placeholder * Use the new task REST API * Remove unused code -- these are no longer used as we are using the new task list REST API * Update logic to use the new fields * Update css to fit the homescreen card * Remove unused var * Show keep & dismiss page when tasks are complete (https://github.com/woocommerce/woocommerce-admin/pull/7684) * Add two column version of task list with a new design * Changes in single column * Task list does not render in the left column if two column task list has been rendered already. * Your store today and activity panel does not render if user is running two column experiment * Prompt a modal when hiding the task list * Add completed compoent * Move completed task to task-list * Implement hide and keep list buttons * Fix keep task list button * Rename hideTaskCard to hideTasks and keepTaskCard to keepTasks * Remove unnecessary feature checking logic * Separate && operator for Activity Header and Panel since one of them can be empty * Add changelog Co-authored-by: Matt Sherman <matt.sherman@automattic.com>
2021-10-20 16:16:22 +00:00
} ) => {
const listEventPrefix = eventName ? eventName + '_' : eventPrefix;
const { profileItems } = useSelect( ( select: WCDataSelector ) => {
const { getProfileItems } = select( ONBOARDING_STORE_NAME );
return {
profileItems: getProfileItems(),
};
} );
const {
hideTaskList,
visitedTask,
keepCompletedTaskList: keepCompletedTasks,
} = useDispatch( ONBOARDING_STORE_NAME );
const userPreferences = useUserPreferences();
const [ headerData, setHeaderData ] = useState< {
task?: TaskType;
goToTask?: () => void;
trackClick?: () => void;
} >( {} );
Add summary tasks for the new two-column tasklist experiment (https://github.com/woocommerce/woocommerce-admin/pull/7669) * Add two column version of task list with a new design * Show number in the status circle * Set background for the active task * Remove border top * Changes in single column * Task list does not render in the left column if two column task list has been rendered already. * Your store today and activity panel does not render if user is running two column experiment * Update the circle border color * Fix lint issue * Support single column mode * Add box-shadow transition * Fix max width * Set the first card as the default if all tasks are complete * Adjust font-weight for the complete tasks * Use experiment * Remove unnecessary placeholder * Use two-column placeholder * Use the new task REST API * Remove unused code -- these are no longer used as we are using the new task list REST API * Update logic to use the new fields * Update css to fit the homescreen card * Remove unused var * Sync changelog from 2.8.0-rc.2 (https://github.com/woocommerce/woocommerce-admin/pull/7783) * Remove changelogs that were picked into 2.8.0-beta.2 * Update changelog for 7690 * Update changelog for 7743 * Update changelog for 7734 * Update changelog for 7763, 7771 * Remove changelog for 7763 from 2.8.0 since it was in 2.7.2 * Update changelog for 7798 * Show keep & dismiss page when tasks are complete (https://github.com/woocommerce/woocommerce-admin/pull/7684) * Add two column version of task list with a new design * Changes in single column * Task list does not render in the left column if two column task list has been rendered already. * Your store today and activity panel does not render if user is running two column experiment * Prompt a modal when hiding the task list * Add completed compoent * Move completed task to task-list * Implement hide and keep list buttons * Fix keep task list button * Rename hideTaskCard to hideTasks and keepTaskCard to keepTasks * Add two column version of task list with a new design * Show number in the status circle * Set background for the active task * Remove border top * Changes in single column * Task list does not render in the left column if two column task list has been rendered already. * Your store today and activity panel does not render if user is running two column experiment * Update the circle border color * Fix lint issue * Support single column mode * Add box-shadow transition * Fix max width * Set the first card as the default if all tasks are complete * Adjust font-weight for the complete tasks * Use experiment * Remove unnecessary placeholder * Use two-column placeholder * Use the new task REST API * Remove unused code -- these are no longer used as we are using the new task list REST API * Update logic to use the new fields * Update css to fit the homescreen card * Remove unused var * Show keep & dismiss page when tasks are complete (https://github.com/woocommerce/woocommerce-admin/pull/7684) * Add two column version of task list with a new design * Changes in single column * Task list does not render in the left column if two column task list has been rendered already. * Your store today and activity panel does not render if user is running two column experiment * Prompt a modal when hiding the task list * Add completed compoent * Move completed task to task-list * Implement hide and keep list buttons * Fix keep task list button * Rename hideTaskCard to hideTasks and keepTaskCard to keepTasks * Remove unnecessary feature checking logic * Separate && operator for Activity Header and Panel since one of them can be empty * Add changelog Co-authored-by: Matt Sherman <matt.sherman@automattic.com>
2021-10-20 16:16:22 +00:00
const [ activeTaskId, setActiveTaskId ] = useState( '' );
const [ showDismissModal, setShowDismissModal ] = useState( false );
const { layoutString } = useLayoutContext();
Add summary tasks for the new two-column tasklist experiment (https://github.com/woocommerce/woocommerce-admin/pull/7669) * Add two column version of task list with a new design * Show number in the status circle * Set background for the active task * Remove border top * Changes in single column * Task list does not render in the left column if two column task list has been rendered already. * Your store today and activity panel does not render if user is running two column experiment * Update the circle border color * Fix lint issue * Support single column mode * Add box-shadow transition * Fix max width * Set the first card as the default if all tasks are complete * Adjust font-weight for the complete tasks * Use experiment * Remove unnecessary placeholder * Use two-column placeholder * Use the new task REST API * Remove unused code -- these are no longer used as we are using the new task list REST API * Update logic to use the new fields * Update css to fit the homescreen card * Remove unused var * Sync changelog from 2.8.0-rc.2 (https://github.com/woocommerce/woocommerce-admin/pull/7783) * Remove changelogs that were picked into 2.8.0-beta.2 * Update changelog for 7690 * Update changelog for 7743 * Update changelog for 7734 * Update changelog for 7763, 7771 * Remove changelog for 7763 from 2.8.0 since it was in 2.7.2 * Update changelog for 7798 * Show keep & dismiss page when tasks are complete (https://github.com/woocommerce/woocommerce-admin/pull/7684) * Add two column version of task list with a new design * Changes in single column * Task list does not render in the left column if two column task list has been rendered already. * Your store today and activity panel does not render if user is running two column experiment * Prompt a modal when hiding the task list * Add completed compoent * Move completed task to task-list * Implement hide and keep list buttons * Fix keep task list button * Rename hideTaskCard to hideTasks and keepTaskCard to keepTasks * Add two column version of task list with a new design * Show number in the status circle * Set background for the active task * Remove border top * Changes in single column * Task list does not render in the left column if two column task list has been rendered already. * Your store today and activity panel does not render if user is running two column experiment * Update the circle border color * Fix lint issue * Support single column mode * Add box-shadow transition * Fix max width * Set the first card as the default if all tasks are complete * Adjust font-weight for the complete tasks * Use experiment * Remove unnecessary placeholder * Use two-column placeholder * Use the new task REST API * Remove unused code -- these are no longer used as we are using the new task list REST API * Update logic to use the new fields * Update css to fit the homescreen card * Remove unused var * Show keep & dismiss page when tasks are complete (https://github.com/woocommerce/woocommerce-admin/pull/7684) * Add two column version of task list with a new design * Changes in single column * Task list does not render in the left column if two column task list has been rendered already. * Your store today and activity panel does not render if user is running two column experiment * Prompt a modal when hiding the task list * Add completed compoent * Move completed task to task-list * Implement hide and keep list buttons * Fix keep task list button * Rename hideTaskCard to hideTasks and keepTaskCard to keepTasks * Remove unnecessary feature checking logic * Separate && operator for Activity Header and Panel since one of them can be empty * Add changelog Co-authored-by: Matt Sherman <matt.sherman@automattic.com>
2021-10-20 16:16:22 +00:00
const prevQueryRef = useRef( query );
const visibleTasks = getVisibleTasks( tasks );
const recordTaskListView = () => {
if ( query.task ) {
return;
}
recordEvent( `${ listEventPrefix }view`, {
number_tasks: visibleTasks.length,
store_connected: profileItems.wccom_connected,
context: layoutString,
} );
};
Add summary tasks for the new two-column tasklist experiment (https://github.com/woocommerce/woocommerce-admin/pull/7669) * Add two column version of task list with a new design * Show number in the status circle * Set background for the active task * Remove border top * Changes in single column * Task list does not render in the left column if two column task list has been rendered already. * Your store today and activity panel does not render if user is running two column experiment * Update the circle border color * Fix lint issue * Support single column mode * Add box-shadow transition * Fix max width * Set the first card as the default if all tasks are complete * Adjust font-weight for the complete tasks * Use experiment * Remove unnecessary placeholder * Use two-column placeholder * Use the new task REST API * Remove unused code -- these are no longer used as we are using the new task list REST API * Update logic to use the new fields * Update css to fit the homescreen card * Remove unused var * Sync changelog from 2.8.0-rc.2 (https://github.com/woocommerce/woocommerce-admin/pull/7783) * Remove changelogs that were picked into 2.8.0-beta.2 * Update changelog for 7690 * Update changelog for 7743 * Update changelog for 7734 * Update changelog for 7763, 7771 * Remove changelog for 7763 from 2.8.0 since it was in 2.7.2 * Update changelog for 7798 * Show keep & dismiss page when tasks are complete (https://github.com/woocommerce/woocommerce-admin/pull/7684) * Add two column version of task list with a new design * Changes in single column * Task list does not render in the left column if two column task list has been rendered already. * Your store today and activity panel does not render if user is running two column experiment * Prompt a modal when hiding the task list * Add completed compoent * Move completed task to task-list * Implement hide and keep list buttons * Fix keep task list button * Rename hideTaskCard to hideTasks and keepTaskCard to keepTasks * Add two column version of task list with a new design * Show number in the status circle * Set background for the active task * Remove border top * Changes in single column * Task list does not render in the left column if two column task list has been rendered already. * Your store today and activity panel does not render if user is running two column experiment * Update the circle border color * Fix lint issue * Support single column mode * Add box-shadow transition * Fix max width * Set the first card as the default if all tasks are complete * Adjust font-weight for the complete tasks * Use experiment * Remove unnecessary placeholder * Use two-column placeholder * Use the new task REST API * Remove unused code -- these are no longer used as we are using the new task list REST API * Update logic to use the new fields * Update css to fit the homescreen card * Remove unused var * Show keep & dismiss page when tasks are complete (https://github.com/woocommerce/woocommerce-admin/pull/7684) * Add two column version of task list with a new design * Changes in single column * Task list does not render in the left column if two column task list has been rendered already. * Your store today and activity panel does not render if user is running two column experiment * Prompt a modal when hiding the task list * Add completed compoent * Move completed task to task-list * Implement hide and keep list buttons * Fix keep task list button * Rename hideTaskCard to hideTasks and keepTaskCard to keepTasks * Remove unnecessary feature checking logic * Separate && operator for Activity Header and Panel since one of them can be empty * Add changelog Co-authored-by: Matt Sherman <matt.sherman@automattic.com>
2021-10-20 16:16:22 +00:00
useEffect( () => {
recordTaskListView();
}, [] );
const taskListCompletionSlot = useSlot(
EXPERIMENTAL_WC_TASK_LIST_COMPLETION_SLOT_NAME
);
Add summary tasks for the new two-column tasklist experiment (https://github.com/woocommerce/woocommerce-admin/pull/7669) * Add two column version of task list with a new design * Show number in the status circle * Set background for the active task * Remove border top * Changes in single column * Task list does not render in the left column if two column task list has been rendered already. * Your store today and activity panel does not render if user is running two column experiment * Update the circle border color * Fix lint issue * Support single column mode * Add box-shadow transition * Fix max width * Set the first card as the default if all tasks are complete * Adjust font-weight for the complete tasks * Use experiment * Remove unnecessary placeholder * Use two-column placeholder * Use the new task REST API * Remove unused code -- these are no longer used as we are using the new task list REST API * Update logic to use the new fields * Update css to fit the homescreen card * Remove unused var * Sync changelog from 2.8.0-rc.2 (https://github.com/woocommerce/woocommerce-admin/pull/7783) * Remove changelogs that were picked into 2.8.0-beta.2 * Update changelog for 7690 * Update changelog for 7743 * Update changelog for 7734 * Update changelog for 7763, 7771 * Remove changelog for 7763 from 2.8.0 since it was in 2.7.2 * Update changelog for 7798 * Show keep & dismiss page when tasks are complete (https://github.com/woocommerce/woocommerce-admin/pull/7684) * Add two column version of task list with a new design * Changes in single column * Task list does not render in the left column if two column task list has been rendered already. * Your store today and activity panel does not render if user is running two column experiment * Prompt a modal when hiding the task list * Add completed compoent * Move completed task to task-list * Implement hide and keep list buttons * Fix keep task list button * Rename hideTaskCard to hideTasks and keepTaskCard to keepTasks * Add two column version of task list with a new design * Show number in the status circle * Set background for the active task * Remove border top * Changes in single column * Task list does not render in the left column if two column task list has been rendered already. * Your store today and activity panel does not render if user is running two column experiment * Update the circle border color * Fix lint issue * Support single column mode * Add box-shadow transition * Fix max width * Set the first card as the default if all tasks are complete * Adjust font-weight for the complete tasks * Use experiment * Remove unnecessary placeholder * Use two-column placeholder * Use the new task REST API * Remove unused code -- these are no longer used as we are using the new task list REST API * Update logic to use the new fields * Update css to fit the homescreen card * Remove unused var * Show keep & dismiss page when tasks are complete (https://github.com/woocommerce/woocommerce-admin/pull/7684) * Add two column version of task list with a new design * Changes in single column * Task list does not render in the left column if two column task list has been rendered already. * Your store today and activity panel does not render if user is running two column experiment * Prompt a modal when hiding the task list * Add completed compoent * Move completed task to task-list * Implement hide and keep list buttons * Fix keep task list button * Rename hideTaskCard to hideTasks and keepTaskCard to keepTasks * Remove unnecessary feature checking logic * Separate && operator for Activity Header and Panel since one of them can be empty * Add changelog Co-authored-by: Matt Sherman <matt.sherman@automattic.com>
2021-10-20 16:16:22 +00:00
useEffect( () => {
const { task: prevTask } = prevQueryRef.current;
const { task } = query;
if ( prevTask !== task ) {
window.document.documentElement.scrollTop = 0;
prevQueryRef.current = query;
}
}, [ query ] );
const incompleteTasks = tasks.filter(
( task ) => ! task.isComplete && ! task.isDismissed
);
const hideTasks = () => {
hideTaskList( id );
Add summary tasks for the new two-column tasklist experiment (https://github.com/woocommerce/woocommerce-admin/pull/7669) * Add two column version of task list with a new design * Show number in the status circle * Set background for the active task * Remove border top * Changes in single column * Task list does not render in the left column if two column task list has been rendered already. * Your store today and activity panel does not render if user is running two column experiment * Update the circle border color * Fix lint issue * Support single column mode * Add box-shadow transition * Fix max width * Set the first card as the default if all tasks are complete * Adjust font-weight for the complete tasks * Use experiment * Remove unnecessary placeholder * Use two-column placeholder * Use the new task REST API * Remove unused code -- these are no longer used as we are using the new task list REST API * Update logic to use the new fields * Update css to fit the homescreen card * Remove unused var * Sync changelog from 2.8.0-rc.2 (https://github.com/woocommerce/woocommerce-admin/pull/7783) * Remove changelogs that were picked into 2.8.0-beta.2 * Update changelog for 7690 * Update changelog for 7743 * Update changelog for 7734 * Update changelog for 7763, 7771 * Remove changelog for 7763 from 2.8.0 since it was in 2.7.2 * Update changelog for 7798 * Show keep & dismiss page when tasks are complete (https://github.com/woocommerce/woocommerce-admin/pull/7684) * Add two column version of task list with a new design * Changes in single column * Task list does not render in the left column if two column task list has been rendered already. * Your store today and activity panel does not render if user is running two column experiment * Prompt a modal when hiding the task list * Add completed compoent * Move completed task to task-list * Implement hide and keep list buttons * Fix keep task list button * Rename hideTaskCard to hideTasks and keepTaskCard to keepTasks * Add two column version of task list with a new design * Show number in the status circle * Set background for the active task * Remove border top * Changes in single column * Task list does not render in the left column if two column task list has been rendered already. * Your store today and activity panel does not render if user is running two column experiment * Update the circle border color * Fix lint issue * Support single column mode * Add box-shadow transition * Fix max width * Set the first card as the default if all tasks are complete * Adjust font-weight for the complete tasks * Use experiment * Remove unnecessary placeholder * Use two-column placeholder * Use the new task REST API * Remove unused code -- these are no longer used as we are using the new task list REST API * Update logic to use the new fields * Update css to fit the homescreen card * Remove unused var * Show keep & dismiss page when tasks are complete (https://github.com/woocommerce/woocommerce-admin/pull/7684) * Add two column version of task list with a new design * Changes in single column * Task list does not render in the left column if two column task list has been rendered already. * Your store today and activity panel does not render if user is running two column experiment * Prompt a modal when hiding the task list * Add completed compoent * Move completed task to task-list * Implement hide and keep list buttons * Fix keep task list button * Rename hideTaskCard to hideTasks and keepTaskCard to keepTasks * Remove unnecessary feature checking logic * Separate && operator for Activity Header and Panel since one of them can be empty * Add changelog Co-authored-by: Matt Sherman <matt.sherman@automattic.com>
2021-10-20 16:16:22 +00:00
};
const keepTasks = () => {
keepCompletedTasks( id );
Add summary tasks for the new two-column tasklist experiment (https://github.com/woocommerce/woocommerce-admin/pull/7669) * Add two column version of task list with a new design * Show number in the status circle * Set background for the active task * Remove border top * Changes in single column * Task list does not render in the left column if two column task list has been rendered already. * Your store today and activity panel does not render if user is running two column experiment * Update the circle border color * Fix lint issue * Support single column mode * Add box-shadow transition * Fix max width * Set the first card as the default if all tasks are complete * Adjust font-weight for the complete tasks * Use experiment * Remove unnecessary placeholder * Use two-column placeholder * Use the new task REST API * Remove unused code -- these are no longer used as we are using the new task list REST API * Update logic to use the new fields * Update css to fit the homescreen card * Remove unused var * Sync changelog from 2.8.0-rc.2 (https://github.com/woocommerce/woocommerce-admin/pull/7783) * Remove changelogs that were picked into 2.8.0-beta.2 * Update changelog for 7690 * Update changelog for 7743 * Update changelog for 7734 * Update changelog for 7763, 7771 * Remove changelog for 7763 from 2.8.0 since it was in 2.7.2 * Update changelog for 7798 * Show keep & dismiss page when tasks are complete (https://github.com/woocommerce/woocommerce-admin/pull/7684) * Add two column version of task list with a new design * Changes in single column * Task list does not render in the left column if two column task list has been rendered already. * Your store today and activity panel does not render if user is running two column experiment * Prompt a modal when hiding the task list * Add completed compoent * Move completed task to task-list * Implement hide and keep list buttons * Fix keep task list button * Rename hideTaskCard to hideTasks and keepTaskCard to keepTasks * Add two column version of task list with a new design * Show number in the status circle * Set background for the active task * Remove border top * Changes in single column * Task list does not render in the left column if two column task list has been rendered already. * Your store today and activity panel does not render if user is running two column experiment * Update the circle border color * Fix lint issue * Support single column mode * Add box-shadow transition * Fix max width * Set the first card as the default if all tasks are complete * Adjust font-weight for the complete tasks * Use experiment * Remove unnecessary placeholder * Use two-column placeholder * Use the new task REST API * Remove unused code -- these are no longer used as we are using the new task list REST API * Update logic to use the new fields * Update css to fit the homescreen card * Remove unused var * Show keep & dismiss page when tasks are complete (https://github.com/woocommerce/woocommerce-admin/pull/7684) * Add two column version of task list with a new design * Changes in single column * Task list does not render in the left column if two column task list has been rendered already. * Your store today and activity panel does not render if user is running two column experiment * Prompt a modal when hiding the task list * Add completed compoent * Move completed task to task-list * Implement hide and keep list buttons * Fix keep task list button * Rename hideTaskCard to hideTasks and keepTaskCard to keepTasks * Remove unnecessary feature checking logic * Separate && operator for Activity Header and Panel since one of them can be empty * Add changelog Co-authored-by: Matt Sherman <matt.sherman@automattic.com>
2021-10-20 16:16:22 +00:00
};
const renderMenu = () => {
return (
<div className="woocommerce-card__menu woocommerce-card__header-item">
<EllipsisMenu
className={ id }
label={ __( 'Task List Options', 'woocommerce' ) }
renderContent={ ( {
onToggle,
}: {
onToggle: () => void;
} ) => (
Add summary tasks for the new two-column tasklist experiment (https://github.com/woocommerce/woocommerce-admin/pull/7669) * Add two column version of task list with a new design * Show number in the status circle * Set background for the active task * Remove border top * Changes in single column * Task list does not render in the left column if two column task list has been rendered already. * Your store today and activity panel does not render if user is running two column experiment * Update the circle border color * Fix lint issue * Support single column mode * Add box-shadow transition * Fix max width * Set the first card as the default if all tasks are complete * Adjust font-weight for the complete tasks * Use experiment * Remove unnecessary placeholder * Use two-column placeholder * Use the new task REST API * Remove unused code -- these are no longer used as we are using the new task list REST API * Update logic to use the new fields * Update css to fit the homescreen card * Remove unused var * Sync changelog from 2.8.0-rc.2 (https://github.com/woocommerce/woocommerce-admin/pull/7783) * Remove changelogs that were picked into 2.8.0-beta.2 * Update changelog for 7690 * Update changelog for 7743 * Update changelog for 7734 * Update changelog for 7763, 7771 * Remove changelog for 7763 from 2.8.0 since it was in 2.7.2 * Update changelog for 7798 * Show keep & dismiss page when tasks are complete (https://github.com/woocommerce/woocommerce-admin/pull/7684) * Add two column version of task list with a new design * Changes in single column * Task list does not render in the left column if two column task list has been rendered already. * Your store today and activity panel does not render if user is running two column experiment * Prompt a modal when hiding the task list * Add completed compoent * Move completed task to task-list * Implement hide and keep list buttons * Fix keep task list button * Rename hideTaskCard to hideTasks and keepTaskCard to keepTasks * Add two column version of task list with a new design * Show number in the status circle * Set background for the active task * Remove border top * Changes in single column * Task list does not render in the left column if two column task list has been rendered already. * Your store today and activity panel does not render if user is running two column experiment * Update the circle border color * Fix lint issue * Support single column mode * Add box-shadow transition * Fix max width * Set the first card as the default if all tasks are complete * Adjust font-weight for the complete tasks * Use experiment * Remove unnecessary placeholder * Use two-column placeholder * Use the new task REST API * Remove unused code -- these are no longer used as we are using the new task list REST API * Update logic to use the new fields * Update css to fit the homescreen card * Remove unused var * Show keep & dismiss page when tasks are complete (https://github.com/woocommerce/woocommerce-admin/pull/7684) * Add two column version of task list with a new design * Changes in single column * Task list does not render in the left column if two column task list has been rendered already. * Your store today and activity panel does not render if user is running two column experiment * Prompt a modal when hiding the task list * Add completed compoent * Move completed task to task-list * Implement hide and keep list buttons * Fix keep task list button * Rename hideTaskCard to hideTasks and keepTaskCard to keepTasks * Remove unnecessary feature checking logic * Separate && operator for Activity Header and Panel since one of them can be empty * Add changelog Co-authored-by: Matt Sherman <matt.sherman@automattic.com>
2021-10-20 16:16:22 +00:00
<div className="woocommerce-task-card__section-controls">
<Button
onClick={ () => {
if ( incompleteTasks.length > 0 ) {
setShowDismissModal( true );
onToggle();
} else {
hideTasks();
Add summary tasks for the new two-column tasklist experiment (https://github.com/woocommerce/woocommerce-admin/pull/7669) * Add two column version of task list with a new design * Show number in the status circle * Set background for the active task * Remove border top * Changes in single column * Task list does not render in the left column if two column task list has been rendered already. * Your store today and activity panel does not render if user is running two column experiment * Update the circle border color * Fix lint issue * Support single column mode * Add box-shadow transition * Fix max width * Set the first card as the default if all tasks are complete * Adjust font-weight for the complete tasks * Use experiment * Remove unnecessary placeholder * Use two-column placeholder * Use the new task REST API * Remove unused code -- these are no longer used as we are using the new task list REST API * Update logic to use the new fields * Update css to fit the homescreen card * Remove unused var * Sync changelog from 2.8.0-rc.2 (https://github.com/woocommerce/woocommerce-admin/pull/7783) * Remove changelogs that were picked into 2.8.0-beta.2 * Update changelog for 7690 * Update changelog for 7743 * Update changelog for 7734 * Update changelog for 7763, 7771 * Remove changelog for 7763 from 2.8.0 since it was in 2.7.2 * Update changelog for 7798 * Show keep & dismiss page when tasks are complete (https://github.com/woocommerce/woocommerce-admin/pull/7684) * Add two column version of task list with a new design * Changes in single column * Task list does not render in the left column if two column task list has been rendered already. * Your store today and activity panel does not render if user is running two column experiment * Prompt a modal when hiding the task list * Add completed compoent * Move completed task to task-list * Implement hide and keep list buttons * Fix keep task list button * Rename hideTaskCard to hideTasks and keepTaskCard to keepTasks * Add two column version of task list with a new design * Show number in the status circle * Set background for the active task * Remove border top * Changes in single column * Task list does not render in the left column if two column task list has been rendered already. * Your store today and activity panel does not render if user is running two column experiment * Update the circle border color * Fix lint issue * Support single column mode * Add box-shadow transition * Fix max width * Set the first card as the default if all tasks are complete * Adjust font-weight for the complete tasks * Use experiment * Remove unnecessary placeholder * Use two-column placeholder * Use the new task REST API * Remove unused code -- these are no longer used as we are using the new task list REST API * Update logic to use the new fields * Update css to fit the homescreen card * Remove unused var * Show keep & dismiss page when tasks are complete (https://github.com/woocommerce/woocommerce-admin/pull/7684) * Add two column version of task list with a new design * Changes in single column * Task list does not render in the left column if two column task list has been rendered already. * Your store today and activity panel does not render if user is running two column experiment * Prompt a modal when hiding the task list * Add completed compoent * Move completed task to task-list * Implement hide and keep list buttons * Fix keep task list button * Rename hideTaskCard to hideTasks and keepTaskCard to keepTasks * Remove unnecessary feature checking logic * Separate && operator for Activity Header and Panel since one of them can be empty * Add changelog Co-authored-by: Matt Sherman <matt.sherman@automattic.com>
2021-10-20 16:16:22 +00:00
}
} }
>
{ __( 'Hide this', 'woocommerce' ) }
Add summary tasks for the new two-column tasklist experiment (https://github.com/woocommerce/woocommerce-admin/pull/7669) * Add two column version of task list with a new design * Show number in the status circle * Set background for the active task * Remove border top * Changes in single column * Task list does not render in the left column if two column task list has been rendered already. * Your store today and activity panel does not render if user is running two column experiment * Update the circle border color * Fix lint issue * Support single column mode * Add box-shadow transition * Fix max width * Set the first card as the default if all tasks are complete * Adjust font-weight for the complete tasks * Use experiment * Remove unnecessary placeholder * Use two-column placeholder * Use the new task REST API * Remove unused code -- these are no longer used as we are using the new task list REST API * Update logic to use the new fields * Update css to fit the homescreen card * Remove unused var * Sync changelog from 2.8.0-rc.2 (https://github.com/woocommerce/woocommerce-admin/pull/7783) * Remove changelogs that were picked into 2.8.0-beta.2 * Update changelog for 7690 * Update changelog for 7743 * Update changelog for 7734 * Update changelog for 7763, 7771 * Remove changelog for 7763 from 2.8.0 since it was in 2.7.2 * Update changelog for 7798 * Show keep & dismiss page when tasks are complete (https://github.com/woocommerce/woocommerce-admin/pull/7684) * Add two column version of task list with a new design * Changes in single column * Task list does not render in the left column if two column task list has been rendered already. * Your store today and activity panel does not render if user is running two column experiment * Prompt a modal when hiding the task list * Add completed compoent * Move completed task to task-list * Implement hide and keep list buttons * Fix keep task list button * Rename hideTaskCard to hideTasks and keepTaskCard to keepTasks * Add two column version of task list with a new design * Show number in the status circle * Set background for the active task * Remove border top * Changes in single column * Task list does not render in the left column if two column task list has been rendered already. * Your store today and activity panel does not render if user is running two column experiment * Update the circle border color * Fix lint issue * Support single column mode * Add box-shadow transition * Fix max width * Set the first card as the default if all tasks are complete * Adjust font-weight for the complete tasks * Use experiment * Remove unnecessary placeholder * Use two-column placeholder * Use the new task REST API * Remove unused code -- these are no longer used as we are using the new task list REST API * Update logic to use the new fields * Update css to fit the homescreen card * Remove unused var * Show keep & dismiss page when tasks are complete (https://github.com/woocommerce/woocommerce-admin/pull/7684) * Add two column version of task list with a new design * Changes in single column * Task list does not render in the left column if two column task list has been rendered already. * Your store today and activity panel does not render if user is running two column experiment * Prompt a modal when hiding the task list * Add completed compoent * Move completed task to task-list * Implement hide and keep list buttons * Fix keep task list button * Rename hideTaskCard to hideTasks and keepTaskCard to keepTasks * Remove unnecessary feature checking logic * Separate && operator for Activity Header and Panel since one of them can be empty * Add changelog Co-authored-by: Matt Sherman <matt.sherman@automattic.com>
2021-10-20 16:16:22 +00:00
</Button>
</div>
) }
/>
</div>
);
};
let selectedHeaderCard = visibleTasks.find(
( listTask ) => listTask.isComplete === false
);
// If nothing is selected, default to the last task since everything is completed.
Add summary tasks for the new two-column tasklist experiment (https://github.com/woocommerce/woocommerce-admin/pull/7669) * Add two column version of task list with a new design * Show number in the status circle * Set background for the active task * Remove border top * Changes in single column * Task list does not render in the left column if two column task list has been rendered already. * Your store today and activity panel does not render if user is running two column experiment * Update the circle border color * Fix lint issue * Support single column mode * Add box-shadow transition * Fix max width * Set the first card as the default if all tasks are complete * Adjust font-weight for the complete tasks * Use experiment * Remove unnecessary placeholder * Use two-column placeholder * Use the new task REST API * Remove unused code -- these are no longer used as we are using the new task list REST API * Update logic to use the new fields * Update css to fit the homescreen card * Remove unused var * Sync changelog from 2.8.0-rc.2 (https://github.com/woocommerce/woocommerce-admin/pull/7783) * Remove changelogs that were picked into 2.8.0-beta.2 * Update changelog for 7690 * Update changelog for 7743 * Update changelog for 7734 * Update changelog for 7763, 7771 * Remove changelog for 7763 from 2.8.0 since it was in 2.7.2 * Update changelog for 7798 * Show keep & dismiss page when tasks are complete (https://github.com/woocommerce/woocommerce-admin/pull/7684) * Add two column version of task list with a new design * Changes in single column * Task list does not render in the left column if two column task list has been rendered already. * Your store today and activity panel does not render if user is running two column experiment * Prompt a modal when hiding the task list * Add completed compoent * Move completed task to task-list * Implement hide and keep list buttons * Fix keep task list button * Rename hideTaskCard to hideTasks and keepTaskCard to keepTasks * Add two column version of task list with a new design * Show number in the status circle * Set background for the active task * Remove border top * Changes in single column * Task list does not render in the left column if two column task list has been rendered already. * Your store today and activity panel does not render if user is running two column experiment * Update the circle border color * Fix lint issue * Support single column mode * Add box-shadow transition * Fix max width * Set the first card as the default if all tasks are complete * Adjust font-weight for the complete tasks * Use experiment * Remove unnecessary placeholder * Use two-column placeholder * Use the new task REST API * Remove unused code -- these are no longer used as we are using the new task list REST API * Update logic to use the new fields * Update css to fit the homescreen card * Remove unused var * Show keep & dismiss page when tasks are complete (https://github.com/woocommerce/woocommerce-admin/pull/7684) * Add two column version of task list with a new design * Changes in single column * Task list does not render in the left column if two column task list has been rendered already. * Your store today and activity panel does not render if user is running two column experiment * Prompt a modal when hiding the task list * Add completed compoent * Move completed task to task-list * Implement hide and keep list buttons * Fix keep task list button * Rename hideTaskCard to hideTasks and keepTaskCard to keepTasks * Remove unnecessary feature checking logic * Separate && operator for Activity Header and Panel since one of them can be empty * Add changelog Co-authored-by: Matt Sherman <matt.sherman@automattic.com>
2021-10-20 16:16:22 +00:00
if ( ! selectedHeaderCard ) {
selectedHeaderCard = visibleTasks[ visibleTasks.length - 1 ];
Add summary tasks for the new two-column tasklist experiment (https://github.com/woocommerce/woocommerce-admin/pull/7669) * Add two column version of task list with a new design * Show number in the status circle * Set background for the active task * Remove border top * Changes in single column * Task list does not render in the left column if two column task list has been rendered already. * Your store today and activity panel does not render if user is running two column experiment * Update the circle border color * Fix lint issue * Support single column mode * Add box-shadow transition * Fix max width * Set the first card as the default if all tasks are complete * Adjust font-weight for the complete tasks * Use experiment * Remove unnecessary placeholder * Use two-column placeholder * Use the new task REST API * Remove unused code -- these are no longer used as we are using the new task list REST API * Update logic to use the new fields * Update css to fit the homescreen card * Remove unused var * Sync changelog from 2.8.0-rc.2 (https://github.com/woocommerce/woocommerce-admin/pull/7783) * Remove changelogs that were picked into 2.8.0-beta.2 * Update changelog for 7690 * Update changelog for 7743 * Update changelog for 7734 * Update changelog for 7763, 7771 * Remove changelog for 7763 from 2.8.0 since it was in 2.7.2 * Update changelog for 7798 * Show keep & dismiss page when tasks are complete (https://github.com/woocommerce/woocommerce-admin/pull/7684) * Add two column version of task list with a new design * Changes in single column * Task list does not render in the left column if two column task list has been rendered already. * Your store today and activity panel does not render if user is running two column experiment * Prompt a modal when hiding the task list * Add completed compoent * Move completed task to task-list * Implement hide and keep list buttons * Fix keep task list button * Rename hideTaskCard to hideTasks and keepTaskCard to keepTasks * Add two column version of task list with a new design * Show number in the status circle * Set background for the active task * Remove border top * Changes in single column * Task list does not render in the left column if two column task list has been rendered already. * Your store today and activity panel does not render if user is running two column experiment * Update the circle border color * Fix lint issue * Support single column mode * Add box-shadow transition * Fix max width * Set the first card as the default if all tasks are complete * Adjust font-weight for the complete tasks * Use experiment * Remove unnecessary placeholder * Use two-column placeholder * Use the new task REST API * Remove unused code -- these are no longer used as we are using the new task list REST API * Update logic to use the new fields * Update css to fit the homescreen card * Remove unused var * Show keep & dismiss page when tasks are complete (https://github.com/woocommerce/woocommerce-admin/pull/7684) * Add two column version of task list with a new design * Changes in single column * Task list does not render in the left column if two column task list has been rendered already. * Your store today and activity panel does not render if user is running two column experiment * Prompt a modal when hiding the task list * Add completed compoent * Move completed task to task-list * Implement hide and keep list buttons * Fix keep task list button * Rename hideTaskCard to hideTasks and keepTaskCard to keepTasks * Remove unnecessary feature checking logic * Separate && operator for Activity Header and Panel since one of them can be empty * Add changelog Co-authored-by: Matt Sherman <matt.sherman@automattic.com>
2021-10-20 16:16:22 +00:00
}
const taskListHeaderSlot = useSlot(
`woocommerce_onboarding_task_list_header_${
headerData?.task?.id ?? selectedHeaderCard?.id
}`
);
const hasTaskListHeaderSlotFills = Boolean(
taskListHeaderSlot?.fills?.length
);
const getTaskStartedCount = ( taskId: string ) => {
const trackedStartedTasks =
userPreferences.task_list_tracked_started_tasks;
if ( ! trackedStartedTasks || ! trackedStartedTasks[ taskId ] ) {
return 0;
}
return trackedStartedTasks[ taskId ];
};
// @todo This would be better as a task endpoint that handles updating the count.
const updateTrackStartedCount = ( taskId: string ) => {
const newCount = getTaskStartedCount( taskId ) + 1;
const trackedStartedTasks =
userPreferences.task_list_tracked_started_tasks || {};
visitedTask( taskId );
userPreferences.updateUserPreferences( {
task_list_tracked_started_tasks: {
...( trackedStartedTasks || {} ),
[ taskId ]: newCount,
},
} );
};
const trackClick = ( task: TaskType ) => {
recordEvent( `${ listEventPrefix }click`, {
task_name: task.id,
context: layoutString,
} );
};
const goToTask = ( task: TaskType ) => {
trackClick( task );
if ( ! task.isComplete ) {
updateTrackStartedCount( task.id );
}
2022-06-01 17:10:20 +00:00
if ( task.actionUrl ) {
2022-06-01 17:10:20 +00:00
navigateTo( {
url: task.actionUrl,
} );
return;
}
2022-06-01 17:10:20 +00:00
navigateTo( { url: getNewPath( { task: task.id }, '/', {} ) } );
};
Add summary tasks for the new two-column tasklist experiment (https://github.com/woocommerce/woocommerce-admin/pull/7669) * Add two column version of task list with a new design * Show number in the status circle * Set background for the active task * Remove border top * Changes in single column * Task list does not render in the left column if two column task list has been rendered already. * Your store today and activity panel does not render if user is running two column experiment * Update the circle border color * Fix lint issue * Support single column mode * Add box-shadow transition * Fix max width * Set the first card as the default if all tasks are complete * Adjust font-weight for the complete tasks * Use experiment * Remove unnecessary placeholder * Use two-column placeholder * Use the new task REST API * Remove unused code -- these are no longer used as we are using the new task list REST API * Update logic to use the new fields * Update css to fit the homescreen card * Remove unused var * Sync changelog from 2.8.0-rc.2 (https://github.com/woocommerce/woocommerce-admin/pull/7783) * Remove changelogs that were picked into 2.8.0-beta.2 * Update changelog for 7690 * Update changelog for 7743 * Update changelog for 7734 * Update changelog for 7763, 7771 * Remove changelog for 7763 from 2.8.0 since it was in 2.7.2 * Update changelog for 7798 * Show keep & dismiss page when tasks are complete (https://github.com/woocommerce/woocommerce-admin/pull/7684) * Add two column version of task list with a new design * Changes in single column * Task list does not render in the left column if two column task list has been rendered already. * Your store today and activity panel does not render if user is running two column experiment * Prompt a modal when hiding the task list * Add completed compoent * Move completed task to task-list * Implement hide and keep list buttons * Fix keep task list button * Rename hideTaskCard to hideTasks and keepTaskCard to keepTasks * Add two column version of task list with a new design * Show number in the status circle * Set background for the active task * Remove border top * Changes in single column * Task list does not render in the left column if two column task list has been rendered already. * Your store today and activity panel does not render if user is running two column experiment * Update the circle border color * Fix lint issue * Support single column mode * Add box-shadow transition * Fix max width * Set the first card as the default if all tasks are complete * Adjust font-weight for the complete tasks * Use experiment * Remove unnecessary placeholder * Use two-column placeholder * Use the new task REST API * Remove unused code -- these are no longer used as we are using the new task list REST API * Update logic to use the new fields * Update css to fit the homescreen card * Remove unused var * Show keep & dismiss page when tasks are complete (https://github.com/woocommerce/woocommerce-admin/pull/7684) * Add two column version of task list with a new design * Changes in single column * Task list does not render in the left column if two column task list has been rendered already. * Your store today and activity panel does not render if user is running two column experiment * Prompt a modal when hiding the task list * Add completed compoent * Move completed task to task-list * Implement hide and keep list buttons * Fix keep task list button * Rename hideTaskCard to hideTasks and keepTaskCard to keepTasks * Remove unnecessary feature checking logic * Separate && operator for Activity Header and Panel since one of them can be empty * Add changelog Co-authored-by: Matt Sherman <matt.sherman@automattic.com>
2021-10-20 16:16:22 +00:00
const showTaskHeader = ( task: TaskType ) => {
if ( taskHeaders[ task.id ] || hasTaskListHeaderSlotFills ) {
setHeaderData( {
task,
goToTask: () => goToTask( task ),
trackClick: () => trackClick( task ),
} );
Add summary tasks for the new two-column tasklist experiment (https://github.com/woocommerce/woocommerce-admin/pull/7669) * Add two column version of task list with a new design * Show number in the status circle * Set background for the active task * Remove border top * Changes in single column * Task list does not render in the left column if two column task list has been rendered already. * Your store today and activity panel does not render if user is running two column experiment * Update the circle border color * Fix lint issue * Support single column mode * Add box-shadow transition * Fix max width * Set the first card as the default if all tasks are complete * Adjust font-weight for the complete tasks * Use experiment * Remove unnecessary placeholder * Use two-column placeholder * Use the new task REST API * Remove unused code -- these are no longer used as we are using the new task list REST API * Update logic to use the new fields * Update css to fit the homescreen card * Remove unused var * Sync changelog from 2.8.0-rc.2 (https://github.com/woocommerce/woocommerce-admin/pull/7783) * Remove changelogs that were picked into 2.8.0-beta.2 * Update changelog for 7690 * Update changelog for 7743 * Update changelog for 7734 * Update changelog for 7763, 7771 * Remove changelog for 7763 from 2.8.0 since it was in 2.7.2 * Update changelog for 7798 * Show keep & dismiss page when tasks are complete (https://github.com/woocommerce/woocommerce-admin/pull/7684) * Add two column version of task list with a new design * Changes in single column * Task list does not render in the left column if two column task list has been rendered already. * Your store today and activity panel does not render if user is running two column experiment * Prompt a modal when hiding the task list * Add completed compoent * Move completed task to task-list * Implement hide and keep list buttons * Fix keep task list button * Rename hideTaskCard to hideTasks and keepTaskCard to keepTasks * Add two column version of task list with a new design * Show number in the status circle * Set background for the active task * Remove border top * Changes in single column * Task list does not render in the left column if two column task list has been rendered already. * Your store today and activity panel does not render if user is running two column experiment * Update the circle border color * Fix lint issue * Support single column mode * Add box-shadow transition * Fix max width * Set the first card as the default if all tasks are complete * Adjust font-weight for the complete tasks * Use experiment * Remove unnecessary placeholder * Use two-column placeholder * Use the new task REST API * Remove unused code -- these are no longer used as we are using the new task list REST API * Update logic to use the new fields * Update css to fit the homescreen card * Remove unused var * Show keep & dismiss page when tasks are complete (https://github.com/woocommerce/woocommerce-admin/pull/7684) * Add two column version of task list with a new design * Changes in single column * Task list does not render in the left column if two column task list has been rendered already. * Your store today and activity panel does not render if user is running two column experiment * Prompt a modal when hiding the task list * Add completed compoent * Move completed task to task-list * Implement hide and keep list buttons * Fix keep task list button * Rename hideTaskCard to hideTasks and keepTaskCard to keepTasks * Remove unnecessary feature checking logic * Separate && operator for Activity Header and Panel since one of them can be empty * Add changelog Co-authored-by: Matt Sherman <matt.sherman@automattic.com>
2021-10-20 16:16:22 +00:00
setActiveTaskId( task.id );
}
};
useEffect( () => {
if ( selectedHeaderCard ) {
showTaskHeader( selectedHeaderCard );
Add summary tasks for the new two-column tasklist experiment (https://github.com/woocommerce/woocommerce-admin/pull/7669) * Add two column version of task list with a new design * Show number in the status circle * Set background for the active task * Remove border top * Changes in single column * Task list does not render in the left column if two column task list has been rendered already. * Your store today and activity panel does not render if user is running two column experiment * Update the circle border color * Fix lint issue * Support single column mode * Add box-shadow transition * Fix max width * Set the first card as the default if all tasks are complete * Adjust font-weight for the complete tasks * Use experiment * Remove unnecessary placeholder * Use two-column placeholder * Use the new task REST API * Remove unused code -- these are no longer used as we are using the new task list REST API * Update logic to use the new fields * Update css to fit the homescreen card * Remove unused var * Sync changelog from 2.8.0-rc.2 (https://github.com/woocommerce/woocommerce-admin/pull/7783) * Remove changelogs that were picked into 2.8.0-beta.2 * Update changelog for 7690 * Update changelog for 7743 * Update changelog for 7734 * Update changelog for 7763, 7771 * Remove changelog for 7763 from 2.8.0 since it was in 2.7.2 * Update changelog for 7798 * Show keep & dismiss page when tasks are complete (https://github.com/woocommerce/woocommerce-admin/pull/7684) * Add two column version of task list with a new design * Changes in single column * Task list does not render in the left column if two column task list has been rendered already. * Your store today and activity panel does not render if user is running two column experiment * Prompt a modal when hiding the task list * Add completed compoent * Move completed task to task-list * Implement hide and keep list buttons * Fix keep task list button * Rename hideTaskCard to hideTasks and keepTaskCard to keepTasks * Add two column version of task list with a new design * Show number in the status circle * Set background for the active task * Remove border top * Changes in single column * Task list does not render in the left column if two column task list has been rendered already. * Your store today and activity panel does not render if user is running two column experiment * Update the circle border color * Fix lint issue * Support single column mode * Add box-shadow transition * Fix max width * Set the first card as the default if all tasks are complete * Adjust font-weight for the complete tasks * Use experiment * Remove unnecessary placeholder * Use two-column placeholder * Use the new task REST API * Remove unused code -- these are no longer used as we are using the new task list REST API * Update logic to use the new fields * Update css to fit the homescreen card * Remove unused var * Show keep & dismiss page when tasks are complete (https://github.com/woocommerce/woocommerce-admin/pull/7684) * Add two column version of task list with a new design * Changes in single column * Task list does not render in the left column if two column task list has been rendered already. * Your store today and activity panel does not render if user is running two column experiment * Prompt a modal when hiding the task list * Add completed compoent * Move completed task to task-list * Implement hide and keep list buttons * Fix keep task list button * Rename hideTaskCard to hideTasks and keepTaskCard to keepTasks * Remove unnecessary feature checking logic * Separate && operator for Activity Header and Panel since one of them can be empty * Add changelog Co-authored-by: Matt Sherman <matt.sherman@automattic.com>
2021-10-20 16:16:22 +00:00
}
}, [ selectedHeaderCard ] );
if ( ! visibleTasks.length ) {
return <div className="woocommerce-task-dashboard__container"></div>;
}
const hasTaskListCompletionSlotFills = Boolean(
taskListCompletionSlot?.fills?.length
);
if ( isComplete && keepCompletedTaskList !== 'yes' ) {
if ( hasTaskListCompletionSlotFills ) {
return (
<TaskListCompletionSlot
fillProps={ {
hideTasks,
keepTasks,
customerEffortScore: cesHeader,
} }
/>
);
}
Add summary tasks for the new two-column tasklist experiment (https://github.com/woocommerce/woocommerce-admin/pull/7669) * Add two column version of task list with a new design * Show number in the status circle * Set background for the active task * Remove border top * Changes in single column * Task list does not render in the left column if two column task list has been rendered already. * Your store today and activity panel does not render if user is running two column experiment * Update the circle border color * Fix lint issue * Support single column mode * Add box-shadow transition * Fix max width * Set the first card as the default if all tasks are complete * Adjust font-weight for the complete tasks * Use experiment * Remove unnecessary placeholder * Use two-column placeholder * Use the new task REST API * Remove unused code -- these are no longer used as we are using the new task list REST API * Update logic to use the new fields * Update css to fit the homescreen card * Remove unused var * Sync changelog from 2.8.0-rc.2 (https://github.com/woocommerce/woocommerce-admin/pull/7783) * Remove changelogs that were picked into 2.8.0-beta.2 * Update changelog for 7690 * Update changelog for 7743 * Update changelog for 7734 * Update changelog for 7763, 7771 * Remove changelog for 7763 from 2.8.0 since it was in 2.7.2 * Update changelog for 7798 * Show keep & dismiss page when tasks are complete (https://github.com/woocommerce/woocommerce-admin/pull/7684) * Add two column version of task list with a new design * Changes in single column * Task list does not render in the left column if two column task list has been rendered already. * Your store today and activity panel does not render if user is running two column experiment * Prompt a modal when hiding the task list * Add completed compoent * Move completed task to task-list * Implement hide and keep list buttons * Fix keep task list button * Rename hideTaskCard to hideTasks and keepTaskCard to keepTasks * Add two column version of task list with a new design * Show number in the status circle * Set background for the active task * Remove border top * Changes in single column * Task list does not render in the left column if two column task list has been rendered already. * Your store today and activity panel does not render if user is running two column experiment * Update the circle border color * Fix lint issue * Support single column mode * Add box-shadow transition * Fix max width * Set the first card as the default if all tasks are complete * Adjust font-weight for the complete tasks * Use experiment * Remove unnecessary placeholder * Use two-column placeholder * Use the new task REST API * Remove unused code -- these are no longer used as we are using the new task list REST API * Update logic to use the new fields * Update css to fit the homescreen card * Remove unused var * Show keep & dismiss page when tasks are complete (https://github.com/woocommerce/woocommerce-admin/pull/7684) * Add two column version of task list with a new design * Changes in single column * Task list does not render in the left column if two column task list has been rendered already. * Your store today and activity panel does not render if user is running two column experiment * Prompt a modal when hiding the task list * Add completed compoent * Move completed task to task-list * Implement hide and keep list buttons * Fix keep task list button * Rename hideTaskCard to hideTasks and keepTaskCard to keepTasks * Remove unnecessary feature checking logic * Separate && operator for Activity Header and Panel since one of them can be empty * Add changelog Co-authored-by: Matt Sherman <matt.sherman@automattic.com>
2021-10-20 16:16:22 +00:00
return (
<>
{ cesHeader ? (
<TaskListCompletedHeader
hideTasks={ hideTasks }
keepTasks={ keepTasks }
2022-05-17 17:25:06 +00:00
customerEffortScore={ true }
/>
) : (
<TaskListCompleted
hideTasks={ hideTasks }
keepTasks={ keepTasks }
/>
) }
Add summary tasks for the new two-column tasklist experiment (https://github.com/woocommerce/woocommerce-admin/pull/7669) * Add two column version of task list with a new design * Show number in the status circle * Set background for the active task * Remove border top * Changes in single column * Task list does not render in the left column if two column task list has been rendered already. * Your store today and activity panel does not render if user is running two column experiment * Update the circle border color * Fix lint issue * Support single column mode * Add box-shadow transition * Fix max width * Set the first card as the default if all tasks are complete * Adjust font-weight for the complete tasks * Use experiment * Remove unnecessary placeholder * Use two-column placeholder * Use the new task REST API * Remove unused code -- these are no longer used as we are using the new task list REST API * Update logic to use the new fields * Update css to fit the homescreen card * Remove unused var * Sync changelog from 2.8.0-rc.2 (https://github.com/woocommerce/woocommerce-admin/pull/7783) * Remove changelogs that were picked into 2.8.0-beta.2 * Update changelog for 7690 * Update changelog for 7743 * Update changelog for 7734 * Update changelog for 7763, 7771 * Remove changelog for 7763 from 2.8.0 since it was in 2.7.2 * Update changelog for 7798 * Show keep & dismiss page when tasks are complete (https://github.com/woocommerce/woocommerce-admin/pull/7684) * Add two column version of task list with a new design * Changes in single column * Task list does not render in the left column if two column task list has been rendered already. * Your store today and activity panel does not render if user is running two column experiment * Prompt a modal when hiding the task list * Add completed compoent * Move completed task to task-list * Implement hide and keep list buttons * Fix keep task list button * Rename hideTaskCard to hideTasks and keepTaskCard to keepTasks * Add two column version of task list with a new design * Show number in the status circle * Set background for the active task * Remove border top * Changes in single column * Task list does not render in the left column if two column task list has been rendered already. * Your store today and activity panel does not render if user is running two column experiment * Update the circle border color * Fix lint issue * Support single column mode * Add box-shadow transition * Fix max width * Set the first card as the default if all tasks are complete * Adjust font-weight for the complete tasks * Use experiment * Remove unnecessary placeholder * Use two-column placeholder * Use the new task REST API * Remove unused code -- these are no longer used as we are using the new task list REST API * Update logic to use the new fields * Update css to fit the homescreen card * Remove unused var * Show keep & dismiss page when tasks are complete (https://github.com/woocommerce/woocommerce-admin/pull/7684) * Add two column version of task list with a new design * Changes in single column * Task list does not render in the left column if two column task list has been rendered already. * Your store today and activity panel does not render if user is running two column experiment * Prompt a modal when hiding the task list * Add completed compoent * Move completed task to task-list * Implement hide and keep list buttons * Fix keep task list button * Rename hideTaskCard to hideTasks and keepTaskCard to keepTasks * Remove unnecessary feature checking logic * Separate && operator for Activity Header and Panel since one of them can be empty * Add changelog Co-authored-by: Matt Sherman <matt.sherman@automattic.com>
2021-10-20 16:16:22 +00:00
</>
);
}
return (
<>
{ showDismissModal && (
<DismissModal
showDismissModal={ showDismissModal }
setShowDismissModal={ setShowDismissModal }
hideTasks={ hideTasks }
/>
) }
{ displayProgressHeader ? (
<ProgressHeader taskListId={ id } />
) : null }
Add summary tasks for the new two-column tasklist experiment (https://github.com/woocommerce/woocommerce-admin/pull/7669) * Add two column version of task list with a new design * Show number in the status circle * Set background for the active task * Remove border top * Changes in single column * Task list does not render in the left column if two column task list has been rendered already. * Your store today and activity panel does not render if user is running two column experiment * Update the circle border color * Fix lint issue * Support single column mode * Add box-shadow transition * Fix max width * Set the first card as the default if all tasks are complete * Adjust font-weight for the complete tasks * Use experiment * Remove unnecessary placeholder * Use two-column placeholder * Use the new task REST API * Remove unused code -- these are no longer used as we are using the new task list REST API * Update logic to use the new fields * Update css to fit the homescreen card * Remove unused var * Sync changelog from 2.8.0-rc.2 (https://github.com/woocommerce/woocommerce-admin/pull/7783) * Remove changelogs that were picked into 2.8.0-beta.2 * Update changelog for 7690 * Update changelog for 7743 * Update changelog for 7734 * Update changelog for 7763, 7771 * Remove changelog for 7763 from 2.8.0 since it was in 2.7.2 * Update changelog for 7798 * Show keep & dismiss page when tasks are complete (https://github.com/woocommerce/woocommerce-admin/pull/7684) * Add two column version of task list with a new design * Changes in single column * Task list does not render in the left column if two column task list has been rendered already. * Your store today and activity panel does not render if user is running two column experiment * Prompt a modal when hiding the task list * Add completed compoent * Move completed task to task-list * Implement hide and keep list buttons * Fix keep task list button * Rename hideTaskCard to hideTasks and keepTaskCard to keepTasks * Add two column version of task list with a new design * Show number in the status circle * Set background for the active task * Remove border top * Changes in single column * Task list does not render in the left column if two column task list has been rendered already. * Your store today and activity panel does not render if user is running two column experiment * Update the circle border color * Fix lint issue * Support single column mode * Add box-shadow transition * Fix max width * Set the first card as the default if all tasks are complete * Adjust font-weight for the complete tasks * Use experiment * Remove unnecessary placeholder * Use two-column placeholder * Use the new task REST API * Remove unused code -- these are no longer used as we are using the new task list REST API * Update logic to use the new fields * Update css to fit the homescreen card * Remove unused var * Show keep & dismiss page when tasks are complete (https://github.com/woocommerce/woocommerce-admin/pull/7684) * Add two column version of task list with a new design * Changes in single column * Task list does not render in the left column if two column task list has been rendered already. * Your store today and activity panel does not render if user is running two column experiment * Prompt a modal when hiding the task list * Add completed compoent * Move completed task to task-list * Implement hide and keep list buttons * Fix keep task list button * Rename hideTaskCard to hideTasks and keepTaskCard to keepTasks * Remove unnecessary feature checking logic * Separate && operator for Activity Header and Panel since one of them can be empty * Add changelog Co-authored-by: Matt Sherman <matt.sherman@automattic.com>
2021-10-20 16:16:22 +00:00
<div
className={ classnames(
`woocommerce-task-dashboard__container woocommerce-task-list__${ id } setup-task-list`
Add summary tasks for the new two-column tasklist experiment (https://github.com/woocommerce/woocommerce-admin/pull/7669) * Add two column version of task list with a new design * Show number in the status circle * Set background for the active task * Remove border top * Changes in single column * Task list does not render in the left column if two column task list has been rendered already. * Your store today and activity panel does not render if user is running two column experiment * Update the circle border color * Fix lint issue * Support single column mode * Add box-shadow transition * Fix max width * Set the first card as the default if all tasks are complete * Adjust font-weight for the complete tasks * Use experiment * Remove unnecessary placeholder * Use two-column placeholder * Use the new task REST API * Remove unused code -- these are no longer used as we are using the new task list REST API * Update logic to use the new fields * Update css to fit the homescreen card * Remove unused var * Sync changelog from 2.8.0-rc.2 (https://github.com/woocommerce/woocommerce-admin/pull/7783) * Remove changelogs that were picked into 2.8.0-beta.2 * Update changelog for 7690 * Update changelog for 7743 * Update changelog for 7734 * Update changelog for 7763, 7771 * Remove changelog for 7763 from 2.8.0 since it was in 2.7.2 * Update changelog for 7798 * Show keep & dismiss page when tasks are complete (https://github.com/woocommerce/woocommerce-admin/pull/7684) * Add two column version of task list with a new design * Changes in single column * Task list does not render in the left column if two column task list has been rendered already. * Your store today and activity panel does not render if user is running two column experiment * Prompt a modal when hiding the task list * Add completed compoent * Move completed task to task-list * Implement hide and keep list buttons * Fix keep task list button * Rename hideTaskCard to hideTasks and keepTaskCard to keepTasks * Add two column version of task list with a new design * Show number in the status circle * Set background for the active task * Remove border top * Changes in single column * Task list does not render in the left column if two column task list has been rendered already. * Your store today and activity panel does not render if user is running two column experiment * Update the circle border color * Fix lint issue * Support single column mode * Add box-shadow transition * Fix max width * Set the first card as the default if all tasks are complete * Adjust font-weight for the complete tasks * Use experiment * Remove unnecessary placeholder * Use two-column placeholder * Use the new task REST API * Remove unused code -- these are no longer used as we are using the new task list REST API * Update logic to use the new fields * Update css to fit the homescreen card * Remove unused var * Show keep & dismiss page when tasks are complete (https://github.com/woocommerce/woocommerce-admin/pull/7684) * Add two column version of task list with a new design * Changes in single column * Task list does not render in the left column if two column task list has been rendered already. * Your store today and activity panel does not render if user is running two column experiment * Prompt a modal when hiding the task list * Add completed compoent * Move completed task to task-list * Implement hide and keep list buttons * Fix keep task list button * Rename hideTaskCard to hideTasks and keepTaskCard to keepTasks * Remove unnecessary feature checking logic * Separate && operator for Activity Header and Panel since one of them can be empty * Add changelog Co-authored-by: Matt Sherman <matt.sherman@automattic.com>
2021-10-20 16:16:22 +00:00
) }
>
<Card
size="large"
className="woocommerce-task-card woocommerce-homescreen-card"
>
<div className="wooocommerce-task-card__header-container">
Add summary tasks for the new two-column tasklist experiment (https://github.com/woocommerce/woocommerce-admin/pull/7669) * Add two column version of task list with a new design * Show number in the status circle * Set background for the active task * Remove border top * Changes in single column * Task list does not render in the left column if two column task list has been rendered already. * Your store today and activity panel does not render if user is running two column experiment * Update the circle border color * Fix lint issue * Support single column mode * Add box-shadow transition * Fix max width * Set the first card as the default if all tasks are complete * Adjust font-weight for the complete tasks * Use experiment * Remove unnecessary placeholder * Use two-column placeholder * Use the new task REST API * Remove unused code -- these are no longer used as we are using the new task list REST API * Update logic to use the new fields * Update css to fit the homescreen card * Remove unused var * Sync changelog from 2.8.0-rc.2 (https://github.com/woocommerce/woocommerce-admin/pull/7783) * Remove changelogs that were picked into 2.8.0-beta.2 * Update changelog for 7690 * Update changelog for 7743 * Update changelog for 7734 * Update changelog for 7763, 7771 * Remove changelog for 7763 from 2.8.0 since it was in 2.7.2 * Update changelog for 7798 * Show keep & dismiss page when tasks are complete (https://github.com/woocommerce/woocommerce-admin/pull/7684) * Add two column version of task list with a new design * Changes in single column * Task list does not render in the left column if two column task list has been rendered already. * Your store today and activity panel does not render if user is running two column experiment * Prompt a modal when hiding the task list * Add completed compoent * Move completed task to task-list * Implement hide and keep list buttons * Fix keep task list button * Rename hideTaskCard to hideTasks and keepTaskCard to keepTasks * Add two column version of task list with a new design * Show number in the status circle * Set background for the active task * Remove border top * Changes in single column * Task list does not render in the left column if two column task list has been rendered already. * Your store today and activity panel does not render if user is running two column experiment * Update the circle border color * Fix lint issue * Support single column mode * Add box-shadow transition * Fix max width * Set the first card as the default if all tasks are complete * Adjust font-weight for the complete tasks * Use experiment * Remove unnecessary placeholder * Use two-column placeholder * Use the new task REST API * Remove unused code -- these are no longer used as we are using the new task list REST API * Update logic to use the new fields * Update css to fit the homescreen card * Remove unused var * Show keep & dismiss page when tasks are complete (https://github.com/woocommerce/woocommerce-admin/pull/7684) * Add two column version of task list with a new design * Changes in single column * Task list does not render in the left column if two column task list has been rendered already. * Your store today and activity panel does not render if user is running two column experiment * Prompt a modal when hiding the task list * Add completed compoent * Move completed task to task-list * Implement hide and keep list buttons * Fix keep task list button * Rename hideTaskCard to hideTasks and keepTaskCard to keepTasks * Remove unnecessary feature checking logic * Separate && operator for Activity Header and Panel since one of them can be empty * Add changelog Co-authored-by: Matt Sherman <matt.sherman@automattic.com>
2021-10-20 16:16:22 +00:00
<div className="wooocommerce-task-card__header">
{ hasTaskListHeaderSlotFills ? (
<WooOnboardingTaskListHeader.Slot
id={ selectedHeaderCard?.id }
fillProps={ headerData }
/>
) : (
headerData?.task &&
createElement(
taskHeaders[ headerData.task.id ],
headerData
)
) }
Add summary tasks for the new two-column tasklist experiment (https://github.com/woocommerce/woocommerce-admin/pull/7669) * Add two column version of task list with a new design * Show number in the status circle * Set background for the active task * Remove border top * Changes in single column * Task list does not render in the left column if two column task list has been rendered already. * Your store today and activity panel does not render if user is running two column experiment * Update the circle border color * Fix lint issue * Support single column mode * Add box-shadow transition * Fix max width * Set the first card as the default if all tasks are complete * Adjust font-weight for the complete tasks * Use experiment * Remove unnecessary placeholder * Use two-column placeholder * Use the new task REST API * Remove unused code -- these are no longer used as we are using the new task list REST API * Update logic to use the new fields * Update css to fit the homescreen card * Remove unused var * Sync changelog from 2.8.0-rc.2 (https://github.com/woocommerce/woocommerce-admin/pull/7783) * Remove changelogs that were picked into 2.8.0-beta.2 * Update changelog for 7690 * Update changelog for 7743 * Update changelog for 7734 * Update changelog for 7763, 7771 * Remove changelog for 7763 from 2.8.0 since it was in 2.7.2 * Update changelog for 7798 * Show keep & dismiss page when tasks are complete (https://github.com/woocommerce/woocommerce-admin/pull/7684) * Add two column version of task list with a new design * Changes in single column * Task list does not render in the left column if two column task list has been rendered already. * Your store today and activity panel does not render if user is running two column experiment * Prompt a modal when hiding the task list * Add completed compoent * Move completed task to task-list * Implement hide and keep list buttons * Fix keep task list button * Rename hideTaskCard to hideTasks and keepTaskCard to keepTasks * Add two column version of task list with a new design * Show number in the status circle * Set background for the active task * Remove border top * Changes in single column * Task list does not render in the left column if two column task list has been rendered already. * Your store today and activity panel does not render if user is running two column experiment * Update the circle border color * Fix lint issue * Support single column mode * Add box-shadow transition * Fix max width * Set the first card as the default if all tasks are complete * Adjust font-weight for the complete tasks * Use experiment * Remove unnecessary placeholder * Use two-column placeholder * Use the new task REST API * Remove unused code -- these are no longer used as we are using the new task list REST API * Update logic to use the new fields * Update css to fit the homescreen card * Remove unused var * Show keep & dismiss page when tasks are complete (https://github.com/woocommerce/woocommerce-admin/pull/7684) * Add two column version of task list with a new design * Changes in single column * Task list does not render in the left column if two column task list has been rendered already. * Your store today and activity panel does not render if user is running two column experiment * Prompt a modal when hiding the task list * Add completed compoent * Move completed task to task-list * Implement hide and keep list buttons * Fix keep task list button * Rename hideTaskCard to hideTasks and keepTaskCard to keepTasks * Remove unnecessary feature checking logic * Separate && operator for Activity Header and Panel since one of them can be empty * Add changelog Co-authored-by: Matt Sherman <matt.sherman@automattic.com>
2021-10-20 16:16:22 +00:00
</div>
{ ! displayProgressHeader && renderMenu() }
</div>
Add summary tasks for the new two-column tasklist experiment (https://github.com/woocommerce/woocommerce-admin/pull/7669) * Add two column version of task list with a new design * Show number in the status circle * Set background for the active task * Remove border top * Changes in single column * Task list does not render in the left column if two column task list has been rendered already. * Your store today and activity panel does not render if user is running two column experiment * Update the circle border color * Fix lint issue * Support single column mode * Add box-shadow transition * Fix max width * Set the first card as the default if all tasks are complete * Adjust font-weight for the complete tasks * Use experiment * Remove unnecessary placeholder * Use two-column placeholder * Use the new task REST API * Remove unused code -- these are no longer used as we are using the new task list REST API * Update logic to use the new fields * Update css to fit the homescreen card * Remove unused var * Sync changelog from 2.8.0-rc.2 (https://github.com/woocommerce/woocommerce-admin/pull/7783) * Remove changelogs that were picked into 2.8.0-beta.2 * Update changelog for 7690 * Update changelog for 7743 * Update changelog for 7734 * Update changelog for 7763, 7771 * Remove changelog for 7763 from 2.8.0 since it was in 2.7.2 * Update changelog for 7798 * Show keep & dismiss page when tasks are complete (https://github.com/woocommerce/woocommerce-admin/pull/7684) * Add two column version of task list with a new design * Changes in single column * Task list does not render in the left column if two column task list has been rendered already. * Your store today and activity panel does not render if user is running two column experiment * Prompt a modal when hiding the task list * Add completed compoent * Move completed task to task-list * Implement hide and keep list buttons * Fix keep task list button * Rename hideTaskCard to hideTasks and keepTaskCard to keepTasks * Add two column version of task list with a new design * Show number in the status circle * Set background for the active task * Remove border top * Changes in single column * Task list does not render in the left column if two column task list has been rendered already. * Your store today and activity panel does not render if user is running two column experiment * Update the circle border color * Fix lint issue * Support single column mode * Add box-shadow transition * Fix max width * Set the first card as the default if all tasks are complete * Adjust font-weight for the complete tasks * Use experiment * Remove unnecessary placeholder * Use two-column placeholder * Use the new task REST API * Remove unused code -- these are no longer used as we are using the new task list REST API * Update logic to use the new fields * Update css to fit the homescreen card * Remove unused var * Show keep & dismiss page when tasks are complete (https://github.com/woocommerce/woocommerce-admin/pull/7684) * Add two column version of task list with a new design * Changes in single column * Task list does not render in the left column if two column task list has been rendered already. * Your store today and activity panel does not render if user is running two column experiment * Prompt a modal when hiding the task list * Add completed compoent * Move completed task to task-list * Implement hide and keep list buttons * Fix keep task list button * Rename hideTaskCard to hideTasks and keepTaskCard to keepTasks * Remove unnecessary feature checking logic * Separate && operator for Activity Header and Panel since one of them can be empty * Add changelog Co-authored-by: Matt Sherman <matt.sherman@automattic.com>
2021-10-20 16:16:22 +00:00
<List animation="custom">
{ visibleTasks.map( ( task, index ) => {
return (
<TaskListItem
Add summary tasks for the new two-column tasklist experiment (https://github.com/woocommerce/woocommerce-admin/pull/7669) * Add two column version of task list with a new design * Show number in the status circle * Set background for the active task * Remove border top * Changes in single column * Task list does not render in the left column if two column task list has been rendered already. * Your store today and activity panel does not render if user is running two column experiment * Update the circle border color * Fix lint issue * Support single column mode * Add box-shadow transition * Fix max width * Set the first card as the default if all tasks are complete * Adjust font-weight for the complete tasks * Use experiment * Remove unnecessary placeholder * Use two-column placeholder * Use the new task REST API * Remove unused code -- these are no longer used as we are using the new task list REST API * Update logic to use the new fields * Update css to fit the homescreen card * Remove unused var * Sync changelog from 2.8.0-rc.2 (https://github.com/woocommerce/woocommerce-admin/pull/7783) * Remove changelogs that were picked into 2.8.0-beta.2 * Update changelog for 7690 * Update changelog for 7743 * Update changelog for 7734 * Update changelog for 7763, 7771 * Remove changelog for 7763 from 2.8.0 since it was in 2.7.2 * Update changelog for 7798 * Show keep & dismiss page when tasks are complete (https://github.com/woocommerce/woocommerce-admin/pull/7684) * Add two column version of task list with a new design * Changes in single column * Task list does not render in the left column if two column task list has been rendered already. * Your store today and activity panel does not render if user is running two column experiment * Prompt a modal when hiding the task list * Add completed compoent * Move completed task to task-list * Implement hide and keep list buttons * Fix keep task list button * Rename hideTaskCard to hideTasks and keepTaskCard to keepTasks * Add two column version of task list with a new design * Show number in the status circle * Set background for the active task * Remove border top * Changes in single column * Task list does not render in the left column if two column task list has been rendered already. * Your store today and activity panel does not render if user is running two column experiment * Update the circle border color * Fix lint issue * Support single column mode * Add box-shadow transition * Fix max width * Set the first card as the default if all tasks are complete * Adjust font-weight for the complete tasks * Use experiment * Remove unnecessary placeholder * Use two-column placeholder * Use the new task REST API * Remove unused code -- these are no longer used as we are using the new task list REST API * Update logic to use the new fields * Update css to fit the homescreen card * Remove unused var * Show keep & dismiss page when tasks are complete (https://github.com/woocommerce/woocommerce-admin/pull/7684) * Add two column version of task list with a new design * Changes in single column * Task list does not render in the left column if two column task list has been rendered already. * Your store today and activity panel does not render if user is running two column experiment * Prompt a modal when hiding the task list * Add completed compoent * Move completed task to task-list * Implement hide and keep list buttons * Fix keep task list button * Rename hideTaskCard to hideTasks and keepTaskCard to keepTasks * Remove unnecessary feature checking logic * Separate && operator for Activity Header and Panel since one of them can be empty * Add changelog Co-authored-by: Matt Sherman <matt.sherman@automattic.com>
2021-10-20 16:16:22 +00:00
key={ task.id }
taskIndex={ ++index }
activeTaskId={ activeTaskId }
task={ task }
goToTask={ () => goToTask( task ) }
trackClick={ () => trackClick( task ) }
Add summary tasks for the new two-column tasklist experiment (https://github.com/woocommerce/woocommerce-admin/pull/7669) * Add two column version of task list with a new design * Show number in the status circle * Set background for the active task * Remove border top * Changes in single column * Task list does not render in the left column if two column task list has been rendered already. * Your store today and activity panel does not render if user is running two column experiment * Update the circle border color * Fix lint issue * Support single column mode * Add box-shadow transition * Fix max width * Set the first card as the default if all tasks are complete * Adjust font-weight for the complete tasks * Use experiment * Remove unnecessary placeholder * Use two-column placeholder * Use the new task REST API * Remove unused code -- these are no longer used as we are using the new task list REST API * Update logic to use the new fields * Update css to fit the homescreen card * Remove unused var * Sync changelog from 2.8.0-rc.2 (https://github.com/woocommerce/woocommerce-admin/pull/7783) * Remove changelogs that were picked into 2.8.0-beta.2 * Update changelog for 7690 * Update changelog for 7743 * Update changelog for 7734 * Update changelog for 7763, 7771 * Remove changelog for 7763 from 2.8.0 since it was in 2.7.2 * Update changelog for 7798 * Show keep & dismiss page when tasks are complete (https://github.com/woocommerce/woocommerce-admin/pull/7684) * Add two column version of task list with a new design * Changes in single column * Task list does not render in the left column if two column task list has been rendered already. * Your store today and activity panel does not render if user is running two column experiment * Prompt a modal when hiding the task list * Add completed compoent * Move completed task to task-list * Implement hide and keep list buttons * Fix keep task list button * Rename hideTaskCard to hideTasks and keepTaskCard to keepTasks * Add two column version of task list with a new design * Show number in the status circle * Set background for the active task * Remove border top * Changes in single column * Task list does not render in the left column if two column task list has been rendered already. * Your store today and activity panel does not render if user is running two column experiment * Update the circle border color * Fix lint issue * Support single column mode * Add box-shadow transition * Fix max width * Set the first card as the default if all tasks are complete * Adjust font-weight for the complete tasks * Use experiment * Remove unnecessary placeholder * Use two-column placeholder * Use the new task REST API * Remove unused code -- these are no longer used as we are using the new task list REST API * Update logic to use the new fields * Update css to fit the homescreen card * Remove unused var * Show keep & dismiss page when tasks are complete (https://github.com/woocommerce/woocommerce-admin/pull/7684) * Add two column version of task list with a new design * Changes in single column * Task list does not render in the left column if two column task list has been rendered already. * Your store today and activity panel does not render if user is running two column experiment * Prompt a modal when hiding the task list * Add completed compoent * Move completed task to task-list * Implement hide and keep list buttons * Fix keep task list button * Rename hideTaskCard to hideTasks and keepTaskCard to keepTasks * Remove unnecessary feature checking logic * Separate && operator for Activity Header and Panel since one of them can be empty * Add changelog Co-authored-by: Matt Sherman <matt.sherman@automattic.com>
2021-10-20 16:16:22 +00:00
/>
);
} ) }
</List>
<ExperimentalWooTaskListFooter />
Add summary tasks for the new two-column tasklist experiment (https://github.com/woocommerce/woocommerce-admin/pull/7669) * Add two column version of task list with a new design * Show number in the status circle * Set background for the active task * Remove border top * Changes in single column * Task list does not render in the left column if two column task list has been rendered already. * Your store today and activity panel does not render if user is running two column experiment * Update the circle border color * Fix lint issue * Support single column mode * Add box-shadow transition * Fix max width * Set the first card as the default if all tasks are complete * Adjust font-weight for the complete tasks * Use experiment * Remove unnecessary placeholder * Use two-column placeholder * Use the new task REST API * Remove unused code -- these are no longer used as we are using the new task list REST API * Update logic to use the new fields * Update css to fit the homescreen card * Remove unused var * Sync changelog from 2.8.0-rc.2 (https://github.com/woocommerce/woocommerce-admin/pull/7783) * Remove changelogs that were picked into 2.8.0-beta.2 * Update changelog for 7690 * Update changelog for 7743 * Update changelog for 7734 * Update changelog for 7763, 7771 * Remove changelog for 7763 from 2.8.0 since it was in 2.7.2 * Update changelog for 7798 * Show keep & dismiss page when tasks are complete (https://github.com/woocommerce/woocommerce-admin/pull/7684) * Add two column version of task list with a new design * Changes in single column * Task list does not render in the left column if two column task list has been rendered already. * Your store today and activity panel does not render if user is running two column experiment * Prompt a modal when hiding the task list * Add completed compoent * Move completed task to task-list * Implement hide and keep list buttons * Fix keep task list button * Rename hideTaskCard to hideTasks and keepTaskCard to keepTasks * Add two column version of task list with a new design * Show number in the status circle * Set background for the active task * Remove border top * Changes in single column * Task list does not render in the left column if two column task list has been rendered already. * Your store today and activity panel does not render if user is running two column experiment * Update the circle border color * Fix lint issue * Support single column mode * Add box-shadow transition * Fix max width * Set the first card as the default if all tasks are complete * Adjust font-weight for the complete tasks * Use experiment * Remove unnecessary placeholder * Use two-column placeholder * Use the new task REST API * Remove unused code -- these are no longer used as we are using the new task list REST API * Update logic to use the new fields * Update css to fit the homescreen card * Remove unused var * Show keep & dismiss page when tasks are complete (https://github.com/woocommerce/woocommerce-admin/pull/7684) * Add two column version of task list with a new design * Changes in single column * Task list does not render in the left column if two column task list has been rendered already. * Your store today and activity panel does not render if user is running two column experiment * Prompt a modal when hiding the task list * Add completed compoent * Move completed task to task-list * Implement hide and keep list buttons * Fix keep task list button * Rename hideTaskCard to hideTasks and keepTaskCard to keepTasks * Remove unnecessary feature checking logic * Separate && operator for Activity Header and Panel since one of them can be empty * Add changelog Co-authored-by: Matt Sherman <matt.sherman@automattic.com>
2021-10-20 16:16:22 +00:00
</Card>
</div>
</>
);
};
export default SetupTaskList;