@riosst100/pwa-marketplace 2.0.7 → 2.0.9

package/src/overwrites/venia-ui/lib/RootComponents/Category/category.module.css

@@ -1,78 +0,0 @@
-.root {
-    composes: p-0 from global;
-}
-
-.title {
-    composes: font-medium from global;
-    composes: text-[24px] from global;
-    composes: leading-[24px] from global;
-    padding: 20px 0px 20px;
-}
-
-.pagination {
-    composes: relative from global;
-    composes: bottom-0 from global;
-}
-
-.placeholder {
-    composes: h-screen from global;
-}
-
-.categoryTitle {
-    composes: font-medium from global;
-    composes: text-[20px] from global;
-}
-
-.heading {
-    composes: flex from global;
-    composes: flex-wrap from global;
-    composes: justify-center from global;
-    composes: pb-2xs from global;
-
-    composes: lg_flex-nowrap from global;
-    composes: lg_items-center from global;
-    composes: lg_justify-between from global;
-    composes: lg_pb-[30px] from global;
-    composes: lg_w-full from global;
-}
-
-.categoryContent {
-    composes: lg_flex-grow from global;
-}
-
-.categoryInfo {
-    flex-basis: 100%;
-    composes: leading-tight from global;
-    composes: max-w-[75vw] from global;
-    composes: mx-0 from global;
-    composes: my-xs from global;
-    composes: text-center from global;
-    composes: text-base from global;
-    composes: lg_m-0 from global;
-    composes: lg_text-left from global;
-    composes: py-4 from global;
-}
-
-.headerButtons {
-    composes: flex from global;
-    composes: justify-center from global;
-    composes: pb-sm from global;
-    flex-basis: 100%;
-
-    composes: lg_justify-end from global;
-    composes: lg_pb-0 from global;
-}
-
-.contentWrapper {
-    composes: w-full from global;
-    composes: lg_mt-[50px] from global;
-    composes: lg_flex from global;
-    composes: gap-[30px] from global;
-}
-
-.sidebar {
-    composes: hidden from global;
-
-    composes: lg_flex from global;
-    composes: lg_self-start from global;
-}

package/src/overwrites/venia-ui/lib/RootComponents/Category/categoryContent.js

