@riosst100/pwa-marketplace 2.0.7 → 2.0.9

package/src/overwrites/venia-ui/lib/components/MegaMenu/submenuColumn.js

@@ -1,4 +1,4 @@
-import React, { useEffect, useState } from 'react';
+import React from 'react';
 import { Link } from 'react-router-dom';
 
 import resourceUrl from '@magento/peregrine/lib/util/makeUrl';
@@ -6,10 +6,6 @@ import resourceUrl from '@magento/peregrine/lib/util/makeUrl';
 import { useStyle } from '@magento/venia-ui/lib/classify';
 import defaultClasses from './submenuColumn.module.css';
 import PropTypes from 'prop-types';
-import { ArrowDown2 } from 'iconsax-react';
-import { textPrimary } from '@riosst100/pwa-marketplace/src/theme/vars';
-import CustomSubmenuColumn from '@riosst100/pwa-marketplace/src/overwrites/venia-ui/lib/components/MegaMenu/customSubmenuColumn';
-import cn from 'classnames';
 
 /**
  * The SubmenuColumn component displays columns with categories in submenu
@@ -22,10 +18,8 @@ const SubmenuColumn = props => {
         category,
         categoryUrlSuffix,
         onNavigate,
-        handleCloseSubMenu,
-        arrow
+        handleCloseSubMenu
     } = props;
-
     const classes = useStyle(defaultClasses, props.classes);
 
     const categoryUrl = resourceUrl(
@@ -33,10 +27,6 @@ const SubmenuColumn = props => {
     );
     let children = null;
 
-    // let maybeDownArrowIcon = () => {
-    //     return ;
-    // };
-
     if (category.children.length) {
         const childrenItems = category.children.map((subCategory, index) => {
             const { url_path, isActive, name } = subCategory;
@@ -50,60 +40,17 @@ const SubmenuColumn = props => {
                     ? props.keyboardProps
                     : {};
 
-            const customMenuItems = subCategory.custom_submenu;
-
-            const [showCustomMenu, setShowCustomMenu] = useState(false);
-
-            const toggleCustomMenu = () => {
-                if (!showCustomMenu) {
-                    setShowCustomMenu(true);
-                } else {
-                    setShowCustomMenu(false);
-                }
-            }
-
-            const customSubMenus = customMenuItems.length ? (
-                <CustomSubmenuColumn
-                    categoryUrlSuffix={categoryUrlSuffix}
-                    onNavigate={onNavigate}
-                    handleCloseSubMenu={handleCloseSubMenu}
-                    category={subCategory}
-                    customMenuItems={customMenuItems}
-                    toggleCustomMenu={toggleCustomMenu}
-                />
-            ) : '';
-
             return (
-                <li key={index} className={cn(classes.submenuChildItem, 'mt-0')}>
-                    {customMenuItems.length ? (
-                        <>
-                            <Link
-                                {...keyboardProps}
-                                className={isActive ? classes.linkActive : classes.link}
-                                data-cy="MegaMenu-SubmenuColumn-link"
-                                to={categoryUrl}
-                                onClick={() => {
-                                    handleCloseSubMenu();
-                                    onNavigate();
-                                }}
-                            >
-                                {name}
-                            </Link>
-                        </>
-                    ) : (
-                        <Link
-                            {...keyboardProps}
-                            className={isActive ? classes.linkActive : classes.link}
-                            data-cy="MegaMenu-SubmenuColumn-link"
-                            to={categoryUrl}
-                            onClick={() => {
-                                handleCloseSubMenu();
-                                onNavigate();
-                            }}
-                        >
-                            {name}
-                        </Link>
-                    )}
+                <li key={index} className={classes.submenuChildItem}>
+                    <Link
+                        {...keyboardProps}
+                        className={isActive ? classes.linkActive : classes.link}
+                        data-cy="MegaMenu-SubmenuColumn-link"
+                        to={categoryUrl}
+                        onClick={onNavigate}
+                    >
+                        {name}
+                    </Link>
                 </li>
             );
         });

package/src/overwrites/venia-ui/lib/components/MegaMenu/submenuColumn.module.css

@@ -1,10 +1,10 @@
 .submenuColumn {
-    /* composes: max-w-[235px] from global; */
-    composes: pl-4 pt-2 from global;
+    composes: max-w-[235px] from global;
+    composes: p-5 from global;
 }
 
 .heading {
-    composes: font-medium from global;
+    composes: font-semibold from global;
 }
 
 .link {
@@ -13,21 +13,16 @@
     composes: focus_underline from global;
 
     composes: hover_underline from global;
-
-    align-items: center;
-    composes: inline-flex from global;
 }
 
 .linkActive {
     composes: underline from global;
-    align-items: center;
-    composes: inline-flex from global;
 }
 
 .submenuChild {
-    composes: mt-0 from global;
+    composes: mt-5 from global;
 }
 
 .submenuChildItem {
-    composes: mb-0 from global;
-}
+    composes: mb-3 from global;
+}

