added forgot password message to the login page

Signed-off-by: Andrii Podriez <andrey5577990@gmail.com>

src/pages/login/login-form.js

@@ -20,8 +20,10 @@ import { Form, Button, Col } from 'react-bootstrap';
 import { useDispatch } from 'react-redux';
 import { login } from '../../store/userSlice';
 import _ from 'lodash';
+import { sessionToken } from '../../localStorage';
+import RecoverPassword from './recover-password';
 
-const LoginForm = (props) => {
+const LoginForm = ({loginMessage, config}) => {
   const [username, setUsername] = useState('');
   const [password, setPassword] = useState('');
   const [forgottenPassword, setForgottenPassword] = useState(false)
@@ -66,10 +68,10 @@ const LoginForm = (props) => {
         </Col>
       </Form.Group>
 
-      {props.loginMessage &&
+      {loginMessage &&
         <div style={{ marginBottom: '20px', color: 'red', fontSize: 'small' }}>
           <Col sm={{ span: 10, offset: 2 }} style={{ paddingLeft: '5px' }}>
-            <i>Error: </i>{props.loginMessage}
+            <i>Error: </i>{loginMessage}
           </Col>
         </div>
       }
@@ -83,14 +85,14 @@ const LoginForm = (props) => {
         </Col>
       </Form.Group>
 
-      {/* <RecoverPassword show={forgottenPassword} onClose={() => setForgottenPassword(false)} sessionToken={props.sessionToken} /> */}
+      <RecoverPassword show={forgottenPassword} onClose={() => setForgottenPassword(false)} config={config} />
     </Form>
   );
 
-  if (props.config) {
-    let externalLogin = _.get(props.config, ['authentication', 'external', 'enabled'])
-    let provider = _.get(props.config, ['authentication', 'external', 'provider_name'])
-    let url = _.get(props.config, ['authentication', 'external', 'authorize_url']) + "?rd=/login/complete"
+  if (config) {
+    let externalLogin = _.get(config, ['authentication', 'external', 'enabled'])
+    let provider = _.get(config, ['authentication', 'external', 'provider_name'])
+    let url = _.get(config, ['authentication', 'external', 'authorize_url']) + "?rd=/login/complete"
 
     if (externalLogin && provider && url) {
       return [

src/pages/login/login.js

@@ -24,6 +24,7 @@ import LoginForm from './login-form';
 import Header from '../../common/header';
 import NotificationsDataManager from '../../common/data-managers/notifications-data-manager';
 import branding from '../../branding/branding';
+import { useGetConfigQuery } from '../../store/apiSlice';
 
 const Login = (props) => {
 
@@ -33,7 +34,7 @@ const Login = (props) => {
     NotificationsDataManager.setSystem(notificationSystem);
   }, []);
 
-  const config = null
+  const {data: config} = useGetConfigQuery();
 
   const currentUser = useSelector(state => state.user.currentUser);
   const loginMessage = useSelector(state => state.user.loginMessage);

src/pages/login/recover-password.js

@@ -0,0 +1,40 @@
+/**
+ * This file is part of VILLASweb.
+ *
+ * VILLASweb is free software: you can redistribute it and/or modify
+ * it under the terms of the GNU General Public License as published by
+ * the Free Software Foundation, either version 3 of the License, or
+ * (at your option) any later version.
+ *
+ * VILLASweb is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ * GNU General Public License for more details.
+ *
+ * You should have received a copy of the GNU General Public License
+ * along with VILLASweb. If not, see <http://www.gnu.org/licenses/>.
+ ******************************************************************************/
+
+import Dialog from "../../common/dialogs/dialog";
+import _ from 'lodash';
+
+const RecoverPassword = ({show, onClose, config}) => {
+    return (
+        <Dialog
+            show={show}
+            title="Recover password"
+            buttonTitle="Close"
+            onClose={(c) => onClose(c)}
+            blendOutCancel={true}
+            valid={true}
+        >
+            <div>
+            <h5>Please contact:</h5>
+            <div>{_.get(config, ['contact', 'name'])}</div>
+            <a href={`mailto:${_.get(config, ['contact', 'mail'])}`}>{_.get(config, ['contact', 'mail'])}</a>
+            </div>
+        </Dialog>
+    )
+}
+
+export default RecoverPassword;