import { Component } from 'react'; import PropTypes from 'prop-types'; import { observer, PropTypes as MobxPropTypes } from 'mobx-react'; import { Link } from 'react-router'; import { defineMessages, injectIntl } from 'react-intl'; import SearchInput from '../../ui/SearchInput'; import Infobox from '../../ui/Infobox'; import Loader from '../../ui/Loader'; import FAB from '../../ui/FAB'; import ServiceItem from './ServiceItem'; import Appear from '../../ui/effects/Appear'; const messages = defineMessages({ headline: { id: 'settings.services.headline', defaultMessage: 'Your services', }, searchService: { id: 'settings.searchService', defaultMessage: 'Search service', }, noServicesAdded: { id: 'settings.services.noServicesAdded', defaultMessage: 'Start by adding a service.', }, noServiceFound: { id: 'settings.services.nothingFound', defaultMessage: 'Sorry, but no service matched your search term.', }, discoverServices: { id: 'settings.services.discoverServices', defaultMessage: 'Discover services', }, servicesRequestFailed: { id: 'settings.services.servicesRequestFailed', defaultMessage: 'Could not load your services', }, tryReloadServices: { id: 'settings.account.tryReloadServices', defaultMessage: 'Try again', }, updatedInfo: { id: 'settings.services.updatedInfo', defaultMessage: 'Your changes have been saved', }, deletedInfo: { id: 'settings.services.deletedInfo', defaultMessage: 'Service has been deleted', }, }); class ServicesDashboard extends Component { static propTypes = { services: MobxPropTypes.arrayOrObservableArray.isRequired, isLoading: PropTypes.bool.isRequired, toggleService: PropTypes.func.isRequired, filterServices: PropTypes.func.isRequired, resetFilter: PropTypes.func.isRequired, goTo: PropTypes.func.isRequired, servicesRequestFailed: PropTypes.bool.isRequired, retryServicesRequest: PropTypes.func.isRequired, status: MobxPropTypes.arrayOrObservableArray.isRequired, searchNeedle: PropTypes.string, }; static defaultProps = { searchNeedle: '', }; render() { const { services, isLoading, toggleService, filterServices, resetFilter, goTo, servicesRequestFailed, retryServicesRequest, status, searchNeedle, } = this.props; const { intl } = this.props; return (
{intl.formatMessage(messages.noServicesAdded)}
{intl.formatMessage(messages.noServiceFound)}