@@ -1,383 +0,0 @@
-import React, { useEffect, Fragment, Suspense, useMemo, useRef, useState } from 'react';
-import { FormattedMessage } from 'react-intl';
-import { array, number, shape, string } from 'prop-types';
-
-import { useIsInViewport } from '@magento/peregrine/lib/hooks/useIsInViewport';
-import { useCategoryContent } from '@magento/peregrine/lib/talons/RootComponents/Category';
-
-import { useStyle } from '@magento/venia-ui/lib/classify';
-import Breadcrumbs from '../../components/Breadcrumbs';
-import FilterModalOpenButton, {
-    FilterModalOpenButtonShimmer
-} from '@magento/venia-ui/lib/components/FilterModalOpenButton';
-import { FilterSidebarShimmer } from '@magento/venia-ui/lib/components/FilterSidebar';
-import Gallery, { GalleryShimmer } from '@magento/venia-ui/lib/components/Gallery';
-import { StoreTitle } from '@magento/venia-ui/lib/components/Head';
-import Pagination from '../../components/Pagination';
-import ProductSort, { ProductSortShimmer } from '../../components/ProductSort';
-import RichContent from '@magento/venia-ui/lib/components/RichContent';
-import Shimmer from '@magento/venia-ui/lib/components/Shimmer';
-import SortedByContainer, {
-    SortedByContainerShimmer
-} from '@magento/venia-ui/lib/components/SortedByContainer';
-import defaultClasses from './category.module.css';
-import NoProductsFound from './NoProductsFound';
-import cn from 'classnames';
-import ProductListTab, { ProductListTabShimmer } from '@riosst100/pwa-marketplace/src/components/ProductListTab';
-import SubCategory from '@riosst100/pwa-marketplace/src/components/SubCategory/subCategory';
-import AttributesBlock from '@riosst100/pwa-marketplace/src/components/AttributesBlock/attributesBlock';
-
-import BrandSlider from '@riosst100/pwa-marketplace/src/components/BrandSlider';
-import CollectibleGameSets from '@riosst100/pwa-marketplace/src/components/CollectibleGameSets/collectibleGameSets';
-import { useLocation, useHistory } from 'react-router-dom';
-import { getFiltersFromSearch } from '@magento/peregrine/lib/talons/FilterModal/helpers';
-import CustomSubCategory from '@riosst100/pwa-marketplace/src/components/SubCategory/customSubCategory';
-import AlphaFilter from '@riosst100/pwa-marketplace/src/components/AlphaFilter';
-
-const FilterModal = React.lazy(() => import('@magento/venia-ui/lib/components/FilterModal'));
-const FilterSidebar = React.lazy(() =>
-    import('@magento/venia-ui/lib/components/FilterSidebar')
-);
-const FilterTop = React.lazy(() =>
-    import('@riosst100/pwa-marketplace/src/components/FilterTop')
-);
-
-const CategoryContent = props => {
-    const {
-        categoryId,
-        data,
-        shopby,
-        isLoading,
-        pageControl,
-        sortProps,
-        pageSize,
-        showSubcategory
-    } = props;
-    const [currentSort] = sortProps;
-
-    const history = useHistory();
-
-    const talonProps = useCategoryContent({
-        categoryId,
-        data,
-        pageSize
-    });
-
-    const {
-        availableSortMethods,
-        categoryName,
-        categoryDescription,
-        filters,
-        items,
-        children,
-        parent,
-        totalCount,
-        totalPagesFromData,
-        attributesBlock,
-        category,
-        virtualCategoryFilters
-    } = talonProps;
-
-    useEffect(() => {
-        if (category) {
-            const urlKey = category.url_key;
-            if (urlKey == "collectible-game") {
-                history.replace('/games/collectible-game/magic-the-gathering.html')
-            }
-
-            if (urlKey == "sport-cards") {
-                history.replace('/cards/sport-cards/baseball.html')
-            }
-
-            if (urlKey == "non-sports-cards") {
-                history.replace('/cards/non-sports-cards/comics.html')
-            }
-
-            if (urlKey == "lego") {
-                history.replace('/lego/lego-sets.html')
-            }
-        }
-    }, [category]);
-
-    const [activeLetter, setActiveLetter] = useState('all')
-    const [activeTab, setActiveTab] = useState('all');
-
-    const handleActiveLetter = (val) => {
-        setActiveLetter(val);
-    }
-
-    const galleryItems = [];
-
-    useMemo(() => {
-            items && items.map((item, index) => {
-                if (item) {
-                    let firstLetter = null;
-
-                    const { custom_attributes } = item;
-                    if (custom_attributes) {
-                        let cardName = '';
-                        custom_attributes.some((attribute, index) => {
-                            const { attribute_metadata, entered_attribute_value, selected_attribute_options } = attribute
-                            if (attribute_metadata.code == "card_name") {
-                                cardName = selected_attribute_options.attribute_option[0].label;
-
-                                return true;
-                            }
-
-                            return false;
-                        });
-
-                        if (cardName) {
-                            firstLetter = cardName.charAt(0).toUpperCase();
-                        }
-                    }
-
-                    if (activeLetter == "all" || activeLetter != "all" && firstLetter == activeLetter) {
-                        return galleryItems.push(item);
-                    }
-                }
-            }),
-        [items, activeLetter, activeTab]
-    });
-
-    const sidebarRef = useRef(null);
-    const classes = useStyle(defaultClasses, props.classes);
-    const shouldRenderSidebarContent = useIsInViewport({
-        elementRef: sidebarRef
-    });
-
-    const shouldShowFilterButtons = filters && filters.length;
-    const shouldShowFilterShimmer = filters === null;
-
-    // If there are no products we can hide the sort button.
-    const shouldShowSortButtons = totalPagesFromData && availableSortMethods;
-    const shouldShowSortShimmer = !totalPagesFromData && isLoading;
-
-    const maybeFilterButtons = shouldShowFilterButtons ? (
-        <FilterModalOpenButton filters={filters} />
-    ) : shouldShowFilterShimmer ? (
-        <FilterModalOpenButtonShimmer />
-    ) : null;
-
-    const filtersModal = shouldShowFilterButtons ? (
-        <FilterModal filters={filters} />
-    ) : null;
-
-    const sidebar = shouldShowFilterButtons ? (
-        <FilterSidebar hideFilters={category && category.hide_filters ? true : false} children={children} filters={filters} allowedFilters={category ? category.allowed_filters : []} />
-    ) : shouldShowFilterShimmer ? (
-        <FilterSidebarShimmer />
-    ) : null;
-
-    const maybeSortButton = shouldShowSortButtons ? (
-        <ProductSort
-            sortProps={sortProps}
-            availableSortMethods={availableSortMethods}
-        />
-    ) : shouldShowSortShimmer ? (
-        <ProductSortShimmer />
-    ) : null;
-
-    const shouldShowProductListTab = totalPagesFromData;
-    const shouldShowProductListTabShimmer = !totalPagesFromData && isLoading;
-
-    const maybeSortContainer = shouldShowSortButtons ? (
-        <SortedByContainer currentSort={currentSort} />
-    ) : shouldShowSortShimmer ? (
-        <SortedByContainerShimmer />
-    ) : null;
-
-    const maybeProductsTabContainer = !isLoading ? (
-        <ProductListTab filters={filters} activeTab={activeTab} setActiveTab={setActiveTab} />
-    ) : shouldShowProductListTabShimmer ? (
-        <ProductListTabShimmer />
-    ) : null;
-
-    const categoryResultsHeading =
-    galleryItems.length > 0 ? (
-            <FormattedMessage
-                id={'categoryContent.resultCount'}
-                values={{
-                    count: galleryItems.length
-                }}
-                defaultMessage={'{count} Results'}
-            />
-        ) : isLoading ? (
-            <Shimmer width={5} />
-        ) : null;
-
-    const categoryDescriptionElement = categoryDescription ? (
-        <RichContent html={categoryDescription} />
-    ) : null;
-
-    const content = useMemo(() => {
-        if (!totalPagesFromData && !isLoading) {
-            return <NoProductsFound categoryId={categoryId} />;
-        }
-
-        const gallery = totalPagesFromData ? (
-            <Gallery items={galleryItems} activeLetter={activeLetter} />
-        ) : (
-            <GalleryShimmer items={galleryItems} />
-        );
-
-        const pagination = totalPagesFromData ? (
-            <Pagination pageControl={pageControl} />
-        ) : null;
-
-        return (
-            <Fragment>
-                <section className={classes.gallery}>{gallery}</section>
-                <div className={classes.pagination}>{pagination}</div>
-            </Fragment>
-        );
-    }, [
-        categoryId,
-        classes.gallery,
-        classes.pagination,
-        isLoading,
-        items,
-        pageControl,
-        totalPagesFromData,
-        activeLetter
-    ]);
-
-    const categoryTitle = categoryName ? categoryName : <Shimmer width={5} />;
-
-    const { search } = useLocation();
-    const allActiveFilters = getFiltersFromSearch(search);
-
-    const activeFilters = [];
-
-    let isSingles = false;
-
-    // console.log(allActiveFilters)
-
-    // console.log(virtualCategoryFilters)
-    const urlKey = category?.url_key;
-
-    if (allActiveFilters && allActiveFilters.size > 0) {
-        allActiveFilters.forEach((value, key) => {
-            value.forEach((value) => {
-                const filterArr = value.split(',');
-                
-                const label = filterArr[0];
-                const optionId = filterArr[1];
-                if (label == "Singles") {
-                    isSingles = true;
-                }
-                if (key == "product_line" && urlKey == "brands" || key == "product_line" && urlKey == "franchise" || key == "franchise" && urlKey == "brands" || key == "franchise" && urlKey == "franchise" || key == "brands" && urlKey == "franchise" || key == "brands" && urlKey == "brands" || virtualCategoryFilters && virtualCategoryFilters.includes(key)) {
-                    activeFilters.push(
-                        {
-                            'label': label,
-                            'code': key,
-                            'option_id': optionId
-                        }
-                    )
-                }
-            })
-        });
-    }
-
-    const currentFilter = activeFilters && activeFilters.length ? activeFilters[activeFilters.length - 1].label : '';
-
-    // console.log(activeFilters.length)
-    // console.log(activeFilters.map(u => u.label).join(' - '))
-
-    let title = activeFilters && activeFilters.length ? (
-        activeFilters.length > 1 ? 
-            activeFilters[activeFilters.length - 1].label
-         : currentFilter
-    ) : categoryName;
-
-    if (shopby == "gauge") {
-        title = "Trains By Gauge";
-    }
-
-    return (
-        <Fragment>
-            <Breadcrumbs categoryId={categoryId} customPage={shopby == "gauge" ? title : ''} currentFilter={activeFilters} />
-            <StoreTitle>{title}</StoreTitle>
-            <article className={classes.root} data-cy="CategoryContent-root">
-                <div className={classes.categoryHeader}>
-                    <h1 aria-live="polite" className={classes.title}>
-                        <span
-                            className={classes.categoryTitle}
-                            data-cy="CategoryContent-categoryTitle"
-                        >
-                            {title}
-                        </span>
-                    </h1>
-                    {categoryDescriptionElement}
-                </div>
-                {/* {activeFilters.size <= 0 && category && category.custom_landing_page ? ( */}
-                    <>
-                        {currentFilter && <AlphaFilter isSingles={isSingles} items={items} handleActiveLetter={handleActiveLetter} activeLetter={activeLetter} />}
-                        {!currentFilter && <CustomSubCategory categoryName={category ? category.name : null} customSubCategory={category ? category.custom_subcategory : null} />}
-                        {shopby != "gauge" ? <SubCategory parent={parent} children={children} /> : ''}
-                        
-                    </>
-                {/* ) : ( */}
-                    <>
-                        {/* <SubCategory filters={filters} children={children} /> */}
-                        <FilterTop shopby={shopby} filters={filters} category={category} children={children} allowedFilters={category ? category.allowed_filters : []} />
-                        {/* <AttributesBlock category={category} attributesBlock={attributesBlock} /> */}
-                        {/* <section className='category_brand-slider my-5'>
-                            <BrandSlider />
-                        </section> */}
-                        <div className={classes.contentWrapper}>
-                            <div ref={sidebarRef} className={classes.sidebar}>
-                                <Suspense fallback={<FilterSidebarShimmer />}>
-                                    {shouldRenderSidebarContent && category ? sidebar : null}
-                                </Suspense>
-                            </div>
-                            <div className={classes.categoryContent}>
-                                <div className={cn(classes.heading)}>
-                                    {maybeProductsTabContainer}
-                                    <div className={classes.headerButtons}>
-                                        {maybeFilterButtons}
-                                        {maybeSortButton}
-                                    </div>
-                                    {maybeSortContainer}
-                                </div>
-                                <div className={cn(classes.heading)}>
-                                    <div
-                                        data-cy="CategoryContent-categoryInfo"
-                                        className={classes.categoryInfo}
-                                    >
-                                        {categoryResultsHeading}
-                                    </div>
-                                </div>
-                                {content}
-                                <Suspense fallback={null}>{filtersModal}</Suspense>
-                            </div>
-                        </div>
-                    </>
-                {/* )} */}
-            </article>
-        </Fragment>
-    );
-};
-
-export default CategoryContent;
-
-CategoryContent.propTypes = {
-    classes: shape({
-        gallery: string,
-        pagination: string,
-        root: string,
-        categoryHeader: string,
-        title: string,
-        categoryTitle: string,
-        sidebar: string,
-        categoryContent: string,
-        heading: string,
-        categoryInfo: string,
-        headerButtons: string
-    }),
-    // sortProps contains the following structure:
-    // [{sortDirection: string, sortAttribute: string, sortText: string},
-    // React.Dispatch<React.SetStateAction<{sortDirection: string, sortAttribute: string, sortText: string}]
-    sortProps: array,
-    pageSize: number
-};

