@riosst100/pwa-marketplace 2.0.8 → 2.0.9

package/src/overwrites/venia-ui/lib/components/SignIn/signIn.js

@@ -1,224 +0,0 @@
-import React from 'react';
-import { FormattedMessage, useIntl } from 'react-intl';
-import { func, shape, string } from 'prop-types';
-import { Form } from 'informed';
-import { useSignIn } from '@magento/peregrine/lib/talons/SignIn/useSignIn';
-
-import { useStyle } from '@magento/venia-ui/lib/classify';
-import { isRequired } from '@magento/venia-ui/lib/util/formValidators';
-import Button from '@magento/venia-ui/lib/components/Button';
-import Field from '@magento/venia-ui/lib/components/Field';
-import TextInput from '@magento/venia-ui/lib/components/TextInput';
-import defaultClasses from './signIn.module.css';
-import { GET_CART_DETAILS_QUERY } from './signIn.gql';
-import LinkButton from '@magento/venia-ui/lib/components/LinkButton';
-import Password from '@magento/venia-ui/lib/components/Password';
-import FormError from '@magento/venia-ui/lib/components/FormError/formError';
-import GoogleRecaptcha from '@magento/venia-ui/lib/components/GoogleReCaptcha';
-import cn from 'classnames';
-import { Link } from 'react-router-dom';
-import SocialLogin from '@riosst100/pwa-marketplace/src/components/SocialLogin';
-
-const SignIn = props => {
-    const classes = useStyle(defaultClasses, props.classes);
-    const {
-        handleTriggerClick,
-        setDefaultUsername,
-        showCreateAccount,
-        showForgotPassword,
-        initialValues,
-        showSocialLogin = true,
-    } = props;
-
-    const { formatMessage } = useIntl();
-    const talonProps = useSignIn({
-        handleTriggerClick,
-        getCartDetailsQuery: GET_CART_DETAILS_QUERY,
-        setDefaultUsername,
-        showCreateAccount,
-        showForgotPassword
-    });
-
-    const {
-        errors,
-        handleCreateAccount,
-        handleEnterKeyPress,
-        signinHandleEnterKeyPress,
-        handleForgotPassword,
-        forgotPasswordHandleEnterKeyPress,
-        handleSubmit,
-        isBusy,
-        setFormApi,
-        recaptchaWidgetProps
-    } = talonProps;
-
-    const forgotPasswordClasses = {
-        root: classes.forgotPasswordButton
-    };
-
-    return (
-        <div data-cy="SignIn-root" className={cn(classes.root, '!p-[30px]')}>
-            <span data-cy="SignIn-title" className={cn(classes.title, 'text-xl font-medium')}>
-                <FormattedMessage
-                    id={'signIn.signInText'}
-                    defaultMessage={'Sign In'}
-                />
-            </span>
-            <FormError errors={Array.from(errors.values())} />
-            <Form
-                getApi={setFormApi}
-                className={classes.form}
-                onSubmit={handleSubmit}
-                data-cy="SignIn-form"
-                initialValues={initialValues && initialValues}
-            >
-                <Field
-                    id="email"
-                    label={formatMessage({
-                        id: 'signIn.emailAddressText',
-                        defaultMessage: 'Email address'
-                    })}
-                    classes={{
-                        root: "mb-6",
-                        label: "font-normal text-left mb-2 text-[14px] block mb-2"
-                    }}
-                >
-                    <TextInput
-                        id="email"
-                        data-cy="SignIn-email"
-                        autoComplete="email"
-                        field="email"
-                        validate={isRequired}
-                        aria-label={formatMessage({
-                            id: 'global.emailRequired',
-                            defaultMessage: 'Email Required'
-                        })}
-                        placeholder='johndoe@gmail.com'
-                    />
-                </Field>
-                <Password
-                    data-cy="SignIn-password"
-                    fieldName="password"
-                    id="Password"
-                    label={formatMessage({
-                        id: 'signIn.passwordText',
-                        defaultMessage: 'Password'
-                    })}
-                    validate={isRequired}
-                    autoComplete="current-password"
-                    isToggleButtonHidden={false}
-                    aria-label={formatMessage({
-                        id: 'global.passwordRequired',
-                        defaultMessage: 'Password Required'
-                    })}
-                    placeholder={formatMessage({
-                        id: 'signIn.passwordText',
-                        defaultMessage: 'Password'
-                    })}
-                    classes={{
-                        root: "mb-6",
-                    }}
-                />
-                <div className={cn(classes.forgotPasswordButtonContainer, 'mb-6')}>
-                    <LinkButton
-                        // classes={forgotPasswordClasses}
-                        type="button"
-                        onClick={handleForgotPassword}
-                        onKeyDown={forgotPasswordHandleEnterKeyPress}
-                        data-cy="SignIn-forgotPasswordButton"
-                    >
-                        <span className='font-normal text-xs'>
-                            <FormattedMessage
-                                id={'signIn.forgotPasswordText'}
-                                defaultMessage={'Forgot your password?'}
-                            />
-                        </span>
-                    </LinkButton>
-                </div>
-                <GoogleRecaptcha {...recaptchaWidgetProps} />
-                <div className={cn(classes.buttonsContainer, '!flex flex-col gap-y-6')}>
-                    <Button
-                        priority="high"
-                        type="submit"
-                        onKeyDown={signinHandleEnterKeyPress}
-                        data-cy="SignInButton-root_highPriority"
-                        disabled={isBusy}
-                        classes={{
-                            rootClass: '!w-full',
-                            content: 'capitalize font-medium text-[16px]'
-                        }}
-                    >
-                        <FormattedMessage
-                            id={'signIn.signInText'}
-                            defaultMessage={'Sign In'}
-                        />
-                    </Button>
-                    <div className='block text-center'>
-                        <span className='text-xs font-normal'>
-                            <FormattedMessage
-                                id={'signIn.dontHaveAccount'}
-                                defaultMessage={"Don't have an account ? "}
-                            />
-                        </span>
-                        {' '}
-                        <Link
-                            to={'/create-account'}
-                            className='text-xs font-normal text-blue-700 underline'
-                        >
-                            <FormattedMessage
-                                id={'signIn.signUpNow'}
-                                defaultMessage={"Sign up now "}
-                            />
-                        </Link>
-                    </div>
-                    {showSocialLogin ? (
-                        <>
-                            <div className='max-w-[390px] w-full mx-auto'>
-                                <label
-                                    className={cn(
-                                        'relative after_w-full after_h-[1px] after_bg-gray-100 after_block after_absolute after_top-1/2 z-[0]',
-                                        'w-full block'
-                                    )}>
-                                    <span
-                                        className={cn(
-                                            'text-[14px] inline-block font-normal bg-white z-[1] relative px-5',
-                                        )}>
-                                        <FormattedMessage
-                                            id={'signIn.orContinueWith'}
-                                            defaultMessage={"Or continue with"}
-                                        />
-                                    </span>
-                                </label>
-                            </div>
-                            <SocialLogin />
-                        </>
-                    ) : null}
-
-                </div>
-            </Form>
-        </div>
-    );
-};
-
-export default SignIn;
-SignIn.propTypes = {
-    classes: shape({
-        buttonsContainer: string,
-        form: string,
-        forgotPasswordButton: string,
-        forgotPasswordButtonContainer: string,
-        root: string,
-        title: string
-    }),
-    setDefaultUsername: func,
-    showCreateAccount: func,
-    showForgotPassword: func,
-    initialValues: shape({
-        email: string.isRequired
-    })
-};
-SignIn.defaultProps = {
-    setDefaultUsername: () => { },
-    showCreateAccount: () => { },
-    showForgotPassword: () => { }
-};

