From 69dac7979aac3207e2651e86bf2719974893683c Mon Sep 17 00:00:00 2001
From: Bianca Villar <biancadfvillar@gmail.com>
Date: Thu, 23 Jan 2020 17:46:29 -0300
Subject: [PATCH 1/2] Remove profile picture upload

---
 CHANGELOG.md                                   |  4 ++++
 .../Menu/ProfilePicture/PictureUploader.tsx    | 18 +-----------------
 react/components/Menu/UserInfo.tsx             |  4 ++--
 react/graphql/updateProfilePicture.gql         |  6 ------
 4 files changed, 7 insertions(+), 25 deletions(-)
 delete mode 100644 react/graphql/updateProfilePicture.gql

diff --git a/CHANGELOG.md b/CHANGELOG.md
index 0b05cd0d..d1449db3 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -7,6 +7,10 @@ and this project adheres to [Semantic Versioning](http://semver.org/spec/v2.0.0.
 
 ## [Unreleased]
 
+### Removed
+
+- Profile picture upload.
+
 ## [1.11.4] - 2020-01-03
 
 ### Changed
diff --git a/react/components/Menu/ProfilePicture/PictureUploader.tsx b/react/components/Menu/ProfilePicture/PictureUploader.tsx
index cfb3b7f9..1c5740b5 100644
--- a/react/components/Menu/ProfilePicture/PictureUploader.tsx
+++ b/react/components/Menu/ProfilePicture/PictureUploader.tsx
@@ -1,10 +1,8 @@
 import React, { Component, Fragment } from 'react'
 import { FormattedMessage } from 'react-intl'
-import { graphql } from 'react-apollo'
 import { Button, Spinner } from 'vtex.styleguide'
 import { GenericError } from 'vtex.my-account-commons'
 
-import UpdateProfilePicture from '../../../graphql/updateProfilePicture.gql'
 import BaseDropzone from './BaseDropzone'
 import PictureRenderer from './PictureRenderer'
 
@@ -36,16 +34,6 @@ class PictureUploader extends Component<Props> {
 
   private handleSaveClick = async (event: any) => {
     event.stopPropagation()
-    const { updateProfilePicture } = this.props
-    const { file } = this.state
-    this.setState({ isLoading: true, finishedUpload: false })
-    try {
-      await updateProfilePicture({ variables: { file } })
-      this.setState({ isLoading: false, finishedUpload: true })
-    } catch (e) {
-      this.setState({ error: 'alert.unknownError', isLoading: false })
-    }
-
     this.props.onCloseClick()
   }
 
@@ -120,12 +108,8 @@ class PictureUploader extends Component<Props> {
 }
 
 interface Props {
-  updateProfilePicture: (args: Variables<UpdateProfilePicture>) => void
   currentPicture?: string
   onCloseClick: () => void
 }
 
-export default graphql<any, {}, {}, Props>(UpdateProfilePicture, {
-  options: { refetchQueries: ['Greeting'] },
-  name: 'updateProfilePicture',
-})(PictureUploader)
+export default PictureUploader
diff --git a/react/components/Menu/UserInfo.tsx b/react/components/Menu/UserInfo.tsx
index 1b5b85e6..19e857cc 100644
--- a/react/components/Menu/UserInfo.tsx
+++ b/react/components/Menu/UserInfo.tsx
@@ -4,15 +4,15 @@ import { compose, branch, withProps, renderComponent } from 'recompose'
 import { FormattedMessage } from 'react-intl'
 
 import GetGreeting from '../../graphql/getGreeting.gql'
-import UserPicture from './ProfilePicture/UserPicture'
 import UserInfoLoading from './UserInfoLoading'
 import styles from '../../styles.css'
+import PictureRenderer from './ProfilePicture/PictureRenderer'
 
 const UserInfo: FunctionComponent<Props> = ({ profile }) => {
   return (
     <div className={`${styles.userInfo} flex flex-wrap items-end mb7`}>
       <div className={`${styles.userImage} relative mr5 h3 w3`}>
-        <UserPicture imagePath={profile.profilePicture} />
+        <PictureRenderer imagePath={profile.profilePicture} />
       </div>
       {profile.firstName ? (
         <div>
diff --git a/react/graphql/updateProfilePicture.gql b/react/graphql/updateProfilePicture.gql
deleted file mode 100644
index 06690daa..00000000
--- a/react/graphql/updateProfilePicture.gql
+++ /dev/null
@@ -1,6 +0,0 @@
-mutation UpdateProfilePicture($file: Upload!) {
-  updateProfilePicture(file: $file) {
-    cacheId
-    profilePicture
-  }
-}

From 40bb3a22d8ffbd401ec94e4ef67cb6bd57392a07 Mon Sep 17 00:00:00 2001
From: Bianca Villar <biancadfvillar@gmail.com>
Date: Fri, 24 Jan 2020 15:19:12 -0300
Subject: [PATCH 2/2] Remove unused components

---
 .../Menu/ProfilePicture/BaseDropzone.tsx      |  54 --------
 .../Menu/ProfilePicture/PictureUploader.tsx   | 115 ------------------
 .../Menu/ProfilePicture/UserPicture.tsx       |  50 --------
 3 files changed, 219 deletions(-)
 delete mode 100644 react/components/Menu/ProfilePicture/BaseDropzone.tsx
 delete mode 100644 react/components/Menu/ProfilePicture/PictureUploader.tsx
 delete mode 100644 react/components/Menu/ProfilePicture/UserPicture.tsx

diff --git a/react/components/Menu/ProfilePicture/BaseDropzone.tsx b/react/components/Menu/ProfilePicture/BaseDropzone.tsx
deleted file mode 100644
index 09e3398d..00000000
--- a/react/components/Menu/ProfilePicture/BaseDropzone.tsx
+++ /dev/null
@@ -1,54 +0,0 @@
-import React, { Component } from 'react'
-import ReactDropzone from 'react-dropzone'
-
-const MAX_SIZE = 4 * 1024 * 1024
-
-class BaseDropzone extends Component<Props> {
-  public state = {
-    isHovering: false,
-  }
-
-  private handleStartHovering = () => {
-    this.setState({ isHovering: true })
-  }
-
-  private handleStopHovering = () => {
-    this.setState({ isHovering: false })
-  }
-
-  private handleDrop = (files: any) => {
-    this.setState({ isHovering: false })
-    this.props.onDrop(files)
-  }
-
-  public render() {
-    const { disabled, children, onClick } = this.props
-    const { isHovering } = this.state
-    return (
-      <ReactDropzone
-        accept="image/*"
-        activeClassName="b--action-primary bg-action-secondary"
-        className={`ba br2 bw1 b--dashed ${
-          isHovering ? '' : 'b--muted-4'
-        } pa7 pa9-ns`}
-        disabled={disabled}
-        disablePreview
-        maxSize={MAX_SIZE}
-        multiple={false}
-        onClick={onClick}
-        onDrop={this.handleDrop}
-        onDragEnter={this.handleStartHovering}
-        onDragLeave={this.handleStopHovering}>
-        {children}
-      </ReactDropzone>
-    )
-  }
-}
-
-interface Props {
-  disabled: boolean
-  onClick: () => void
-  onDrop: (files: any) => void
-}
-
-export default BaseDropzone
diff --git a/react/components/Menu/ProfilePicture/PictureUploader.tsx b/react/components/Menu/ProfilePicture/PictureUploader.tsx
deleted file mode 100644
index 1c5740b5..00000000
--- a/react/components/Menu/ProfilePicture/PictureUploader.tsx
+++ /dev/null
@@ -1,115 +0,0 @@
-import React, { Component, Fragment } from 'react'
-import { FormattedMessage } from 'react-intl'
-import { Button, Spinner } from 'vtex.styleguide'
-import { GenericError } from 'vtex.my-account-commons'
-
-import BaseDropzone from './BaseDropzone'
-import PictureRenderer from './PictureRenderer'
-
-class PictureUploader extends Component<Props> {
-  public state = {
-    error: null,
-    isLoading: false,
-    finishedUpload: false,
-    previewPicture: null,
-    file: null,
-  }
-
-  private handleImageDrop = async (acceptedFiles: any) => {
-    if (acceptedFiles && acceptedFiles[0]) {
-      this.setState({
-        error: null,
-        finishedUpload: true,
-        previewPicture: URL.createObjectURL(acceptedFiles[0]),
-        file: acceptedFiles[0],
-      })
-    } else {
-      this.setState({ error: 'alert.fileTooBig' })
-    }
-  }
-
-  private handleErrorReset = () => {
-    this.setState({ error: null })
-  }
-
-  private handleSaveClick = async (event: any) => {
-    event.stopPropagation()
-    this.props.onCloseClick()
-  }
-
-  public render() {
-    const { currentPicture } = this.props
-    const { error, isLoading, finishedUpload, previewPicture } = this.state
-    const boxText = finishedUpload
-      ? 'upload.photoUpdated'
-      : 'upload.dragYourPhoto'
-
-    return (
-      <Fragment>
-        {error && (
-          <div className="mb6">
-            <GenericError onDismiss={this.handleErrorReset} errorId={error} />
-          </div>
-        )}
-        <BaseDropzone
-          disabled={isLoading}
-          onClick={this.handleErrorReset}
-          onDrop={this.handleImageDrop}>
-          <div className="w-100 w5-ns flex flex-column justify-between items-center">
-            {isLoading ? (
-              <Fragment>
-                <Spinner />
-                <div className="mt8 f5 tc gray">
-                  <FormattedMessage id="upload.loading" />
-                </div>
-              </Fragment>
-            ) : (
-              <Fragment>
-                <div className="h4 w4 mb8">
-                  <PictureRenderer
-                    imagePath={previewPicture || currentPicture}
-                  />
-                </div>
-                <div className="mb6 f5 tc c-muted-1 lh-copy">
-                  <FormattedMessage id={boxText} />
-                </div>
-                {finishedUpload ? (
-                  <Fragment>
-                    <div className="mb4 w-100">
-                      <Button block size="small" onClick={this.handleSaveClick}>
-                        <FormattedMessage id="upload.save" />
-                      </Button>
-                    </div>
-                    <Button block size="small" variation="secondary">
-                      <FormattedMessage id="upload.chooseAgain" />
-                    </Button>
-                  </Fragment>
-                ) : (
-                  <Fragment>
-                    <div className="flex w-100 items-center mb6">
-                      <div className="flex-auto bt b--muted-4" />
-                      <span className="mh3 c-muted-1">
-                        <FormattedMessage id="upload.or" />
-                      </span>
-                      <div className="flex-auto bt b--muted-4" />
-                    </div>
-                    <Button block size="small">
-                      <FormattedMessage id="upload.choosePhoto" />
-                    </Button>
-                  </Fragment>
-                )}
-              </Fragment>
-            )}
-          </div>
-        </BaseDropzone>
-      </Fragment>
-    )
-  }
-}
-
-interface Props {
-  currentPicture?: string
-  onCloseClick: () => void
-}
-
-export default PictureUploader
diff --git a/react/components/Menu/ProfilePicture/UserPicture.tsx b/react/components/Menu/ProfilePicture/UserPicture.tsx
deleted file mode 100644
index 02288812..00000000
--- a/react/components/Menu/ProfilePicture/UserPicture.tsx
+++ /dev/null
@@ -1,50 +0,0 @@
-import React, { Component } from 'react'
-import { Modal } from 'vtex.styleguide'
-
-import PictureUploader from './PictureUploader'
-import PictureRenderer from './PictureRenderer'
-
-class UserPicture extends Component<Props> {
-  public state = {
-    isModalOpen: false,
-  }
-
-  private handleOpenModal = () => {
-    this.setState({ isModalOpen: true })
-  }
-
-  private handleCloseModal = () => {
-    this.setState({ isModalOpen: false })
-  }
-
-  public render() {
-    const { imagePath } = this.props
-    const { isModalOpen } = this.state
-
-    return (
-      <React.Fragment>
-        <PictureRenderer imagePath={imagePath} />
-        <button
-          className="absolute bottom-0 right-0 pa0 c-on-base--inverted bg-action-primary br-100 f5 bn pointer flex justify-center items-center"
-          style={{ width: 26, height: 26 }}
-          onClick={this.handleOpenModal}>
-          ＋
-        </button>
-        <Modal centered isOpen={isModalOpen} onClose={this.handleCloseModal}>
-          <div className="pv4 ph4">
-            <PictureUploader
-              currentPicture={imagePath}
-              onCloseClick={this.handleCloseModal}
-            />
-          </div>
-        </Modal>
-      </React.Fragment>
-    )
-  }
-}
-
-interface Props {
-  imagePath?: string
-}
-
-export default UserPicture