Modify account information

@@ -40,11 +40,9 @@ const AccountProfile = props => {
   const classes = useStyles();
   const classes = useStyles();
 
 
   const user = {
   const user = {
-    name: 'Shen Zhi',
-    city: 'Los Angeles',
-    country: 'USA',
-    timezone: 'GTM-7',
-    avatar: '/images/avatars/avatar_11.png'
+    name: '엄준식',
+    membership: 'Basic',
+    avatar: '/images/avatars/avatar_1.png'
   };
   };
 
 
   return (
   return (
@@ -59,21 +57,13 @@ const AccountProfile = props => {
               gutterBottom
               gutterBottom
               variant="h2"
               variant="h2"
             >
             >
-              John Doe
+              {user.name}
             </Typography>
             </Typography>
             <Typography
             <Typography
-              className={classes.locationText}
               color="textSecondary"
               color="textSecondary"
               variant="body1"
               variant="body1"
             >
             >
-              {user.city}, {user.country}
-            </Typography>
-            <Typography
-              className={classes.dateText}
-              color="textSecondary"
-              variant="body1"
-            >
-              {moment().format('hh:mm A')} ({user.timezone})
+              {user.membership + " Plan"}
             </Typography>
             </Typography>
           </div>
           </div>
           <Avatar
           <Avatar
@@ -82,7 +72,7 @@ const AccountProfile = props => {
           />
           />
         </div>
         </div>
         <div className={classes.progress}>
         <div className={classes.progress}>
-          <Typography variant="body1">Profile Completeness: 70%</Typography>
+          <Typography variant="body1">저장용량: 70% (7GB/10GB)</Typography>
           <LinearProgress
           <LinearProgress
             value={70}
             value={70}
             variant="determinate"
             variant="determinate"

@@ -17,6 +17,9 @@ const useStyles = makeStyles(theme => ({
   spacer: {
   spacer: {
     flexGrow: 1
     flexGrow: 1
   },
   },
+  Button: {
+    marginRight: theme.spacing(1)
+  },
   importButton: {
   importButton: {
     marginRight: theme.spacing(1)
     marginRight: theme.spacing(1)
   },
   },
@@ -40,8 +43,8 @@ const DriveToolbar = props => {
     >
     >
       <div className={classes.row}>
       <div className={classes.row}>
         <span className={classes.spacer} />
         <span className={classes.spacer} />
-        <Button className={classes.importButton}>새 폴더</Button>
-        <Button className={classes.exportButton}>폴더 업로드</Button>
+        <Button className={classes.Button}>새 폴더</Button>
+        <Button className={classes.Button}>폴더 업로드</Button>
         <Button
         <Button
           color="primary"
           color="primary"
           variant="contained"
           variant="contained"
@@ -50,6 +53,16 @@ const DriveToolbar = props => {
         </Button>
         </Button>
       </div>
       </div>
       <div className={classes.row}>
       <div className={classes.row}>
+        {/* 파일 클릭했을 때 표시 */}
+        <span className={classes.spacer} />
+        <Button className={classes.Button}>공유</Button>
+        <Button className={classes.Button}>미리보기</Button>
+        <Button className={classes.Button}>삭제</Button>
+        <Button className={classes.Button}>이름 바꾸기</Button>
+        <Button className={classes.Button}>이동</Button>
+        <Button className={classes.Button}>다운로드</Button>
+      </div>
+      <div className={classes.row}>
         <SearchInput
         <SearchInput
           className={classes.searchInput}
           className={classes.searchInput}
           placeholder="파일, 폴더 검색"
           placeholder="파일, 폴더 검색"

@@ -39,6 +39,15 @@ const DriveToolbar = props => {
       className={clsx(classes.root, className)}
       className={clsx(classes.root, className)}
     >
     >
       <div className={classes.row}>
       <div className={classes.row}>
+        {/* 파일 클릭했을 때 표시 */}
+        <span className={classes.spacer} />
+        <Button className={classes.Button}>공유</Button>
+        <Button className={classes.Button}>미리보기</Button>
+        <Button className={classes.Button}>삭제</Button>
+        <Button className={classes.Button}>이름 바꾸기</Button>
+        <Button className={classes.Button}>다운로드</Button>
+      </div>
+      <div className={classes.row}>
         <SearchInput
         <SearchInput
           className={classes.searchInput}
           className={classes.searchInput}
           placeholder="파일, 폴더 검색"
           placeholder="파일, 폴더 검색"

@@ -38,6 +38,12 @@ const DriveToolbar = props => {
       {...rest}
       {...rest}
       className={clsx(classes.root, className)}
       className={clsx(classes.root, className)}
     >
     >
+       <div className={classes.row}>
+        {/* 파일 클릭했을 때 표시 */}
+        <span className={classes.spacer} />
+        <Button className={classes.Button}>복원</Button>
+        <Button className={classes.Button}>영구 삭제</Button>
+      </div>
       <div className={classes.row}>
       <div className={classes.row}>
         <SearchInput
         <SearchInput
           className={classes.searchInput}
           className={classes.searchInput}