@riosst100/pwa-marketplace 2.0.8 → 2.0.9

package/src/overwrites/venia-ui/lib/components/AccountMenu/accountMenu.module.css

@@ -1,73 +0,0 @@
-.root {
-    composes: absolute from global;
-    composes: h-0 from global;
-    composes: left-[-100vw] from global;
-    composes: max-w-[100vw] from global;
-    composes: opacity-0 from global;
-    composes: overflow-visible from global;
-    composes: top-full from global;
-    composes: z-menu from global;
-    transition: opacity 192ms var(--venia-global-anim-out),
-        visibility 192ms var(--venia-global-anim-out),
-        /* Adding delay to move container off the screen after previous transitions happened */
-            left 0s 192ms;
-    width: calc(100vw - 2rem); /* TODO @TW: cannot compose */
-    transform: translate3d(-50%, 0, 0);
-
-    /* TODO @TW: review (B6) */
-    /* composes: invisible from global; */
-    visibility: hidden;
-}
-
-.root_open {
-    composes: root;
-
-    composes: left-1/2 from global;
-    composes: opacity-100 from global;
-    transition: opacity 224ms var(--venia-global-anim-in),
-        visibility 224ms var(--venia-global-anim-in), left 0s;
-
-    /* TODO @TW: review (B6) */
-    /* composes: visible from global; */
-    visibility: visible;
-}
-
-.contents {
-    composes: absolute from global;
-    composes: bg-white from global;
-    composes: grid from global;
-    composes: right-0 from global;
-    composes: rounded-sm from global;
-    composes: shadow-menu from global;
-    composes: top-0 from global;
-    composes: w-[27.5rem] from global;
-    min-height: 10rem;
-    transform: translate3d(0, -8px, 0);
-    transition-duration: 192ms;
-    transition-property: transform;
-    transition-timing-function: var(--venia-global-anim-out);
-}
-
-.contents_open {
-    composes: contents;
-
-    transform: translate3d(0, 4px, 0);
-    transition-duration: 224ms;
-    transition-timing-function: var(--venia-global-anim-in);
-}
-
-.createAccount {
-    composes: grid from global;
-    composes: gap-xs from global;
-    composes: justify-items-stretch from global;
-    composes: px-sm from global;
-    composes: py-xs from global;
-}
-
-.forgotPassword {
-    composes: p-md from global;
-}
-
-.loading {
-    composes: p-md from global;
-}

package/src/overwrites/venia-ui/lib/components/AccountMenu/accountMenuItems.js

@@ -1,58 +0,0 @@
-import React from 'react';
-import { func, shape, string } from 'prop-types';
-import { FormattedMessage } from 'react-intl';
-import { Link } from 'react-router-dom';
-
-import { useStyle } from '@magento/venia-ui/lib/classify';
-import { useAccountMenuItems } from '@magento/peregrine/lib/talons/AccountMenu/useAccountMenuItems';
-
-import defaultClasses from './accountMenuItems.module.css';
-
-const AccountMenuItems = props => {
-    const { onSignOut } = props;
-
-    const talonProps = useAccountMenuItems({ onSignOut });
-    const { handleSignOut, menuItems } = talonProps;
-
-    const classes = useStyle(defaultClasses, props.classes);
-
-    const menu = menuItems.map(item => {
-        return (
-            <Link
-                data-cy="AccountMenuItems-link"
-                className={classes.link}
-                key={item.name}
-                to={item.url}
-            >
-                <FormattedMessage id={item.id} defaultMessage={item.name} />
-            </Link>
-        );
-    });
-
-    return (
-        <div className={classes.root} data-cy="AccountMenuItems-root">
-            {menu}
-            <button
-                className={classes.signOut}
-                onClick={handleSignOut}
-                type="button"
-                data-cy="AccountMenuItems-signOut"
-            >
-                <FormattedMessage
-                    id={'accountMenu.signOutButtonText'}
-                    defaultMessage={'Sign Out'}
-                />
-            </button>
-        </div>
-    );
-};
-
-export default AccountMenuItems;
-
-AccountMenuItems.propTypes = {
-    classes: shape({
-        link: string,
-        signOut: string
-    }),
-    onSignOut: func
-};

