diff --git a/assets/js/base/components/cart-checkout/shipping-calculator/address.js b/assets/js/base/components/cart-checkout/shipping-calculator/address.tsx similarity index 82% rename from assets/js/base/components/cart-checkout/shipping-calculator/address.js rename to assets/js/base/components/cart-checkout/shipping-calculator/address.tsx index 08b6c350c1f..4187960c48f 100644 --- a/assets/js/base/components/cart-checkout/shipping-calculator/address.js +++ b/assets/js/base/components/cart-checkout/shipping-calculator/address.tsx @@ -1,12 +1,12 @@ /** * External dependencies */ -import PropTypes from 'prop-types'; import { __ } from '@wordpress/i18n'; import Button from '@woocommerce/base-components/button'; import { useState } from '@wordpress/element'; import isShallowEqual from '@wordpress/is-shallow-equal'; import { useValidationContext } from '@woocommerce/base-context'; +import type { EnteredAddress, AddressFields } from '@woocommerce/settings'; /** * Internal dependencies @@ -14,11 +14,16 @@ import { useValidationContext } from '@woocommerce/base-context'; import './style.scss'; import { AddressForm } from '../address-form'; +interface ShippingCalculatorAddressProps { + address: EnteredAddress; + onUpdate: ( address: EnteredAddress ) => void; + addressFields: Partial< keyof AddressFields >[]; +} const ShippingCalculatorAddress = ( { address: initialAddress, onUpdate, addressFields, -} ) => { +}: ShippingCalculatorAddressProps ): JSX.Element => { const [ address, setAddress ] = useState( initialAddress ); const { hasValidationErrors, @@ -55,10 +60,4 @@ const ShippingCalculatorAddress = ( { ); }; -ShippingCalculatorAddress.propTypes = { - address: PropTypes.object.isRequired, - onUpdate: PropTypes.func.isRequired, - addressFields: PropTypes.array.isRequired, -}; - export default ShippingCalculatorAddress; diff --git a/assets/js/base/components/cart-checkout/shipping-calculator/index.js b/assets/js/base/components/cart-checkout/shipping-calculator/index.tsx similarity index 70% rename from assets/js/base/components/cart-checkout/shipping-calculator/index.js rename to assets/js/base/components/cart-checkout/shipping-calculator/index.tsx index 845c29353db..27752fde46e 100644 --- a/assets/js/base/components/cart-checkout/shipping-calculator/index.js +++ b/assets/js/base/components/cart-checkout/shipping-calculator/index.tsx @@ -1,8 +1,8 @@ /** * External dependencies */ -import PropTypes from 'prop-types'; import { useShippingDataContext } from '@woocommerce/base-context'; +import type { EnteredAddress } from '@woocommerce/settings'; /** * Internal dependencies @@ -10,10 +10,17 @@ import { useShippingDataContext } from '@woocommerce/base-context'; import ShippingCalculatorAddress from './address'; import './style.scss'; +interface ShippingCalculatorProps { + onUpdate?: ( newAddress: EnteredAddress ) => void; + addressFields?: Partial< keyof EnteredAddress >[]; +} + const ShippingCalculator = ( { - onUpdate = () => {}, + onUpdate = () => { + /* Do nothing */ + }, addressFields = [ 'country', 'state', 'city', 'postcode' ], -} ) => { +}: ShippingCalculatorProps ): JSX.Element => { const { shippingAddress, setShippingAddress } = useShippingDataContext(); return (
@@ -29,9 +36,4 @@ const ShippingCalculator = ( { ); }; -ShippingCalculator.propTypes = { - onUpdate: PropTypes.func, - addressFields: PropTypes.array, -}; - export default ShippingCalculator; diff --git a/assets/js/base/components/cart-checkout/shipping-location/index.js b/assets/js/base/components/cart-checkout/shipping-location/index.tsx similarity index 79% rename from assets/js/base/components/cart-checkout/shipping-location/index.js rename to assets/js/base/components/cart-checkout/shipping-location/index.tsx index 872753152d9..bd2ea74b671 100644 --- a/assets/js/base/components/cart-checkout/shipping-location/index.js +++ b/assets/js/base/components/cart-checkout/shipping-location/index.tsx @@ -1,24 +1,35 @@ /** * External dependencies */ -import PropTypes from 'prop-types'; import { __, sprintf } from '@wordpress/i18n'; -import { getSetting } from '@woocommerce/settings'; +import { EnteredAddress, getSetting } from '@woocommerce/settings'; import { decodeEntities } from '@wordpress/html-entities'; +interface ShippingLocationProps { + address: EnteredAddress; +} + /** * Shows a formatted shipping location. * * @param {Object} props Incoming props for the component. * @param {Object} props.address Incoming address information. */ -const ShippingLocation = ( { address } ) => { +const ShippingLocation = ( { + address, +}: ShippingLocationProps ): JSX.Element | null => { // we bail early if we don't have an address. if ( Object.values( address ).length === 0 ) { return null; } - const shippingCountries = getSetting( 'shippingCountries', {} ); - const shippingStates = getSetting( 'shippingStates', {} ); + const shippingCountries = getSetting( 'shippingCountries', {} ) as Record< + string, + string + >; + const shippingStates = getSetting( 'shippingStates', {} ) as Record< + string, + Record< string, string > + >; const formattedCountry = typeof shippingCountries[ address.country ] === 'string' ? decodeEntities( shippingCountries[ address.country ] ) @@ -56,13 +67,4 @@ const ShippingLocation = ( { address } ) => { ); }; -ShippingLocation.propTypes = { - address: PropTypes.shape( { - city: PropTypes.string, - state: PropTypes.string, - postcode: PropTypes.string, - country: PropTypes.string, - } ), -}; - export default ShippingLocation; diff --git a/assets/js/base/components/cart-checkout/shipping-rates-control-package/index.tsx b/assets/js/base/components/cart-checkout/shipping-rates-control-package/index.tsx index 467fe2a8b03..fdc359b9d8d 100644 --- a/assets/js/base/components/cart-checkout/shipping-rates-control-package/index.tsx +++ b/assets/js/base/components/cart-checkout/shipping-rates-control-package/index.tsx @@ -7,9 +7,10 @@ import { decodeEntities } from '@wordpress/html-entities'; import Label from '@woocommerce/base-components/label'; import Title from '@woocommerce/base-components/title'; import type { ReactElement } from 'react'; -import type { Rate, PackageRateOption } from '@woocommerce/type-defs/shipping'; +import type { PackageRateOption } from '@woocommerce/type-defs/shipping'; import { Panel } from '@woocommerce/blocks-checkout'; import { useSelectShippingRate } from '@woocommerce/base-context/hooks'; +import type { CartShippingPackageShippingRate } from '@woocommerce/type-defs/cart'; /** * Internal dependencies @@ -34,21 +35,28 @@ interface Destination { country: string; } +export interface PackageData { + destination: Destination; + name: string; + // eslint-disable-next-line camelcase + shipping_rates: CartShippingPackageShippingRate[]; + items: PackageItem[]; +} + +export type PackageRateRenderOption = ( + option: CartShippingPackageShippingRate +) => PackageRateOption; + interface PackageProps { - packageId: string; - renderOption: ( option: Rate ) => PackageRateOption; - collapse: boolean; - packageData: { - destination: Destination; - name: string; - // eslint-disable-next-line camelcase - shipping_rates: Rate[]; - items: PackageItem[]; - }; + /* PackageId can be a string, WooCommerce Subscriptions uses strings for example, but WooCommerce core uses numbers */ + packageId: string | number; + renderOption: PackageRateRenderOption; + collapse?: boolean; + packageData: PackageData; className?: string; collapsible?: boolean; noResultsMessage: ReactElement; - showItems: boolean; + showItems?: boolean; } export const ShippingRatesControlPackage = ( { diff --git a/assets/js/base/components/cart-checkout/shipping-rates-control-package/package-rates.tsx b/assets/js/base/components/cart-checkout/shipping-rates-control-package/package-rates.tsx index b097d8a35ad..ed350d61cb1 100644 --- a/assets/js/base/components/cart-checkout/shipping-rates-control-package/package-rates.tsx +++ b/assets/js/base/components/cart-checkout/shipping-rates-control-package/package-rates.tsx @@ -4,8 +4,9 @@ import RadioControl, { RadioControlOptionLayout, } from '@woocommerce/base-components/radio-control'; -import type { Rate, PackageRateOption } from '@woocommerce/type-defs/shipping'; +import type { PackageRateOption } from '@woocommerce/type-defs/shipping'; import type { ReactElement } from 'react'; +import type { CartShippingPackageShippingRate } from '@woocommerce/type-defs/cart'; /** * Internal dependencies @@ -14,8 +15,10 @@ import { renderPackageRateOption } from './render-package-rate-option'; interface PackageRates { onSelectRate: ( selectedRateId: string ) => void; - rates: Rate[]; - renderOption?: ( option: Rate ) => PackageRateOption; + rates: CartShippingPackageShippingRate[]; + renderOption?: ( + option: CartShippingPackageShippingRate + ) => PackageRateOption; className?: string; noResultsMessage: ReactElement; selected?: string; diff --git a/assets/js/base/components/cart-checkout/shipping-rates-control-package/render-package-rate-option.tsx b/assets/js/base/components/cart-checkout/shipping-rates-control-package/render-package-rate-option.tsx index bb5655b68cf..8fb2695298f 100644 --- a/assets/js/base/components/cart-checkout/shipping-rates-control-package/render-package-rate-option.tsx +++ b/assets/js/base/components/cart-checkout/shipping-rates-control-package/render-package-rate-option.tsx @@ -4,15 +4,18 @@ import { decodeEntities } from '@wordpress/html-entities'; import { getCurrencyFromPriceResponse } from '@woocommerce/price-format'; import FormattedMonetaryAmount from '@woocommerce/base-components/formatted-monetary-amount'; -import type { Rate, PackageRateOption } from '@woocommerce/type-defs/shipping'; +import type { PackageRateOption } from '@woocommerce/type-defs/shipping'; import { getSetting } from '@woocommerce/settings'; +import { CartShippingPackageShippingRate } from '@woocommerce/type-defs/cart'; /** * Default render function for package rate options. * * @param {Object} rate Rate data. */ -export const renderPackageRateOption = ( rate: Rate ): PackageRateOption => { +export const renderPackageRateOption = ( + rate: CartShippingPackageShippingRate +): PackageRateOption => { const priceWithTaxes: number = getSetting( 'displayCartPricesIncludingTax', false diff --git a/assets/js/base/components/cart-checkout/shipping-rates-control/index.js b/assets/js/base/components/cart-checkout/shipping-rates-control/index.tsx similarity index 78% rename from assets/js/base/components/cart-checkout/shipping-rates-control/index.js rename to assets/js/base/components/cart-checkout/shipping-rates-control/index.tsx index 613f2dfeadc..e1913177849 100644 --- a/assets/js/base/components/cart-checkout/shipping-rates-control/index.js +++ b/assets/js/base/components/cart-checkout/shipping-rates-control/index.tsx @@ -3,7 +3,6 @@ */ import { __, _n, sprintf } from '@wordpress/i18n'; import { useEffect } from '@wordpress/element'; -import PropTypes from 'prop-types'; import { speak } from '@wordpress/a11y'; import LoadingMask from '@woocommerce/base-components/loading-mask'; import { ExperimentalOrderShippingPackages } from '@woocommerce/blocks-checkout'; @@ -12,16 +11,77 @@ import { getShippingRatesRateCount, } from '@woocommerce/base-utils'; import { useStoreCart } from '@woocommerce/base-context/hooks'; +import { CartResponseShippingRate } from '@woocommerce/type-defs/cart-response'; +import { ReactElement } from 'react'; /** * Internal dependencies */ -import ShippingRatesControlPackage from '../shipping-rates-control-package'; +import ShippingRatesControlPackage, { + PackageRateRenderOption, +} from '../shipping-rates-control-package'; + +interface PackagesProps { + packages: CartResponseShippingRate[]; + collapse?: boolean; + collapsible?: boolean; + showItems?: boolean; + noResultsMessage: ReactElement; + renderOption: PackageRateRenderOption; +} /** - * @typedef {import('react')} React + * Renders multiple packages within the slotfill. + * + * @param {Object} props Incoming props. + * @param {Array} props.packages Array of packages. + * @param {boolean} props.collapsible If the package should be rendered as a + * @param {ReactElement} props.noResultsMessage Rendered when there are no rates in a package. + * collapsible panel. + * @param {boolean} props.collapse If the panel should be collapsed by default, + * only works if collapsible is true. + * @param {boolean} props.showItems If we should items below the package name. + * @param {PackageRateRenderOption} [props.renderOption] Function to render a shipping rate. + * @return {JSX.Element|null} Rendered components. */ +const Packages = ( { + packages, + collapse, + showItems, + collapsible, + noResultsMessage, + renderOption, +}: PackagesProps ): JSX.Element | null => { + // If there are no packages, return nothing. + if ( ! packages.length ) { + return null; + } + return ( + <> + { packages.map( ( { package_id: packageId, ...packageData } ) => ( + + ) ) } + + ); +}; +interface ShippingRatesControlProps { + collapsible?: boolean; + shippingRates: CartResponseShippingRate[]; + className?: string; + shippingRatesLoading: boolean; + noResultsMessage: ReactElement; + renderOption: PackageRateRenderOption; +} /** * Renders the shipping rates control element. * @@ -30,7 +90,7 @@ import ShippingRatesControlPackage from '../shipping-rates-control-package'; * @param {boolean} props.shippingRatesLoading True when rates are being loaded. * @param {string} props.className Class name for package rates. * @param {boolean} [props.collapsible] If true, when multiple packages are rendered they can be toggled open and closed. - * @param {React.ReactElement} props.noResultsMessage Rendered when there are no packages. + * @param {ReactElement} props.noResultsMessage Rendered when there are no packages. * @param {Function} [props.renderOption] Function to render a shipping rate. */ const ShippingRatesControl = ( { @@ -40,7 +100,7 @@ const ShippingRatesControl = ( { collapsible = false, noResultsMessage, renderOption, -} ) => { +}: ShippingRatesControlProps ): JSX.Element => { useEffect( () => { if ( shippingRatesLoading ) { return; @@ -90,7 +150,7 @@ const ShippingRatesControl = ( { // Prepare props to pass to the ExperimentalOrderShippingPackages slot fill. // We need to pluck out receiveCart. // eslint-disable-next-line no-unused-vars - const { extensions, receiveCart, ...cart } = useStoreCart(); + const { extensions, ...cart } = useStoreCart(); const slotFillProps = { className, collapsible, @@ -124,58 +184,4 @@ const ShippingRatesControl = ( { ); }; -/** - * Renders multiple packages within the slotfill. - * - * @param {Object} props Incoming props. - * @param {Array} props.packages Array of packages. - * @param {React.ReactElement} props.noResultsMessage Rendered when there are no rates in a package. - * @param {boolean} props.collapsible If the package should be rendered as a - * collapsible panel. - * @param {boolean} props.collapse If the panel should be collapsed by default, - * only works if collapsible is true. - * @param {boolean} props.showItems If we should items below the package name. - * @param {Function} [props.renderOption] Function to render a shipping rate. - * @return {React.ReactElement|null} Rendered components. - */ -const Packages = ( { - packages, - collapse, - showItems, - collapsible, - noResultsMessage, - renderOption, -} ) => { - // If there are no packages, return nothing. - if ( ! packages.length ) { - return null; - } - - return ( - <> - { packages.map( ( { package_id: packageId, ...packageData } ) => ( - - ) ) } - - ); -}; - -ShippingRatesControl.propTypes = { - noResultsMessage: PropTypes.node.isRequired, - renderOption: PropTypes.func, - className: PropTypes.string, - collapsible: PropTypes.bool, - shippingRates: PropTypes.array, - shippingRatesLoading: PropTypes.bool, -}; - export default ShippingRatesControl; diff --git a/assets/js/base/components/cart-checkout/totals/shipping/index.tsx b/assets/js/base/components/cart-checkout/totals/shipping/index.tsx index f4a7db4d00d..4d3131f1aff 100644 --- a/assets/js/base/components/cart-checkout/totals/shipping/index.tsx +++ b/assets/js/base/components/cart-checkout/totals/shipping/index.tsx @@ -8,7 +8,7 @@ import { useStoreCart } from '@woocommerce/base-context/hooks'; import { TotalsItem } from '@woocommerce/blocks-checkout'; import type { Currency } from '@woocommerce/price-format'; import type { ReactElement } from 'react'; -import { getSetting } from '@woocommerce/settings'; +import { getSetting, EnteredAddress } from '@woocommerce/settings'; /** * Internal dependencies @@ -47,7 +47,7 @@ interface ShippingAddressProps { showCalculator: boolean; isShippingCalculatorOpen: boolean; setIsShippingCalculatorOpen: CalculatorButtonProps[ 'setIsShippingCalculatorOpen' ]; - shippingAddress: Record< string, unknown >; + shippingAddress: EnteredAddress; } const ShippingAddress = ( { diff --git a/assets/js/base/context/hooks/shipping/use-select-shipping-rate.ts b/assets/js/base/context/hooks/shipping/use-select-shipping-rate.ts index f4fbc65e6dd..afb239cc8b9 100644 --- a/assets/js/base/context/hooks/shipping/use-select-shipping-rate.ts +++ b/assets/js/base/context/hooks/shipping/use-select-shipping-rate.ts @@ -3,7 +3,7 @@ */ import { useState, useEffect, useRef, useCallback } from '@wordpress/element'; import isShallowEqual from '@wordpress/is-shallow-equal'; -import { Rate } from '@woocommerce/type-defs/shipping'; +import { CartShippingPackageShippingRate } from '@woocommerce/type-defs/cart'; /** * Internal dependencies @@ -18,8 +18,9 @@ import { useStoreEvents } from '../use-store-events'; * @return {string} Selected rate id. */ // This will find the selected rate ID in an array of shipping rates. -const deriveSelectedRateId = ( shippingRates: Rate[] ) => - shippingRates.find( ( rate ) => rate.selected )?.rate_id; +const deriveSelectedRateId = ( + shippingRates: CartShippingPackageShippingRate[] +) => shippingRates.find( ( rate ) => rate.selected )?.rate_id; /** * This is a custom hook for tracking selected shipping rates for a package and selecting a rate. State is used so @@ -33,8 +34,8 @@ const deriveSelectedRateId = ( shippingRates: Rate[] ) => * - isSelectingRate: True when rates are being resolved to the API. */ export const useSelectShippingRate = ( - packageId: string, - shippingRates: Rate[] + packageId: string | number, + shippingRates: CartShippingPackageShippingRate[] ): { selectShippingRate: ( newShippingRateId: string ) => unknown; selectedShippingRate: string | undefined; diff --git a/assets/js/base/context/hooks/shipping/use-select-shipping-rates.ts b/assets/js/base/context/hooks/shipping/use-select-shipping-rates.ts index 5f8fca9638b..edd7ad044ce 100644 --- a/assets/js/base/context/hooks/shipping/use-select-shipping-rates.ts +++ b/assets/js/base/context/hooks/shipping/use-select-shipping-rates.ts @@ -16,7 +16,7 @@ import { useThrowError } from '@woocommerce/base-hooks'; export const useSelectShippingRates = (): { selectShippingRate: ( newShippingRateId: string, - packageId: string + packageId: string | number ) => unknown; isSelectingRate: boolean; } => { @@ -26,7 +26,7 @@ export const useSelectShippingRates = (): { } ) as { selectShippingRate: ( newShippingRateId: string, - packageId: string + packageId: string | number ) => Promise< unknown >; }; diff --git a/assets/js/blocks/cart-checkout/checkout/form/shipping-options-step.js b/assets/js/blocks/cart-checkout/checkout/form/shipping-options-step.tsx similarity index 90% rename from assets/js/blocks/cart-checkout/checkout/form/shipping-options-step.js rename to assets/js/blocks/cart-checkout/checkout/form/shipping-options-step.tsx index 57ffd26580f..c136e5f7352 100644 --- a/assets/js/blocks/cart-checkout/checkout/form/shipping-options-step.js +++ b/assets/js/blocks/cart-checkout/checkout/form/shipping-options-step.tsx @@ -21,6 +21,8 @@ import { decodeEntities } from '@wordpress/html-entities'; import { Notice } from 'wordpress-components'; import classnames from 'classnames'; import { getSetting } from '@woocommerce/settings'; +import type { PackageRateOption } from '@woocommerce/type-defs/shipping'; +import type { CartShippingPackageShippingRate } from '@woocommerce/type-defs/cart'; /** * Internal dependencies @@ -32,7 +34,9 @@ import NoShippingPlaceholder from './no-shipping-placeholder'; * * @param {Object} option Shipping Rate. */ -const renderShippingRatesControlOption = ( option ) => { +const renderShippingRatesControlOption = ( + option: CartShippingPackageShippingRate +): PackageRateOption => { const priceWithTaxes = getSetting( 'displayCartPricesIncludingTax', false ) ? parseInt( option.price, 10 ) + parseInt( option.taxes, 10 ) : parseInt( option.price, 10 ); @@ -50,7 +54,7 @@ const renderShippingRatesControlOption = ( option ) => { }; }; -const ShippingOptionsStep = () => { +const ShippingOptionsStep = (): JSX.Element | null => { const { isProcessing: checkoutIsProcessing } = useCheckoutContext(); const { isEditor } = useEditorContext(); const { diff --git a/assets/js/previews/shipping-rates.ts b/assets/js/previews/shipping-rates.ts index 752a447537b..d040641fca0 100644 --- a/assets/js/previews/shipping-rates.ts +++ b/assets/js/previews/shipping-rates.ts @@ -2,9 +2,9 @@ * External dependencies */ import { __, _x } from '@wordpress/i18n'; -import type { CartResponseShippingRateItem } from '@woocommerce/types'; +import type { CartResponseShippingRate } from '@woocommerce/types'; -export const previewShippingRates: CartResponseShippingRateItem[] = [ +export const previewShippingRates: CartResponseShippingRate[] = [ { destination: { address_1: '', diff --git a/assets/js/settings/shared/default-address-fields.ts b/assets/js/settings/shared/default-address-fields.ts index 84a5311dad2..ee56b0e3500 100644 --- a/assets/js/settings/shared/default-address-fields.ts +++ b/assets/js/settings/shared/default-address-fields.ts @@ -1,5 +1,3 @@ -/** @typedef { import('@woocommerce/type-defs/address-fields').AddressField } AddressField */ - /** * External dependencies */ @@ -38,6 +36,29 @@ export interface AddressFields { postcode: AddressField; } +export interface EnteredAddress { + // eslint-disable-next-line camelcase + first_name: string; + // eslint-disable-next-line camelcase + last_name: string; + company: string; + // eslint-disable-next-line camelcase + address_1: string; + // eslint-disable-next-line camelcase + address_2: string; + country: string; + city: string; + state: string; + postcode: string; +} + +export type KeyedAddressField = AddressField & { + key: keyof AddressFields; +}; +export type ShippingAddress = EnteredAddress; +export type BillingAddress = EnteredAddress; +export type CountryAddressFields = Record< string, AddressFields >; + /** * Default address field properties. */ diff --git a/assets/js/type-defs/cart-response.ts b/assets/js/type-defs/cart-response.ts index 48751d21bb7..b6563d6c2a2 100644 --- a/assets/js/type-defs/cart-response.ts +++ b/assets/js/type-defs/cart-response.ts @@ -45,7 +45,7 @@ export interface ResponseBaseAddress { country: string; } -export interface ShippingRateItemItem { +export interface ShippingRateItem { key: string; name: string; quantity: number; @@ -60,7 +60,7 @@ export type ExtensionsData = | Record< string, unknown > | Record< string, never >; -export interface CartResponseShippingRateItemShippingRate +export interface CartResponseShippingPackageShippingRate extends CurrencyResponseInfo { rate_id: string; name: string; @@ -74,12 +74,13 @@ export interface CartResponseShippingRateItemShippingRate selected: boolean; } -export interface CartResponseShippingRateItem { - package_id: number; +export interface CartResponseShippingRate { + /* PackageId can be a string, WooCommerce Subscriptions uses strings for example, but WooCommerce core uses numbers */ + package_id: number | string; name: string; destination: ResponseBaseAddress; - items: Array< ShippingRateItemItem >; - shipping_rates: Array< CartResponseShippingRateItemShippingRate >; + items: Array< ShippingRateItem >; + shipping_rates: Array< CartResponseShippingPackageShippingRate >; } export interface CartResponseShippingAddress @@ -194,7 +195,7 @@ export interface CartResponseExtensionItem { export interface CartResponse { coupons: Array< CartResponseCouponItem >; - shipping_rates: Array< CartResponseShippingRateItem >; + shipping_rates: Array< CartResponseShippingRate >; shipping_address: CartResponseShippingAddress; billing_address: CartResponseBillingAddress; items: Array< CartResponseItem >; diff --git a/assets/js/type-defs/cart.ts b/assets/js/type-defs/cart.ts index 21d356355c7..02708795268 100644 --- a/assets/js/type-defs/cart.ts +++ b/assets/js/type-defs/cart.ts @@ -5,7 +5,7 @@ */ import { MetaKeyValue, - ShippingRateItemItem, + ShippingRateItem, ExtensionsData, } from './cart-response'; export interface CurrencyInfo { @@ -43,7 +43,7 @@ export interface BaseAddress { country: string; } -export interface CartShippingRateItemShippingRate extends CurrencyInfo { +export interface CartShippingPackageShippingRate extends CurrencyInfo { rate_id: string; name: string; description: string; @@ -56,12 +56,12 @@ export interface CartShippingRateItemShippingRate extends CurrencyInfo { selected: boolean; } -export interface CartShippingRateItem { +export interface CartShippingRate { package_id: number; name: string; destination: BaseAddress; - items: Array< ShippingRateItemItem >; - shipping_rates: Array< CartShippingRateItemShippingRate >; + items: Array< ShippingRateItem >; + shipping_rates: Array< CartShippingPackageShippingRate >; } export interface CartShippingAddress extends BaseAddress, FirstNameLastName { @@ -171,7 +171,7 @@ export interface CartErrorItem { export interface Cart { coupons: Array< CartCouponItem >; - shippingRates: Array< CartShippingRateItem >; + shippingRates: Array< CartShippingRate >; shippingAddress: CartShippingAddress; billingAddress: CartBillingAddress; items: Array< CartItem >; diff --git a/assets/js/type-defs/hooks.ts b/assets/js/type-defs/hooks.ts index 4e02667c30f..a17d0dd6716 100644 --- a/assets/js/type-defs/hooks.ts +++ b/assets/js/type-defs/hooks.ts @@ -9,7 +9,7 @@ import type { CartResponseTotals, CartResponseShippingAddress, CartResponseBillingAddress, - CartResponseShippingRateItem, + CartResponseShippingRate, CartResponse, } from './cart-response'; import type { ResponseError } from '../data/types'; @@ -44,7 +44,7 @@ export interface StoreCart { cartErrors: Array< ResponseError >; billingAddress: CartResponseBillingAddress; shippingAddress: CartResponseShippingAddress; - shippingRates: Array< CartResponseShippingRateItem >; + shippingRates: Array< CartResponseShippingRate >; extensions: Record< string, unknown >; shippingRatesLoading: boolean; cartHasCalculatedShipping: boolean; diff --git a/assets/js/type-defs/shipping.ts b/assets/js/type-defs/shipping.ts index c4b886b253f..1f9f48b6efb 100644 --- a/assets/js/type-defs/shipping.ts +++ b/assets/js/type-defs/shipping.ts @@ -5,26 +5,6 @@ */ import type { ReactElement } from 'react'; -export interface Rate { - currency_code: string; - currency_decimal_separator: string; - currency_minor_unit: number; - currency_prefix: string; - currency_suffix: string; - currency_symbol: string; - currency_thousand_separator: string; - delivery_time: string; - description: string; - id: number; - meta_data: [ { key: 'Items'; value: 'Beanie × 2' } ]; - method_id: string; - name: string; - price: string; - rate_id: string; - selected: boolean; - taxes: string; -} - export interface PackageRateOption { label: string; value: string; diff --git a/packages/prices/utils/price.ts b/packages/prices/utils/price.ts index 92a7212155c..1b36c879aab 100644 --- a/packages/prices/utils/price.ts +++ b/packages/prices/utils/price.ts @@ -3,7 +3,7 @@ */ import { CURRENCY } from '@woocommerce/settings'; import type { CurrencyResponseInfo } from '@woocommerce/type-defs/cart-response'; -import type { Rate } from '@woocommerce/type-defs/shipping'; +import type { CartShippingPackageShippingRate } from '@woocommerce/type-defs/cart'; /** * Internal dependencies @@ -72,7 +72,10 @@ const siteCurrencySettings: Currency = { */ export const getCurrencyFromPriceResponse = ( // Currency data object, for example an API response containing currency formatting data. - currencyData: CurrencyResponseInfo | Record< string, never > | Rate + currencyData: + | CurrencyResponseInfo + | Record< string, never > + | CartShippingPackageShippingRate ): Currency => { if ( ! currencyData || typeof currencyData !== 'object' ) { return siteCurrencySettings;