package/src/overwrites/venia-ui/lib/RootComponents/Category/categoryContent.shimmer.js

@@ -1,74 +0,0 @@
-import React, { Fragment } from 'react';
-import { shape, string } from 'prop-types';
-
-import { useStyle } from '@magento/venia-ui/lib/classify';
-import BreadcrumbsShimmer from '../../components/Breadcrumbs/breadcrumbs.shimmer';
-import { FilterModalOpenButtonShimmer } from '@magento/venia-ui/lib/components/FilterModalOpenButton';
-import { FilterSidebarShimmer } from '@magento/venia-ui/lib/components/FilterSidebar';
-import { GalleryShimmer } from '@magento/venia-ui/lib/components/Gallery';
-import { ProductSortShimmer } from '../../components/ProductSort';
-import Shimmer from '@magento/venia-ui/lib/components/Shimmer';
-import { SortedByContainerShimmer } from '@magento/venia-ui/lib/components/SortedByContainer';
-import defaultClasses from './category.module.css';
-
-const CategoryContentShimmer = props => {
-    const classes = useStyle(defaultClasses, props.classes);
-
-    const placeholderItems = Array.from({ length: 6 }).fill(null);
-
-    return (
-        <Fragment>
-            <BreadcrumbsShimmer />
-            <article className={classes.root}>
-                <div className={classes.categoryHeader}>
-                    <h1 className={classes.title}>
-                        <div className={classes.categoryTitle}>
-                            <Shimmer width={5} />
-                        </div>
-                    </h1>
-                </div>
-                <div className={classes.contentWrapper}>
-                    <div className={classes.sidebar}>
-                        <FilterSidebarShimmer />
-                    </div>
-                    <div className={classes.categoryContent}>
-                        <div className={classes.heading}>
-                            <div className={classes.categoryInfo}>
-                                <Shimmer width={5} />
-                            </div>
-                            <div className={classes.headerButtons}>
-                                <FilterModalOpenButtonShimmer />
-                                <ProductSortShimmer />
-                            </div>
-                            <SortedByContainerShimmer />
-                        </div>
-                        <section className={classes.gallery}>
-                            <GalleryShimmer items={placeholderItems} />
-                        </section>
-                    </div>
-                </div>
-            </article>
-        </Fragment>
-    );
-};
-
-CategoryContentShimmer.defaultProps = {
-    classes: {}
-};
-
-CategoryContentShimmer.propTypes = {
-    classes: shape({
-        root: string,
-        categoryHeader: string,
-        title: string,
-        categoryTitle: string,
-        sidebar: string,
-        categoryContent: string,
-        heading: string,
-        categoryInfo: string,
-        headerButtons: string,
-        gallery: string
-    })
-};
-
-export default CategoryContentShimmer;