package/src/overwrites/venia-ui/lib/components/SearchBar/autocomplete.js

@@ -7,7 +7,6 @@ import { useIntl } from 'react-intl';
 import defaultClasses from './autocomplete.module.css';
 import { useStyle } from '@magento/venia-ui/lib/classify';
 import Suggestions from './suggestions';
-import cn from 'classnames';
 
 const GET_AUTOCOMPLETE_RESULTS = gql`
     query getAutocompleteResults($inputText: String!) {
@@ -137,10 +136,7 @@ const Autocomplete = props => {
             : messageTpl;
 
     return (
-        <div
-            data-cy="Autocomplete-root"
-            className={cn(rootClassName)}
-        >
+        <div data-cy="Autocomplete-root" className={rootClassName}>
             <label
                 id="search_query"
                 data-cy="Autocomplete-message"

package/src/overwrites/venia-ui/lib/components/SearchBar/autocomplete.module.css

@@ -1,20 +1,21 @@
 .root {
     composes: absolute from global;
     composes: bg-white from global;
-    composes: border from global;
-    composes: border-gray-100 from global;
+    composes: border-2 from global;
+    composes: border-input from global;
     composes: border-solid from global;
+    composes: border-t-0 from global;
     composes: gap-3 from global;
     composes: grid from global;
     composes: left-0 from global;
     composes: p-xs from global;
     composes: right-0 from global;
     composes: rounded-b-md from global;
-    composes: rounded-t-md from global;
-    composes: text-base from global;
+    composes: rounded-t-none from global;
+    composes: shadow-inputFocus from global;
+    composes: text-sm from global;
     composes: top-9 from global;
     composes: z-menu from global;
-    composes: mt-3 from global;
     transition-property: opacity, transform, visibility;
 }
 
@@ -58,4 +59,4 @@
 /* TODO @TW: cannot compose */
 .suggestions:empty {
     display: none;
-}
+}

package/src/overwrites/venia-ui/lib/components/SearchBar/searchBar.js

@@ -8,8 +8,6 @@ import { useStyle } from '@magento/venia-ui/lib/classify';
 import Autocomplete from './autocomplete';
 import SearchField from './searchField';
 import defaultClasses from './searchBar.module.css';
-import Dropdown from '@riosst100/pwa-marketplace/src/components/Dropdown';
-import cn from 'classnames';
 
 const SearchBar = React.forwardRef((props, ref) => {
     const { isOpen } = props;
@@ -28,15 +26,6 @@ const SearchBar = React.forwardRef((props, ref) => {
     const classes = useStyle(defaultClasses, props.classes);
     const rootClassName = isOpen ? classes.root_open : classes.root;
     const { formatMessage } = useIntl();
-
-    const options = [
-        { value: '2', label: 'Action Figures' },
-        { value: '3', label: 'Anime' },
-    ];
-
-    const handleSelect = (option) => {
-    };
-
     return (
         <div className={rootClassName} data-cy="SearchBar-root" ref={ref}>
             <div ref={containerRef} className={classes.container}>
@@ -46,21 +35,7 @@ const SearchBar = React.forwardRef((props, ref) => {
                     initialValues={initialValues}
                     onSubmit={handleSubmit}
                 >
-                    <div
-                        className={cn(
-                            classes.search,
-                            'flex flex-row relative border border-gray-100 rounded-full'
-                        )}
-                    >
-                        <Dropdown
-                            placeholder="All Category"
-                            options={options}
-                            onSelect={handleSelect}
-                            rootClassName="!static"
-                            optionsClassName="w-full grid grid-cols-4 !mt-2.5"
-                            optionItemClassName="hover_bg-white hover_text-blue-400 font-medium"
-                            className="border-none after_w-[1px] after_h-[18px] after_bg-gray-100 h-10"
-                        />
+                    <div className={classes.search}>
                         <SearchField
                             addLabel={formatMessage({
                                 id: 'global.clearText',

package/src/overwrites/venia-ui/lib/components/SearchBar/searchBar.module.css

@@ -2,6 +2,7 @@
     composes: items-center from global;
     composes: justify-items-center from global;
     composes: justify-self-center from global;
+    composes: max-w-site from global;
     composes: px-xs from global;
     composes: py-0 from global;
     composes: w-full from global;
@@ -32,12 +33,13 @@
     composes: inline-flex from global;
     composes: items-center from global;
     composes: justify-center from global;
-    composes: max-w-full from global;
+    composes: max-w-[24rem] from global;
     composes: relative from global;
     composes: w-full from global;
 }
 
 .search {
+    composes: grid from global;
     composes: relative from global;
 }
 

package/src/overwrites/venia-ui/lib/components/SearchBar/searchField.js

@@ -11,18 +11,10 @@ const SearchField = props => {
     const { inputRef, resetForm, value } = useSearchField({ isSearchOpen });
 
     const handleSearch = () => {
+        console.log('search');
     }
     const searchButton =
-        <Trigger
-            action={handleSearch}
-            addLabel={addLabel}
-            classes={{
-                root: 'bg-transparent'
-            }}
-            style={{
-                "paddingRight":"1rem"
-            }}
-        >
+        <Trigger action={handleSearch} addLabel={addLabel}>
             <SearchNormal size="18" color="#280135" variant="Outline" />
         </Trigger>
 
@@ -35,10 +27,7 @@ const SearchField = props => {
             onFocus={onFocus}
             onValueChange={onChange}
             forwardedRef={inputRef}
-            className={{
-                inputClassName: cn('border-none bg-transparent rounded-r-full')
-            }}
-            placeholder="Search..."
+            classes={cn('search input')}
         />
     );
 };

package/src/overwrites/venia-ui/lib/components/SearchBar/suggestions.module.css

@@ -1,6 +1,6 @@
 .heading {
     composes: pt-3 from global;
-    composes: text-base from global;
+    composes: text-sm from global;
     composes: text-subtle from global;
     composes: uppercase from global;
 }

package/src/talons/Header/websiteSwitcher.gql.js

@@ -1,45 +1,45 @@
-import { gql } from '@apollo/client';
-
-export const GET_STORE_CONFIG_DATA = gql`
-    query getStoreConfigData {
-        # eslint-disable-next-line @graphql-eslint/require-id-when-available
-        storeConfig {
-            store_code
-            store_name
-            store_group_name
-            website_name
-        }
-    }
-`;
-
-export const GET_ROUTE_DATA = gql`
-    query getRouteData($url: String!) {
-        route(url: $url) {
-            relative_url
-        }
-    }
-`;
-
-export const GET_AVAILABLE_WEBSITES_DATA = gql`
-    query availableStoresByUserIp {
-        # eslint-disable-next-line @graphql-eslint/require-id-when-available
-        availableStoresByUserIp {
-            default_display_currency_code
-            locale
-            secure_base_media_url
-            store_code
-            store_group_code
-            store_group_name
-            store_name
-            store_sort_order
-            website_name
-            website_code
-        }
-    }
-`;
-
-export default {
-    getStoreConfigData: GET_STORE_CONFIG_DATA,
-    getRouteData: GET_ROUTE_DATA,
-    getAvailableWebsitesData: GET_AVAILABLE_WEBSITES_DATA
-};
+import { gql } from '@apollo/client';
+
+export const GET_STORE_CONFIG_DATA = gql`
+    query getStoreConfigData {
+        # eslint-disable-next-line @graphql-eslint/require-id-when-available
+        storeConfig {
+            store_code
+            store_name
+            store_group_name
+            website_name
+        }
+    }
+`;
+
+export const GET_ROUTE_DATA = gql`
+    query getRouteData($url: String!) {
+        route(url: $url) {
+            relative_url
+        }
+    }
+`;
+
+export const GET_AVAILABLE_WEBSITES_DATA = gql`
+    query availableStoresByUserIp {
+        # eslint-disable-next-line @graphql-eslint/require-id-when-available
+        availableStoresByUserIp {
+            default_display_currency_code
+            locale
+            secure_base_media_url
+            store_code
+            store_group_code
+            store_group_name
+            store_name
+            store_sort_order
+            website_name
+            website_code
+        }
+    }
+`;
+
+export default {
+    getStoreConfigData: GET_STORE_CONFIG_DATA,
+    getRouteData: GET_ROUTE_DATA,
+    getAvailableWebsitesData: GET_AVAILABLE_WEBSITES_DATA
+};

package/src/talons/Seller/seller.gql.js

@@ -147,6 +147,42 @@ export const GET_SELLER_DETAIL_QUERY = gql`
             response_ratio
             response_time
             store_id
