From 7e4126bc9f4ea394b4a27db0dd4060865fc9b0c2 Mon Sep 17 00:00:00 2001
From: Chi-Hsuan Huang <chihsuan.tw@gmail.com>
Date: Wed, 4 May 2022 10:35:15 +0800
Subject: [PATCH] Update experimental-import-products to load sample products

---
 .../fills/experimental-import-products/index.tsx | 16 +++++++++++++++-
 1 file changed, 15 insertions(+), 1 deletion(-)

diff --git a/plugins/woocommerce-admin/client/tasks/fills/experimental-import-products/index.tsx b/plugins/woocommerce-admin/client/tasks/fills/experimental-import-products/index.tsx
index 323fedece34..2d6b76b86f2 100644
--- a/plugins/woocommerce-admin/client/tasks/fills/experimental-import-products/index.tsx
+++ b/plugins/woocommerce-admin/client/tasks/fills/experimental-import-products/index.tsx
@@ -7,7 +7,8 @@ import { __ } from '@wordpress/i18n';
 import { Icon, chevronUp, chevronDown } from '@wordpress/icons';
 import { Button } from '@wordpress/components';
 import { useState } from '@wordpress/element';
-import { find } from 'lodash';
+import { getAdminLink } from '@woocommerce/settings';
+
 /**
  * Internal dependencies
  */
@@ -17,14 +18,26 @@ import { importTypes } from './importTypes';
 import './style.scss';
 import useProductTypeListItems from '../experimental-products/use-product-types-list-items';
 import { getProductTypes } from '../experimental-products/utils';
+import LoadSampleProductModal from '../components/load-sample-product-modal';
+import useLoadSampleProducts from '../components/use-load-sample-products';
 
 const Products = () => {
 	const [ showStacks, setStackVisibility ] = useState< boolean >( false );
+
+	const {
+		loadSampleProduct,
+		isLoadingSampleProducts,
+	} = useLoadSampleProducts( {
+		redirectUrlAfterSuccess: getAdminLink(
+			'edit.php?post_type=product&wc_onboarding_active_task=products'
+		),
+	} );
 	const StacksComponent = (
 		<Stacks
 			items={ useProductTypeListItems(
 				getProductTypes( [ 'subscription' ] )
 			) }
+			onClickLoadSampleProduct={ loadSampleProduct }
 		/>
 	);
 	return (
@@ -38,6 +51,7 @@ const Products = () => {
 				</Button>
 				{ showStacks && StacksComponent }
 			</div>
+			{ isLoadingSampleProducts && <LoadSampleProductModal /> }
 		</div>
 	);
 };