package/src/overwrites/venia-ui/lib/components/AccountMenu/accountMenuItems.module.css

@@ -1,31 +0,0 @@
-.root {
-    composes: gap-y-sm from global;
-    composes: grid from global;
-    composes: grid-flow-row from global;
-    composes: justify-stretch from global;
-    composes: p-sm from global;
-}
-
-.link {
-    composes: cursor-pointer from global;
-    composes: font-medium from global;
-    composes: inline-flex from global;
-    composes: items-center from global;
-    composes: justify-start from global;
-    composes: leading-tight from global;
-    composes: max-w-full from global;
-    composes: no-underline from global;
-    composes: pointer-events-auto from global;
-    composes: text-subtle from global;
-
-    composes: hover_text-colorDefault from global;
-}
-
-.signOut {
-    composes: link;
-
-    composes: border-t-2 from global;
-    composes: border-solid from global;
-    composes: border-light from global;
-    composes: pt-xs from global;
-}

package/src/overwrites/venia-ui/lib/components/AccountMenu/index.js

@@ -1 +0,0 @@
-export { default } from './accountMenu';

package/src/overwrites/venia-ui/lib/components/App/app.js

@@ -1,131 +0,0 @@
-import React, { useCallback } from 'react';
-import { useIntl } from 'react-intl';
-import { array, func, shape, string } from 'prop-types';
-
-import { useToasts } from '@magento/peregrine';
-import { useDelayedTransition } from '@magento/peregrine/lib/hooks/useDelayedTransition';
-import { useApp } from '@magento/peregrine/lib/talons/App/useApp';
-
-import globalCSS from '../../index.module.css';
-import { HeadProvider, StoreTitle } from '@magento/venia-ui/lib/components/Head';
-import Main from '../Main';
-import Mask from '@magento/venia-ui/lib/components/Mask';
-import Navigation from '@magento/venia-ui/lib/components/Navigation';
-import Routes from '@magento/venia-ui/lib/components/Routes';
-import ToastContainer from '@magento/venia-ui/lib/components/ToastContainer';
-import Icon from '@magento/venia-ui/lib/components/Icon';
-
-import {
-    AlertCircle as AlertCircleIcon,
-    CloudOff as CloudOffIcon,
-    Wifi as WifiIcon
-} from 'react-feather';
-
-const OnlineIcon = <Icon src={WifiIcon} attrs={{ width: 18 }} />;
-const OfflineIcon = <Icon src={CloudOffIcon} attrs={{ width: 18 }} />;
-const ErrorIcon = <Icon src={AlertCircleIcon} attrs={{ width: 18 }} />;
-
-const App = props => {
-    const { markErrorHandled, renderError, unhandledErrors } = props;
-    const { formatMessage } = useIntl();
-    const [, { addToast }] = useToasts();
-    useDelayedTransition();
-
-    const ERROR_MESSAGE = formatMessage({
-        id: 'app.errorUnexpected',
-        defaultMessage: 'Sorry! An unexpected error occurred.'
-    });
-
-    const handleIsOffline = useCallback(() => {
-        addToast({
-            type: 'error',
-            icon: OfflineIcon,
-            message: formatMessage({
-                id: 'app.errorOffline',
-                defaultMessage:
-                    'You are offline. Some features may be unavailable.'
-            }),
-            timeout: 3000
-        });
-    }, [addToast, formatMessage]);
-
-    const handleIsOnline = useCallback(() => {
-        addToast({
-            type: 'info',
-            icon: OnlineIcon,
-            message: formatMessage({
-                id: 'app.infoOnline',
-                defaultMessage: 'You are online.'
-            }),
-            timeout: 3000
-        });
-    }, [addToast, formatMessage]);
-
-    const handleError = useCallback(
-        (error, id, loc, handleDismissError) => {
-            const errorToastProps = {
-                icon: ErrorIcon,
-                message: `${ERROR_MESSAGE}\nDebug: ${id} ${loc}`,
-                onDismiss: remove => {
-                    handleDismissError();
-                    remove();
-                },
-                timeout: 15000,
-                type: 'error'
-            };
-
-            addToast(errorToastProps);
-        },
-        [ERROR_MESSAGE, addToast]
-    );
-
-    const talonProps = useApp({
-        handleError,
-        handleIsOffline,
-        handleIsOnline,
-        markErrorHandled,
-        renderError,
-        unhandledErrors
-    });
-
-    const { hasOverlay, handleCloseDrawer } = talonProps;
-
-    if (renderError) {
-        return (
-            <HeadProvider>
-                <StoreTitle />
-                <Main isMasked={true} />
-                <Mask isActive={true} />
-                <ToastContainer />
-            </HeadProvider>
-        );
-    }
-
-    return (
-        <HeadProvider>
-            <StoreTitle />
-            <Main isMasked={hasOverlay}>
-                <Routes />
-            </Main>
-            <Mask
-                isActive={hasOverlay}
-                dismiss={handleCloseDrawer}
-                data-cy="App-Mask-button"
-            />
-            <Navigation />
-            <ToastContainer />
-        </HeadProvider>
-    );
-};
-
-App.propTypes = {
-    markErrorHandled: func.isRequired,
-    renderError: shape({
-        stack: string
-    }),
-    unhandledErrors: array
-};
-
-App.globalCSS = globalCSS;
-
-export default App;

