@riosst100/pwa-marketplace 1.2.5 → 1.2.7

package/src/components/SellerAccountPage/sellerAccountPage.js

@@ -1,110 +1,110 @@
-import React, { Fragment, Suspense } from 'react';
-import { shape, string } from 'prop-types';
-import { FormattedMessage, useIntl } from 'react-intl';
-
-import { useSellerAccountPage } from '@riosst100/pwa-marketplace/src/talons/SellerAccountPage/useSellerAccountPage';
-import { useStyle } from '@magento/venia-ui/lib/classify';
-// import SellerAccount from '@riosst100/pwa-marketplace/src/components/SellerAccount';
-import { StoreTitle } from '@magento/venia-ui/lib/components/Head';
-import defaultClasses from './sellerAccountPage.module.css';
-import { fullPageLoadingIndicator } from '@magento/venia-ui/lib/components/LoadingIndicator';
-import AccountInformationPageOperations from '@magento/venia-ui/lib/components/AccountInformationPage/accountInformationPage.gql.js';
-import Button from '@magento/venia-ui/lib/components/Button';
-
-const SellerAccountPage = props => {
-    const classes = useStyle(defaultClasses, props.classes);
-    const sellerAccountProps = useSellerAccountPage({
-        ...AccountInformationPageOperations
-    });
-    const {
-        handleCancel,
-        formErrors,
-        handleChangePassword,
-        handleSubmit,
-        initialValues,
-        isDisabled,
-        isUpdateMode,
-        loadDataError,
-        shouldShowNewPassword,
-        showUpdateMode,
-        recaptchaWidgetProps
-    } = sellerAccountProps;
-    const { formatMessage } = useIntl();
-
-    let sellerAccountDetails = null;
-    let sellerLoginAccount = null;
-    if (!initialValues) {
-        return fullPageLoadingIndicator;
-    } else {
-        const { customer } = initialValues;
-        const customerName = `${customer.firstname} ${customer.lastname}`;
-        const passwordValue = 'Same as current';
-
-        sellerLoginAccount = (
-            <Fragment>
-                <div className={classes.accountDetails}>
-                    <span className={classes.nameLabel}>
-                        <FormattedMessage
-                            id={'global.sellerDashboardLoginAccountText'}
-                            defaultMessage={'Seller Dashboard Login Account'}
-                        />
-                    </span>
-                    <div className={classes.lineItemsContainer}>
-                        <span className={classes.emailLabel}>
-                            <FormattedMessage
-                                id={'global.email'}
-                                defaultMessage={'Email'}
-                            />
-                        </span>
-                        <span className={classes.emailValue}>
-                            {customer.email}
-                        </span>
-                        <span className={classes.passwordLabel}>
-                            <FormattedMessage
-                                id={'global.password'}
-                                defaultMessage={'Password'}
-                            />
-                        </span>
-                        <span className={classes.passwordValue}>
-                            {passwordValue}
-                        </span>
-                    </div>
-                    <div className={classes.editButtonContainer}>
-                        <a href={process.env.MAGENTO_BACKEND_URL + "/lofmarketplace/seller/login"} className={classes.editInformationButton}>
-                            <FormattedMessage
-                                id={'global.sellerDashboardText'}
-                                defaultMessage={'Seller Dashboard'}
-                            />
-                        </a>
-                    </div>
-                </div>
-            </Fragment>
-        );
-    }
-
-    return (
-        <div className={classes.root}>
-            <StoreTitle>
-                {formatMessage({
-                    id: 'sellerAccountPage.title',
-                    defaultMessage: 'Seller Account'
-                })}
-            </StoreTitle>
-            {sellerLoginAccount}
-        </div>
-    )
-}
-
-export default SellerAccountPage;
-
-SellerAccountPage.defaultProps = {
-    signedInRedirectUrl: '/seller-account',
-    signInPageUrl: '/sign-in'
-};
-
-SellerAccountPage.propTypes = {
-    classes: shape({
-        root: string
-    }),
-    signedInRedirectUrl: string
-};
+import React, { Fragment, Suspense } from 'react';
+import { shape, string } from 'prop-types';
+import { FormattedMessage, useIntl } from 'react-intl';
+
+import { useSellerAccountPage } from '@riosst100/pwa-marketplace/src/talons/SellerAccountPage/useSellerAccountPage';
+import { useStyle } from '@magento/venia-ui/lib/classify';
+// import SellerAccount from '@riosst100/pwa-marketplace/src/components/SellerAccount';
+import { StoreTitle } from '@magento/venia-ui/lib/components/Head';
+import defaultClasses from './sellerAccountPage.module.css';
+import { fullPageLoadingIndicator } from '@magento/venia-ui/lib/components/LoadingIndicator';
+import AccountInformationPageOperations from '@magento/venia-ui/lib/components/AccountInformationPage/accountInformationPage.gql.js';
+import Button from '@magento/venia-ui/lib/components/Button';
+
+const SellerAccountPage = props => {
+    const classes = useStyle(defaultClasses, props.classes);
+    const sellerAccountProps = useSellerAccountPage({
+        ...AccountInformationPageOperations
+    });
+    const {
+        handleCancel,
+        formErrors,
+        handleChangePassword,
+        handleSubmit,
+        initialValues,
+        isDisabled,
+        isUpdateMode,
+        loadDataError,
+        shouldShowNewPassword,
+        showUpdateMode,
+        recaptchaWidgetProps
+    } = sellerAccountProps;
+    const { formatMessage } = useIntl();
+
+    let sellerAccountDetails = null;
+    let sellerLoginAccount = null;
+    if (!initialValues) {
+        return fullPageLoadingIndicator;
+    } else {
+        const { customer } = initialValues;
+        const customerName = `${customer.firstname} ${customer.lastname}`;
+        const passwordValue = 'Same as current';
+
+        sellerLoginAccount = (
+            <Fragment>
+                <div className={classes.accountDetails}>
+                    <span className={classes.nameLabel}>
+                        <FormattedMessage
+                            id={'global.sellerDashboardLoginAccountText'}
+                            defaultMessage={'Seller Dashboard Login Account'}
+                        />
+                    </span>
+                    <div className={classes.lineItemsContainer}>
+                        <span className={classes.emailLabel}>
+                            <FormattedMessage
+                                id={'global.email'}
+                                defaultMessage={'Email'}
+                            />
+                        </span>
+                        <span className={classes.emailValue}>
+                            {customer.email}
+                        </span>
+                        <span className={classes.passwordLabel}>
+                            <FormattedMessage
+                                id={'global.password'}
+                                defaultMessage={'Password'}
+                            />
+                        </span>
+                        <span className={classes.passwordValue}>
+                            {passwordValue}
+                        </span>
+                    </div>
+                    <div className={classes.editButtonContainer}>
+                        <a href={process.env.MAGENTO_BACKEND_URL + "/lofmarketplace/seller/login"} className={classes.editInformationButton}>
+                            <FormattedMessage
+                                id={'global.sellerDashboardText'}
+                                defaultMessage={'Seller Dashboard'}
+                            />
+                        </a>
+                    </div>
+                </div>
+            </Fragment>
+        );
+    }
+
+    return (
+        <div className={classes.root}>
+            <StoreTitle>
+                {formatMessage({
+                    id: 'sellerAccountPage.title',
+                    defaultMessage: 'Seller Account'
+                })}
+            </StoreTitle>
+            {sellerLoginAccount}
+        </div>
+    )
+}
+
+export default SellerAccountPage;
+
+SellerAccountPage.defaultProps = {
+    signedInRedirectUrl: '/seller-account',
+    signInPageUrl: '/sign-in'
+};
+
+SellerAccountPage.propTypes = {
+    classes: shape({
+        root: string
+    }),
+    signedInRedirectUrl: string
+};

