@agilemotion/oui-react-js 1.2.7 → 1.2.9

package/dist/view/security/ForgotPasswordBasic.js

@@ -0,0 +1,212 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _react = _interopRequireDefault(require("react"));
+
+var _Security = require("./Security");
+
+var _reactRedux = require("react-redux");
+
+var _redux = require("redux");
+
+var _DashboardStore = require("../../redux/store/DashboardStore");
+
+var _reactRouterDom = require("react-router-dom");
+
+var _ApplicationContext = _interopRequireDefault(require("./../../ApplicationContext"));
+
+var _Footer = _interopRequireDefault(require("../../components/footer/Footer"));
+
+var _loginBasicStyle = _interopRequireDefault(require("../../assets/jss/views/loginBasicStyle"));
+
+var _Utils = _interopRequireDefault(require("../../Utils"));
+
+var _Paper = _interopRequireDefault(require("@material-ui/core/Paper"));
+
+var _Button = _interopRequireDefault(require("@material-ui/core/Button"));
+
+var _Alert = _interopRequireDefault(require("react-bootstrap/Alert"));
+
+var _TextField = _interopRequireDefault(require("@material-ui/core/TextField"));
+
+var _Lock = _interopRequireDefault(require("@material-ui/icons/Lock"));
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
+
+function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+
+function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
+
+function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
+
+function _iterableToArrayLimit(arr, i) { if (typeof Symbol === "undefined" || !(Symbol.iterator in Object(arr))) return; var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
+
+function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
+
+const ResetPassword = props => {
+  const _React$useState = _react.default.useState(""),
+        _React$useState2 = _slicedToArray(_React$useState, 2),
+        username = _React$useState2[0],
+        setUsername = _React$useState2[1];
+
+  const _React$useState3 = _react.default.useState(null),
+        _React$useState4 = _slicedToArray(_React$useState3, 2),
+        message = _React$useState4[0],
+        setMessage = _React$useState4[1];
+
+  const _React$useState5 = _react.default.useState(null),
+        _React$useState6 = _slicedToArray(_React$useState5, 2),
+        messageTitle = _React$useState6[0],
+        setMessageTitle = _React$useState6[1];
+
+  const _React$useState7 = _react.default.useState(""),
+        _React$useState8 = _slicedToArray(_React$useState7, 2),
+        alertVariant = _React$useState8[0],
+        setAlertVariant = _React$useState8[1];
+
+  const _React$useState9 = _react.default.useState(false),
+        _React$useState10 = _slicedToArray(_React$useState9, 2),
+        usernameError = _React$useState10[0],
+        setUsernameError = _React$useState10[1];
+
+  const _React$useState11 = _react.default.useState(false),
+        _React$useState12 = _slicedToArray(_React$useState11, 2),
+        isLoading = _React$useState12[0],
+        setIsLoading = _React$useState12[1];
+
+  const _React$useState13 = _react.default.useState(null),
+        _React$useState14 = _slicedToArray(_React$useState13, 2),
+        showPassword = _React$useState14[0],
+        setShowPassword = _React$useState14[1];
+
+  const handleClickShowPassword = () => {
+    setShowPassword(!showPassword);
+  };
+
+  const sendCode = () => {
+    if (!_Utils.default.isNull(username) && username.trim().length > 0) {
+      setIsLoading(true);
+      (0, _Security.forgotPassword)(props.url, username, (codeSent, message) => {
+        setIsLoading(false);
+        setUsername(null);
+        setMessageTitle("Password Reset");
+        setMessage(message);
+        setAlertVariant('success');
+      }, errorMessage => {
+        setIsLoading(false);
+        setMessageTitle("Password Reset Error!");
+        setMessage(errorMessage);
+        setAlertVariant('danger');
+      });
+    } else {
+      setUsernameError(true);
+    }
+  };
+
+  const handleMouseDownPassword = event => {
+    event.preventDefault();
+  };
+
+  _react.default.useEffect(() => {
+    _ApplicationContext.default.clear();
+  });
+
+  return /*#__PURE__*/_react.default.createElement("div", {
+    style: {
+      backgroundColor: props.background,
+      height: '100%',
+      width: '100%'
+    }
+  }, /*#__PURE__*/_react.default.createElement("div", {
+    style: {
+      height: '92%',
+      width: '100%',
+      margin: 'auto',
+      paddingTop: 'calc(100vh/6)'
+    }
+  }, /*#__PURE__*/_react.default.createElement("div", {
+    style: {
+      maxWidth: '400px',
+      margin: 'auto'
+    }
+  }, /*#__PURE__*/_react.default.createElement("div", {
+    className: "row",
+    style: _loginBasicStyle.default.title
+  }, /*#__PURE__*/_react.default.createElement("div", {
+    style: {
+      width: '30%',
+      textAlign: 'right'
+    },
+    className: 'col-*-*'
+  }, /*#__PURE__*/_react.default.createElement("img", {
+    src: props.logo,
+    alt: "..."
+  })), /*#__PURE__*/_react.default.createElement("div", {
+    style: {
+      width: '70%',
+      textAlign: 'left',
+      margin: 'auto',
+      paddingLeft: '16px'
+    },
+    className: 'col-*-*'
+  }, props.title)), !_Utils.default.isNull(message) ? /*#__PURE__*/_react.default.createElement(_Alert.default, {
+    variant: alertVariant,
+    show: !_Utils.default.isNull(message),
+    onClose: () => setMessage(null),
+    dismissible: true
+  }, /*#__PURE__*/_react.default.createElement(_Alert.default.Heading, null, messageTitle), /*#__PURE__*/_react.default.createElement("p", null, message)) : "", /*#__PURE__*/_react.default.createElement("div", {
+    style: _loginBasicStyle.default.loginContainer
+  }, /*#__PURE__*/_react.default.createElement(_Paper.default, {
+    style: _loginBasicStyle.default.paper
+  }, /*#__PURE__*/_react.default.createElement("form", null, /*#__PURE__*/_react.default.createElement(_TextField.default, {
+    id: "username",
+    required: true,
+    label: "Username",
+    error: usernameError,
+    value: username || '',
+    onChange: e => {
+      let usernamePresent = !_Utils.default.isNull(e.target.value) && e.target.value.trim().length > 0;
+      setUsername(e.target.value);
+      setUsernameError(!usernamePresent);
+    },
+    margin: "normal",
+    variant: "outlined",
+    style: {
+      minWidth: "200px",
+      width: "100%"
+    }
+  }), /*#__PURE__*/_react.default.createElement("div", {
+    className: "w-100"
+  }, /*#__PURE__*/_react.default.createElement(_Button.default, {
+    onClick: () => sendCode(),
+    variant: "contained",
+    color: "primary",
+    fullWidth: true,
+    disabled: isLoading,
+    style: _loginBasicStyle.default.loginBtn
+  }, isLoading && /*#__PURE__*/_react.default.createElement("i", {
+    className: "fa fa-refresh fa-spin",
+    style: {
+      marginRight: "8px"
+    }
+  }), isLoading && /*#__PURE__*/_react.default.createElement("span", null, "LOADING..."), !isLoading && /*#__PURE__*/_react.default.createElement("span", null, "RESET PASSWORD"))))), /*#__PURE__*/_react.default.createElement("div", {
+    style: _loginBasicStyle.default.buttonsDiv
+  }, /*#__PURE__*/_react.default.createElement(_Button.default, {
+    label: "Back to Login",
+    href: "/login",
+    style: _loginBasicStyle.default.flatButton,
+    startIcon: /*#__PURE__*/_react.default.createElement(_Lock.default, null)
+  }, "Back to Login"))))), /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement(_Footer.default, {
+    white: true
+  })));
+};
+
+var _default = (0, _reactRouterDom.withRouter)((0, _reactRedux.connect)(dispatch => (0, _redux.bindActionCreators)(_DashboardStore.actionCreators, dispatch))(ResetPassword));
+
+exports.default = _default;

