Bogdan
1 year ago
parent
7e9e528d3b
commit
c8d30fd214
@ -1,82 +0,0 @@
|
|||||||
import PropTypes from 'prop-types';
|
|
||||||
import React from 'react';
|
|
||||||
import Label from 'Components/Label';
|
|
||||||
import IconButton from 'Components/Link/IconButton';
|
|
||||||
import Link from 'Components/Link/Link';
|
|
||||||
import TableRowCell from 'Components/Table/Cells/TableRowCell';
|
|
||||||
import TableRow from 'Components/Table/TableRow';
|
|
||||||
import { icons, kinds } from 'Helpers/Props';
|
|
||||||
import formatBytes from 'Utilities/Number/formatBytes';
|
|
||||||
import translate from 'Utilities/String/translate';
|
|
||||||
import styles from './RootFolderRow.css';
|
|
||||||
|
|
||||||
function RootFolderRow(props) {
|
|
||||||
const {
|
|
||||||
id,
|
|
||||||
path,
|
|
||||||
accessible,
|
|
||||||
freeSpace,
|
|
||||||
unmappedFolders,
|
|
||||||
onDeletePress
|
|
||||||
} = props;
|
|
||||||
|
|
||||||
const isUnavailable = !accessible;
|
|
||||||
|
|
||||||
return (
|
|
||||||
<TableRow>
|
|
||||||
<TableRowCell>
|
|
||||||
{
|
|
||||||
isUnavailable ?
|
|
||||||
<div className={styles.unavailablePath}>
|
|
||||||
{path}
|
|
||||||
|
|
||||||
<Label
|
|
||||||
className={styles.unavailableLabel}
|
|
||||||
kind={kinds.DANGER}
|
|
||||||
>
|
|
||||||
{translate('Unavailable')}
|
|
||||||
</Label>
|
|
||||||
</div> :
|
|
||||||
|
|
||||||
<Link
|
|
||||||
className={styles.link}
|
|
||||||
to={`/add/import/${id}`}
|
|
||||||
>
|
|
||||||
{path}
|
|
||||||
</Link>
|
|
||||||
}
|
|
||||||
</TableRowCell>
|
|
||||||
|
|
||||||
<TableRowCell className={styles.freeSpace}>
|
|
||||||
{(isUnavailable || isNaN(freeSpace)) ? '-' : formatBytes(freeSpace)}
|
|
||||||
</TableRowCell>
|
|
||||||
|
|
||||||
<TableRowCell className={styles.unmappedFolders}>
|
|
||||||
{isUnavailable ? '-' : unmappedFolders.length}
|
|
||||||
</TableRowCell>
|
|
||||||
|
|
||||||
<TableRowCell className={styles.actions}>
|
|
||||||
<IconButton
|
|
||||||
title={translate('RemoveRootFolder')}
|
|
||||||
name={icons.REMOVE}
|
|
||||||
onPress={onDeletePress}
|
|
||||||
/>
|
|
||||||
</TableRowCell>
|
|
||||||
</TableRow>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
|
|
||||||
RootFolderRow.propTypes = {
|
|
||||||
id: PropTypes.number.isRequired,
|
|
||||||
path: PropTypes.string.isRequired,
|
|
||||||
accessible: PropTypes.bool.isRequired,
|
|
||||||
freeSpace: PropTypes.number,
|
|
||||||
unmappedFolders: PropTypes.arrayOf(PropTypes.object).isRequired,
|
|
||||||
onDeletePress: PropTypes.func.isRequired
|
|
||||||
};
|
|
||||||
|
|
||||||
RootFolderRow.defaultProps = {
|
|
||||||
unmappedFolders: []
|
|
||||||
};
|
|
||||||
|
|
||||||
export default RootFolderRow;
|
|
||||||
@ -1,92 +0,0 @@
|
|||||||
import PropTypes from 'prop-types';
|
|
||||||
import React from 'react';
|
|
||||||
import Alert from 'Components/Alert';
|
|
||||||
import LoadingIndicator from 'Components/Loading/LoadingIndicator';
|
|
||||||
import Table from 'Components/Table/Table';
|
|
||||||
import TableBody from 'Components/Table/TableBody';
|
|
||||||
import { kinds } from 'Helpers/Props';
|
|
||||||
import translate from 'Utilities/String/translate';
|
|
||||||
import RootFolderRowConnector from './RootFolderRowConnector';
|
|
||||||
|
|
||||||
const rootFolderColumns = [
|
|
||||||
{
|
|
||||||
name: 'path',
|
|
||||||
get label() {
|
|
||||||
return translate('Path');
|
|
||||||
},
|
|
||||||
isVisible: true
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name: 'freeSpace',
|
|
||||||
get label() {
|
|
||||||
return translate('FreeSpace');
|
|
||||||
},
|
|
||||||
isVisible: true
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name: 'unmappedFolders',
|
|
||||||
get label() {
|
|
||||||
return translate('UnmappedFolders');
|
|
||||||
},
|
|
||||||
isVisible: true
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name: 'actions',
|
|
||||||
isVisible: true
|
|
||||||
}
|
|
||||||
];
|
|
||||||
|
|
||||||
function RootFolders(props) {
|
|
||||||
const {
|
|
||||||
isFetching,
|
|
||||||
isPopulated,
|
|
||||||
error,
|
|
||||||
items
|
|
||||||
} = props;
|
|
||||||
|
|
||||||
if (isFetching && !isPopulated) {
|
|
||||||
return (
|
|
||||||
<LoadingIndicator />
|
|
||||||
);
|
|
||||||
}
|
|
||||||
|
|
||||||
if (!isFetching && !!error) {
|
|
||||||
return (
|
|
||||||
<Alert kind={kinds.DANGER}>
|
|
||||||
{translate('UnableToLoadRootFolders')}
|
|
||||||
</Alert>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
|
|
||||||
return (
|
|
||||||
<Table
|
|
||||||
columns={rootFolderColumns}
|
|
||||||
>
|
|
||||||
<TableBody>
|
|
||||||
{
|
|
||||||
items.map((rootFolder) => {
|
|
||||||
return (
|
|
||||||
<RootFolderRowConnector
|
|
||||||
key={rootFolder.id}
|
|
||||||
id={rootFolder.id}
|
|
||||||
path={rootFolder.path}
|
|
||||||
accessible={rootFolder.accessible}
|
|
||||||
freeSpace={rootFolder.freeSpace}
|
|
||||||
unmappedFolders={rootFolder.unmappedFolders}
|
|
||||||
/>
|
|
||||||
);
|
|
||||||
})
|
|
||||||
}
|
|
||||||
</TableBody>
|
|
||||||
</Table>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
|
|
||||||
RootFolders.propTypes = {
|
|
||||||
isFetching: PropTypes.bool.isRequired,
|
|
||||||
isPopulated: PropTypes.bool.isRequired,
|
|
||||||
error: PropTypes.object,
|
|
||||||
items: PropTypes.arrayOf(PropTypes.object).isRequired
|
|
||||||
};
|
|
||||||
|
|
||||||
export default RootFolders;
|
|
||||||
@ -1,72 +0,0 @@
|
|||||||
import PropTypes from 'prop-types';
|
|
||||||
import React, { Component } from 'react';
|
|
||||||
import FileBrowserModal from 'Components/FileBrowser/FileBrowserModal';
|
|
||||||
import Icon from 'Components/Icon';
|
|
||||||
import Button from 'Components/Link/Button';
|
|
||||||
import { icons, kinds, sizes } from 'Helpers/Props';
|
|
||||||
import translate from 'Utilities/String/translate';
|
|
||||||
import styles from './AddRootFolder.css';
|
|
||||||
|
|
||||||
class AddRootFolder extends Component {
|
|
||||||
|
|
||||||
//
|
|
||||||
// Lifecycle
|
|
||||||
|
|
||||||
constructor(props, context) {
|
|
||||||
super(props, context);
|
|
||||||
|
|
||||||
this.state = {
|
|
||||||
isAddNewRootFolderModalOpen: false
|
|
||||||
};
|
|
||||||
}
|
|
||||||
|
|
||||||
//
|
|
||||||
// Lifecycle
|
|
||||||
|
|
||||||
onAddNewRootFolderPress = () => {
|
|
||||||
this.setState({ isAddNewRootFolderModalOpen: true });
|
|
||||||
};
|
|
||||||
|
|
||||||
onNewRootFolderSelect = ({ value }) => {
|
|
||||||
this.props.onNewRootFolderSelect(value);
|
|
||||||
};
|
|
||||||
|
|
||||||
onAddRootFolderModalClose = () => {
|
|
||||||
this.setState({ isAddNewRootFolderModalOpen: false });
|
|
||||||
};
|
|
||||||
|
|
||||||
//
|
|
||||||
// Render
|
|
||||||
|
|
||||||
render() {
|
|
||||||
return (
|
|
||||||
<div className={styles.addRootFolderButtonContainer}>
|
|
||||||
<Button
|
|
||||||
kind={kinds.PRIMARY}
|
|
||||||
size={sizes.LARGE}
|
|
||||||
onPress={this.onAddNewRootFolderPress}
|
|
||||||
>
|
|
||||||
<Icon
|
|
||||||
className={styles.importButtonIcon}
|
|
||||||
name={icons.DRIVE}
|
|
||||||
/>
|
|
||||||
{translate('AddRootFolder')}
|
|
||||||
</Button>
|
|
||||||
|
|
||||||
<FileBrowserModal
|
|
||||||
isOpen={this.state.isAddNewRootFolderModalOpen}
|
|
||||||
name="rootFolderPath"
|
|
||||||
value=""
|
|
||||||
onChange={this.onNewRootFolderSelect}
|
|
||||||
onModalClose={this.onAddRootFolderModalClose}
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
AddRootFolder.propTypes = {
|
|
||||||
onNewRootFolderSelect: PropTypes.func.isRequired
|
|
||||||
};
|
|
||||||
|
|
||||||
export default AddRootFolder;
|
|
||||||
Loading…
Reference in new issue