2020-1-CloudComputing-E / E_Team_KhuBox

Go to a project
Toggle navigation Toggle navigation pinning
이우진
4201fe1f 1 parent 5ecbbcb8

Add shared file list view

Inline Side-by-side
Showing 21 changed files with 339 additions and 46 deletions
...@@ -7,7 +7,8 @@ import { Main as MainLayout, Minimal as MinimalLayout } from './layouts'; ...@@ -7,7 +7,8 @@ import { Main as MainLayout, Minimal as MinimalLayout } from './layouts';
7 import { 7 import {
8 Dashboard as DashboardView, 8 Dashboard as DashboardView,
9 ProductList as ProductListView, 9 ProductList as ProductListView,
10 - FileList as FileListView, 10 + MyDrive as MyDriveView,
11 + SharedFileList as SharedFileView,
11 Typography as TypographyView, 12 Typography as TypographyView,
12 Icons as IconsView, 13 Icons as IconsView,
13 Account as AccountView, 14 Account as AccountView,
...@@ -26,13 +27,13 @@ const Routes = () => { ...@@ -26,13 +27,13 @@ const Routes = () => {
26 to="/my-drive" 27 to="/my-drive"
27 /> 28 />
28 <RouteWithLayout 29 <RouteWithLayout
29 - component={FileListView} 30 + component={MyDriveView}
30 exact 31 exact
31 layout={MainLayout} 32 layout={MainLayout}
32 path="/my-drive" 33 path="/my-drive"
33 /> 34 />
34 <RouteWithLayout 35 <RouteWithLayout
35 - component={FileListView} 36 + component={SharedFileView}
36 exact 37 exact
37 layout={MainLayout} 38 layout={MainLayout}
38 path="/share" 39 path="/share"
......
1 +[{"id":1,"name":"MattisNibh.tiff","modifiedAt":"2019-12-20","size":334,"share":false,"sharedAt":"2019-11-19","sharedUser":"Vi de Lloyd"},
2 +{"id":2,"name":"UltricesPosuereCubilia.mpeg","modifiedAt":"2019-06-12","size":703,"share":true,"sharedAt":"2019-10-10","sharedUser":"Rogerio Baynon"},
3 +{"id":3,"name":"FuscePosuereFelis.tiff","modifiedAt":"2019-08-09","size":811,"share":true,"sharedAt":"2019-11-18","sharedUser":"Etheline Hynard"},
4 +{"id":4,"name":"HacHabitassePlatea.xls","modifiedAt":"2020-01-23","size":414,"share":false,"sharedAt":"2020-01-08","sharedUser":"Rudd Skellern"},
5 +{"id":5,"name":"Vivamus.xls","modifiedAt":"2020-03-14","size":351,"share":false,"sharedAt":"2019-12-12","sharedUser":"Carmelle Plumridege"},
6 +{"id":6,"name":"BlanditMi.ppt","modifiedAt":"2019-05-09","size":234,"share":false,"sharedAt":"2020-03-12","sharedUser":"Darla Hassey"},
7 +{"id":7,"name":"ErosVestibulumAc.ppt","modifiedAt":"2019-12-18","size":381,"share":true,"sharedAt":"2019-12-17","sharedUser":"Dame Alenikov"},
8 +{"id":8,"name":"AcTellusSemper.ppt","modifiedAt":"2019-05-07","size":706,"share":false,"sharedAt":"2020-02-10","sharedUser":"Jules Gutteridge"},
9 +{"id":9,"name":"SedTinciduntEu.xls","modifiedAt":"2019-07-24","size":746,"share":true,"sharedAt":"2020-04-19","sharedUser":"Peyton Wakeling"},
10 +{"id":10,"name":"Turpis.tiff","modifiedAt":"2019-12-14","size":132,"share":true,"sharedAt":"2019-07-10","sharedUser":"Felice Tethcote"},
11 +{"id":11,"name":"Nascetur.mp3","modifiedAt":"2019-12-28","size":218,"share":true,"sharedAt":"2019-05-19","sharedUser":"Lindie Balmann"},
12 +{"id":12,"name":"Est.ppt","modifiedAt":"2019-07-13","size":467,"share":true,"sharedAt":"2019-08-31","sharedUser":"Nathalia Heinritz"},
13 +{"id":13,"name":"Egestas.txt","modifiedAt":"2020-04-22","size":690,"share":true,"sharedAt":"2020-04-26","sharedUser":"Eloise Proschke"},
14 +{"id":14,"name":"Sed.doc","modifiedAt":"2019-10-09","size":691,"share":false,"sharedAt":"2019-08-27","sharedUser":"Janaye Aikin"},
15 +{"id":15,"name":"InFaucibus.ppt","modifiedAt":"2019-12-10","size":677,"share":false,"sharedAt":"2020-02-09","sharedUser":"Maurizia Swann"},
16 +{"id":16,"name":"EgetTempus.xls","modifiedAt":"2020-04-07","size":542,"share":false,"sharedAt":"2019-11-16","sharedUser":"Terrence Gummow"},
17 +{"id":17,"name":"AcNulla.tiff","modifiedAt":"2019-09-12","size":409,"share":true,"sharedAt":"2019-12-03","sharedUser":"Paulie Strawbridge"},
18 +{"id":18,"name":"LiberoNullam.mov","modifiedAt":"2019-11-29","size":700,"share":true,"sharedAt":"2019-07-07","sharedUser":"Peggi Guildford"},
19 +{"id":19,"name":"DuisBibendum.xls","modifiedAt":"2020-04-19","size":822,"share":true,"sharedAt":"2019-06-17","sharedUser":"Baron Colles"},
20 +{"id":20,"name":"AliquetPulvinar.ppt","modifiedAt":"2019-09-11","size":799,"share":true,"sharedAt":"2020-02-13","sharedUser":"Roxanna Elcombe"},
21 +{"id":21,"name":"Congue.ppt","modifiedAt":"2020-03-28","size":671,"share":true,"sharedAt":"2019-05-11","sharedUser":"Gleda Rabjohn"},
22 +{"id":22,"name":"IdNulla.xls","modifiedAt":"2019-06-05","size":810,"share":true,"sharedAt":"2019-08-18","sharedUser":"Constantia Windrass"},
23 +{"id":23,"name":"MaurisLaoreet.mov","modifiedAt":"2019-07-12","size":651,"share":false,"sharedAt":"2019-11-17","sharedUser":"Lynda Paoletto"},
24 +{"id":24,"name":"EuSapien.mp3","modifiedAt":"2019-08-19","size":50,"share":true,"sharedAt":"2019-10-23","sharedUser":"Bern Rizzello"},
25 +{"id":25,"name":"Eu.jpeg","modifiedAt":"2020-01-08","size":635,"share":true,"sharedAt":"2019-12-01","sharedUser":"Norah Dumini"},
26 +{"id":26,"name":"Cras.ppt","modifiedAt":"2020-04-28","size":37,"share":true,"sharedAt":"2019-11-26","sharedUser":"Kelsy Stebbings"},
27 +{"id":27,"name":"SapienUt.xls","modifiedAt":"2020-02-10","size":901,"share":true,"sharedAt":"2019-09-13","sharedUser":"Aveline Kemmis"},
28 +{"id":28,"name":"EgetTempus.ppt","modifiedAt":"2020-03-05","size":652,"share":false,"sharedAt":"2020-04-05","sharedUser":"Steffane Hussy"},
29 +{"id":29,"name":"ConvallisTortor.mpeg","modifiedAt":"2019-10-05","size":306,"share":false,"sharedAt":"2020-01-20","sharedUser":"Coral Lisciandro"},
30 +{"id":30,"name":"Sed.pdf","modifiedAt":"2020-03-22","size":965,"share":false,"sharedAt":"2020-02-25","sharedUser":"Dawna Ruprechter"},
31 +{"id":31,"name":"MollisMolestieLorem.ppt","modifiedAt":"2019-12-12","size":415,"share":true,"sharedAt":"2020-03-06","sharedUser":"Myra Fifield"},
32 +{"id":32,"name":"APedePosuere.tiff","modifiedAt":"2019-12-01","size":132,"share":false,"sharedAt":"2019-09-03","sharedUser":"Wolfy Boniface"},
33 +{"id":33,"name":"Proin.jpeg","modifiedAt":"2020-04-21","size":315,"share":false,"sharedAt":"2019-10-13","sharedUser":"Ozzie Orpin"},
34 +{"id":34,"name":"HacHabitassePlatea.mp3","modifiedAt":"2020-03-09","size":761,"share":false,"sharedAt":"2019-10-09","sharedUser":"Theadora Vaughan"},
35 +{"id":35,"name":"Vulputate.doc","modifiedAt":"2019-11-22","size":761,"share":false,"sharedAt":"2019-05-18","sharedUser":"Reina Copley"},
36 +{"id":36,"name":"SitAmet.tiff","modifiedAt":"2019-07-11","size":284,"share":true,"sharedAt":"2019-10-06","sharedUser":"Rhiamon Devon"},
37 +{"id":37,"name":"ConvallisNullaNeque.tiff","modifiedAt":"2019-12-23","size":201,"share":true,"sharedAt":"2019-05-19","sharedUser":"Dur Pocke"},
38 +{"id":38,"name":"RhoncusAliquet.xls","modifiedAt":"2019-10-11","size":635,"share":true,"sharedAt":"2019-07-31","sharedUser":"Dori Grellis"},
39 +{"id":39,"name":"TinciduntEuFelis.doc","modifiedAt":"2019-06-05","size":118,"share":true,"sharedAt":"2019-09-17","sharedUser":"Wylie Warbrick"},
40 +{"id":40,"name":"Erat.mp3","modifiedAt":"2020-02-13","size":285,"share":false,"sharedAt":"2019-10-06","sharedUser":"Chelsey Marzellano"},
41 +{"id":41,"name":"VestibulumSitAmet.jpeg","modifiedAt":"2020-04-23","size":262,"share":false,"sharedAt":"2019-11-03","sharedUser":"Marni Harpur"},
42 +{"id":42,"name":"PorttitorLacusAt.xls","modifiedAt":"2019-11-06","size":301,"share":false,"sharedAt":"2019-08-23","sharedUser":"Gerri Jest"},
43 +{"id":43,"name":"EratNulla.jpeg","modifiedAt":"2019-10-11","size":788,"share":true,"sharedAt":"2020-01-20","sharedUser":"Ginni Hillatt"},
44 +{"id":44,"name":"CubiliaCuraeMauris.ppt","modifiedAt":"2019-11-04","size":416,"share":true,"sharedAt":"2019-10-09","sharedUser":"Eolande Garstan"},
45 +{"id":45,"name":"QuisJusto.avi","modifiedAt":"2020-03-03","size":159,"share":false,"sharedAt":"2020-02-13","sharedUser":"Karl Lyness"},
46 +{"id":46,"name":"ElementumInHac.avi","modifiedAt":"2019-09-04","size":413,"share":true,"sharedAt":"2019-06-17","sharedUser":"Hugo Challicum"},
47 +{"id":47,"name":"Adipiscing.tiff","modifiedAt":"2020-01-16","size":510,"share":true,"sharedAt":"2019-08-30","sharedUser":"Leela Larmouth"},
48 +{"id":48,"name":"Sed.gif","modifiedAt":"2020-02-17","size":778,"share":true,"sharedAt":"2019-12-30","sharedUser":"Koren Timmermann"},
49 +{"id":49,"name":"QuisqueArcuLibero.xls","modifiedAt":"2020-02-23","size":320,"share":false,"sharedAt":"2020-01-15","sharedUser":"Osborne Sprull"},
50 +{"id":50,"name":"Ac.ppt","modifiedAt":"2019-07-01","size":644,"share":true,"sharedAt":"2019-10-15","sharedUser":"Brandy Antal"}]
1 -import uuid from 'uuid/v1';
2 -
3 -export default [
4 - {id:1,name:"VelitEuEst.jpeg",modifiedAt:"2019-08-28",size:73,share:false},
5 -{id:2,name:"EstRisusAuctor.mp3",modifiedAt:"2019-11-03",size:34,share:true},
6 -{id:3,name:"NonLigula.pdf",modifiedAt:"2019-12-15",size:20,share:true},
7 -{id:4,name:"In.avi",modifiedAt:"2019-05-09",size:100,share:true},
8 -{id:5,name:"DiamEratFermentum.txt",modifiedAt:"2019-07-18",size:20,share:false},
9 -{id:6,name:"Amet.avi",modifiedAt:"2020-02-27",size:77,share:false},
10 -{id:7,name:"OrnareImperdietSapien.jpeg",modifiedAt:"2020-01-22",size:24,share:false},
11 -{id:8,name:"AugueLuctus.mp3",modifiedAt:"2020-03-22",size:50,share:true},
12 -{id:9,name:"TempusSemperEst.doc",modifiedAt:"2020-04-26",size:20,share:true},
13 -{id:10,name:"Pellentesque.avi",modifiedAt:"2020-03-31",size:7,share:true},
14 -{id:11,name:"Ante.mp3",modifiedAt:"2020-04-08",size:53,share:true},
15 -{id:12,name:"NamDui.mp3",modifiedAt:"2019-11-05",size:14,share:true},
16 -{id:13,name:"MagnaAc.xls",modifiedAt:"2020-01-04",size:92,share:true},
17 -{id:14,name:"Nam.mp3",modifiedAt:"2019-11-04",size:10,share:true},
18 -{id:15,name:"Vestibulum.avi",modifiedAt:"2019-07-02",size:62,share:true},
19 -{id:16,name:"VestibulumAnteIpsum.ppt",modifiedAt:"2020-03-17",size:67,share:true},
20 -{id:17,name:"Id.tiff",modifiedAt:"2019-05-15",size:72,share:true},
21 -{id:18,name:"NequeVestibulumEget.xls",modifiedAt:"2019-09-06",size:1,share:true},
22 -{id:19,name:"AdipiscingMolestieHendrerit.ppt",modifiedAt:"2019-05-25",size:87,share:true},
23 -{id:20,name:"Lacus.xls",modifiedAt:"2020-03-04",size:52,share:true},
24 -{id:21,name:"EgetElitSodales.xls",modifiedAt:"2019-05-19",size:95,share:false},
25 -{id:22,name:"PorttitorLacus.ppt",modifiedAt:"2019-11-01",size:89,share:false},
26 -{id:23,name:"Cubilia.mp3",modifiedAt:"2019-05-10",size:35,share:true},
27 -{id:24,name:"VenenatisNonSodales.xls",modifiedAt:"2019-10-29",size:22,share:true},
28 -{id:25,name:"JustoIn.ppt",modifiedAt:"2020-02-23",size:54,share:false},
29 -{id:26,name:"InFelis.ppt",modifiedAt:"2019-10-18",size:58,share:false},
30 -{id:27,name:"SitAmetEleifend.xls",modifiedAt:"2019-09-21",size:12,share:false},
31 -{id:28,name:"UtSuscipit.ppt",modifiedAt:"2019-05-17",size:83,share:false},
32 -{id:29,name:"UtDolor.pdf",modifiedAt:"2019-07-28",size:23,share:false},
33 -{id:30,name:"DuisBibendum.ppt",modifiedAt:"2019-09-06",size:48,share:true}
34 -];
1 -export { default } from './FileList';
...@@ -13,7 +13,7 @@ const useStyles = makeStyles(theme => ({ ...@@ -13,7 +13,7 @@ const useStyles = makeStyles(theme => ({
13 } 13 }
14 })); 14 }));
15 15
16 -const FileList = () => { 16 +const MyDrive = () => {
17 const classes = useStyles(); 17 const classes = useStyles();
18 18
19 const [files] = useState(mockData); 19 const [files] = useState(mockData);
...@@ -22,10 +22,10 @@ const FileList = () => { ...@@ -22,10 +22,10 @@ const FileList = () => {
22 <div className={classes.root}> 22 <div className={classes.root}>
23 <DriveToolbar /> 23 <DriveToolbar />
24 <div className={classes.content}> 24 <div className={classes.content}>
25 - <FileTable users={files} /> 25 + <FileTable files={files} />
26 </div> 26 </div>
27 </div> 27 </div>
28 ); 28 );
29 }; 29 };
30 30
31 -export default FileList; 31 +export default MyDrive;
......
...@@ -42,7 +42,7 @@ const useStyles = makeStyles(theme => ({ ...@@ -42,7 +42,7 @@ const useStyles = makeStyles(theme => ({
42 })); 42 }));
43 43
44 const FileTable = props => { 44 const FileTable = props => {
45 - const { className, users: files, ...rest } = props; 45 + const { className, files: files, ...rest } = props;
46 46
47 const classes = useStyles(); 47 const classes = useStyles();
48 48
...@@ -51,12 +51,12 @@ const FileTable = props => { ...@@ -51,12 +51,12 @@ const FileTable = props => {
51 const [page, setPage] = useState(0); 51 const [page, setPage] = useState(0);
52 52
53 const handleSelectAll = event => { 53 const handleSelectAll = event => {
54 - const { users } = props; 54 + const { files } = props;
55 55
56 let selectedUsers; 56 let selectedUsers;
57 57
58 if (event.target.checked) { 58 if (event.target.checked) {
59 - selectedUsers = users.map(user => user.id); 59 + selectedUsers = files.map(user => user.id);
60 } else { 60 } else {
61 selectedUsers = []; 61 selectedUsers = [];
62 } 62 }
...@@ -174,7 +174,7 @@ const FileTable = props => { ...@@ -174,7 +174,7 @@ const FileTable = props => {
174 174
175 FileTable.propTypes = { 175 FileTable.propTypes = {
176 className: PropTypes.string, 176 className: PropTypes.string,
177 - users: PropTypes.array.isRequired 177 + files: PropTypes.array.isRequired
178 }; 178 };
179 179
180 export default FileTable; 180 export default FileTable;
......
1 +import uuid from 'uuid/v1';
2 +import data from 'mock_file_data.json'
3 +
4 +export default data;
...\ No newline at end of file ...\ No newline at end of file
1 +export { default } from './MyDrive';
1 +import React, { useState } from 'react';
2 +import { makeStyles } from '@material-ui/styles';
3 +
4 +import { SharedFileToolbar, SharedFileTable } from './components';
5 +import mockData from './data';
6 +
7 +const useStyles = makeStyles(theme => ({
8 + root: {
9 + padding: theme.spacing(3)
10 + },
11 + content: {
12 + marginTop: theme.spacing(2)
13 + }
14 +}));
15 +
16 +const SharedFileList = () => {
17 + const classes = useStyles();
18 +
19 + const [files] = useState(mockData);
20 +
21 + return (
22 + <div className={classes.root}>
23 + <SharedFileToolbar />
24 + <div className={classes.content}>
25 + <SharedFileTable files={files} />
26 + </div>
27 + </div>
28 + );
29 +};
30 +
31 +export default SharedFileList;
1 +import React, { useState } from 'react';
2 +import clsx from 'clsx';
3 +import PropTypes from 'prop-types';
4 +import moment from 'moment';
5 +import PerfectScrollbar from 'react-perfect-scrollbar';
6 +import { makeStyles } from '@material-ui/styles';
7 +import {
8 + Card,
9 + CardActions,
10 + CardContent,
11 + Avatar,
12 + Checkbox,
13 + Table,
14 + TableBody,
15 + TableCell,
16 + TableHead,
17 + TableRow,
18 + Typography,
19 + TablePagination
20 +} from '@material-ui/core';
21 +
22 +import { getInitials } from 'helpers';
23 +
24 +const useStyles = makeStyles(theme => ({
25 + root: {},
26 + content: {
27 + padding: 0
28 + },
29 + inner: {
30 + minWidth: 1050
31 + },
32 + nameContainer: {
33 + display: 'flex',
34 + alignItems: 'center'
35 + },
36 + avatar: {
37 + marginRight: theme.spacing(2)
38 + },
39 + actions: {
40 + justifyContent: 'flex-end'
41 + }
42 +}));
43 +
44 +const FileTable = props => {
45 + const { className, files: files, ...rest } = props;
46 +
47 + const classes = useStyles();
48 +
49 + const [selectedUsers, setSelectedUsers] = useState([]);
50 + const [rowsPerPage, setRowsPerPage] = useState(10);
51 + const [page, setPage] = useState(0);
52 +
53 + const handleSelectAll = event => {
54 + const { files } = props;
55 +
56 + let selectedUsers;
57 +
58 + if (event.target.checked) {
59 + selectedUsers = files.map(user => user.id);
60 + } else {
61 + selectedUsers = [];
62 + }
63 +
64 + setSelectedUsers(selectedUsers);
65 + };
66 +
67 + const handleSelectOne = (event, id) => {
68 + const selectedIndex = selectedUsers.indexOf(id);
69 + let newSelectedUsers = [];
70 +
71 + if (selectedIndex === -1) {
72 + newSelectedUsers = newSelectedUsers.concat(selectedUsers, id);
73 + } else if (selectedIndex === 0) {
74 + newSelectedUsers = newSelectedUsers.concat(selectedUsers.slice(1));
75 + } else if (selectedIndex === selectedUsers.length - 1) {
76 + newSelectedUsers = newSelectedUsers.concat(selectedUsers.slice(0, -1));
77 + } else if (selectedIndex > 0) {
78 + newSelectedUsers = newSelectedUsers.concat(
79 + selectedUsers.slice(0, selectedIndex),
80 + selectedUsers.slice(selectedIndex + 1)
81 + );
82 + }
83 +
84 + setSelectedUsers(newSelectedUsers);
85 + };
86 +
87 + const handlePageChange = (event, page) => {
88 + setPage(page);
89 + };
90 +
91 + const handleRowsPerPageChange = event => {
92 + setRowsPerPage(event.target.value);
93 + };
94 +
95 + return (
96 + <Card
97 + {...rest}
98 + className={clsx(classes.root, className)}
99 + >
100 + <CardContent className={classes.content}>
101 + <PerfectScrollbar>
102 + <div className={classes.inner}>
103 + <Table>
104 + <TableHead>
105 + <TableRow>
106 + <TableCell padding="checkbox">
107 + <Checkbox
108 + checked={selectedUsers.length === files.length}
109 + color="primary"
110 + indeterminate={
111 + selectedUsers.length > 0 &&
112 + selectedUsers.length < files.length
113 + }
114 + onChange={handleSelectAll}
115 + />
116 + </TableCell>
117 + <TableCell>이름</TableCell>
118 + <TableCell>공유한 날짜</TableCell>
119 + <TableCell>공유자</TableCell>
120 + </TableRow>
121 + </TableHead>
122 + <TableBody>
123 + {files.slice(0, rowsPerPage).map(file => (
124 + <TableRow
125 + className={classes.tableRow}
126 + hover
127 + key={file.id}
128 + selected={selectedUsers.indexOf(file.id) !== -1}
129 + >
130 + <TableCell padding="checkbox">
131 + <Checkbox
132 + checked={selectedUsers.indexOf(file.id) !== -1}
133 + color="primary"
134 + onChange={event => handleSelectOne(event, file.id)}
135 + value="true"
136 + />
137 + </TableCell>
138 + <TableCell>
139 + <div className={classes.nameContainer}>
140 + {/* 파일 아이콘 */}
141 + <Typography variant="body1">{file.name}</Typography>
142 + </div>
143 + </TableCell>
144 + <TableCell>
145 + {moment(file.sharedAt).format('DD/MM/YYYY')}
146 + </TableCell>
147 + <TableCell>{file.sharedUser}</TableCell>
148 +
149 + </TableRow>
150 + ))}
151 + </TableBody>
152 + </Table>
153 + </div>
154 + </PerfectScrollbar>
155 + </CardContent>
156 + <CardActions className={classes.actions}>
157 + <TablePagination
158 + component="div"
159 + count={files.length}
160 + onChangePage={handlePageChange}
161 + onChangeRowsPerPage={handleRowsPerPageChange}
162 + page={page}
163 + rowsPerPage={rowsPerPage}
164 + rowsPerPageOptions={[5, 10, 25]}
165 + />
166 + </CardActions>
167 + </Card>
168 + );
169 +};
170 +
171 +FileTable.propTypes = {
172 + className: PropTypes.string,
173 + files: PropTypes.array.isRequired
174 +};
175 +
176 +export default FileTable;
1 +import React from 'react';
2 +import PropTypes from 'prop-types';
3 +import clsx from 'clsx';
4 +import { makeStyles } from '@material-ui/styles';
5 +import { Button } from '@material-ui/core';
6 +
7 +import { SearchInput } from 'components';
8 +
9 +const useStyles = makeStyles(theme => ({
10 + root: {},
11 + row: {
12 + height: '42px',
13 + display: 'flex',
14 + alignItems: 'center',
15 + marginTop: theme.spacing(1)
16 + },
17 + spacer: {
18 + flexGrow: 1
19 + },
20 + importButton: {
21 + marginRight: theme.spacing(1)
22 + },
23 + exportButton: {
24 + marginRight: theme.spacing(1)
25 + },
26 + searchInput: {
27 + marginRight: theme.spacing(1)
28 + }
29 +}));
30 +
31 +const DriveToolbar = props => {
32 + const { className, ...rest } = props;
33 +
34 + const classes = useStyles();
35 +
36 + return (
37 + <div
38 + {...rest}
39 + className={clsx(classes.root, className)}
40 + >
41 + <div className={classes.row}>
42 + <SearchInput
43 + className={classes.searchInput}
44 + placeholder="파일, 폴더 검색"
45 + />
46 + </div>
47 + </div>
48 + );
49 +};
50 +
51 +DriveToolbar.propTypes = {
52 + className: PropTypes.string
53 +};
54 +
55 +export default DriveToolbar;
1 +export { default as SharedFileTable } from './SharedFileTable';
2 +export { default as SharedFileToolbar } from './SharedFileToolbar';
1 +import uuid from 'uuid/v1';
2 +import data from 'mock_file_data.json'
3 +
4 +export default data;
1 +export { default } from './SharedFileList';
...@@ -7,4 +7,5 @@ export { default as Settings } from './Settings'; ...@@ -7,4 +7,5 @@ export { default as Settings } from './Settings';
7 export { default as SignIn } from './SignIn'; 7 export { default as SignIn } from './SignIn';
8 export { default as SignUp } from './SignUp'; 8 export { default as SignUp } from './SignUp';
9 export { default as Typography } from './Typography'; 9 export { default as Typography } from './Typography';
10 -export { default as FileList } from './FileList'; 10 +export { default as MyDrive } from './MyDrive';
11 +export { default as SharedFileList } from './SharedFileList';
......