package/dist/view/security/Login.js

@@ -0,0 +1,278 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _react = _interopRequireDefault(require("react"));
+
+var _security = require("./security");
+
+var _IconButton = _interopRequireDefault(require("@material-ui/core/IconButton"));
+
+var _Visibility = _interopRequireDefault(require("@material-ui/icons/Visibility"));
+
+var _VisibilityOff = _interopRequireDefault(require("@material-ui/icons/VisibilityOff"));
+
+var _reactRedux = require("react-redux");
+
+var _redux = require("redux");
+
+var _DashboardStore = require("../../redux/store/DashboardStore");
+
+var _reactRouterDom = require("react-router-dom");
+
+var _ApplicationContext = _interopRequireDefault(require("./../../ApplicationContext"));
+
+var _styles = require("@material-ui/core/styles");
+
+var _InputAdornment = _interopRequireDefault(require("@material-ui/core/InputAdornment"));
+
+var _Face = _interopRequireDefault(require("@material-ui/icons/Face"));
+
+var _AuthNavbar = _interopRequireDefault(require("../../components/navbars/AuthNavbar"));
+
+var _Footer = _interopRequireDefault(require("../../components/footer/Footer"));
+
+var _GridContainer = _interopRequireDefault(require("../../components/grid/GridContainer"));
+
+var _GridItem = _interopRequireDefault(require("../../components/grid/GridItem"));
+
+var _Card = _interopRequireDefault(require("../../components/card/Card"));
+
+var _CardBody = _interopRequireDefault(require("../../components/card/CardBody"));
+
+var _CardHeader = _interopRequireDefault(require("../../components/card/CardHeader"));
+
+var _CardFooter = _interopRequireDefault(require("../../components/card/CardFooter"));
+
+var _CustomInput = _interopRequireDefault(require("../../components/customInput/CustomInput"));
+
+var _RegularButton = _interopRequireDefault(require("../../components/RegularButton"));
+
+var _loginStyle = _interopRequireDefault(require("../../assets/jss/views/loginStyle"));
+
+var _Danger = _interopRequireDefault(require("../../components/typography/Danger"));
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
+
+function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+
+function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
+
+function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
+
+function _iterableToArrayLimit(arr, i) { if (typeof Symbol === "undefined" || !(Symbol.iterator in Object(arr))) return; var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
+
+function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
+
+const useStyles = (0, _styles.makeStyles)(_loginStyle.default);
+
+const Login = props => {
+  const _React$useState = _react.default.useState(""),
+        _React$useState2 = _slicedToArray(_React$useState, 2),
+        username = _React$useState2[0],
+        setUsername = _React$useState2[1];
+
+  const _React$useState3 = _react.default.useState(""),
+        _React$useState4 = _slicedToArray(_React$useState3, 2),
+        usernameState = _React$useState4[0],
+        setUsernameState = _React$useState4[1];
+
+  const _React$useState5 = _react.default.useState(""),
+        _React$useState6 = _slicedToArray(_React$useState5, 2),
+        password = _React$useState6[0],
+        setPassword = _React$useState6[1];
+
+  const _React$useState7 = _react.default.useState(""),
+        _React$useState8 = _slicedToArray(_React$useState7, 2),
+        passwordState = _React$useState8[0],
+        setPasswordState = _React$useState8[1];
+
+  const _React$useState9 = _react.default.useState(false),
+        _React$useState10 = _slicedToArray(_React$useState9, 2),
+        isLoading = _React$useState10[0],
+        setIsLoading = _React$useState10[1];
+
+  const _React$useState11 = _react.default.useState(null),
+        _React$useState12 = _slicedToArray(_React$useState11, 2),
+        showPassword = _React$useState12[0],
+        setShowPassword = _React$useState12[1];
+
+  const _React$useState13 = _react.default.useState(null),
+        _React$useState14 = _slicedToArray(_React$useState13, 2),
+        errorMessage = _React$useState14[0],
+        setErrorMessage = _React$useState14[1];
+
+  const _React$useState15 = _react.default.useState("cardHidden"),
+        _React$useState16 = _slicedToArray(_React$useState15, 2),
+        cardAnimation = _React$useState16[0],
+        setCardAnimation = _React$useState16[1];
+
+  _react.default.useEffect(() => {
+    let id = setTimeout(function () {
+      setCardAnimation("");
+    }, 700);
+    document.body.style.overflow = "unset";
+    return function cleanup() {
+      window.clearTimeout(id);
+    };
+  });
+
+  const classes = useStyles();
+
+  const handleClickShowPassword = () => {
+    setShowPassword(!showPassword);
+  };
+
+  const fireLogin = () => {
+    if (username === "") {
+      setUsernameState("error");
+    }
+
+    if (password === "") {
+      setPasswordState("error");
+    }
+
+    if (username && password) {
+      setIsLoading(true);
+      (0, _security.login)(props.url, username, password, authenticated => {
+        setIsLoading(false);
+
+        if (authenticated) {
+          props.history.push('/home');
+        }
+      }, errorMessage => {
+        setIsLoading(false);
+        setErrorMessage(errorMessage);
+      });
+    }
+  };
+
+  const handleMouseDownPassword = event => {
+    event.preventDefault();
+  };
+
+  _react.default.useEffect(() => {
+    _ApplicationContext.default.clear();
+  });
+
+  return /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement(_AuthNavbar.default, {
+    brandText: " Business Agility "
+  }), /*#__PURE__*/_react.default.createElement("div", {
+    className: classes.wrapper
+  }, /*#__PURE__*/_react.default.createElement("div", {
+    className: classes.fullPage,
+    style: {
+      backgroundImage: require('../../assets/img/login.jpeg')
+    }
+  }, /*#__PURE__*/_react.default.createElement("div", {
+    className: classes.container
+  }, /*#__PURE__*/_react.default.createElement(_GridContainer.default, {
+    justify: "center"
+  }, /*#__PURE__*/_react.default.createElement(_GridItem.default, {
+    xs: 12,
+    sm: 6,
+    md: 4
+  }, /*#__PURE__*/_react.default.createElement("form", null, /*#__PURE__*/_react.default.createElement(_Card.default, {
+    login: true,
+    className: classes[cardAnimation]
+  }, /*#__PURE__*/_react.default.createElement(_CardHeader.default, {
+    className: "".concat(classes.cardHeader, " ").concat(classes.textCenter),
+    color: "rose"
+  }, /*#__PURE__*/_react.default.createElement("h4", {
+    className: classes.cardTitle
+  }, " Log in "), /*#__PURE__*/_react.default.createElement("div", {
+    className: classes.socialLine
+  }, ["fa fa-lock"].map((prop, key) => {
+    return /*#__PURE__*/_react.default.createElement(_RegularButton.default, {
+      color: "transparent",
+      justIcon: true,
+      key: key,
+      className: classes.customButtonClass
+    }, /*#__PURE__*/_react.default.createElement("i", {
+      className: prop
+    }));
+  }))), errorMessage ? /*#__PURE__*/_react.default.createElement(_CardHeader.default, {
+    className: "".concat(classes.textCenter)
+  }, /*#__PURE__*/_react.default.createElement(_Danger.default, null, errorMessage)) : null, usernameState === "error" ? /*#__PURE__*/_react.default.createElement(_CardHeader.default, {
+    className: "".concat(classes.textCenter)
+  }, /*#__PURE__*/_react.default.createElement(_Danger.default, null, "Username is required")) : null, passwordState === "error" ? /*#__PURE__*/_react.default.createElement(_CardHeader.default, {
+    className: "".concat(classes.textCenter)
+  }, /*#__PURE__*/_react.default.createElement(_Danger.default, null, "Password is required")) : null, /*#__PURE__*/_react.default.createElement(_CardBody.default, null, /*#__PURE__*/_react.default.createElement(_CustomInput.default, {
+    labelText: "Username",
+    id: "username",
+    formControlProps: {
+      fullWidth: true
+    },
+    success: usernameState === "success",
+    error: usernameState === "error",
+    inputProps: {
+      endAdornment: /*#__PURE__*/_react.default.createElement(_InputAdornment.default, {
+        position: "end"
+      }, /*#__PURE__*/_react.default.createElement(_Face.default, {
+        className: classes.inputAdornmentIcon
+      })),
+      value: username,
+      onChange: e => {
+        setUsername(e.target.value);
+      }
+    }
+  }), /*#__PURE__*/_react.default.createElement(_CustomInput.default, {
+    labelText: "Password",
+    id: "password",
+    type: showPassword ? 'text' : 'password',
+    success: passwordState === "success",
+    error: passwordState === "error",
+    formControlProps: {
+      fullWidth: true
+    },
+    inputProps: {
+      endAdornment: /*#__PURE__*/_react.default.createElement(_InputAdornment.default, {
+        position: "end"
+      }, /*#__PURE__*/_react.default.createElement(_IconButton.default, {
+        "aria-label": "toggle password visibility",
+        onClick: handleClickShowPassword,
+        onMouseDown: handleMouseDownPassword,
+        edge: "end"
+      }, showPassword ? /*#__PURE__*/_react.default.createElement(_Visibility.default, null) : /*#__PURE__*/_react.default.createElement(_VisibilityOff.default, null))),
+      type: showPassword ? "text" : "password",
+      autoComplete: "off",
+      required: true,
+      value: password,
+      onChange: e => {
+        setPassword(e.target.value);
+      }
+    }
+  }), /*#__PURE__*/_react.default.createElement("div", {
+    className: classes.right
+  }, /*#__PURE__*/_react.default.createElement("a", {
+    href: "/forgot-password",
+    style: {
+      color: "#22A7F0"
+    }
+  }, "Forgot Password?"))), /*#__PURE__*/_react.default.createElement(_CardFooter.default, {
+    className: classes.justifyContentCenter
+  }, /*#__PURE__*/_react.default.createElement(_RegularButton.default, {
+    color: "rose",
+    simple: true,
+    size: "lg",
+    block: true,
+    onClick: () => fireLogin(),
+    disabled: isLoading
+  }, isLoading && /*#__PURE__*/_react.default.createElement("i", {
+    className: "fa fa-refresh fa-spin",
+    style: {
+      marginRight: "8px"
+    }
+  }), isLoading && /*#__PURE__*/_react.default.createElement("span", null, "LOADING..."), !isLoading && /*#__PURE__*/_react.default.createElement("span", null, "LOGIN"))))))), /*#__PURE__*/_react.default.createElement(_Footer.default, {
+    white: true
+  })))));
+};
+
+var _default = (0, _reactRouterDom.withRouter)((0, _reactRedux.connect)(dispatch => (0, _redux.bindActionCreators)(_DashboardStore.actionCreators, dispatch))(Login));
+
+exports.default = _default;