Merge branch 'master' into user-settings

.github/workflows/cypress-e2e-tests.yml

@@ -0,0 +1,23 @@
+name: Cypress Tests
+
+on: push
+
+jobs:
+  cypress-run:
+    runs-on: ubuntu-22.04
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v4
+      - name: Setup Node
+        uses: actions/setup-node@v4
+        with:
+          node-version: 20.9.0
+      # Install NPM dependencies, cache them correctly
+      # and run all Cypress tests
+      - name: Cypress run
+        uses: cypress-io/github-action@v6
+        with:
+          start: docker compose -f docker-compose-all.yml up
+          wait-on: http://localhost:8080/swagger/index.html
+          browser: chrome
+          config: baseUrl=http://localhost

cypress/e2e/main_page.cy.js

@@ -0,0 +1,5 @@
+describe('main page', () => {
+  it('successfully loads', () => {
+    cy.visit('/')
+  })
+})

cypress/e2e/registration.cy.js

@@ -0,0 +1,13 @@
+describe('registration page', () => {
+
+    it('registers user', () => {
+        cy.visit('/register')
+
+        cy.get('input[id^=username]').type('jp2')
+        cy.get('input[id^=email]').type('[email protected]')
+        cy.get('input[id^=password]').type('barka2137')
+        cy.get('input[id^=repeatPassword]').type('barka2137')
+
+        cy.get('form').submit()
+    })
+})

docker-compose-all.yml

@@ -0,0 +1,46 @@
+version: '3.8'
+
+services:
+
+  bot_wars_db:
+    image: "mcr.microsoft.com/mssql/server:2022-latest"
+    ports:
+      - "1433:1433"
+    environment:
+      SA_PASSWORD: "Sqlhaslo123!"
+      ACCEPT_EULA: "Y"
+      MSSQL_PID: "Evaluation"
+    volumes:
+      - bot_wars_db:/var/lib/mssql
+
+  bot_wars_api:
+    image: stanislawmalinski/bot-wars-api:latest
+    ports:
+      - "8080:8080"
+      - "8081:8081"
+    depends_on:
+      - bot_wars_db
+    command:
+      - /bin/sh
+      - -c
+      - |
+        sleep 5
+        dotnet ef migrations add migration
+        dotnet ef database update
+
+  bot_wars_front:
+    build: .
+    ports:
+      - "3000:80"
+
+  proxy:
+    build: ./proxy
+    ports:
+      - "80:80"
+    depends_on:
+      - bot_wars_front
+      - bot_wars_api
+
+volumes:
+  bot_wars_db:
+    driver: local

docker-compose-backend.yml

@@ -0,0 +1,33 @@
+version: '3.8'
+
+services:
+
+    bot_wars_db:
+        image: "mcr.microsoft.com/mssql/server:2022-latest"
+        ports:
+          - "1433:1433"
+        environment:
+            SA_PASSWORD: "Sqlhaslo123!"
+            ACCEPT_EULA: "Y"
+            MSSQL_PID: "Evaluation"
+        volumes:
+            - bot_wars_db:/var/lib/mssql
+
+    bot_wars_api:
+        image: stanislawmalinski/bot-wars-api:latest
+        ports:
+            - "8080:8080"
+            - "8081:8081"
+        depends_on:
+            - bot_wars_db
+        command: 
+            - /bin/sh
+            - -c
+            - |
+               sleep 5
+               dotnet ef migrations add migration
+               dotnet ef database update
+
+volumes:
+  bot_wars_db:
+    driver: local

proxy/Dockerfile

@@ -0,0 +1,3 @@
+FROM nginx:latest
+
+COPY nginx.conf /etc/nginx/nginx.conf

proxy/nginx.conf

@@ -0,0 +1,15 @@
+events {}
+
+http {
+    server {
+        listen 80;
+
+        location /api/ {
+          proxy_pass http://bot_wars_api:8080/api/;
+        }
+
+        location / {
+          proxy_pass http://bot_wars_front:80/;
+        }
+    }
+}

src/App.js

@@ -7,7 +7,7 @@ function App() {
         <div className="app">
             <div className="title">
                 <h1>Bot-Wars</h1>
-                <div className="login-btn">
+                <div className="login-btns">
                     <User isLoggedIn={false}/>
                 </div>
             </div>

src/App.scss

@@ -12,9 +12,10 @@
 
   .title {
     overflow: auto;
+    padding: 10px;
   }
 
-  .login-btn {
+  .login-btns {
     float: right;
   }
 
@@ -40,4 +41,8 @@
       width: 100%
     }
   }
+
+  .login-btn {
+    width: 100%;
+  }
 }

src/User/User.js

