Make desktop client compatible with Electron

daveajlee · Mar 13, 2024 · f1ca45d · f1ca45d
1 parent 0b9b90c
commit f1ca45d
Show file tree

Hide file tree

Showing 8 changed files with 29 additions and 7 deletions.
diff --git a/desktop/src/App.js b/desktop/src/App.js
@@ -33,7 +33,7 @@ function App() {
           const companies = res.data;
           setCompanies(companies);
         }).catch(error => {
-            console.log('No connection to API');
+            console.log('No connection to API available');
     })
   }, []);
 

diff --git a/desktop/src/assets/personalman-logo.png b/desktop/src/assets/personalman-logo.png
diff --git a/desktop/src/components/pages/ChangePassword/ChangePassword.js b/desktop/src/components/pages/ChangePassword/ChangePassword.js
@@ -4,6 +4,7 @@ import axios from "axios";
 import {useLocation, useNavigate} from "react-router-dom";
 import Header from "../../layout/Header/Header";
 import {useTranslation} from "react-i18next";
+import logo from './../../../assets/personalman-logo.png';
 
 /**
  * This is the page which allows the user to change their password assuming they known their old password. Otherwise,
@@ -119,7 +120,7 @@ function ChangePassword (props) {
         <Container fluid className="p-3 my-5 h-custom">
         <Row className="d-flex flex-row align-items-center justify-content-center">
             <Col>
-                <Image src="https://www.davelee.de/common/assets/img/portfolio/personalman-logo.png"
+                <Image src={logo}
                        className="d-block mx-auto img-fluid w-50" alt="PersonalMan Logo"/>
             </Col>
             <Col>

diff --git a/desktop/src/components/pages/ErrorPage/ErrorPage.js b/desktop/src/components/pages/ErrorPage/ErrorPage.js
@@ -1,5 +1,6 @@
 import React from "react";
 import {Col, Container, Image, Row} from "react-bootstrap";
+import logo from './../../../assets/personalman-logo.png';
 
 /**
  * This page is the error page which is displayed whenever the user visits an invalid url.
@@ -14,7 +15,7 @@ function ErrorPage() {
         <Container fluid className="p-3 my-5 h-custom">
             <Row className="d-flex flex-row align-items-center justify-content-center">
                 <Col>
-                    <Image src="https://www.davelee.de/common/assets/img/portfolio/personalman-logo.png"
+                    <Image src={logo}
                            className="d-block mx-auto img-fluid w-50" alt="PersonalMan Logo"/>
                 </Col>
                 <Col>

diff --git a/desktop/src/components/pages/Login/Login.js b/desktop/src/components/pages/Login/Login.js
@@ -3,6 +3,7 @@ import {Container, Col, Row, Form, Button, Image} from "react-bootstrap";
 import axios from 'axios';
 import {useNavigate} from "react-router-dom";
 import {useTranslation} from "react-i18next";
+import logo from './../../../assets/personalman-logo.png';
 
 /**
  * This component represents the login screen to allow users to login to PersonalMan.
@@ -89,7 +90,7 @@ function Login() {
     return (<Container fluid className="p-3 my-5 h-custom">
         <Row className="d-flex flex-row align-items-center justify-content-center">
             <Col>
-                <Image src="https://www.davelee.de/common/assets/img/portfolio/personalman-logo.png"
+                <Image src={logo}
                        className="d-block mx-auto img-fluid w-50" alt="PersonalMan Logo"/>
             </Col>
             <Col>

diff --git a/desktop/src/components/pages/RegisterCompany/RegisterCompany.js b/desktop/src/components/pages/RegisterCompany/RegisterCompany.js
@@ -3,6 +3,7 @@ import {Button, Col, Container, Form, Image, Row} from "react-bootstrap";
 import axios from "axios";
 import { useNavigate } from "react-router-dom";
 import {useTranslation} from "react-i18next";
+import logo from './../../../assets/personalman-logo.png';
 
 /**
  * This is the page which allows the user to register a new company in PersonalMan.
@@ -14,6 +15,7 @@ function RegisterCompany () {
     const [annualLeave, setAnnualLeave] = useState(20);
     const [country, setCountry] = useState("Germany");
     const navigate = useNavigate();
+    const [errorText, setErrorText] = useState("");
 
     const {t} = useTranslation();
 
@@ -54,6 +56,9 @@ function RegisterCompany () {
      * Register the new company by sending the request to the API. Display an alert and then move back to the home page.
      */
     function registerCompany() {
+        console.log('*****');
+        const userAgent = navigator.userAgent.toLowerCase();
+        console.log(userAgent);
         axios.post(process.env.REACT_APP_SERVER_URL  + '/company/', {
             name: name,
             defaultAnnualLeaveInDays: annualLeave,
@@ -62,8 +67,11 @@ function RegisterCompany () {
             if ( response.status === 201 ) {
                 alert('Thank you for registering for PersonalMan. You can now create users on the login page.')
                 navigate("/registerUser")
+            } else {
+                setErrorText('Server is not available. Please check the server is configured correctly.')
             }
         }).catch(function (error) {
+            setErrorText('Server is not available. Please check the server is configured correctly.')
             console.log(error);
         });
     }
@@ -74,14 +82,14 @@ function RegisterCompany () {
     return (<Container fluid className="p-3 my-5 h-custom">
         <Row className="d-flex flex-row align-items-center justify-content-center">
             <Col>
-                <Image src="https://www.davelee.de/common/assets/img/portfolio/personalman-logo.png"
+                <Image src={logo}
                        className="d-block mx-auto img-fluid w-50" alt="PersonalMan Logo"/>
             </Col>
             <Col>
                 <Container className="d-flex flex-row align-items-center justify-content-center mb-3">
                     <Row>
                         <Col>
-                            <h3>{t('registerCompanyTitle')}</h3>
+                            <h3>Test {t('registerCompanyTitle')}</h3>
                         </Col>
                     </Row>
                 </Container>
@@ -117,6 +125,14 @@ function RegisterCompany () {
                     </Form>
                 </Container>
 
+                <Container className='align-items-center justify-content-center text-md-start mt-4 pt-2'>
+                    <Row>
+                        <Col className="text-center">
+                            <h2 style={{color:`red`}}>{errorText}</h2>
+                        </Col>
+                    </Row>
+                </Container>
+
                 <Container className='align-items-center justify-content-center text-md-start mt-4 pt-2'>
                     <Row>
                         <Col className="text-center">

diff --git a/desktop/src/components/pages/RegisterUser/RegisterUser.js b/desktop/src/components/pages/RegisterUser/RegisterUser.js
@@ -2,6 +2,7 @@ import React from "react";
 import {Col, Container, Image, Row} from "react-bootstrap";
 import AddUserForm from "../../forms/AddUserForm/AddUserForm";
 import {useTranslation} from "react-i18next";
+import logo from './../../../assets/personalman-logo.png';
 
 /**
  * This is the page which allows the user to register themselves for PersonalMan.
@@ -17,7 +18,7 @@ function RegisterUser () {
     return (<Container fluid className="p-3 my-5 h-custom">
         <Row className="d-flex flex-row align-items-center justify-content-center">
             <Col>
-                <Image src="https://www.davelee.de/common/assets/img/portfolio/personalman-logo.png"
+                <Image src={logo}
                        className="d-block mx-auto img-fluid w-50" alt="PersonalMan Logo"/>
             </Col>
             <Col>

diff --git a/desktop/src/electron-starter.js b/desktop/src/electron-starter.js
@@ -52,6 +52,8 @@ function createWindow() {
         })
     })
 
+    mainWindow.openDevTools();
+
     // Emitted when the window is closed.
     mainWindow.on('closed', function () {
         // Dereference the window object, usually you would store windows