Create New Item
Item Type
File
Folder
Item Name
Search file in folder and subfolders...
Are you sure want to rename?
primogenial
/
wp-content
/
plugins
/
woocommerce
/
packages
/
woocommerce-blocks
/
assets
/
js
/
base
/
components
/
cart-checkout
/
totals
/
coupon
/
stories
:
index.tsx
Advanced Search
Upload
New Item
Settings
Back
Back Up
Advanced Editor
Save
/** * External dependencies */ import { useArgs } from '@storybook/client-api'; import { Story, Meta } from '@storybook/react'; import { useValidationContext, ValidationContextProvider, } from '@woocommerce/base-context'; import { INTERACTION_TIMEOUT } from '@woocommerce/storybook-controls'; /** * Internal dependencies */ import { TotalsCoupon, TotalsCouponProps } from '..'; export default { title: 'WooCommerce Blocks/@base-components/cart-checkout/totals/Coupon', component: TotalsCoupon, args: { initialOpen: true, }, } as Meta< TotalsCouponProps >; const INVALID_COUPON_ERROR = { hidden: false, message: 'Invalid coupon code', }; const Template: Story< TotalsCouponProps > = ( args ) => { const [ {}, setArgs ] = useArgs(); const onSubmit = ( code: string ) => { args.onSubmit?.( code ); setArgs( { isLoading: true } ); setTimeout( () => setArgs( { isLoading: false } ), INTERACTION_TIMEOUT ); }; return <TotalsCoupon { ...args } onSubmit={ onSubmit } />; }; export const Default = Template.bind( {} ); Default.args = {}; export const LoadingState = Template.bind( {} ); LoadingState.args = { isLoading: true, }; export const ErrorState: Story< TotalsCouponProps > = ( args ) => { const { setValidationErrors } = useValidationContext(); setValidationErrors( { coupon: INVALID_COUPON_ERROR } ); return <TotalsCoupon { ...args } />; }; ErrorState.decorators = [ ( StoryComponent ) => { return ( <ValidationContextProvider> <StoryComponent /> </ValidationContextProvider> ); }, ];