ScreenState.js 2.8 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849
  1. var _excluded = ["translations"];
  2. function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
  3. function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
  4. function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
  5. import React from 'react';
  6. import { ErrorScreen } from './ErrorScreen';
  7. import { NoResultsScreen } from './NoResultsScreen';
  8. import { ResultsScreen } from './ResultsScreen';
  9. import { StartScreen } from './StartScreen';
  10. export var ScreenState = React.memo(function (_ref) {
  11. var _ref$translations = _ref.translations,
  12. translations = _ref$translations === void 0 ? {} : _ref$translations,
  13. props = _objectWithoutProperties(_ref, _excluded);
  14. if (props.state.status === 'error') {
  15. return /*#__PURE__*/React.createElement(ErrorScreen, {
  16. translations: translations === null || translations === void 0 ? void 0 : translations.errorScreen
  17. });
  18. }
  19. var hasCollections = props.state.collections.some(function (collection) {
  20. return collection.items.length > 0;
  21. });
  22. if (!props.state.query) {
  23. return /*#__PURE__*/React.createElement(StartScreen, _extends({}, props, {
  24. hasCollections: hasCollections,
  25. translations: translations === null || translations === void 0 ? void 0 : translations.startScreen
  26. }));
  27. }
  28. if (hasCollections === false) {
  29. return /*#__PURE__*/React.createElement(NoResultsScreen, _extends({}, props, {
  30. translations: translations === null || translations === void 0 ? void 0 : translations.noResultsScreen
  31. }));
  32. }
  33. return /*#__PURE__*/React.createElement(ResultsScreen, props);
  34. }, function areEqual(_prevProps, nextProps) {
  35. // We don't update the screen when Autocomplete is loading or stalled to
  36. // avoid UI flashes:
  37. // - Empty screen → Results screen
  38. // - NoResults screen → NoResults screen with another query
  39. return nextProps.state.status === 'loading' || nextProps.state.status === 'stalled';
  40. });