asab_webui_shell 25.1.1

package/dist/modules/auth/components/SessionExpirationAlert.js

@@ -0,0 +1,35 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.SessionExpirationAlert = SessionExpirationAlert;
+var _react = _interopRequireDefault(require("react"));
+var _reactI18next = require("react-i18next");
+var _reactstrap = require("reactstrap");
+// Session expiration custom Alert component
+function SessionExpirationAlert(_ref) {
+  var alert = _ref.alert,
+    store = _ref.store;
+  var _useTranslation = (0, _reactI18next.useTranslation)(),
+    t = _useTranslation.t; // Use the hook inside the functional component
+
+  return /*#__PURE__*/_react["default"].createElement(_reactstrap.Alert, {
+    key: alert.key,
+    color: alert.level,
+    fade: true,
+    isOpen: !alert.acked
+  }, /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, /*#__PURE__*/_react["default"].createElement("h5", null, t(alert.message)), /*#__PURE__*/_react["default"].createElement("div", {
+    onClick: function onClick() {
+      return window.location.reload();
+    },
+    className: "mt-2",
+    style: {
+      whiteSpace: 'pre-wrap',
+      fontWeight: 'bold',
+      cursor: 'pointer',
+      textDecoration: 'underline'
+    }
+  }, t('ASABAuthModule|Click here to proceed to login.'))));
+}

package/dist/modules/auth/header.js

@@ -0,0 +1,109 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.AuthHeaderDropdown = AuthHeaderDropdown;
+exports.AuthHeaderInvitation = AuthHeaderInvitation;
+var _react = _interopRequireDefault(require("react"));
+var _reactRedux = require("react-redux");
+var _reactRouterDom = require("react-router-dom");
+var _reactI18next = require("react-i18next");
+var _asab_webui_components = require("asab_webui_components");
+var _reactstrap = require("reactstrap");
+require("./header.scss");
+/*
+
+	Language localizations for auth HeaderComponent can be added to the translation.json files of
+	public/locales/en & public/locales/cs of the product where HeaderComponent is used.
+
+	Example:
+
+	{
+		'AuthHeader': {
+			'My account': 'My account',
+			'Access control': 'Access control',
+			'Manage': 'Manage',
+			'Change a password': 'Change a password',
+			'Logout': 'Logout',
+			...
+		}
+	}
+
+*/
+
+function AuthHeaderInvitation(props) {
+  var resources = (0, _reactRedux.useSelector)(function (state) {
+    var _state$auth;
+    return (_state$auth = state.auth) === null || _state$auth === void 0 ? void 0 : _state$auth.resources;
+  });
+  var tenant = (0, _reactRedux.useSelector)(function (state) {
+    var _state$tenant;
+    return (_state$tenant = state.tenant) === null || _state$tenant === void 0 ? void 0 : _state$tenant.current;
+  });
+  var navigate = (0, _reactRouterDom.useNavigate)();
+  var _useTranslation = (0, _reactI18next.useTranslation)(),
+    t = _useTranslation.t;
+  if (!tenant || !(0, _asab_webui_components.isAuthorized)(['seacat:tenant:assign'])) {
+    return null;
+  }
+  ;
+  return /*#__PURE__*/_react["default"].createElement(_reactstrap.Button, {
+    outline: true,
+    onClick: function onClick(e) {
+      e.preventDefault(), navigate('/auth/invite');
+    },
+    title: t('AuthHeader|Invite other users'),
+    className: "invite-nav-button",
+    color: "primary"
+  }, /*#__PURE__*/_react["default"].createElement("i", {
+    className: "bi bi-person-plus me-2"
+  }), t('AuthHeader|Invite other users'));
+}
+function AuthHeaderDropdown(props) {
+  var _useTranslation2 = (0, _reactI18next.useTranslation)(),
+    t = _useTranslation2.t;
+  var userinfo = (0, _reactRedux.useSelector)(function (state) {
+    var _state$auth2;
+    return (_state$auth2 = state.auth) === null || _state$auth2 === void 0 ? void 0 : _state$auth2.userinfo;
+  });
+  var isSuperuser = (0, _asab_webui_components.isAuthorized)(['authz:superuser']);
+  var logout = function logout() {
+    props.AuthModule.logout();
+  };
+  return /*#__PURE__*/_react["default"].createElement(_reactstrap.UncontrolledDropdown, {
+    direction: "down"
+  }, /*#__PURE__*/_react["default"].createElement(_reactstrap.DropdownToggle, {
+    nav: true,
+    caret: true,
+    title: isSuperuser ? t('AuthHeader|You have superuser privileges. Act responsibly.') : userinfo === null || userinfo === void 0 ? void 0 : userinfo.sub,
+    className: isSuperuser ? 'text-warning' : ''
+  }, userinfo !== null && userinfo !== void 0 && userinfo.picture ? /*#__PURE__*/_react["default"].createElement("img", {
+    src: userinfo === null || userinfo === void 0 ? void 0 : userinfo.picture,
+    className: "img-avatar",
+    alt: userinfo === null || userinfo === void 0 ? void 0 : userinfo.username
+  }) : /*#__PURE__*/_react["default"].createElement("i", {
+    alt: userinfo === null || userinfo === void 0 ? void 0 : userinfo.username,
+    className: "pe-2 bi ".concat(isSuperuser ? 'bi-universal-access' : 'bi-person-gear')
+  }), /*#__PURE__*/_react["default"].createElement("span", null, userinfo === null || userinfo === void 0 ? void 0 : userinfo.username)), /*#__PURE__*/_react["default"].createElement(_reactstrap.DropdownMenu, {
+    className: "shadow"
+  }, /*#__PURE__*/_react["default"].createElement(_reactstrap.DropdownItem, {
+    header: true
+  }, t('AuthHeader|My account')), /*#__PURE__*/_react["default"].createElement(_reactstrap.DropdownItem, {
+    tag: _reactRouterDom.Link,
+    to: "/auth/access-control"
+  }, t('AuthHeader|Access control')), /*#__PURE__*/_react["default"].createElement(_reactstrap.DropdownItem, {
+    tag: _reactRouterDom.Link,
+    to: "/account"
+  }, t('AuthHeader|Account settings')), /*#__PURE__*/_react["default"].createElement(_reactstrap.DropdownItem, {
+    tag: _reactRouterDom.Link,
+    to: "/account/password"
+  }, t('AuthHeader|Change password')), /*#__PURE__*/_react["default"].createElement(_reactstrap.DropdownItem, {
+    onClick: function onClick() {
+      logout();
+    }
+  }, /*#__PURE__*/_react["default"].createElement("span", {
+    className: "text-danger"
+  }, t('AuthHeader|Log out')))));
+}

package/dist/modules/auth/header.scss

@@ -0,0 +1,9 @@
+.invite-nav-button {
+	border: 1px solid var(--bs-primary) !important;
+	padding: 1px !important;
+	padding-left: 4px !important;
+	padding-right: 4px !important;
+	&:hover {
+		border: 1px solid transparent !important;
+	}
+}