import { Component } from 'react'; import PropTypes from 'prop-types'; import { observer } from 'mobx-react'; import { defineMessages, injectIntl } from 'react-intl'; import { Link } from 'react-router'; import injectSheet from 'react-jss'; import { Infobox } from '../../../components/ui/infobox/index'; import { Input } from '../../../components/ui/input/index'; import { Button } from '../../../components/ui/button/index'; import Workspace from '../models/Workspace'; import Service from '../../../models/Service'; import Form from '../../../lib/Form'; import { required } from '../../../helpers/validation-helpers'; import WorkspaceServiceListItem from './WorkspaceServiceListItem'; import Request from '../../../stores/lib/Request'; import { KEEP_WS_LOADED_USID } from '../../../config'; import Toggle from '../../../components/ui/Toggle'; import { H2 } from '../../../components/ui/headline'; const messages = defineMessages({ buttonDelete: { id: 'settings.workspace.form.buttonDelete', defaultMessage: 'Delete workspace', }, buttonSave: { id: 'settings.workspace.form.buttonSave', defaultMessage: 'Save workspace', }, name: { id: 'settings.workspace.form.name', defaultMessage: 'Name', }, yourWorkspaces: { id: 'settings.workspace.form.yourWorkspaces', defaultMessage: 'Your workspaces', }, keepLoaded: { id: 'settings.workspace.form.keepLoaded', defaultMessage: 'Keep this workspace loaded*', }, keepLoadedInfo: { id: 'settings.workspace.form.keepLoadedInfo', defaultMessage: '*This option will be overwritten by the global "Keep all workspaces loaded" option.', }, servicesInWorkspaceHeadline: { id: 'settings.workspace.form.servicesInWorkspaceHeadline', defaultMessage: 'Services in this Workspace', }, noServicesAdded: { id: 'settings.services.noServicesAdded', defaultMessage: 'Start by adding a service.', }, discoverServices: { id: 'settings.services.discoverServices', defaultMessage: 'Discover services', }, }); const styles = { nameInput: { height: 'auto', }, serviceList: { height: 'auto', }, keepLoadedInfo: { marginBottom: '2rem !important', }, }; class EditWorkspaceForm extends Component { static propTypes = { classes: PropTypes.object.isRequired, onDelete: PropTypes.func.isRequired, onSave: PropTypes.func.isRequired, services: PropTypes.arrayOf(PropTypes.instanceOf(Service)).isRequired, workspace: PropTypes.instanceOf(Workspace).isRequired, updateWorkspaceRequest: PropTypes.instanceOf(Request).isRequired, deleteWorkspaceRequest: PropTypes.instanceOf(Request).isRequired, }; form = this.prepareWorkspaceForm(this.props.workspace); // eslint-disable-next-line react/no-deprecated componentWillReceiveProps(nextProps) { const { workspace } = this.props; if (workspace.id !== nextProps.workspace.id) { this.form = this.prepareWorkspaceForm(nextProps.workspace); } } prepareWorkspaceForm(workspace) { const { intl, updateWorkspaceRequest } = this.props; updateWorkspaceRequest.reset(); return new Form({ fields: { name: { label: intl.formatMessage(messages.name), placeholder: intl.formatMessage(messages.name), value: workspace.name, validators: [required], }, keepLoaded: { label: intl.formatMessage(messages.keepLoaded), value: workspace.services.includes(KEEP_WS_LOADED_USID), default: false, }, services: { value: [...workspace.services], }, }, }); } save(form) { this.props.updateWorkspaceRequest.reset(); form.submit({ onSuccess: async f => { const { onSave } = this.props; const values = f.values(); onSave(values); }, onError: async () => {}, }); } delete() { const { onDelete } = this.props; onDelete(); } toggleService(service) { const servicesField = this.form.$('services'); const serviceIds = servicesField.value; if (serviceIds.includes(service.id)) { serviceIds.splice(serviceIds.indexOf(service.id), 1); } else { serviceIds.push(service.id); } servicesField.set(serviceIds); } render() { const { intl } = this.props; const { classes, workspace, services, deleteWorkspaceRequest, updateWorkspaceRequest, } = this.props; const { form } = this; const workspaceServices = form.$('services').value; const isDeleting = deleteWorkspaceRequest.isExecuting; const isSaving = updateWorkspaceRequest.isExecuting; return (
{intl.formatMessage(messages.keepLoadedInfo)}
{intl.formatMessage(messages.noServicesAdded)}