import React, { Component } from 'react'; import PropTypes from 'prop-types'; import { observer, PropTypes as MobxPropTypes, inject } from 'mobx-react'; import { defineMessages, injectIntl } from 'react-intl'; import injectSheet from 'react-jss'; import { Infobox } from '@meetfranz/ui'; import { mdiCheckboxMarkedCircleOutline } from '@mdi/js'; import Loader from '../../../components/ui/Loader'; import WorkspaceItem from './WorkspaceItem'; import CreateWorkspaceForm from './CreateWorkspaceForm'; import Request from '../../../stores/lib/Request'; import Appear from '../../../components/ui/effects/Appear'; import UIStore from '../../../stores/UIStore'; const messages = defineMessages({ headline: { id: 'settings.workspaces.headline', defaultMessage: 'Your workspaces', }, noServicesAdded: { id: 'settings.workspaces.noWorkspacesAdded', defaultMessage: "You haven't created any workspaces yet.", }, workspacesRequestFailed: { id: 'settings.workspaces.workspacesRequestFailed', defaultMessage: 'Could not load your workspaces', }, tryReloadWorkspaces: { id: 'settings.workspaces.tryReloadWorkspaces', defaultMessage: 'Try again', }, updatedInfo: { id: 'settings.workspaces.updatedInfo', defaultMessage: 'Your changes have been saved', }, deletedInfo: { id: 'settings.workspaces.deletedInfo', defaultMessage: 'Workspace has been deleted', }, workspaceFeatureInfo: { id: 'settings.workspaces.workspaceFeatureInfo', defaultMessage: 'Info about workspace feature', }, workspaceFeatureHeadline: { id: 'settings.workspaces.workspaceFeatureHeadline', defaultMessage: 'Less is More: Introducing Ferdi Workspaces', }, }); const styles = () => ({ table: { width: '100%', '& td': { padding: '10px', }, }, createForm: { height: 'auto', }, appear: { height: 'auto', }, teaserImage: { width: 250, margin: [-8, 0, 0, 20], alignSelf: 'center', }, }); @inject('stores') @injectSheet(styles) @observer class WorkspacesDashboard extends Component { static propTypes = { classes: PropTypes.object.isRequired, getUserWorkspacesRequest: PropTypes.instanceOf(Request).isRequired, createWorkspaceRequest: PropTypes.instanceOf(Request).isRequired, deleteWorkspaceRequest: PropTypes.instanceOf(Request).isRequired, updateWorkspaceRequest: PropTypes.instanceOf(Request).isRequired, onCreateWorkspaceSubmit: PropTypes.func.isRequired, onWorkspaceClick: PropTypes.func.isRequired, workspaces: MobxPropTypes.arrayOrObservableArray.isRequired, }; render() { const { classes, getUserWorkspacesRequest, createWorkspaceRequest, deleteWorkspaceRequest, updateWorkspaceRequest, onCreateWorkspaceSubmit, onWorkspaceClick, workspaces, } = this.props; const { intl } = this.props; return (
{intl.formatMessage(messages.noServicesAdded)}