import React, { Component } from 'react'; import PropTypes from 'prop-types'; import { observer, PropTypes as MobxPropTypes } from 'mobx-react'; import { Link } from 'react-router'; import { defineMessages, intlShape } 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.recipes.nothingFound', defaultMessage: '!!!Sorry, but no service matched your search term. Please note that the website might show more services that have been added to Ferdi since the version that you are currently on. To get those new services, please consider upgrading to a newer version of Ferdi.', }, 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', }, }); export default @observer 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: '', }; static contextTypes = { intl: intlShape, }; render() { const { services, isLoading, toggleService, filterServices, resetFilter, goTo, servicesRequestFailed, retryServicesRequest, status, searchNeedle, } = this.props; const { intl } = this.context; return (
{intl.formatMessage(messages.noServicesAdded)}
{intl.formatMessage(messages.noServiceFound)}