package/src/overwrites/venia-ui/lib/components/SignIn/signIn.module.css

@@ -1,65 +0,0 @@
-.root {
-    composes: gap-sm from global;
-    composes: grid from global;
-    composes: justify-items-stretch from global;
-}
-
-.forgotPassword {
-    composes: block from global;
-    composes: text-error from global;
-    composes: text-sm from global;
-    composes: underline from global;
-}
-
-.form {
-    composes: grid from global;
-}
-
-.modal {
-    composes: absolute from global;
-    composes: bg-subtle from global;
-    composes: bottom-0 from global;
-    composes: h-full from global;
-    composes: text-center from global;
-    composes: w-full from global;
-
-    /* TODO @TW: review (B6) */
-    /* composes: invisible from global; */
-    visibility: hidden;
-}
-
-.modal_active {
-    composes: modal;
-    composes: opacity-90 from global;
-
-    /* TODO @TW: review (B6) */
-    /* composes: visible from global; */
-    visibility: visible;
-}
-
-.buttonsContainer {
-    composes: gap-sm from global;
-    composes: grid from global;
-    composes: grid-flow-row from global;
-    composes: justify-center from global;
-    composes: w-full from global;
-}
-
-.forgotPasswordButtonContainer {
-    composes: flex from global;
-    composes: items-center from global;
-    composes: justify-center from global;
-    composes: justify-self-start from global;
-    composes: text-center from global;
-}
-
-.forgotPasswordButton {
-    composes: root from '@magento/venia-ui/lib/components/LinkButton/linkButton.module.css';
-
-    composes: p-0 from global;
-}
-
-.title {
-    composes: capitalize from global;
-    composes: text-lg from global;
-}

