@riosst100/pwa-marketplace 2.5.7 → 2.5.9

package/src/components/FilterListContent/filterListPage.js

@@ -0,0 +1,414 @@
+import React, { Fragment, useEffect, useMemo, useState } from 'react';
+import ErrorView from '@magento/venia-ui/lib/components/ErrorView';
+import { StoreTitle, Meta } from '@magento/venia-ui/lib/components/Head';
+import { useSetsData } from '@riosst100/pwa-marketplace/src/talons/SetsData/useSetsData';
+import { Link } from 'react-router-dom';
+import resourceUrl from '@magento/peregrine/lib/util/makeUrl';
+import defaultClasses from '@riosst100/pwa-marketplace/src/components/FilterListContent/setsData.module.css';
+import { useStyle } from '@magento/venia-ui/lib/classify';
+import cn from 'classnames';
+import Divider from '@riosst100/pwa-marketplace/src/components/Divider';
+import { SetsDataShimmer } from '@riosst100/pwa-marketplace/src/components/SetsData';
+import CustomSortBy from '@riosst100/pwa-marketplace/src/components/CustomSortBy';
+import ArraySearchInput from '@riosst100/pwa-marketplace/src/components/ArraySearchInput';
+import { useCustomSort } from '@riosst100/pwa-marketplace/src/hooks/useCustomSort';
+import Breadcrumbs from '@magento/venia-ui/lib/components/Breadcrumbs';
+import { useLocation } from 'react-router-dom';
+import { getFiltersFromSearch } from '@magento/peregrine/lib/talons/FilterModal/helpers';
+
+const FilterListPage = props => {
+    const { categoryId } = props
+
+    const { location } = globalThis;
+
+    const { search } = useLocation();
+
+    const query = new URLSearchParams(location.search);
+
+    const [active, setActive] = useState('all');
+    const [activeTab, setActiveTab] = useState('all');
+    const [activeFilter, setActiveFilter] = useState('');
+    const [activeYear, setActiveYear] = useState('');
+    const [searchQuery, setSearchQuery] = useState('');
+    
+    const shopby = query.get('shopby') || null;
+    const setType = query.get('set_type') || null;
+
+    let defaultSort = {
+        sortText: 'All (A-Z)',
+        value: 'all'
+    };
+    
+    if (shopby == "release_year") {
+        defaultSort = {
+            sortText: 'All (By Year)',
+            value: 'date'
+        };
+    }
+    
+    // Sorting
+    const sortProps = useCustomSort({ sortFromSearch: false, defaultSort: defaultSort});
+    const [currentSort] = sortProps;
+    // const [sortBy, setSortBy] = useState({
+    //     sortText: 'All (A-Z)',
+    //     value: 'all'
+    // });
+
+    // let availableSortBy = [
+    //     {
+    //         'label': 'All (A-Z)',
+    //         'value': 'all'
+    //     },
+    //     {
+    //         'label': 'By Year',
+    //         'value': 'newest'
+    //     }
+    // ];
+
+    const classes = useStyle(defaultClasses);
+
+    const talonProps = useFilterListPage({ activeFilter, activeYear, searchQuery, setActive, currentSort, shopby, setType, categoryId, activeTab });
+
+    const { error, loading, setsData, categoryUrlSuffix, categoryUrlKey, productType, filteredSetsData, availableGroups, availableYears, category, attributeData, pageInfo } = talonProps;
+
+    if (loading && !setsData)
+        return <SetsDataShimmer />;
+    if (error && !setsData) return <ErrorView />;
+
+    if (!setsData && !loading && !error) {
+        return <SetsDataShimmer />;
+    }
+
+    const setsLengthArr = [];
+
+    const newSetsData = searchQuery || activeYear ? filteredSetsData : setsData;
+
+    // useEffect(() => {
+        if (setsData && setsData.length) {
+            setsData.map((setRelease, index) => {
+                const { group, sets } = setRelease;
+
+                setsLengthArr[group] = sets.length
+            })
+        }
+    // }, [setsData])
+
+    const splitToNChunks = (array, n) => {
+        let result = [];
+        for (let i = n; i > 0; i--) {
+            result.push(array.splice(0, Math.ceil(array.length / i)));
+        }
+        return result;
+    }
+
+    let allSetsTitle = "Sets";
+    let attributeCode = attributeData ? attributeData.attribute_code : '';
+    let byYearTitle = "By Year";
+    // if (shopby == "singles") {
+    //     attributeCode = "lego_set_name";
+    //     // allSetsTitle = "Singles";
+    //     byYearTitle = "By Year";
+    // }
+
+    let newfilterSearchArr = search ? search.split('&') : [];
+    newfilterSearchArr = newfilterSearchArr.filter(function(data) {
+        return !data.includes(attributeCode + '%5Bfilter%5D') && !data.includes('shopby');
+    });
+    
+    let filterSearch = newfilterSearchArr.join('&')
+
+    if (!filterSearch.includes('?')) {
+        filterSearch = '?'+filterSearch;
+    }
+
+    const setRelases = newSetsData && newSetsData.length && newSetsData.map((setRelease, index) => {
+        const { group, release_year, sets } = setRelease;
+
+        const setsResult = [];
+        
+        if (sets.length) {
+            sets.map((set, index) => {
+                const { products_count, set_name, option_id, release_year } = set;
+
+                const categoryUrl = resourceUrl(
+                    `/${category?.url_path}${categoryUrlSuffix || ''}${filterSearch || ''}&${attributeCode}[filter]=${set_name},${option_id}`
+                );
+
+                if (parseInt(products_count) > 0) {
+                    setsResult.push(<li key={index} className='list-none'>
+                        <Link to={categoryUrl} className="hover_bg-darkblue-900 hover_text-white w-full block text-[14px] py-[2px] px-0">
+                            {set_name} <span className='text-[12px]'>({products_count})</span>
+                        </Link>
+                    </li>)
+                } else {
+                    setsResult.push(<li key={index} className='list-none'>
+                    <span className="text-[#8f8f8f] w-full block text-[14px] py-[2px] px-0">
+                        {set_name} <span className='text-[12px]'>({products_count})</span>
+                    </span>
+                </li>)
+                }
+            })
+        }
+
+        let setsResultSplitted = [];
+        if (active && active == group || newSetsData.length == 1) {
+            setsResultSplitted = splitToNChunks(setsResult, 3);
+        }
+        
+        return (
+            <>
+                {active == "all" && activeYear && activeYear == release_year && newSetsData.length > 1 || active == "all" && !activeYear && newSetsData.length > 1 ?
+                <div className={cn('singles_group-wrapper mb-4 px-2 inline-block', classes.singlesGroupWrapper)}>
+                    {shopby == "secret_lair" ? <div className='singles_item_group_letter text-[14px] font-medium border-b border-gray-100 pb-1 mb-2'>
+                        {group}
+                    </div> : <div className='singles_item_group_letter text-xl font-medium border-b border-gray-100 pb-1 mb-2' >
+                        {group}
+                    </div>}
+                    <div className={cn('singles_item-list flex flex-col')}>{setsResult}</div>
+                </div> : ''}
+                {active == group || newSetsData.length == 1 ? setsResultSplitted && setsResultSplitted.length && setsResultSplitted.map((setsResult, index) =>
+                    <div key={index} className={cn('singles_group-wrapper mb-4 px-2 inline-block', classes.singlesGroupWrapper)}>
+                        {index == 0 ? shopby == "secret_lair" ? <div className='singles_item_group_letter text-[14px] font-medium border-b border-gray-100 pb-1 mb-2'>
+                        {group}
+                    </div> : <div className='singles_item_group_letter text-xl font-medium border-b border-gray-100 pb-1 mb-2' >
+                        {group}
+                    </div> : 
+                        (shopby == "secret_lair" ? <div className='singles_item_group_letter text-[14px] font-medium pb-1 mb-2' style={{"marginTop":"22px"}}></div> : <div className='singles_item_group_letter text-xl font-medium pb-1 mb-2' style={{"marginTop":"35px"}}></div>)}
+                        <div className={cn('singles_item-list flex flex-col')}>{setsResult}</div>
+                    </div>
+                )
+                 : ''}
+            </>
+        );
+    });
+
+    const handleActive = (val) => {
+        setActive(val);
+
+        setSearchQuery('')
+    }
+
+    const handleActiveTab = (val) => {
+        setActiveTab(val);
+        setActive('all');
+        setActiveFilter('');
+
+        setSearchQuery('')
+    }
+
+    const handleActiveYear = (val) => {
+        setActiveYear(val);
+        setActive('all');
+        setActiveFilter('');
+        setSearchQuery('')
+    }
+
+    const handleSearchQuery = (val) => {
+        setSearchQuery(val)
+        setActiveYear('');
+        setActive('all')
+    }
+
+    let alpha = ['#', 'A','B','C','D','E','F','G','H','I','J','K','L','M','N','O','P','Q','R','S','T','U','V','W','X','Y','Z'];
+
+    let title = pageInfo ? pageInfo.title : 'All S2ets';
+    if (activeTab == "year") {
+        title = "Sets | By Year";
+    }
+    
+    const availableFilters = [
+        'Theme',
+        'Sub-Theme',
+        'Interest',
+        'Age Level'
+    ];
+
+    const handleActiveFilter = (val) => {
+        setActiveFilter(val);
+
+        setActive('all');
+
+        setSearchQuery('')
+    }
+
+    const activeFilters = [];
+    
+    const allActiveFilters = getFiltersFromSearch(search);
+
+    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 == "bricks_categories" || key == "sc_sports_categories" || key == "card_game" || 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
+                        }
+                    )
+                }
+            })
+        });
+    }
+
+    return (
+        <Fragment>
+            <StoreTitle>{title}</StoreTitle>
+            <Breadcrumbs categoryId={categoryId} currentFilter={activeFilters} customPage={shopby == "singles" ? "Mini-Figures" : title} />
+            {shopby == "secret_lair" ? <>
+                <ul className={classes.nav}>
+                    {availableYears.map((group, index) => (
+                    <li key={index} className={classes.nav_item}>
+                        <button
+                            onClick={() => {
+                                handleActiveYear(group)
+                            }}
+                        >
+                            {activeYear == group ? <b>{group}</b> : group}
+                        </button>
+                    </li>
+                    ))}
+                    <li key={"all"} className={classes.nav_item}>
+                        <button
+                            onClick={() => {
+                                handleActiveYear('')
+                            }}
+                        >
+                            {!activeYear ? <b>All Year</b> : 'All Year'}
+                        </button>
+                    </li>
+                </ul>
+            </> : ''}
+            {shopby == "lego_set_name" && activeTab == "all" ? <>
+                <ul className={classes.nav}>
+                    {availableFilters.map((group, index) => (
+                    <li key={index} className={classes.nav_item}>
+                        <button
+                            onClick={() => {
+                                handleActiveFilter(group)
+                            }}
+                        >
+                            {activeFilter == group ? <b>{group}</b> : group}
+                        </button>
+                    </li>
+                    ))}
+                    <li key={"all"} className={classes.nav_item}>
+                        <button
+                            onClick={() => {
+                                handleActiveFilter('')
+                            }}
+                        >
+                            {!activeFilter ? <b>A-Z</b> : 'A-Z'}
+                        </button>
+                    </li>
+                </ul>
+            </> : ''}
+            {!pageInfo.hide_title && <h1 className='mx-auto relative block text-xl font-bold text-center pt-10 pb-4'>
+                {title}
+            </h1>}
+            {activeTab == "year" && availableGroups ? <ul className={classes.nav}>
+                {availableGroups.map((group, index) => (
+                <li key={index} className={classes.nav_item}>
+                    <button
+                        onClick={() => {
+                            handleActive(group)
+                        }}
+                    >
+                        {active == group ? <b>{group}</b> : group}
+                    </button>
+                </li>
+            ))}
+            <li key={'all'} className={classes.nav_item}>
+                <button
+                    onClick={() => {
+                        handleActive('all')
+                    }}
+                >
+                    {active == 'all' ? <b>All</b> : 'All'}
+                </button>
+            </li>
+            </ul> : ''}
+            {pageInfo.filter_group && <ul className={classes.nav}>
+                {availableGroups.map((group, index) => (
+                    <li key={index} className={classes.nav_item}>
+                        <button
+                            onClick={() => {
+                                handleActive(group)
+                            }}
+                        >
+                            {active == group ? <b>{group}</b> : group}
+                        </button>
+                    </li>
+                ))}
+                {availableGroups && availableGroups.length ? <li key={'all'} className={classes.nav_item}>
+                    <button
+                        onClick={() => {
+                            handleActive('all')
+                        }}
+                    >
+                        {active == 'all' ? <b>All</b> : 'All'}
+                    </button>
+                </li> : ''}
+            </ul>}
+            <div className='border border-gray-100 px-6'>
+                {setsData ? (
+                    <div
+                        className={classes.toolbar}
+                    >
+                        <div style={{"width":"35%"}}><ArraySearchInput active={active} searchQuery={searchQuery} placeholder="Search sets..." isOpen={true} setSearchQuery={handleSearchQuery} /></div>
+                        {/* <CustomSortBy sortProps={sortProps} availableSortMethods={availableSortBy} /> */}
+                    </div>
+                ) : ''}
+                {shopby != "secret_lair" && <section className='single_list-indexing-container relative m-auto pt-5'>
+                    {shopby != "secret_lair" && !activeFilter && activeTab != "year" && <ul className='flex gap-2 justify-center flex-wrap'>
+                        <li key={'all'}>
+                            <button
+                                className={cn(
+                                    'rounded-md border border-solid border-gray-100 p-2 min-w-[28px]',
+                                    'leading-4 font-medium text-base hover_bg-gray-50'
+                                )}
+                                onClick={() => {
+                                    handleActive('all')
+                                }}
+                            >
+                                {active == 'all' ? <b>All</b> : 'All'}
+                            </button>
+                        </li>
+                        {alpha.map((letter, index) => (
+                            <li key={index}>
+                                <button
+                                    className={cn(
+                                        'rounded-md border border-solid border-gray-100 p-2 min-w-[28px]',
+                                        'leading-4 font-medium text-base ',
+                                        setsLengthArr[letter] > 0 ? 'hover_bg-gray-50' : 'bg-gray-100 text-gray-400',
+                                    )}
+                                    onClick={() => {
+                                        handleActive(letter)
+                                    }}
+                                    disabled={setsLengthArr[letter] > 0 ? false : true}
+                                >
+                                    {active == letter ? <b>{letter}</b> : letter}
+                                </button>
+                            </li>
+                        ))}
+                    </ul>}
+                </section>}
+                <Divider className="mb-5 px-4 mt-5" />
+                <section className='singles-container'>
+                    <div className={cn('singles-wrapper block -mx-4', classes.singlesWrapper)}>
+                        {newSetsData && newSetsData.length ? setRelases : (searchQuery ? <div className='singles_group-wrapper mb-4 px-2 inline-block w-full'>No sets found for <b>{searchQuery}</b> search query.</div> : <div className='singles_group-wrapper mb-4 px-2 inline-block w-full'>No sets found.</div>)}
+                    </div>
+                </section>
+            </div>
+        </Fragment>
+    );
+}
+
+export default FilterListPage;