package/src/components/SellerAccountPage/sellerAccountPage.module.css

@@ -1,55 +1,55 @@
-.root {
-    composes: grid from global;
-    composes: gap-y-md from global;
-    composes: px-lg from global;
-    composes: py-md from global;
-}
-
-.title {
-    composes: font-bold from global;
-    composes: font-serif from global;
-    composes: justify-self-center from global;
-}
-
-.accountDetails {
-    composes: gap-y-md from global;
-    composes: grid from global;
-    composes: grid-cols-1 from global;
-
-    composes: lg_grid-cols-3 from global;
-}
-
-.lineItemsContainer {
-    composes: gap-3 from global;
-    composes: grid from global;
-    composes: grid-cols-1 from global;
-    composes: leading-normal from global;
-    grid-column: 1 / span 1;
-
-    composes: lg_gap-xs from global;
-    composes: lg_grid-cols-2 from global;
-}
-
-.lineItemLabel {
-    composes: font-bold from global;
-}
-
-.nameLabel,
-.emailLabel,
-.passwordLabel {
-    composes: font-bold from global;
-}
-
-.nameValue,
-.emailValue,
-.passwordValue {
-}
-
-.editButtonContainer {
-    grid-column: 1 / span 1;
-    composes: text-center from global;
-}
-
-.editInformationButton {
-    composes: root_normalPriority from '@magento/venia-ui/lib/components/Button/button.module.css';
-}
+.root {
+    composes: grid from global;
+    composes: gap-y-md from global;
+    composes: px-lg from global;
+    composes: py-md from global;
+}
+
+.title {
+    composes: font-bold from global;
+    composes: font-serif from global;
+    composes: justify-self-center from global;
+}
+
+.accountDetails {
+    composes: gap-y-md from global;
+    composes: grid from global;
+    composes: grid-cols-1 from global;
+
+    composes: lg_grid-cols-3 from global;
+}
+
+.lineItemsContainer {
+    composes: gap-3 from global;
+    composes: grid from global;
+    composes: grid-cols-1 from global;
+    composes: leading-normal from global;
+    grid-column: 1 / span 1;
+
+    composes: lg_gap-xs from global;
+    composes: lg_grid-cols-2 from global;
+}
+
+.lineItemLabel {
+    composes: font-bold from global;
+}
+
+.nameLabel,
+.emailLabel,
+.passwordLabel {
+    composes: font-bold from global;
+}
+
+.nameValue,
+.emailValue,
+.passwordValue {
+}
+
+.editButtonContainer {
+    grid-column: 1 / span 1;
+    composes: text-center from global;
+}
+
+.editInformationButton {
+    composes: root_normalPriority from '@magento/venia-ui/lib/components/Button/button.module.css';
+}