package/src/overwrites/venia-ui/lib/components/SignInPage/index.js

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

package/src/overwrites/venia-ui/lib/components/SignInPage/signInPage.js

@@ -1,50 +0,0 @@
-import React from 'react';
-import { shape, string } from 'prop-types';
-import { FormattedMessage, useIntl } from 'react-intl';
-
-import { useSignInPage } from '@magento/peregrine/lib/talons/SignInPage/useSignInPage';
-import { useStyle } from '@magento/venia-ui/lib/classify';
-import { StoreTitle } from '@magento/venia-ui/lib/components/Head';
-import SignIn from '@magento/venia-ui/lib/components/SignIn';
-import cn from 'classnames';
-
-import defaultClasses from './signInPage.module.css';
-
-const SignInPage = props => {
-    const classes = useStyle(defaultClasses, props.classes);
-    const { signInProps } = useSignInPage(props);
-    const { formatMessage } = useIntl();
-
-    return (
-        <div className={cn(classes.root, '!py-[60px]')}>
-            <StoreTitle>
-                {formatMessage({
-                    id: 'signInPage.title',
-                    defaultMessage: 'Sign In'
-                })}
-            </StoreTitle>
-            <div className={cn(classes.contentContainer, 'border border-gray-100 rounded-lg')}>
-                <SignIn {...signInProps} />
-            </div>
-        </div>
-    );
-};
-
-SignInPage.defaultProps = {
-    createAccountPageUrl: '/create-account',
-    forgotPasswordPageUrl: '/forgot-password',
-    signedInRedirectUrl: '/order-history'
-};
-
-SignInPage.propTypes = {
-    classes: shape({
-        root: string,
-        header: string,
-        contentContainer: string
-    }),
-    createAccountPageUrl: string,
-    forgotPasswordPageUrl: string,
-    signedInRedirectUrl: string
-};
-
-export default SignInPage;

package/src/overwrites/venia-ui/lib/components/SignInPage/signInPage.module.css

@@ -1,17 +0,0 @@
-.root {
-    composes: gap-y-md from global;
-    composes: grid from global;
-    composes: justify-center from global;
-    composes: px-0 from global;
-    composes: py-lg from global;
-    composes: text-center from global;
-    grid-template-columns: minmax(auto, 512px);
-}
-
-.header {
-    composes: font-serif from global;
-}
-
-.contentContainer {
-    composes: rounded-lg from global;
-}

package/src/overwrites/venia-ui/lib/components/TextArea/index.js

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

package/src/overwrites/venia-ui/lib/components/TextArea/textArea.js

@@ -1,44 +0,0 @@
-import React, { Fragment } from 'react';
-import { number, node, oneOf, oneOfType, shape, string } from 'prop-types';
-import { TextArea as InformedTextArea } from 'informed';
-import useFieldState from '@magento/peregrine/lib/hooks/hook-wrappers/useInformedFieldStateWrapper';
-
-import { useStyle } from '@magento/venia-ui/lib/classify';
-import { Message } from '@magento/venia-ui/lib/components/Field';
-import defaultClasses from './textArea.module.css';
-
-const TextArea = props => {
-    const { classes: propClasses, field, message, ...rest } = props;
-    const fieldState = useFieldState(field);
-    const classes = useStyle(defaultClasses, propClasses);
-
-    return (
-        <Fragment>
-            <InformedTextArea
-                {...rest}
-                className={classes.input}
-                field={field}
-            />
-            <Message fieldState={fieldState}>{message}</Message>
-        </Fragment>
-    );
-};
-
-export default TextArea;
-
-TextArea.defaultProps = {
-    cols: 40,
-    rows: 4,
-    wrap: 'hard'
-};
-
-TextArea.propTypes = {
-    classes: shape({
-        input: string
-    }),
-    cols: oneOfType([number, string]),
-    field: string.isRequired,
-    message: node,
-    rows: oneOfType([number, string]),
-    wrap: oneOf(['hard', 'soft'])
-};

package/src/overwrites/venia-ui/lib/components/TextArea/textArea.module.css

@@ -1,27 +0,0 @@
-.input {
-    /* composes: input from '@magento/venia-ui/lib/components/Field/field.module.css'; */
-
-    composes: h-auto from global;
-    composes: max-w-full from global;
-    composes: min-w-full from global;
-    composes: px-xs from global;
-    composes: py-3 from global;
-    composes: border from global;
-    composes: border-gray-100 from global;
-    composes: rounded-md from global;
-    composes: rounded-md from global;
-    composes: focus-visible_outline-none from global;
-}
-
-.input_shimmer {
-    composes: h-auto from global;
-    composes: m-0 from global;
-    composes: max-w-full from global;
-    composes: min-h-[6.75rem] from global;
-    composes: min-w-full from global;
-    composes: px-[15px] from global;
-    composes: py-[12px] from global;
-    composes: rounded-md from global;
-    composes: w-full from global;
-    font-size: 1rem;
-}