package/src/overwrites/venia-ui/lib/components/Breadcrumbs/breadcrumbs.js

@@ -1,189 +0,0 @@
-import React, { Fragment, useMemo } from 'react';
-import { FormattedMessage } from 'react-intl';
-import { string } from 'prop-types';
-import { Link } from 'react-router-dom';
-
-import { useBreadcrumbs } from '@magento/peregrine/lib/talons/Breadcrumbs/useBreadcrumbs';
-import resourceUrl from '@magento/peregrine/lib/util/makeUrl';
-import { useStyle } from '@magento/venia-ui/lib/classify';
-import Shimmer from '@riosst100/pwa-marketplace/src/overwrites/venia-ui/lib/components/Breadcrumbs/breadcrumbs.shimmer';
-import defaultClasses from '@riosst100/pwa-marketplace/src/overwrites/venia-ui/lib/components/Breadcrumbs/breadcrumbs.module.css';
-import { ArrowRight2 } from 'iconsax-react';
-import cn from 'classnames';
-import { getFiltersFromSearch } from '@magento/peregrine/lib/talons/FilterModal/helpers';
-import { useLocation } from 'react-router-dom';
-
-/**
- * Breadcrumbs! Generates a sorted display of category links.
- *
- * @param {String} props.categoryId the uid of the category for which to generate breadcrumbs
- * @param {String} props.currentProduct the name of the product we're currently on, if any.
- */
-const Breadcrumbs = props => {
-    const classes = useStyle(defaultClasses, props.classes);
-
-    const { categoryId, currentProduct, customPage, currentFilter } = props;
-
-    const talonProps = useBreadcrumbs({ categoryId });
-
-    const DELIMITER = <ArrowRight2 size={13} className='inline-flex text-gray-200' />
-
-    const {
-        currentCategory,
-        currentCategoryPath,
-        hasError,
-        isLoading,
-        normalizedData,
-        handleClick
-    } = talonProps;
-
-    // For all links generate a fragment like "/ Text"
-    const links = useMemo(() => {
-        return normalizedData.map(({ text, path }) => {
-            if (text == "dCollectible Card Games") {
-                return '';
-            }
-            
-            return (
-                <Fragment key={text}>
-                    <span className={classes.divider}>{DELIMITER}</span>
-                    <Link
-                        className={classes.link}
-                        to={resourceUrl(path)}
-                        onClick={handleClick}
-                    >
-                        {text}
-                    </Link>
-                </Fragment>
-            );
-        });
-    }, [classes.divider, classes.link, handleClick, normalizedData]);
-
-    if (isLoading) {
-        return <Shimmer />;
-    }
-
-    // Don't display anything but the empty, static height div when there's an error.
-    if (hasError) {
-        return (
-            <div
-                className={classes.root}
-                aria-live="polite"
-                aria-busy="false"
-            />
-        );
-    }
-
-    // console.log(currentFilter)
-
-    const filterBreadcrumbsElement = [];
-
-    const lastIndex = currentFilter ? currentFilter.length - 1 : 0;
-    // const filterpath = ;
-    
-    currentFilter && currentFilter.length && currentFilter.map((filter, index) => {
-        console.log(filter)
-        currentProduct ? (
-            filterBreadcrumbsElement.push(
-                <>
-                <span className={classes.divider}>{DELIMITER}</span>
-                <Link
-                    key={index}
-                    className={classes.link}
-                    to={resourceUrl('/'+currentCategoryPath)}
-                    onClick={handleClick}
-                >
-                    {filter.label}
-                </Link>
-                </>
-            )
-        ) : (
-            customPage ? (
-                filterBreadcrumbsElement.push(
-                    <>
-                    <span className={classes.divider}>{DELIMITER}</span>
-                    <Link
-                        key={index}
-                        className={classes.link}
-                        to={resourceUrl('/'+currentCategoryPath)}
-                        onClick={handleClick}
-                    >
-                        {filter.label}
-                    </Link>
-                    </>
-                )
-            ) : filterBreadcrumbsElement.push(
-                index == lastIndex ?
-                <span key={index}>
-                    <span className={classes.divider}>{DELIMITER}</span>
-                    <span className={cn(classes.currentCategory, 'text-blue-700 font-medium')}>{filter.label}</span>
-                </span> : <>
-                    <span className={classes.divider}>{DELIMITER}</span>
-                    <Link
-                        key={index}
-                        className={classes.link}
-                        to={resourceUrl('/'+currentCategoryPath+'?' + filter.code + '[filter]=' + filter.label + ',' + filter.option_id)}
-                        onClick={handleClick}
-                    >
-                        {filter.label}
-                    </Link>
-                    </>
-            )
-        );
-    });
-
-    // If we have a "currentProduct" it means we're on a PDP so we want the last
-    // category text to be a link. If we don't have a "currentProduct" we're on
-    // a category page so it should be regular text.
-    const currentCategoryLink = currentCategory == "dCollectible Card Games" ? '' : (customPage || currentProduct || currentFilter && currentFilter.length ? (
-        <>
-        <span className={classes.divider}>{DELIMITER}</span>
-        <Link
-            className={classes.link}
-            to={'/'+resourceUrl(currentCategoryPath)}
-            onClick={handleClick}
-        >
-            {currentCategory}
-        </Link>
-        </>
-    ) : (
-        <>
-        <span className={classes.divider}>{DELIMITER}</span>
-        <span className={cn(classes.currentCategory, 'text-blue-700 font-medium')}>{currentCategory}</span>
-        </>
-    ));
-
-    const currentProductNode = currentProduct ? (
-        <Fragment>
-            <span className={classes.divider}>{DELIMITER}</span>
-            <span className={classes.text}>{currentProduct}</span>
-        </Fragment>
-    ) : null;
-
-    const customPageNode = customPage ? (
-        <Fragment>
-            <span className={classes.divider}>{DELIMITER}</span>
-            <span className={classes.text}>{customPage}</span>
-        </Fragment>
-    ) : null;
-    
-    return (
-        <div className={classes.root} aria-live="polite" aria-busy="false">
-            <Link className={classes.link} to="/">
-                <FormattedMessage id={'global.home'} defaultMessage={'Home'} />
-            </Link>
-            {links}
-            {currentCategoryLink}
-            {filterBreadcrumbsElement}
-            {currentProductNode}
-            {customPageNode}
-        </div>
-    );
-};
-
-export default Breadcrumbs;
-
-Breadcrumbs.propTypes = {
-    categoryId: string.isRequired,
-    currentProduct: string
-};