package/src/components/FilterListContent/index.js

@@ -0,0 +1 @@
+export { default } from '@riosst100/pwa-marketplace/src/components/FilterListContent/filterListPage';

package/src/components/FilterListPage/index.js

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

package/src/components/Seller/seller.js

@@ -9,18 +9,12 @@ import SellerDetail from '@riosst100/pwa-marketplace/src/components/SellerDetail
 const Seller = props => {
     const { categoryUrlKey } = props;
 
-    console.log('categoryUrlKey+'+categoryUrlKey)
-    console.log(props)
-
     const talonProps = useSeller({
         mapSeller
     });
 
     const { error, loading, seller } = talonProps;
 
-    console.log('---seller')
-    console.log(seller)
-
     if (loading && !seller)
         return '';
     // return <SellerShimmer />;

package/src/components/SetsData/setsData.js

@@ -402,7 +402,7 @@ const SetsData = props => {
                 </section>}
                 <Divider className="mb-5 px-4 mt-5" />
                 <section className='singles-container'>
-                    <div className={cn('singles-wrapper block -mx-4', classes.singlesWrapper)}>
+                    <div className={cn('singles-wrapper block', classes.singlesWrapper)}>
                         {newSetsData && newSetsData.length ? setRelases : (searchQuery ? <div className='singles_group-wrapper mb-4 px-2 inline-block w-full'>No sets found for <b>{searchQuery}</b> search query.</div> : <div className='singles_group-wrapper mb-4 px-2 inline-block w-full'>No sets found.</div>)}
                     </div>
                 </section>

package/src/overwrites/peregrine/lib/store/actions/cart/asyncActions.js

@@ -21,20 +21,10 @@ export const createSellerCart = payload =>
                 }
             });
 