package/src/overwrites/venia-ui/lib/components/TextInput/field.module.css

@@ -1,51 +0,0 @@
-.root {
-    composes: content-start from global;
-    composes: grid from global;
-    composes: text-colorDefault from global;
-}
-
-.label {
-    composes: flex from global;
-    composes: font-medium from global;
-    composes: items-center from global;
-    composes: justify-between from global;
-    composes: leading-none from global;
-    composes: px-0.5 from global;
-    composes: py-2.5 from global;
-    composes: text-colorDefault from global;
-    min-height: 2.125rem;
-}
-
-.input {
-    composes: appearance-none from global;
-    composes: bg-white from global;
-    composes: border-2 from global;
-    composes: border-solid from global;
-    composes: border-gray-100 from global;
-    composes: flex-textInput from global;
-    composes: h-[2.5rem] from global;
-    composes: inline-flex from global;
-    composes: m-0 from global;
-    composes: max-w-full from global;
-    composes: rounded-md from global;
-    composes: text-colorDefault from global;
-    composes: text-colorDefault from global;
-    composes: w-full from global;
-    padding: calc(0.375rem - 1px) calc(0.625rem - 1px);
-    /* TODO @TW: review */
-
-    composes: focus_outline-none from global;
-    composes: focus_shadow-inputFocus from global;
-}
-
-.input:disabled {
-    background: rgb(var(--venia-global-color-gray-100));
-    border-color: rgb(var(--venia-global-color-gray-400));
-    color: rgb(var(--venia-global-color-gray-darker));
-}
-
-.optional {
-    composes: font-normal from global;
-    composes: text-base from global;
-    composes: text-subtle from global;
-}

package/src/overwrites/venia-ui/lib/components/TextInput/index.js

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

package/src/overwrites/venia-ui/lib/components/TextInput/textInput.js

@@ -1,64 +0,0 @@
-import React, { Fragment } from 'react';
-import { node, shape, string } from 'prop-types';
-import { Text as InformedText } from 'informed';
-import useFieldState from '@magento/peregrine/lib/hooks/hook-wrappers/useInformedFieldStateWrapper';
-
-import { useStyle } from '@magento/venia-ui/lib/classify';
-import { FieldIcons, Message } from '@magento/venia-ui/lib/components/Field';
-import defaultClasses from './textInput.module.css';
-import cn from 'classnames';
-
-const TextInput = props => {
-    const {
-        after,
-        before,
-        classes: propClasses,
-        regionError,
-        field,
-        message,
-        className = {},
-        ...rest
-    } = props;
-    const fieldState = useFieldState(field);
-    const classes = useStyle(defaultClasses, propClasses);
-    const { inputClassName = '' } = className;
-    var inputClass =
-        fieldState.error || regionError ? classes.input_error : classes.input;
-
-    return (
-        <Fragment>
-            <FieldIcons after={after} before={before} >
-                <InformedText
-                    {...rest}
-                    className={cn(
-                        inputClass,
-                        'focus_shadow-none !border rounded-md',
-                        inputClassName
-                    )}
-                    field={field}
-                />
-            </FieldIcons>
-            <Message
-                classes={{
-                    root: 'text-[12px] font-normal',
-                    root_error: 'text-[12px] font-normal mt-1 text-red-400 text-left'
-                }}
-                fieldState={fieldState}
-            >
-                {message}
-            </Message>
-        </Fragment>
-    );
-};
-
-export default TextInput;
-
-TextInput.propTypes = {
-    after: node,
-    before: node,
-    classes: shape({
-        input: string
-    }),
-    field: string.isRequired,
-    message: node
-};

package/src/overwrites/venia-ui/lib/components/TextInput/textInput.module.css

@@ -1,21 +0,0 @@
-.input {
-    composes: input from './field.module.css';
-
-    composes: disabled_text-subtle from global;
-}
-
-.input_error {
-    composes: input from './field.module.css';
-
-    composes: border-red-400 from global;
-}
-
-.input_shimmer {
-    composes: h-[2.5rem] from global;
-    composes: m-0 from global;
-    composes: max-w-full from global;
-    composes: rounded-md from global;
-    composes: w-full from global;
-    font-size: 1rem;
-    padding: calc(0.375rem - 1px) calc(0.625rem - 1px);
-}