package/src/overwrites/venia-ui/lib/components/Breadcrumbs/breadcrumbs.module.css

@@ -1,33 +0,0 @@
-.root {
-    /* Permanent height to prevent pop-in. */
-    /* Show ellipses when overflowing. */
-    composes: flex from global;
-    composes: items-center from global;
-    composes: gap-[6px] from global;
-    composes: my-[10px] from global;
-    padding-top: 20px;
-    margin-bottom: 40px;
-}
-
-.text {
-    composes: text-base from global;
-    composes: leading-[13px] from global;
-    composes: text-blue-700 from global;
-    composes: font-medium from global;
-}
-
-.divider {
-    composes: text-base from global;
-    composes: leading-[13px] from global;
-}
-
-.link {
-    composes: text-base from global;
-    composes: leading-[13px] from global;
-    composes: text-gray-200 from global;
-}
-
-.currentCategory {
-    composes: text-base from global;
-    composes: leading-[13px] from global;
-}

package/src/overwrites/venia-ui/lib/components/Breadcrumbs/breadcrumbs.shimmer.js

@@ -1,24 +0,0 @@
-import React from 'react';
-import { shape, string } from 'prop-types';
-import { useStyle } from '@magento/venia-ui/lib/classify';
-
-import Shimmer from '@magento/venia-ui/lib/components/Shimmer';
-import defaultClasses from '@magento/venia-ui/lib/components/Breadcrumbs/breadcrumbs.module.css';
-
-const BreadcrumbsShimmer = props => {
-    const classes = useStyle(defaultClasses, props.classes);
-
-    return (
-        <div className={classes.root} aria-live="polite" aria-busy="true">
-            <Shimmer width={5} />
-        </div>
-    );
-};
-
-BreadcrumbsShimmer.propTypes = {
-    classes: shape({
-        root: string
-    })
-};
-
-export default BreadcrumbsShimmer;

