@riosst100/pwa-marketplace 1.8.0 → 1.8.1

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@riosst100/pwa-marketplace",
   "author": "riosst100@gmail.com",
-  "version": "1.8.0",
+  "version": "1.8.1",
   "main": "src/index.js",
   "pwa-studio": {
     "targets": {

package/src/components/LegoSets/legoSets.js

@@ -20,20 +20,14 @@ const LegoSets = props => {
     const { location } = globalThis;
 
     const query = new URLSearchParams(location.search);
-    const activeParam = query.get('active_tab') || null;
 
     const [active, setActive] = useState('all');
     const [activeTab, setActiveTab] = useState('all');
-    const [activeFilter, setActiveFilter] = useState('Major Baseball League');
 
     const [searchQuery, setSearchQuery] = useState('');
-
-    let availableLeagues = [];
-    let availableBrands = [];
     
     const shopby = query.get('shopby') || null;
     const setType = query.get('set_type') || null;
-    const brandsFilter = query.get('sc_brands[filter]') || null;
 
     let defaultSort = {
         sortText: 'All (A-Z)',
@@ -57,25 +51,25 @@ const LegoSets = props => {
     // 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 [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 = useLegoSets({ searchQuery, setActive, currentSort, shopby, setType, categoryId, activeTab, activeFilter });
+    const talonProps = useLegoSets({ searchQuery, setActive, currentSort, shopby, setType, categoryId, activeTab });
 
     const { error, loading, legoSets, categoryUrlSuffix, categoryUrlKey, productType, filteredLegoSets, availableGroups, category } = talonProps;
 
@@ -96,48 +90,11 @@ const LegoSets = props => {
             legoSets.map((setRelease, index) => {
                 const { group, sets } = setRelease;
 
-                // if (sets.length) {
-                //     sets.map((set, index) => {
-                //         // console.log(set)
-                //         if (set.sc_league) {
-                //             if (!availableLeagues.includes(set.sc_league)) {
-                //                 availableLeagues.push(set.sc_league)
-                //             }
-                //         }
-                //     })
-                // }
-
                 setsLengthArr[group] = sets.length
             })
         }
     // }, [legoSets])
 
-    if (legoSets && legoSets.length) {
-        legoSets.map((setRelease, index) => {
-            const { group, sets } = setRelease;
-            if (active == 'all' || active != "all" && active == group) {
-                if (sets.length) {
-                    sets.map((set, index) => {
-                        // console.log(set)
-                        if (set.sc_league) {
-                            if (!availableLeagues.includes(set.sc_league)) {
-                                availableLeagues.push(set.sc_league)
-                            }
-                        }
-
-                        if (set.sc_brands) {
-                            if (!availableBrands.includes(set.sc_brands)) {
-                                availableBrands.push(set.sc_brands)
-                            }
-                        }
-
-                        // availableBrands
-                    })
-                }
-            }
-        })
-    }
-
     const splitToNChunks = (array, n) => {
         let result = [];
         for (let i = n; i > 0; i--) {
@@ -156,7 +113,7 @@ const LegoSets = props => {
                 const { set_name, option_id, release_year } = set;
 
                 const categoryUrl = resourceUrl(
-                    `/${category?.url_path}${categoryUrlSuffix || ''}?sc_${category?.url_key}_release[filter]=${set_name},${option_id}`
+                    `/${category?.url_path}${categoryUrlSuffix || ''}?lego_set_name[filter]=${set_name},${option_id}`
                 );
 
                 setsResult.push(<li className='list-none'>
@@ -196,11 +153,6 @@ const LegoSets = props => {
     const handleActive = (val) => {
         setActive(val);
 
-        availableLeagues = [];
-
-        setActiveFilter('Major Baseball League')
-
-
         setSearchQuery('')
     }
 
@@ -209,11 +161,9 @@ const LegoSets = props => {
 
         setSearchQuery('')
     }
-
-    const handleActiveFilter = (val) => {
-        setActiveFilter(val);
-
-        setSearchQuery('')
+    const handleSearchQuery = (val) => {
+        setSearchQuery(val)
+        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'];
@@ -277,7 +227,7 @@ const LegoSets = props => {
                     <div
                         className={classes.toolbar}
                     >
-                        <div style={{"width":"35%"}}><ArraySearchInput active={active} searchQuery={searchQuery} placeholder="Search sets..." isOpen={true} setSearchQuery={setSearchQuery} /></div>
+                        <div style={{"width":"35%"}}><ArraySearchInput active={active} searchQuery={searchQuery} placeholder="Search sets..." isOpen={true} setSearchQuery={handleSearchQuery} /></div>
                         {/* <CustomSortBy sortProps={sortProps} availableSortMethods={availableSortBy} /> */}
                     </div>
                 ) : ''}
@@ -324,7 +274,6 @@ const LegoSets = props => {
             </div>
         </Fragment>
     );
-    return '';
 }
 
 export default LegoSets;

package/src/talons/FilterTop/filterTop.gql.js

@@ -1,8 +1,8 @@
 import { gql } from '@apollo/client';
 
 export const GET_CUSTOM_FILTERS = gql`
-    query GetCustomFilters($filters: ProductAttributeFilterInput!) {
-        customSubFilters(filters: $filters) {
+    query GetCustomFilters($categoryUrlKey: String!, $filters: ProductAttributeFilterInput!) {
+        customSubFilters(categoryUrlKey: $categoryUrlKey, filters: $filters) {
             label
             count
             attribute_code

package/src/talons/FilterTop/useFilterTop.js

@@ -40,6 +40,10 @@ export const useFilterTop = props => {
     const history = useHistory();
     const { pathname, search } = useLocation();
 
+    const pathnameArr = pathname.split('/');
+
+    const categoryUrlKey = pathnameArr[pathnameArr.length - 1].replace('.html','');
+
     const { data: introspectionData } = useQuery(getFilterInputsQuery);
 
     const filterTypeMap = useMemo(() => {
@@ -72,7 +76,8 @@ export const useFilterTop = props => {
 
         runQuery({
             variables: {
-                filters: newFilters
+                filters: newFilters,
+                categoryUrlKey: categoryUrlKey
             }
         });
     }, [

package/src/talons/LegoSets/legoSets.gql.js

@@ -12,8 +12,8 @@ export const GET_STORE_CONFIG_DATA = gql`
 `;
 
 export const GET_LEGO_SETS_QUERY = gql`
-    query getLegoSets($categoryUrlKey: String!, $setType: String, $filters: ProductAttributeFilterInput!) {
-        legoSets(categoryUrlKey: $categoryUrlKey, setType: $setType, filters: $filters) {
+    query getLegoSets($categoryUrlKey: String!, $activeTab: String, $filters: ProductAttributeFilterInput!) {
+        legoSets(categoryUrlKey: $categoryUrlKey, activeTab: $activeTab, filters: $filters) {
             group
             sets {
                 set_name

package/src/talons/LegoSets/useLegoSets.js

@@ -138,44 +138,8 @@ export const useLegoSets = props => {
             return null;
         }
 
-        const sortbyData = [];
-        // if (activeTab == 'year') {
-
-            // console.log(legoSets)
-            if (legoSets) {
-            legoSets.map((setRelease, index) => {
-                const { group, sets } = setRelease;
-                if (sets.length) {
-                    sets.map((set, index) => {
-                        const { release_year, sc_league } = set;
-                        if (sc_league) {
-                            if (!availableLeagues.includes(sc_league)) {
-                                availableLeagues.push(sc_league);
-                            }
-                        }
-                        // if (release_year) {
-                        //     // groupingSetsByYear.splice(release_year, 0, set);
-                            // const result = sortbyData.find(item => item.group === release_year);
-
-                        //     // groupingSetsByYear[release_year] = set;
-                        //     if (result) {
-                        //         result.sets.push(set)
-                        //     } else {
-                        //         // if (sortby == "date" || sortby == "newest" && sortbyData.length < 2) {
-                        //             sortbyData.push({
-                        //                 'group': release_year,
-                        //                 'sets': [set]
-                        //             })
-                        //         // }
-                        //     }
-                        // }
-                    })
-                }
-            })
-        }
-
         return legoSets.slice().sort((a, b) =>a.group.toLowerCase().localeCompare(b.group.toLowerCase()));
-    }, [queryResponse, activeTab]);
+    }, [queryResponse]);
 
     const availableGroups = legoSets && legoSets.length ? legoSets.map(({ group }) => group) : [];
 
@@ -192,7 +156,9 @@ export const useLegoSets = props => {
 
         if (searchQuery) {
 
-            setActive('all')
+            // useEffect(() => {
+            //     setActive('all')
+            // }, [active]);
 
             legoSets.map(({ group, sets }, index) => {
                 const newSets = sets.filter(function(set) {
@@ -209,24 +175,8 @@ export const useLegoSets = props => {
             })
         }
 
-        if (activeFilter && activeFilter  != "all") {
-            legoSets.map(({ group, sets }, index) => {
-                const newSets = sets.filter(function(set) {
-                    return set.sc_league == activeFilter;
-                    // return set.set_name.includes(searchQuery);
-                });
-
-                if (newSets && newSets.length) {
-                    filteredSets.push({
-                        'group': group,
-                        'sets': newSets
-                    })
-                }
-            })
-        }
-
-        return searchQuery || activeFilter ? filteredSets : legoSets;
-    }, [legoSets, searchQuery, sortby, activeFilter]);
+        return searchQuery ? filteredSets : legoSets;
+    }, [legoSets, searchQuery]);
 
     // useEffect(() => {
     //     setPageLoading(isBackgroundLoading);