2016-12-21 23:37:48 +00:00
|
|
|
import React, {Component, PropTypes} from 'react';
|
|
|
|
import {Dropdown, DropdownButton, DropdownItem, DropdownDivider} from '../base/dropdown';
|
|
|
|
import Link from '../base/Link';
|
|
|
|
import Modal from '../base/Modal';
|
|
|
|
import ModalBody from '../base/ModalBody';
|
|
|
|
import ModalHeader from '../base/ModalHeader';
|
|
|
|
import ModalFooter from '../base/ModalFooter';
|
|
|
|
import * as session from '../../../sync/session';
|
2017-01-11 03:18:15 +00:00
|
|
|
import * as sync from '../../../sync/index';
|
2016-12-21 23:37:48 +00:00
|
|
|
import LoginModal from './LoginModal';
|
|
|
|
import {showModal} from './index';
|
2017-01-11 03:18:15 +00:00
|
|
|
import PromptModal from './PromptModal';
|
|
|
|
import PromptButton from '../base/PromptButton';
|
2017-01-11 18:35:44 +00:00
|
|
|
import {trackEvent} from '../../../analytics/index';
|
2016-12-21 23:37:48 +00:00
|
|
|
|
|
|
|
class WorkspaceShareSettingsModal extends Component {
|
2017-01-11 03:18:15 +00:00
|
|
|
state = {};
|
|
|
|
|
|
|
|
_handleSubmit = e => e.preventDefault();
|
|
|
|
_handleClose = () => this.hide();
|
|
|
|
_setModalRef = m => this.modal = m;
|
|
|
|
|
|
|
|
_handleUnshare = async () => {
|
|
|
|
const {resourceGroup} = this.state;
|
|
|
|
|
|
|
|
this._resetState({loading: true});
|
|
|
|
|
|
|
|
try {
|
|
|
|
await session.unshareWithAllTeams(resourceGroup.id);
|
|
|
|
await this._load();
|
|
|
|
} catch (err) {
|
|
|
|
console.warn('Failed to unshare workspace', err);
|
|
|
|
this._resetState({error: err.message, loading: false});
|
|
|
|
}
|
2016-12-21 23:37:48 +00:00
|
|
|
};
|
|
|
|
|
2017-01-11 03:18:15 +00:00
|
|
|
_handleShareWithTeam = async team => {
|
|
|
|
const passphrase = await showModal(PromptModal, {
|
|
|
|
headerName: 'Share Workspace',
|
|
|
|
label: 'Confirm password to share workspace',
|
|
|
|
placeholder: '•••••••••••••••••',
|
|
|
|
submitName: 'Share with Team',
|
|
|
|
inputType: 'password',
|
|
|
|
});
|
|
|
|
|
|
|
|
const {resourceGroup} = this.state;
|
|
|
|
this._resetState({loading: true});
|
|
|
|
|
|
|
|
try {
|
|
|
|
await session.shareWithTeam(resourceGroup.id, team.id, passphrase);
|
|
|
|
await this._load();
|
|
|
|
} catch (err) {
|
|
|
|
this._resetState({error: err.message, loading: false});
|
|
|
|
}
|
2016-12-21 23:37:48 +00:00
|
|
|
};
|
|
|
|
|
|
|
|
async _load () {
|
|
|
|
if (!session.isLoggedIn()) {
|
|
|
|
showModal(LoginModal);
|
|
|
|
}
|
|
|
|
|
2017-01-11 03:18:15 +00:00
|
|
|
const {workspace} = this.props;
|
|
|
|
const resource = await sync.getOrCreateResourceForDoc(workspace);
|
2016-12-21 23:37:48 +00:00
|
|
|
|
2017-01-11 18:35:44 +00:00
|
|
|
const teams = await session.listTeams();
|
2016-12-21 23:37:48 +00:00
|
|
|
|
2017-01-11 18:35:44 +00:00
|
|
|
try {
|
2017-01-11 20:58:37 +00:00
|
|
|
const resourceGroup = await sync.fetchResourceGroup(resource.resourceGroupId, true);
|
2017-01-11 18:35:44 +00:00
|
|
|
this.setState({teams, resourceGroup, loading: false, error: ''});
|
|
|
|
} catch (err) {
|
|
|
|
console.warn('Failed to fetch ResourceGroup', err);
|
|
|
|
this.setState({error: 'No sync info found. Please try again.', loading: false});
|
|
|
|
trackEvent('Sync', 'Error', 'Share Fetch Fail');
|
|
|
|
}
|
2017-01-11 03:18:15 +00:00
|
|
|
}
|
|
|
|
|
|
|
|
_resetState (patch = {}) {
|
|
|
|
this.setState(Object.assign({
|
|
|
|
teams: [],
|
|
|
|
resourceGroup: null,
|
|
|
|
error: '',
|
|
|
|
loading: false,
|
|
|
|
}, patch));
|
|
|
|
}
|
2016-12-21 23:37:48 +00:00
|
|
|
|
2017-01-11 03:18:15 +00:00
|
|
|
async show () {
|
2016-12-21 23:37:48 +00:00
|
|
|
this.modal.show();
|
2017-01-11 03:18:15 +00:00
|
|
|
this._resetState();
|
|
|
|
await this._load();
|
2016-12-21 23:37:48 +00:00
|
|
|
}
|
|
|
|
|
2017-01-11 03:18:15 +00:00
|
|
|
hide () {
|
|
|
|
this.modal.hide();
|
|
|
|
}
|
2016-12-21 23:37:48 +00:00
|
|
|
|
2017-01-11 03:18:15 +00:00
|
|
|
componentWillMount () {
|
|
|
|
this._resetState();
|
|
|
|
}
|
|
|
|
|
|
|
|
render () {
|
|
|
|
const {teams, resourceGroup, error, loading} = this.state;
|
|
|
|
const {workspace} = this.props;
|
2016-12-21 23:37:48 +00:00
|
|
|
return (
|
|
|
|
<form onSubmit={this._handleSubmit}>
|
|
|
|
<Modal ref={this._setModalRef}>
|
|
|
|
<ModalHeader key="header">Share Workspace</ModalHeader>
|
2017-01-11 03:18:15 +00:00
|
|
|
<ModalBody key="body" className="pad text-center" noScroll={true}>
|
2016-12-21 23:37:48 +00:00
|
|
|
<p>
|
2017-01-11 03:18:15 +00:00
|
|
|
Share <strong>{workspace.name}</strong> to automatically sync
|
|
|
|
all data with your team members.
|
2016-12-21 23:37:48 +00:00
|
|
|
</p>
|
2017-01-11 03:18:15 +00:00
|
|
|
<div className="form-control pad">
|
|
|
|
{error ? <div className="danger">Oops: {error}</div> : null}
|
2016-12-21 23:37:48 +00:00
|
|
|
<Dropdown outline={true}>
|
|
|
|
<DropdownDivider>Teams</DropdownDivider>
|
2017-01-11 03:18:15 +00:00
|
|
|
{!loading && resourceGroup ? (
|
|
|
|
resourceGroup.teamId ? (
|
|
|
|
<DropdownButton className="btn btn--clicky">
|
|
|
|
<i className="fa fa-users"/> Shared with
|
|
|
|
{" "}
|
|
|
|
<strong>{resourceGroup.teamName}</strong>
|
|
|
|
{" "}
|
|
|
|
<i className="fa fa-caret-down"/>
|
|
|
|
</DropdownButton>
|
|
|
|
) : (
|
|
|
|
<DropdownButton className="btn btn--clicky">
|
|
|
|
<i className="fa fa-lock"/> Private <i className="fa fa-caret-down"/>
|
|
|
|
</DropdownButton>
|
|
|
|
)
|
|
|
|
) : (
|
|
|
|
<DropdownButton className="btn btn--clicky">
|
|
|
|
<i className="fa fa-spin fa-refresh"/> Loading...
|
|
|
|
{" "}
|
|
|
|
<i className="fa fa-caret-down"/>
|
|
|
|
</DropdownButton>
|
|
|
|
)}
|
2016-12-21 23:37:48 +00:00
|
|
|
{teams.map(team => (
|
2017-01-11 03:18:15 +00:00
|
|
|
<DropdownItem key={team.id} value={team} onClick={this._handleShareWithTeam}>
|
2016-12-21 23:37:48 +00:00
|
|
|
<i className="fa fa-users"/> Share with <strong>{team.name}</strong>
|
|
|
|
</DropdownItem>
|
|
|
|
))}
|
|
|
|
<DropdownDivider>Other</DropdownDivider>
|
2017-01-11 03:18:15 +00:00
|
|
|
<DropdownItem buttonClass={PromptButton}
|
|
|
|
addIcon={true}
|
|
|
|
confirmMessage="Really make private?"
|
|
|
|
onClick={this._handleUnshare}>
|
2016-12-21 23:37:48 +00:00
|
|
|
<i className="fa fa-lock"/> Private
|
|
|
|
</DropdownItem>
|
|
|
|
</Dropdown>
|
|
|
|
|
|
|
|
<Link button={true}
|
|
|
|
className="btn btn--super-compact inline-block"
|
|
|
|
href="https://insomnia.rest/app/teams/">
|
2017-01-11 03:18:15 +00:00
|
|
|
Manage Team
|
2016-12-21 23:37:48 +00:00
|
|
|
</Link>
|
|
|
|
</div>
|
|
|
|
</ModalBody>
|
|
|
|
<ModalFooter key="footer">
|
|
|
|
<button type="button" className="btn" onClick={this._handleClose}>
|
|
|
|
Done
|
|
|
|
</button>
|
|
|
|
</ModalFooter>
|
|
|
|
</Modal>
|
|
|
|
</form>
|
|
|
|
);
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
WorkspaceShareSettingsModal.propTypes = {
|
|
|
|
workspace: PropTypes.object.isRequired,
|
|
|
|
};
|
|
|
|
|
|
|
|
export default WorkspaceShareSettingsModal;
|