package/src/overwrites/venia-ui/lib/components/Breadcrumbs/index.js

@@ -1,2 +0,0 @@
-export { default } from '@riosst100/pwa-marketplace/src/overwrites/venia-ui/lib/components/Breadcrumbs/breadcrumbs';
-export { default as BreadcrumbShimmer } from '@riosst100/pwa-marketplace/src/overwrites/venia-ui/lib/components/Breadcrumbs/breadcrumbs.shimmer';

package/src/overwrites/venia-ui/lib/components/Button/button.js

@@ -1,100 +0,0 @@
-import React, { useRef } from 'react';
-import { useButton } from 'react-aria';
-import { oneOf, shape, string, bool } from 'prop-types';
-
-import { useStyle } from '@magento/venia-ui/lib/classify';
-import defaultClasses from './button.module.css';
-import cn from 'classnames';
-
-const getRootClassName = (priority, negative) =>
-    `root_${priority}Priority${negative ? 'Negative' : ''}`;
-
-/**
- * A component for buttons.
- *
- * @typedef Button
- * @kind functional component
- *
- * @param {props} props React component props
- *
- * @returns {React.Element} A React component that displays a single button.
- */
-const Button = props => {
-    const {
-        children,
-        classes: propClasses,
-        priority,
-        negative,
-        disabled,
-        onPress,
-        ...restProps
-    } = props;
-
-    const buttonRef = useRef();
-
-    const { buttonProps } = useButton(
-        {
-            isDisabled: disabled,
-            onPress,
-            ...restProps
-        },
-        buttonRef
-    );
-
-    const classes = useStyle(defaultClasses, propClasses);
-    const rootClassName = classes[getRootClassName(priority, negative)];
-
-    return (
-        <button
-            ref={buttonRef}
-            className={cn(rootClassName, classes.rootClass)}
-            {...buttonProps}
-            {...restProps}
-        >
-            <span className={cn(classes.content)}>{children}</span>
-        </button>
-    );
-};
-
-/**
- * Props for {@link Button}
- *
- * @typedef props
- *
- * @property {Object} classes An object containing the class names for the
- * Button component.
- * @property {string} classes.content classes for the button content
- * @property {string} classes.root classes for root container
- * @property {string} classes.root_highPriority classes for Button if
- * high priority.
- * @property {string} classes.root_lowPriority classes for Button if
- * low priority.
- * @property {string} classes.root_normalPriority classes for Button if
- * normal priority.
- * @property {string} priority the priority/importance of the Button
- * @property {string} type the type of the Button
- * @property {bool} negative whether the button should be displayed in red for a negative action
- * @property {bool} disabled is the button disabled
- */
-Button.propTypes = {
-    classes: shape({
-        content: string,
-        root: string,
-        root_highPriority: string,
-        root_lowPriority: string,
-        root_normalPriority: string
-    }),
-    priority: oneOf(['high', 'low', 'normal']).isRequired,
-    type: oneOf(['button', 'reset', 'submit']).isRequired,
-    negative: bool,
-    disabled: bool
-};
-
-Button.defaultProps = {
-    priority: 'normal',
-    type: 'button',
-    negative: false,
-    disabled: false
-};
-
-export default Button;