Remove addMode code

This commit is contained in:
Andrew Nicolaou 2019-11-10 19:50:45 +01:00
parent 9ac0cc1482
commit b6e60185f7
3 changed files with 4 additions and 57 deletions

View File

@ -91,7 +91,7 @@ class CollectionList extends React.Component {
const username = this.props.username !== undefined ? this.props.username : this.props.user.username; const username = this.props.username !== undefined ? this.props.username : this.props.user.username;
return ( return (
<div className={`sketches-table-container ${this.props.addMode ? 'sketches-table-container--fixed' : ''}`}> <div className="sketches-table-container">
<Helmet> <Helmet>
<title>{this.getTitle()}</title> <title>{this.getTitle()}</title>
</Helmet> </Helmet>
@ -116,7 +116,6 @@ class CollectionList extends React.Component {
collection={collection} collection={collection}
user={this.props.user} user={this.props.user}
username={username} username={username}
addMode={this.props.addMode}
project={this.props.project} project={this.props.project}
/>))} />))}
</tbody> </tbody>
@ -143,7 +142,6 @@ const ItemsShape = PropTypes.shape({
}); });
CollectionList.propTypes = { CollectionList.propTypes = {
addMode: PropTypes.bool,
user: PropTypes.shape({ user: PropTypes.shape({
username: PropTypes.string, username: PropTypes.string,
authenticated: PropTypes.bool.isRequired authenticated: PropTypes.bool.isRequired
@ -176,7 +174,6 @@ CollectionList.propTypes = {
}; };
CollectionList.defaultProps = { CollectionList.defaultProps = {
addMode: false,
project: { project: {
id: undefined, id: undefined,
owner: undefined owner: undefined

View File

@ -81,38 +81,10 @@ class CollectionListRowBase extends React.Component {
} }
} }
handleCollectionAdd = () => {
this.props.addToCollection(this.props.collection.id, this.props.project.id);
}
handleCollectionRemove = () => {
this.props.removeFromCollection(this.props.collection.id, this.props.project.id);
}
handleAddRemove = (evt) => {
// Clicking on View action should not perform add/remove
const didOriginateInLink = evt.target.nodeName === 'A';
if (didOriginateInLink) {
return;
}
if (CollectionListRowBase.projectInCollection(this.props.project, this.props.collection)) {
this.handleCollectionRemove();
} else {
this.handleCollectionAdd();
}
}
renderActions = () => { renderActions = () => {
const { optionsOpen } = this.state; const { optionsOpen } = this.state;
const userIsOwner = this.props.user.username === this.props.username; const userIsOwner = this.props.user.username === this.props.username;
if (this.props.addMode === true && this.props.project) {
return <Link to={`/${this.props.collection.owner.username}/collections/${this.props.collection.id}`}>View</Link>;
}
return ( return (
<React.Fragment> <React.Fragment>
<button <button
@ -144,22 +116,10 @@ class CollectionListRowBase extends React.Component {
); );
} }
renderIsInCollectionStatus = () => {
if (CollectionListRowBase.projectInCollection(this.props.project, this.props.collection)) {
return checkIcon;
}
return null;
}
renderCollectionName = () => { renderCollectionName = () => {
const { addMode, collection, username } = this.props; const { collection, username } = this.props;
const { renameOpen, renameValue } = this.state; const { renameOpen, renameValue } = this.state;
if (addMode) {
return collection.name;
}
return ( return (
<React.Fragment> <React.Fragment>
<Link to={{ pathname: `/${username}/collections/${collection.id}`, state: { skipSavingPath: true } }}> <Link to={{ pathname: `/${username}/collections/${collection.id}`, state: { skipSavingPath: true } }}>
@ -180,17 +140,15 @@ class CollectionListRowBase extends React.Component {
} }
render() { render() {
const { addMode, collection } = this.props; const { collection } = this.props;
return ( return (
<tr <tr
className={`sketches-table__row ${addMode ? 'sketches-table__row--is-add-mode' : ''}`} className="sketches-table__row"
key={collection.id} key={collection.id}
onClick={addMode ? this.handleAddRemove : null}
> >
<th scope="row"> <th scope="row">
<span className="sketches-table__name"> <span className="sketches-table__name">
{addMode && this.renderIsInCollectionStatus()}
{this.renderCollectionName()} {this.renderCollectionName()}
</span> </span>
</th> </th>
@ -206,8 +164,6 @@ class CollectionListRowBase extends React.Component {
} }
CollectionListRowBase.propTypes = { CollectionListRowBase.propTypes = {
addToCollection: PropTypes.func.isRequired,
removeFromCollection: PropTypes.func.isRequired,
collection: PropTypes.shape({ collection: PropTypes.shape({
id: PropTypes.string.isRequired, id: PropTypes.string.isRequired,
name: PropTypes.string.isRequired, name: PropTypes.string.isRequired,
@ -215,7 +171,6 @@ CollectionListRowBase.propTypes = {
username: PropTypes.string.isRequired, username: PropTypes.string.isRequired,
}).isRequired, }).isRequired,
}).isRequired, }).isRequired,
addMode: PropTypes.bool.isRequired,
project: PropTypes.shape({ project: PropTypes.shape({
id: PropTypes.string.isRequired, id: PropTypes.string.isRequired,
}).isRequired, }).isRequired,

View File

@ -4,11 +4,6 @@
min-height: #{400 / $base-font-size}rem; min-height: #{400 / $base-font-size}rem;
} }
.sketches-table-container--fixed {
width: #{1000 / $base-font-size}rem;
padding: #{24 / $base-font-size}rem;
}
.sketches-table { .sketches-table {
width: 100%; width: 100%;