package/src/overwrites/venia-ui/lib/RootComponents/Category/images/index.js

@@ -1,12 +0,0 @@
-export { default as image001 } from './001.jpg';
-export { default as image002 } from './002.jpg';
-export { default as image003 } from './003.jpg';
-export { default as image004 } from './004.jpg';
-export { default as image005 } from './005.jpg';
-export { default as image006 } from './006.jpg';
-export { default as image007 } from './007.jpg';
-export { default as image008 } from './008.jpg';
-export { default as image009 } from './009.jpg';
-export { default as image010 } from './010.jpg';
-export { default as image011 } from './011.jpg';
-export { default as image012 } from './012.jpg';

package/src/overwrites/venia-ui/lib/RootComponents/Category/index.js

@@ -1,6 +0,0 @@
-/**
- * @RootComponent
- * description = 'Basic Category Page'
- * pageTypes = CATEGORY
- */
-export { default } from './category';

package/src/overwrites/venia-ui/lib/components/AccountInformationPage/accountInformationPage.gql.js

@@ -1,48 +0,0 @@
-import { gql } from '@apollo/client';
-import { AccountInformationPageFragment } from './accountInformationPageFragment.gql';
-
-export const SET_CUSTOMER_INFORMATION = gql`
-    mutation SetCustomerInformation($customerInput: CustomerInput!) {
-        updateCustomer(input: $customerInput) {
-            # eslint-disable-next-line @graphql-eslint/require-id-when-available
-            customer {
-                ...AccountInformationPageFragment
-            }
-        }
-    }
-    ${AccountInformationPageFragment}
-`;
-
-export const CHANGE_CUSTOMER_PASSWORD = gql`
-    mutation ChangeCustomerPassword(
-        $currentPassword: String!
-        $newPassword: String!
-    ) {
-        changeCustomerPassword(
-            currentPassword: $currentPassword
-            newPassword: $newPassword # eslint-disable-next-line @graphql-eslint/require-id-when-available
-        ) {
-            email
-        }
-    }
-`;
-
-export const GET_CUSTOMER_INFORMATION = gql`
-    query GetCustomerInformation {
-        # eslint-disable-next-line @graphql-eslint/require-id-when-available
-        customer {
-            ...AccountInformationPageFragment
-        }
-    }
-    ${AccountInformationPageFragment}
-`;
-
-export default {
-    mutations: {
-        setCustomerInformationMutation: SET_CUSTOMER_INFORMATION,
-        changeCustomerPasswordMutation: CHANGE_CUSTOMER_PASSWORD
-    },
-    queries: {
-        getCustomerInformationQuery: GET_CUSTOMER_INFORMATION
-    }
-};