@@ -5,28 +5,21 @@ import {Link} from "react-router-dom";
 
 function User({ isAuthenticated, user, login, logout }) {
     return (
-      <div>
+        <>
         {isAuthenticated ? (
           <button onClick={logout}>Logout</button>
         ) : (
-          <>
-          <button>
-          <Link to="login">
-              Login
+        <>
+          <Link to="/login">
+              <button className="login-btn">Login</button>
           </Link>
-          </button>
-
-          <button>
-          <Link to="register">
-            Register
+          <Link to="/register">
+              <button className="login-btn">Register</button>
           </Link>
-          </button>
-          <button onClick={() => login({ username: 'exampleUser' })}>
-            test
-          </button>
+
         </>
         )}
-      </div>
+        </>
     );
   }
 

src/User/store.js

@@ -27,19 +27,14 @@ const authReducer = (state = initialState, action) => {
   }
 };
 
-// Configuration for redux-persist using sessionStorage
 const persistConfig = {
   key: 'root',
-  storage, // Use sessionStorage
+  storage, 
 };
 
-// Wrap the reducer with redux-persist
 const persistedReducer = persistReducer(persistConfig, authReducer);
-
-// Create store with persisted reducer
 const store = createStore(persistedReducer);
 
-// Create a persistor object
 export const persistor = persistStore(store);
 
 export default store;

src/forms/AddGameForm.js

@@ -1,17 +1,31 @@
 import './AddGameForm.scss'
 import './Form.scss'
 import React, {useState} from "react";
+import {GameService} from "../services/GameService";
 
-function AddGameForm() {
+function AddGameForm({isAuthenticated, user, login, logout}) {
     const [name, setName] = useState('');
     const [description, setDescription] = useState('');
     const [file, setFile] = useState('');
+    const [message, setMessage] = useState(true);
+
+    const handleSubmit = async (e) => {
+        e.preventDefault();
+
+        try {
+            console.log(name,description)
+            const response = await GameService.addGameType(10,name,description,"string",true)
+            setMessage('Game added succesfully')
+        } catch (e) {
+            setMessage('There was a problem with adding game.')
+        }
+    };
 
     return (
         <div className="add-game-form">
             <div className="form">
                 <h1>Add a new type of game</h1>
-                <form>
+                <form onSubmit={handleSubmit}>
                     <div className="form-group">
                         <label htmlFor="title">Name:</label>
                         <input
@@ -59,6 +73,7 @@ function AddGameForm() {
                         separated by commas, named: <i>interface</i></li>
                 </ul>
             </p>
+            <p>{message}</p>
         </div>
     )
 }

src/forms/LoginForm.js

@@ -3,7 +3,11 @@ import './Form.scss'
 import React, { useState } from "react";
 import {UserService} from "../services/UserService";
 
-function RegisterForm() {
+import { connect } from 'react-redux';
+import { login, logout } from '../User/actions';
+
+function LoginForm({isAuthenticated, user, login, logout}) {
+
     const [email, setEmail] = useState('');
     const [password, setPassword] = useState('');
     const [message, setMessage] = useState(true);
@@ -12,9 +16,11 @@ function RegisterForm() {
         e.preventDefault();
 
         try {
-            await UserService.loginUser(email, password)
+            const response = await UserService.loginUser(email, password)
+            login({ email: email , token: response.data.data})
+            setMessage('Login succesful.')
         } catch (e) {
-            setMessage('There was a problem with the registration.')
+            setMessage('There was a problem with login.')
         }
     };
 
@@ -61,4 +67,12 @@ function RegisterForm() {
     )
 }
 
-export default RegisterForm
+const mapStateToProps = (state) => ({
+    isAuthenticated: state.isAuthenticated,
+    user: state.user,
+  });
+
+const mapDispatchToProps = {login,logout,};
+
+export default connect(mapStateToProps, mapDispatchToProps)(LoginForm);
+

src/lists/DeleteGameButton.js

@@ -1,28 +1,22 @@
 import React from 'react';
+import {GameService} from "../services/GameService";
 
 class DeleteGameButton extends React.Component {
-  handleClick = (gameId) => {
-    // fetch('https://your-api-endpoint.com/data', {
-    //   method: 'GET', 
-    //   headers: {
-    //     'Content-Type': 'application/json',
-    //   },
-    // })
-    // .then(response => response.json())
-    // .then(data => {
-    //   // Handle the data from the response
-    //   console.log(data);
-    // })
-    // .catch(error => {
-    //   // Handle errors
-    //   console.error('Error:', error);
-    // });
-    console.log('usuwamy gre o id: ' + gameId)
+  handleClick = async (gameId) => {
+
+    try {
+      console.log('usuwamy gre o id: ' + gameId)
+      const response = await GameService.deleteGame(gameId);
+      console.log(response)
+    } catch (e) {
+        console.log(e);
+    }
   };
 
   render() {
     return (
-        <div className="del-btn color-primary-3" onClick={() => this.handleClick(this.props.gameId)}>Usuń gre</div>    );
+        <div className="del-btn color-primary-3" onClick={() => this.handleClick(this.props.gameId)}>Usuń gre</div>
+    );
   }
 }