package/src/components/SellerCountry/sellerCountry.gql.js

@@ -1,11 +1,11 @@
-import { gql } from '@apollo/client';
-
-export const GET_SELLER_COUNTRIES_QUERY = gql`
-    query GetSellerCountries {
-        sellerCountries {
-            id
-            full_name_english
-            two_letter_abbreviation
-        }
-    }
-`;
+import { gql } from '@apollo/client';
+
+export const GET_SELLER_COUNTRIES_QUERY = gql`
+    query GetSellerCountries {
+        sellerCountries {
+            id
+            full_name_english
+            two_letter_abbreviation
+        }
+    }
+`;

package/src/components/SellerInformation/index.js

@@ -1 +1 @@
-export { default } from './sellerInformation';
+export { default } from './sellerInformation';

package/src/components/SellerInformation/sellerInformation.js

@@ -1,119 +1,91 @@
-import React from 'react';
-import SellerLocation from '../SellerLocation';
-import { Location, ShopAdd } from 'iconsax-react';
-import OperatingHours from '@riosst100/pwa-marketplace/src/components/OperatingHours';
-import SellerAddressCard from '@riosst100/pwa-marketplace/src/components/Seller/sellerAddressCard';
-
-const SellerInformation = ({ seller }) => {
-    return (
-        <>
-            <div class="flex flex-col items-start gap-[30px] px-[10px]">
-                <div class="grid xs_grid-cols-1 md_grid-cols-2 xl_grid-cols-3 relative w-full grow xs_gap-y-6 md_gap-x-14 xl_gap-x-14">
-                    <div class="flex flex-col items-start gap-[30px] relative self-stretch">
-                        <div class="flex flex-col items-start gap-[15px] relative self-stretch w-full flex-[0_0_auto]">
-                            <div class="relative w-fit mt-[-1.00px] [font-family:'Frederik-DemiBold',Helvetica] font-bold text-[16px] tracking-[0] leading-[normal] whitespace-nowrap">Description</div>
-                            <div class="inline-flex items-center justify-center gap-[10px] relative flex-[0_0_auto]">
-                                <p class="relative mt-[-1.00px]  font-normal text-[14px] tracking-[0] leading-[16px]">
-                                    {seller ? seller.description : ''}<br />
-                                    <br />
-                                    {seller ? seller.contact_number : ''}
-                                </p>
-                            </div>
-                            <div class="inline-flex items-center gap-[10px] relative flex-[0_0_auto]">
-                                <Location color="#009A7B" size={18} variant="Outline" className='stroke-[#009A7B] stroke-[0.5px]' />
-                                <p class="relative w-fit [font-family:'Frederik-Regular',Helvetica] font-normal text-[#009a7b] text-[14px] tracking-[0] leading-[normal] whitespace-nowrap"><SellerAddressCard address={seller} /></p>
-                            </div>
-                            <div class="inline-flex items-center gap-[10px] relative flex-[0_0_auto]">
-                                <ShopAdd color="#009A7B" size={18} variant="Outline" className='stroke-[#009A7B] stroke-[0.5px]' />
-                                <div class="relative self-stretch w-[151px] mt-[-1.00px] [font-family:'Frederik-Regular',Helvetica] font-normal text-[#009a7b] text-[14px] tracking-[0] leading-[normal]">Joined: {seller ? seller.creation_time : ''}</div>
-                                {/* <p class="relative w-fit  font-normal text-[#009a7b] text-[14px] tracking-[0] leading-[normal] whitespace-nowrap">612, Jurong West Street 65</p>
-                            </div>
-                            <div class="inline-flex items-center gap-[10px] relative flex-[0_0_auto]">
-                                <ShopAdd color="#009A7B" size={18} variant="Outline" className='stroke-[#009A7B] stroke-[0.5px]' />
-                                <div class="relative self-stretch mt-[-1.00px]  font-normal text-[#009a7b] text-[14px] tracking-[0] leading-[normal]">Joined: December 2023</div> */}
-                            </div>
-                        </div>
-                    </div>
-                    <div class="flex flex-col items-start gap-[30px] relative">
-                        <div class="flex flex-col items-start gap-[15px] relative self-stretch w-full flex-[0_0_auto]">
-                            <div class="relative w-fit mt-[-1.00px] [font-family:'Frederik-DemiBold',Helvetica] font-bold text-[16px] tracking-[0] leading-[normal] whitespace-nowrap">Working Hour</div>
-                            <div class="inline-flex flex-col items-start relative flex-[0_0_auto]">
-                                <div class="inline-flex items-start gap-[10px] relative flex-[0_0_auto]">
-                                    <p class="relative w-[186px] mt-[-1.00px] [font-family:'Frederik-Regular',Helvetica] font-normal text-[#1b1b1b] text-[14px] tracking-[0] leading-[normal]">
-                                        <OperatingHours values={seller.operating_hours} />
-                                    {/* <p class="relative mt-[-1.00px]  font-normal text-[14px] tracking-[0] leading-[normal]">
-                                        Monday - Friday 9 AM - 5 PM<br />
-                                        <br />
-                                        Saturday 11 AM - 3 PM<br />
-                                        <br />
-                                        Sunday Close
-                                    */}
-                                    </p>
-                                </div>
-                            </div>
-                        </div>
-                    </div>
-                    <div class="flex flex-col items-start gap-[15px] relative">
-                        <div class="inline-flex items-start gap-[10px] relative flex-[0_0_auto]">
-                            <div class="relative w-fit mt-[-1.00px] [font-family:'Frederik-DemiBold',Helvetica] font-bold text-[16px] tracking-[0] leading-[normal] whitespace-nowrap">Ship To</div>
-                        </div>
-                        <div class="flex flex-wrap w-[300px] items-start gap-[10px_10px] relative flex-[0_0_auto]">
-                            {seller ? <SellerShipTo seller={seller} /> : '' }
-                        {/* <div class="flex flex-wrap items-start gap-[10px_10px] relative flex-[0_0_auto]">
-                            <div class="flex flex-wrap items-center gap-2 px-0 py-[5px] relative flex-1 grow">
-                                <div class="inline-flex items-center justify-center gap-[10px] px-[10px] py-0 relative flex-[0_0_auto] border-r [border-right-style:solid] border-[#e6e9ea]">
-                                    <div class="relative w-fit mt-[-1.00px]  font-normal text-[14px] tracking-[0] leading-[normal] whitespace-nowrap">Yishun</div>
-                                </div>
-                                <div class="inline-flex items-center justify-center gap-[10px] px-[10px] py-0 relative flex-[0_0_auto] border-r [border-right-style:solid] border-[#e6e9ea]">
-                                    <div class="relative w-fit mt-[-1.00px]  font-normal text-[14px] tracking-[0] leading-[normal] whitespace-nowrap">Jurong West</div>
-                                </div>
-                                <div class="inline-flex items-center justify-center gap-[10px] px-[10px] py-0 relative flex-[0_0_auto] border-r [border-right-style:solid] border-[#e6e9ea]">
-                                    <div class="relative w-fit mt-[-1.00px]  font-normal text-[14px] tracking-[0] leading-[normal] whitespace-nowrap">Jurong East</div>
-                                </div>
-                                <div class="inline-flex items-center justify-center gap-[10px] px-[10px] py-0 relative flex-[0_0_auto] border-r [border-right-style:solid] border-[#e6e9ea]">
-                                    <div class="relative w-fit mt-[-1.00px]  font-normal text-[14px] tracking-[0] leading-[normal] whitespace-nowrap">Seletar</div>
-                                </div>
-                                <div class="inline-flex items-center justify-center gap-[10px] px-[10px] py-0 relative flex-[0_0_auto] border-r [border-right-style:solid] border-[#e6e9ea]">
-                                    <div class="mt-[-1.00px]  text-[14px] leading-[normal] whitespace-nowrap relative w-fit font-normal tracking-[0]">Serangoon</div>
-                                </div>
-                                <div class="inline-flex items-center justify-center gap-[10px] px-[10px] py-0 relative flex-[0_0_auto]">
-                                    <div class="relative w-fit mt-[-1.00px]  font-normal text-[14px] tracking-[0] leading-[normal] whitespace-nowrap">Bukit Batok</div>
-                                </div>
-                            </div> */}
-                        </div>
-                    </div>
-                </div>
-                <div class="flex items-start relative self-stretch w-full flex-[0_0_auto]">
-                    <div class="flex flex-col items-start gap-[15px] relative flex-1 grow">
-                        <div class="relative w-fit mt-[-1.00px] [font-family:'Frederik-DemiBold',Helvetica] font-bold text-[16px] tracking-[0] leading-[normal] whitespace-nowrap">Terms &amp; Condition</div>
-                        <div class="inline-flex items-center justify-center gap-[10px] relative flex-[0_0_auto]">
-                            <div class="flex flex-col items-start gap-[2px]">
-                                {seller ? seller.term_and_conditions : ''}
-                            </div>
-                        </div>
-                    {/* </div>
-                </div>
-                {seller ? <SellerLocation storeLocators={seller.store_locators} /> : ''}
-            </div> */}
-                    </div>
-                </div>
-                <SellerLocation />
-            </div>
-        </>
-    )
-}
-
-const SellerShipTo = ({seller}) => {
-    const shipTo = seller ? seller.ship_to : '';
-    const shipToCountry = seller ? seller.ship_to_country : '';
-
-    return <>
-        <div class="flex flex-wrap items-center gap-[0px_10px] px-0 py-[5px] relative flex-1 grow">
-            <div class="inline-flex items-center justify-center gap-[10px] px-[10px] py-0 relative flex-[0_0_auto] border-r [border-right-style:solid] border-[#e6e9ea]">
-                <div class="relative w-fit mt-[-1.00px] [font-family:'Frederik-Regular',Helvetica] font-normal text-[#1b1b1b] text-[14px] tracking-[0] leading-[normal] whitespace-nowrap">{shipTo}<br />{shipToCountry}</div>
-            </div>
-        </div>
-    </>
-}
-
+import React from 'react';
+import SellerLocation from '../SellerLocation';
+import { Location, ShopAdd } from 'iconsax-react';
+
+const SellerInformation = ({ seller }) => {
+    console.log(seller.operating_hours)
+    return (
+        <>
+            <div class="flex flex-col items-start gap-[30px] px-[10px]">
+                <div class="grid xs_grid-cols-1 md_grid-cols-2 xl_grid-cols-3 relative w-full grow xs_gap-y-6 md_gap-x-14 xl_gap-x-14">
+                    <div class="flex flex-col items-start gap-[30px] relative self-stretch">
+                        <div class="flex flex-col items-start gap-[15px] relative self-stretch w-full flex-[0_0_auto]">
+                            <div class="relative w-fit mt-[-1.00px] [font-family:'Frederik-DemiBold',Helvetica] font-bold text-[16px] tracking-[0] leading-[normal] whitespace-nowrap">Description</div>
+                            <div class="inline-flex items-center justify-center gap-[10px] relative flex-[0_0_auto]">
+                                <p class="relative mt-[-1.00px]  font-normal text-[14px] tracking-[0] leading-[16px]">
+                                    {seller ? seller.description : ''}<br />
+                                    <br />
+                                    {seller ? seller.contact_number : ''}
+                                </p>
+                            </div>
+                            <div class="inline-flex items-center gap-[10px] relative flex-[0_0_auto]">
+                                <Location color="#009A7B" size={18} variant="Outline" className='stroke-[#009A7B] stroke-[0.5px]' />
+                                <p class="relative w-fit  font-normal text-[#009a7b] text-[14px] tracking-[0] leading-[normal] whitespace-nowrap">612, Jurong West Street 65</p>
+                            </div>
+                            <div class="inline-flex items-center gap-[10px] relative flex-[0_0_auto]">
+                                <ShopAdd color="#009A7B" size={18} variant="Outline" className='stroke-[#009A7B] stroke-[0.5px]' />
+                                <div class="relative self-stretch mt-[-1.00px]  font-normal text-[#009a7b] text-[14px] tracking-[0] leading-[normal]">Joined: December 2023</div>
+                            </div>
+                        </div>
+                    </div>
+                    <div class="flex flex-col items-start gap-[30px] relative">
+                        <div class="flex flex-col items-start gap-[15px] relative self-stretch w-full flex-[0_0_auto]">
+                            <div class="relative w-fit mt-[-1.00px] [font-family:'Frederik-DemiBold',Helvetica] font-bold text-[16px] tracking-[0] leading-[normal] whitespace-nowrap">Working Hour</div>
+                            <div class="inline-flex flex-col items-start relative flex-[0_0_auto]">
+                                <div class="inline-flex items-start gap-[10px] relative flex-[0_0_auto]">
+                                    <p class="relative mt-[-1.00px]  font-normal text-[14px] tracking-[0] leading-[normal]">
+                                        Monday - Friday 9 AM - 5 PM<br />
+                                        <br />
+                                        Saturday 11 AM - 3 PM<br />
+                                        <br />
+                                        Sunday Close
+                                    </p>
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+                    <div class="flex flex-col items-start gap-[15px] relative">
+                        <div class="inline-flex items-start gap-[10px] relative flex-[0_0_auto]">
+                            <div class="relative w-fit mt-[-1.00px] [font-family:'Frederik-DemiBold',Helvetica] font-bold text-[16px] tracking-[0] leading-[normal] whitespace-nowrap">Ship To</div>
+                        </div>
+                        <div class="flex flex-wrap items-start gap-[10px_10px] relative flex-[0_0_auto]">
+                            <div class="flex flex-wrap items-center gap-2 px-0 py-[5px] relative flex-1 grow">
+                                <div class="inline-flex items-center justify-center gap-[10px] px-[10px] py-0 relative flex-[0_0_auto] border-r [border-right-style:solid] border-[#e6e9ea]">
+                                    <div class="relative w-fit mt-[-1.00px]  font-normal text-[14px] tracking-[0] leading-[normal] whitespace-nowrap">Yishun</div>
+                                </div>
+                                <div class="inline-flex items-center justify-center gap-[10px] px-[10px] py-0 relative flex-[0_0_auto] border-r [border-right-style:solid] border-[#e6e9ea]">
+                                    <div class="relative w-fit mt-[-1.00px]  font-normal text-[14px] tracking-[0] leading-[normal] whitespace-nowrap">Jurong West</div>
+                                </div>
+                                <div class="inline-flex items-center justify-center gap-[10px] px-[10px] py-0 relative flex-[0_0_auto] border-r [border-right-style:solid] border-[#e6e9ea]">
+                                    <div class="relative w-fit mt-[-1.00px]  font-normal text-[14px] tracking-[0] leading-[normal] whitespace-nowrap">Jurong East</div>
+                                </div>
+                                <div class="inline-flex items-center justify-center gap-[10px] px-[10px] py-0 relative flex-[0_0_auto] border-r [border-right-style:solid] border-[#e6e9ea]">
+                                    <div class="relative w-fit mt-[-1.00px]  font-normal text-[14px] tracking-[0] leading-[normal] whitespace-nowrap">Seletar</div>
+                                </div>
+                                <div class="inline-flex items-center justify-center gap-[10px] px-[10px] py-0 relative flex-[0_0_auto] border-r [border-right-style:solid] border-[#e6e9ea]">
+                                    <div class="mt-[-1.00px]  text-[14px] leading-[normal] whitespace-nowrap relative w-fit font-normal tracking-[0]">Serangoon</div>
+                                </div>
+                                <div class="inline-flex items-center justify-center gap-[10px] px-[10px] py-0 relative flex-[0_0_auto]">
+                                    <div class="relative w-fit mt-[-1.00px]  font-normal text-[14px] tracking-[0] leading-[normal] whitespace-nowrap">Bukit Batok</div>
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+                <div class="flex items-start relative self-stretch w-full flex-[0_0_auto]">
+                    <div class="flex flex-col items-start gap-[15px] relative flex-1 grow">
+                        <div class="relative w-fit mt-[-1.00px] [font-family:'Frederik-DemiBold',Helvetica] font-bold text-[16px] tracking-[0] leading-[normal] whitespace-nowrap">Terms &amp; Condition</div>
+                        <div class="inline-flex items-center justify-center gap-[10px] relative flex-[0_0_auto]">
+                            <div class="flex flex-col items-start gap-[2px]">
+                                {seller ? seller.term_and_conditions : ''}
+                            </div>
+                        </div>
+                    </div >
+                </div >
+                <SellerLocation />
+            </div >
+        </>
+    )
+}
+
 export default SellerInformation;

package/src/components/SellerLocation/index.js

@@ -1 +1 @@
-export { default } from './sellerLocation';
+export { default } from './sellerLocation';