-            console.log('datadatadatadata')
-            console.log(data)
-
-            console.log('data.initCheckoutSplitCart')
-            console.log(data.initCheckoutSplitCart)
-
-            console.log('data.initCheckoutSplitCart.quote_id')
-            console.log(data.initCheckoutSplitCart.quote_id)
-
             let receivePayload;
 
             if (errors) {
                 receivePayload = new Error(errors);
-                console.log(errors)
             } else {
                 receivePayload = data.initCheckoutSplitCart.quote_id;
                 // write to storage in the background
@@ -385,16 +375,9 @@ export const getCartDetails = payload => {
         const { isSignedIn } = user;
 
         const isCheckoutActive = await retrieveCheckoutState();
-        console.log('isCheckoutActive')
-        console.log(isCheckoutActive)
-
         const isSplitCartActive = await retrieveSellerCartId();
-        console.log('isSplitCartActive')
-        console.log(isSplitCartActive)
 
         if (cartId && isSplitCartActive && !isCheckoutActive) {
-            console.log('JALANIN = removeCart')
-
             await dispatch(removeCart());
 
             // Clear cart data from Apollo cache
@@ -402,7 +385,6 @@ export const getCartDetails = payload => {
 
             // Create a new cart
             try {
-                console.log('JALANIN RESET SPLIT CART')
                 await dispatch(
                     resetSplitCart({
                         removeSplitCart
@@ -411,8 +393,6 @@ export const getCartDetails = payload => {
 
                 await clearSellerCartId();
 
-                console.log('JALANIN CREATE CART')
-
                 await dispatch(
                     createCart({
                         fetchCartId
@@ -420,7 +400,6 @@ export const getCartDetails = payload => {
                 );
             } catch (error) {
                 alert(error);
-                console.log(error);
                 // If creating a cart fails, all is not lost. Return so that the
                 // user can continue to at least browse the site.
                 return;

package/src/overwrites/peregrine/lib/talons/FilterSidebar/useFilterSidebar.js

@@ -47,18 +47,6 @@ export const useFilterSidebar = props => {
         nextFetchPolicy: 'cache-first'
     });
 
-    console.log('subFilterItemsCalled')
-    console.log(subFilterItemsCalled)
-
-    console.log('subFilterItemsLoading')
-    console.log(subFilterItemsLoading)
-
-    console.log('subFilterItemsError')
-    console.log(subFilterItemsError)
-
-    console.log('subFilterItems')
-    console.log(subFilterItems)
-
     const attributeCodes = useMemo(
         () => filters.map(({ attribute_code }) => attribute_code),
         [filters]

package/src/overwrites/peregrine/lib/talons/RootComponents/Category/categoryContent.gql.js

@@ -12,6 +12,7 @@ export const GET_PRODUCT_FILTERS_BY_CATEGORY = gql`
                 options {
                     label
                     value
+                    count
                 }
                 position
             }
@@ -83,6 +84,7 @@ export const GET_STORE_CONFIG_DATA = gql`
     query GetStoreConfigForBreadcrumbs {
         # eslint-disable-next-line @graphql-eslint/require-id-when-available
         storeConfig {
+            category_url_suffix
             store_code
             custommarketplace_plp_filters_virtualcategory
         }

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

@@ -19,6 +19,7 @@ import NonSportCardsSets from '@riosst100/pwa-marketplace/src/components/NonSpor
 import LegoSets from '@riosst100/pwa-marketplace/src/components/LegoSets/legoSets';
 import TrainsSets from '@riosst100/pwa-marketplace/src/components/TrainsSets/trainsSets';
 import SetsData from '@riosst100/pwa-marketplace/src/components/SetsData/setsData';
+import FilterContent from '@riosst100/pwa-marketplace/src/components/FilterContent/filterContent';
 
 const MESSAGES = new Map().set(
     'NOT_FOUND',
@@ -39,6 +40,7 @@ const Category = props => {
 
     const query = new URLSearchParams(location.search);
     const shopby = query.get('shopby') || null;
+    const filterby = query.get('filterby') || null;
     const showSubcategory = query.get('show_subcategory') || null;
 
     const talonProps = useCategory({
@@ -91,7 +93,18 @@ const Category = props => {
                 categoryId={uid}
                 isLoading={loading} />
             ) : (
-                allowedShopby.includes(shopby) ? <ShopBy
+                filterby ? (
+                    <FilterContent
+                        categoryId={uid}
+                        classes={classes}
+                        data={categoryData}
+                        filterby={filterby}
+                        isLoading={loading}
+                        pageControl={pageControl}
+                        sortProps={sortProps}
+                        pageSize={pageSize} 
+                    />
+                ) : allowedShopby.includes(shopby) ? <ShopBy
                 categoryId={uid}
                 shopby={shopby}
                 isLoading={loading} /> : shopby == "release_year" || shopby == "secret_lair" || shopby == "expansion_sets" || shopby == "sets" || shopby == "release" ? <SetsData

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

@@ -317,10 +317,9 @@ const CategoryContent = props => {
                 </div>
                 {/* {activeFilters.size <= 0 && category && category.custom_landing_page ? ( */}
                     <>
-                        {currentFilter && <AlphaFilter isSingles={isSingles} items={items} handleActiveLetter={handleActiveLetter} activeLetter={activeLetter} />}
+                        {/* {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" && category?.name != "Collectible Card Games" ? <SubCategory parent={parent} children={children} /> : ''}
-                        
                     </>
                 {/* ) : ( */}
                     <>
@@ -341,10 +340,7 @@ const CategoryContent = props => {
                                     {maybeSortContainer}
                                 </div>
                                 <div className={cn(classes.heading)}>
-                                    <div
-                                        data-cy="CategoryContent-categoryInfo"
-                                        className={classes.categoryInfo}
-                                    >
+                                    <div data-cy="CategoryContent-categoryInfo" className={classes.categoryInfo}>
                                         {categoryResultsHeading}
                                     </div>
                                 </div>

package/src/overwrites/venia-ui/lib/components/CartPage/ProductListing/productListing.js

@@ -58,9 +58,6 @@ const ProductListing = props => {
         );
     }
 
-    console.log('items')
-    console.log(items)
-
     // Grouping berdasarkan seller_id dengan data seller di atas
     const groupedItems = items.reduce((acc, item) => {
         if (!item.seller) {
@@ -83,16 +80,10 @@ const ProductListing = props => {
         acc[seller_id].items.push(item);
         return acc;
     }, {});
-
-    console.log('groupedItems')
-    console.log(groupedItems)
     
     // Ubah hasil ke dalam array
     const itemsBySeller = Object.values(groupedItems);
 
-    console.log('itemsBySeller != []')
-    console.log(itemsBySeller)
-
     if (itemsBySeller.length) {
         const productBySellerComponents = itemsBySeller.map((sellerItems, index) => (
             <ProductListingBySeller 

package/src/overwrites/venia-ui/lib/components/CheckoutPage/PaymentInformation/paymentMethods.js

@@ -37,12 +37,6 @@ const PaymentMethods = props => {
         return null;
     }
 
-    console.log('payments')
-    console.log(payments)
-
-    console.log('availablePaymentMethods')
-    console.log(availablePaymentMethods)
-
     const radios = availablePaymentMethods
         .map(({ code, title }) => {
             // If we don't have an implementation for a method type, ignore it.
@@ -80,9 +74,6 @@ const PaymentMethods = props => {
         })
         .filter(paymentMethod => !!paymentMethod);
 
-    console.log('radios != [] harusny')
-    console.log(radios)
-
     const noPaymentMethodMessage = !radios.length ? (
         <div className={classes.payment_errors}>
             <span>