+            seller_rates {
+                total_count
+                page_info {
+                    page_size
+                    current_page
+                }
+                items {
+                    rating_id
+                    seller_id
+                    customer_id
+                    rate1
+                    rate2
+                    rate3
+                    rate4
+                    rate5
+                    rating
+                    email
+                    title
+                    status
+                    detail
+                    nickname
+                    created_at
+                    verified_buyer
+                    is_recommended
+                    is_hidden
+                    answer
+                    admin_note
+                    like_about
+                    not_like_about
+                    guest_email
+                    plus_review
+                    minus_review
+                    report_abuse
+                    country
+                }
+            }
             products {
                 total_count
                 page_info {

package/src/talons/WebsiteSwitcher/websiteSwitcher.gql.js

@@ -1,45 +1,45 @@
-import { gql } from '@apollo/client';
-
-export const GET_STORE_CONFIG_DATA = gql`
-    query getStoreConfigData {
-        # eslint-disable-next-line @graphql-eslint/require-id-when-available
-        storeConfig {
-            store_code
-            store_name
-            store_group_name
-            website_name
-        }
-    }
-`;
-
-export const GET_ROUTE_DATA = gql`
-    query getRouteData($url: String!) {
-        route(url: $url) {
-            relative_url
-        }
-    }
-`;
-
-export const GET_AVAILABLE_WEBSITES_DATA = gql`
-    query availableStoresByUserIp {
-        # eslint-disable-next-line @graphql-eslint/require-id-when-available
-        availableStoresByUserIp {
-            default_display_currency_code
-            locale
-            secure_base_media_url
-            store_code
-            store_group_code
-            store_group_name
-            store_name
-            store_sort_order
-            website_name
-            website_code
-        }
-    }
-`;
-
-export default {
-    getStoreConfigData: GET_STORE_CONFIG_DATA,
-    getRouteData: GET_ROUTE_DATA,
-    getAvailableWebsitesData: GET_AVAILABLE_WEBSITES_DATA
-};
+import { gql } from '@apollo/client';
+
+export const GET_STORE_CONFIG_DATA = gql`
+    query getStoreConfigData {
+        # eslint-disable-next-line @graphql-eslint/require-id-when-available
+        storeConfig {
+            store_code
+            store_name
+            store_group_name
+            website_name
+        }
+    }
+`;
+
+export const GET_ROUTE_DATA = gql`
+    query getRouteData($url: String!) {
+        route(url: $url) {
+            relative_url
+        }
+    }
+`;
+
+export const GET_AVAILABLE_WEBSITES_DATA = gql`
+    query availableStoresByUserIp {
+        # eslint-disable-next-line @graphql-eslint/require-id-when-available
+        availableStoresByUserIp {
+            default_display_currency_code
+            locale
+            secure_base_media_url
+            store_code
+            store_group_code
+            store_group_name
+            store_name
+            store_sort_order
+            website_name
+            website_code
+        }
+    }
+`;
+
+export default {
+    getStoreConfigData: GET_STORE_CONFIG_DATA,
+    getRouteData: GET_ROUTE_DATA,
+    getAvailableWebsitesData: GET_AVAILABLE_WEBSITES_DATA
+};

package/src/theme/vars.js

@@ -1,23 +1,7 @@
 export const textPrimary = '#1B1B1B';
 export const lightGray = '#E6E9EA';
-export const darkBlue = '#280135';
-export const blue = '#f76b1c';
-export const orange = '#F7C317';
-export const gray100 = '#B9AEC5';
-export const gray600 = '#1BA387';
-export const gray700 = '#999999';
-export const primary900 = "#292D32";
-export const blackTransparent = "#11182780";
 
 export default {
     textPrimary,
     lightGray,
-    darkBlue,
-    blue,
-    orange,
-    gray100,
-    gray600,
-    gray700,
-    primary900,
-    blackTransparent,
 }

package/src/components/AccountLayout/accountlayout.module.css

@@ -1,13 +0,0 @@
-.menu {
-    flex-basis: 23%;
-}
-
-.blockContent {
-    width: 100%;
-}
-
-@media only screen and (min-width: 1024px) {
-    .blockContent {
-        width: calc(100% - 260px);
-    }
-}