Enable collection and sketch to be created from dashboard page
This commit is contained in:
parent
27804acd6a
commit
f5356007d3
2 changed files with 33 additions and 5 deletions
|
@ -2,8 +2,7 @@ import PropTypes from 'prop-types';
|
|||
import React from 'react';
|
||||
import { connect } from 'react-redux';
|
||||
import { bindActionCreators } from 'redux';
|
||||
import { browserHistory } from 'react-router';
|
||||
|
||||
import { browserHistory, Link } from 'react-router';
|
||||
import { updateSettings, initiateVerification, createApiKey, removeApiKey } from '../actions';
|
||||
import Nav from '../../../components/Nav';
|
||||
|
||||
|
@ -61,6 +60,22 @@ class DashboardView extends React.Component {
|
|||
return this.props.user.username === this.props.params.username;
|
||||
}
|
||||
|
||||
renderActionButton(tabKey, username) {
|
||||
if (!this.isOwner()) {
|
||||
return null;
|
||||
}
|
||||
|
||||
switch (tabKey) {
|
||||
case TabKey.assets:
|
||||
return null;
|
||||
case TabKey.collections:
|
||||
return <Link className="dashboard__action-button" to={`/${username}/collections/create`}>Create collection</Link>;
|
||||
case TabKey.sketches:
|
||||
default:
|
||||
return <Link className="dashboard__action-button" to="/">New sketch</Link>;
|
||||
}
|
||||
}
|
||||
|
||||
renderContent(tabKey, username) {
|
||||
switch (tabKey) {
|
||||
case TabKey.assets:
|
||||
|
@ -85,9 +100,11 @@ class DashboardView extends React.Component {
|
|||
<section className="dashboard-header">
|
||||
<div className="dashboard-header__header">
|
||||
<h2 className="dashboard-header__header__title">{this.ownerName()}</h2>
|
||||
|
||||
<div className="dashboard-header__actions">
|
||||
<DashboardTabSwitcher currentTab={currentTab} isOwner={isOwner} username={username} />
|
||||
{currentTab === TabKey.sketches && <Searchbar />}
|
||||
{this.renderActionButton(currentTab, username)}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="dashboard-content">
|
||||
|
|
|
@ -50,3 +50,14 @@
|
|||
font-weight: bold;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.dashboard-header__actions {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.dashboard__action-button {
|
||||
flex-grow: 0;
|
||||
@extend %button;
|
||||
}
|
||||
|
|
Loading…
Reference in a new issue