@teachfloor/extension-kit/dist/ui/NotFoundView.js

Teachfloor Extension Kit

"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.NotFoundView = void 0;
var _react = _interopRequireDefault(require("react"));
var _ = require("../");
var _2 = require(".");
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
const getViewportName = function () {
  let viewport = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : '';
  const words = viewport.split('.');

  /**
   * Remove teachfloor namespace
   */
  if (words[0] === 'teachfloor') {
    words.shift();
  }

  /**
   * Remove dashboard namespace
   */
  if (words[0] === 'dashboard') {
    words.shift();
  }

  /**
   * Capitalize each word and join them with spaces
   */
  const friendlyName = words.map(word => word.charAt(0).toUpperCase() + word.slice(1).replace(/_/g, ' ')).join(' ');
  return friendlyName;
};
const NotFoundView = _ref => {
  let {
    name = null,
    views = null
  } = _ref;
  const {
    appContext,
    environment
  } = (0, _.useExtensionContext)();
  const getAvailableViews = () => {
    if (views) {
      return views;
    }
    return (appContext?.views || []

    /**
     * Avoid recognizing `settings` as a ui_extension view
     */).filter(view => view !== 'settings');
  };
  const getAppName = () => {
    if (name) {
      return name;
    }
    return appContext?.name || '';
  };
  const renderText = () => {
    if (getAppName()) {
      return /*#__PURE__*/_react.default.createElement(_2.Text, {
        ta: "center",
        fw: 600
      }, `Choose a page below to get started with ${getAppName()}`);
    }
    return /*#__PURE__*/_react.default.createElement(_2.Text, {
      ta: "center",
      fw: 600
    }, "Choose a page below to get started");
  };
  const renderAvailableViews = () => getAvailableViews().map(view => /*#__PURE__*/_react.default.createElement(_2.Button, {
    key: view,
    variant: "default",
    size: "xs",
    onClick: () => (0, _.goToViewport)(view)
  }, getViewportName(view)));
  if (!getAvailableViews().length) {
    return null;
  }
  return /*#__PURE__*/_react.default.createElement(_2.Container, {
    p: "xl"
  }, /*#__PURE__*/_react.default.createElement(_2.SimpleGrid, null, renderText(), /*#__PURE__*/_react.default.createElement(_2.SimpleGrid, {
    verticalSpacing: "xs"
  }, renderAvailableViews())));
};
exports.NotFoundView = NotFoundView;