Merge pull request #81 from Mueller-Patrick/develop

Master deployment

Backend/src/models/contact_persons/contact_persons.router.ts

@@ -76,9 +76,7 @@ contactpersonsRouter.post('/', async (req: Request, res: Response) => {
     try {
         // Authenticate user
         const user_ip = req.connection.remoteAddress ?? '';
-        const session_id = req.body.session_id;
-        const session_key = req.body.session_key;
-        const user = await UserService.checkSession(session_id, session_key, user_ip);
+        const user = await UserService.checkSessionWithCookie(req.cookies.betterauth, user_ip);
 
         // Get required parameters
         const vendor_id = req.body.vendor_id;
@@ -106,9 +104,7 @@ contactpersonsRouter.put('/:id', async (req: Request, res: Response) => {
     try {
         // Authenticate user
         const user_ip = req.connection.remoteAddress ?? '';
-        const session_id = req.body.session_id;
-        const session_key = req.body.session_key;
-        const user = await UserService.checkSession(session_id, session_key, user_ip);
+        const user = await UserService.checkSessionWithCookie(req.cookies.betterauth, user_ip);
 
         // Get required parameters
         const contact_person_id = parseInt(req.params.id, 10);

Backend/src/models/crawling_status/crawling_status.router.ts

@@ -25,9 +25,7 @@ crawlingstatusRouter.get('/', async (req: Request, res: Response) => {
     try {
         // Authenticate user
         const user_ip = req.connection.remoteAddress ?? '';
-        const session_id = (req.query.session_id ?? '').toString();
-        const session_key = (req.query.session_key ?? '').toString();
-        const user = await UserService.checkSession(session_id, session_key, user_ip);
+        const user = await UserService.checkSessionWithCookie(req.cookies.betterauth, user_ip);
 
         if (!user.is_admin) {
             res.status(403).send({});

Backend/src/models/favorite_shops/favoriteshops.router.ts

@@ -24,9 +24,7 @@ favoriteshopsRouter.get('/', async (req: Request, res: Response) => {
     try {
         // Authenticate user
         const user_ip = req.connection.remoteAddress ?? '';
-        const session_id = (req.query.session_id ?? '').toString();
-        const session_key = (req.query.session_key ?? '').toString();
-        const user = await UserService.checkSession(session_id, session_key, user_ip);
+        const user = await UserService.checkSessionWithCookie(req.cookies.betterauth, user_ip);
 
         const priceAlarms = await FavoriteShopsService.getFavoriteShops(user.user_id);
 
@@ -42,9 +40,7 @@ favoriteshopsRouter.post('/', async (req: Request, res: Response) => {
     try {
         // Authenticate user
         const user_ip = req.connection.remoteAddress ?? '';
-        const session_id = req.body.session_id;
-        const session_key = req.body.session_key;
-        const user = await UserService.checkSession(session_id, session_key, user_ip);
+        const user = await UserService.checkSessionWithCookie(req.cookies.betterauth, user_ip);
 
         // Get info for price alarm creation
         const vendor_id = req.body.vendor_id;
@@ -76,9 +72,7 @@ favoriteshopsRouter.delete('/:id', async (req: Request, res: Response) => {
     try {
         // Authenticate user
         const user_ip = req.connection.remoteAddress ?? '';
-        const session_id = (req.query.session_id ?? '').toString();
-        const session_key = (req.query.session_key ?? '').toString();
-        const user = await UserService.checkSession(session_id, session_key, user_ip);
+        const user = await UserService.checkSessionWithCookie(req.cookies.betterauth, user_ip);
 
         // Get info for price alarm creation
         const favorite_id = parseInt(req.params.id, 10);

Backend/src/models/pricealarms/pricealarms.router.ts

@@ -24,9 +24,7 @@ pricealarmsRouter.get('/', async (req: Request, res: Response) => {
     try {
         // Authenticate user
         const user_ip = req.connection.remoteAddress ?? '';
-        const session_id = (req.query.session_id ?? '').toString();
-        const session_key = (req.query.session_key ?? '').toString();
-        const user = await UserService.checkSession(session_id, session_key, user_ip);
+        const user = await UserService.checkSessionWithCookie(req.cookies.betterauth, user_ip);
 
         const priceAlarms = await PriceAlarmsService.getPriceAlarms(user.user_id);
 
@@ -42,9 +40,7 @@ pricealarmsRouter.post('/', async (req: Request, res: Response) => {
     try {
         // Authenticate user
         const user_ip = req.connection.remoteAddress ?? '';
-        const session_id = req.body.session_id;
-        const session_key = req.body.session_key;
-        const user = await UserService.checkSession(session_id, session_key, user_ip);
+        const user = await UserService.checkSessionWithCookie(req.cookies.betterauth, user_ip);
 
         // Get info for price alarm creation
         const product_id = req.body.product_id;
@@ -77,9 +73,7 @@ pricealarmsRouter.put('/', async (req: Request, res: Response) => {
     try {
         // Authenticate user
         const user_ip = req.connection.remoteAddress ?? '';
-        const session_id = req.body.session_id;
-        const session_key = req.body.session_key;
-        const user = await UserService.checkSession(session_id, session_key, user_ip);
+        const user = await UserService.checkSessionWithCookie(req.cookies.betterauth, user_ip);
 
         // Get info for price alarm creation
         const alarm_id = req.body.alarm_id;
@@ -106,29 +100,3 @@ pricealarmsRouter.put('/', async (req: Request, res: Response) => {
         res.status(500).send(JSON.stringify({'message': 'Internal Server Error. Try again later.'}));
     }
 });
-
-// DELETE pricealarms/:id
-pricealarmsRouter.delete('/:id', async (req, res) => {
-    try {
-        // Authenticate user
-        const user_ip = req.connection.remoteAddress ?? '';
-        const session_id = (req.query.session_id ?? '').toString();
-        const session_key = (req.query.session_key ?? '').toString();
-        const user = await UserService.checkSession(session_id, session_key, user_ip);
-
-        const id: number = parseInt(req.params.id, 10);
-
-        const success = await PriceAlarmsService.deletePriceAlarm(id, user.user_id);
-
-        if (success) {
-            res.status(200).send(JSON.stringify({success: true}));
-            return;
-        } else {
-            res.status(500).send(JSON.stringify({success: false}));
-            return;
-        }
-    } catch (e) {
-        console.log('Error handling a request: ' + e.message);
-        res.status(500).send(JSON.stringify({'message': 'Internal Server Error. Try again later.'}));
-    }
-});

Backend/src/models/pricealarms/pricealarms.service.ts

@@ -92,24 +92,3 @@ export const updatePriceAlarm = async (alarm_id: number, user_id: number, define
         }
     }
 };
-
-/**
- * Deletes the given price alarm
- * @param alarm_id The id of the price alarm to update
- * @param user_id The id of the user that wants to update the price alarm
- */
-export const deletePriceAlarm = async (alarm_id: number, user_id: number): Promise<boolean> => {
-    let conn;
-    try {
-        conn = await pool.getConnection();
-        const res = await conn.query('DELETE FROM price_alarms WHERE alarm_id = ? AND user_id = ?', [alarm_id, user_id]);
-
-        return res.affectedRows === 1;
-    } catch (err) {
-        throw err;
-    } finally {
-        if (conn) {
-            conn.end();
-        }
-    }
-};

Backend/src/models/prices/prices.router.ts

@@ -107,9 +107,7 @@ pricesRouter.post('/', async (req: Request, res: Response) => {
     try {
         // Authenticate user
         const user_ip = req.connection.remoteAddress ?? '';
-        const session_id = req.body.session_id;
-        const session_key = req.body.session_key;
-        const user = await UserService.checkSession(session_id, session_key, user_ip);
+        const user = await UserService.checkSessionWithCookie(req.cookies.betterauth, user_ip);
 
         // Get required parameters
         const vendor_id = req.body.vendor_id;

Backend/src/models/prices/prices.service.ts

@@ -282,11 +282,11 @@ export const getBestDeals = async (amount: number): Promise<Prices> => {
                     'price_in_cents': lowestPrice.price_in_cents,
                     'timestamp': lowestPrice.timestamp,
                     'amazonDifference': (amazonPrice.price_in_cents - lowestPrice.price_in_cents),
-                    'amazonDifferencePercent': ((amazonPrice.price_in_cents / lowestPrice.price_in_cents) * 100),
+                    'amazonDifferencePercent': ((1 - (lowestPrice.price_in_cents / amazonPrice.price_in_cents)) * 100),
                 };
 
                 // Push only deals were the amazon price is actually higher
-                if (deal.amazonDifferencePercent > 0 && deal.amazonDifference > 0) {
+                if (deal.amazonDifferencePercent > 0) {
                     deals.push(deal as Deal);
                 }
             }

Backend/src/models/users/users.router.ts

@@ -47,10 +47,10 @@ usersRouter.post('/register', async (req: Request, res: Response) => {
         const session: Session = await UserService.createUser(username, password, email, ip);
 
         // Send the session details back to the user
-        res.status(201).send({
-            session_id: session.session_id,
-            session_key: session.session_key
-        });
+        res.cookie('betterauth', JSON.stringify({
+            id: session.session_id,
+            key: session.session_key
+        }), {expires: new Date(Date.now() + 1000 * 60 * 60 * 24 * 30)}).status(201).send({});
     } catch (e) {
         console.log('Error handling a request: ' + e.message);
         res.status(500).send(JSON.stringify({'message': 'Internal Server Error. Try again later.'}));
@@ -80,10 +80,10 @@ usersRouter.post('/login', async (req: Request, res: Response) => {
         }
 
         // Send the session details back to the user
-        res.status(200).send({
-            session_id: session.session_id,
-            session_key: session.session_key
-        });
+        res.cookie('betterauth', JSON.stringify({
+            id: session.session_id,
+            key: session.session_key
+        }), {expires: new Date(Date.now() + 1000 * 60 * 60 * 24 * 30)}).status(200).send({});
     } catch (e) {
         console.log('Error handling a request: ' + e.message);
         res.status(500).send(JSON.stringify({'message': 'Internal Server Error. Try again later.'}));
@@ -94,17 +94,9 @@ usersRouter.post('/login', async (req: Request, res: Response) => {
 usersRouter.post('/checkSessionValid', async (req: Request, res: Response) => {
     try {
         const ip: string = req.connection.remoteAddress ?? '';
-        const session_id = req.body.session_id;
-        const session_key = req.body.session_key;
-
-        if(!session_id || !session_key) {
-            // Error logging in, probably wrong username / password
-            res.status(401).send(JSON.stringify({messages: ['No session detected'], codes: [5]}));
-            return;
-        }
 
         // Update the user entry and create a session
-        const user: User = await UserService.checkSession(session_id, session_key, ip);
+        const user: User = await UserService.checkSessionWithCookie(req.cookies.betterauth, ip);
 
         if (!user.user_id) {
             // Error logging in, probably wrong username / password

Backend/src/models/users/users.service.ts

@@ -115,8 +115,8 @@ export const login = async (username: string, password: string, ip: string): Pro
         const sessionKeyHash = bcrypt.hashSync(sessionKey, 10);
 
         // Update user entry in SQL
-        const userQuery = 'UPDATE users SET last_login_date = NOW() WHERE user_id = ?';
-        const userIdRes = await conn.query(userQuery, userId);
+        const userQuery = 'UPDATE users SET last_login_date = NOW()';
+        const userIdRes = await conn.query(userQuery);
         await conn.commit();
 
         // Create session

Backend/src/models/vendors/vendors.router.ts

@@ -37,9 +37,7 @@ vendorsRouter.get('/managed', async (req: Request, res: Response) => {
     try {
         // Authenticate user
         const user_ip = req.connection.remoteAddress ?? '';
-        const session_id = (req.query.session_id ?? '').toString();
-        const session_key = (req.query.session_key ?? '').toString();
-        const user = await UserService.checkSession(session_id, session_key, user_ip);
+        const user = await UserService.checkSessionWithCookie(req.cookies.betterauth, user_ip);
 
         const vendors = await VendorService.getManagedShops(user.user_id);
 
@@ -93,9 +91,7 @@ vendorsRouter.put('/manage/deactivatelisting', async (req: Request, res: Respons
     try {
         // Authenticate user
         const user_ip = req.connection.remoteAddress ?? '';
-        const session_id = req.body.session_id;
-        const session_key = req.body.session_key;
-        const user = await UserService.checkSession(session_id, session_key, user_ip);
+        const user = await UserService.checkSessionWithCookie(req.cookies.betterauth, user_ip);
 
         // Get required parameters
         const vendor_id = req.body.vendor_id;
@@ -119,9 +115,7 @@ vendorsRouter.put('/manage/shop/deactivate/:id', async (req: Request, res: Respo
     try {
         // Authenticate user
         const user_ip = req.connection.remoteAddress ?? '';
-        const session_id = req.body.session_id;
-        const session_key = req.body.session_key;
-        const user = await UserService.checkSession(session_id, session_key, user_ip);
+        const user = await UserService.checkSessionWithCookie(req.cookies.betterauth, user_ip);
 
         // Get required parameters
         const vendor_id = parseInt(req.params.id, 10);
@@ -144,9 +138,7 @@ vendorsRouter.put('/manage/shop/activate/:id', async (req: Request, res: Respons
     try {
         // Authenticate user
         const user_ip = req.connection.remoteAddress ?? '';
-        const session_id = req.body.session_id;
-        const session_key = req.body.session_key;
-        const user = await UserService.checkSession(session_id, session_key, user_ip);
+        const user = await UserService.checkSessionWithCookie(req.cookies.betterauth, user_ip);
 
         // Get required parameters
         const vendor_id = parseInt(req.params.id, 10);

CucumberTests/src/test/java/RunTest.java

@@ -8,16 +8,14 @@ import stepdefs.Preconditions;
 
 @RunWith(Cucumber.class)
 @CucumberOptions(
-        features = {"src/test/resource/searchProduct.feature",
-                "src/test/resource/priceAlarms.feature",
-                "src/test/resource/favoriteShopList.feature",
-                "src/test/resource/manageVendor.feature"}
+  features = {"src/test/resource/searchProduct.feature",
+    "src/test/resource/priceAlarms.feature"}
 )
 
 public class RunTest {
     @BeforeClass
     public static void setup() {
-        Preconditions.driver = new FirefoxDriver();
+        Preconditions.driver= new FirefoxDriver();
     }
 
     @AfterClass

CucumberTests/src/test/java/stepdefs/FavoriteShopList.java

@@ -1,34 +0,0 @@
-package stepdefs;
-
-import io.cucumber.java.en.Given;
-import io.cucumber.java.en.Then;
-import io.cucumber.java.en.When;
-import org.openqa.selenium.By;
-import org.openqa.selenium.WebElement;
-import org.openqa.selenium.support.ui.ExpectedConditions;
-import org.openqa.selenium.support.ui.WebDriverWait;
-
-public class FavoriteShopList {
-    @Given("^the user has at least (\\d+) favorite shop$")
-    public void the_user_has_at_least_favorite_shop(int arg1) throws Exception {
-    }
-
-    @Then("^the profile page should open$")
-    public void the_profile_page_should_open() throws Exception {
-        WebElement profile_info_text = (new WebDriverWait(Preconditions.driver, Preconditions.delaySeconds))
-                .until(ExpectedConditions.elementToBeClickable(By.cssSelector("table.table.table-hover")));
-        assert(profile_info_text.isDisplayed());
-    }
-
-    @Then("^he should see his favorite shops list$")
-    public void he_should_see_his_favorite_shops_list() throws Exception {
-    }
-
-    @When("^he clicks on delete a favorite shop entry$")
-    public void he_clicks_on_delete_a_favorite_shop_entry() throws Exception {
-    }
-
-    @Then("^the favorite shop entry should be deleted$")
-    public void the_favorite_shop_entry_should_be_deleted() throws Exception {
-    }
-}

CucumberTests/src/test/java/stepdefs/ManageVendor.java

@@ -1,31 +0,0 @@
-package stepdefs;
-
-import io.cucumber.java.en.Given;
-import io.cucumber.java.en.Then;
-import io.cucumber.java.en.When;
-
-public class ManageVendor {
-    @Given("^the user is logged in as vendor manager$")
-    public void the_user_is_logged_in_as_vendor_manager() throws Exception {
-    }
-
-    @When("^the user opens the shop managing page$")
-    public void the_user_opens_the_shop_managing_page() throws Exception {
-    }
-
-    @When("^the user clicks on deactivate a listing$")
-    public void the_user_clicks_on_deactivate_a_listing() throws Exception {
-    }
-
-    @Then("^the listing should be deactivated$")
-    public void the_listing_should_be_deactivated() throws Exception {
-    }
-
-    @When("^the user clicks on deactivate the shop$")
-    public void the_user_clicks_on_deactivate_the_shop() throws Exception {
-    }
-
-    @Then("^the shop and all related listings should be deactivated$")
-    public void the_shop_and_all_related_listings_should_be_deactivated() throws Exception {
-    }
-}

CucumberTests/src/test/java/stepdefs/Preconditions.java

@@ -4,5 +4,4 @@ import org.openqa.selenium.WebDriver;
 
 public class Preconditions {
     public static WebDriver driver;
-    public static final int delaySeconds = 7;
 }

CucumberTests/src/test/java/stepdefs/PriceAlarm.java

@@ -4,12 +4,6 @@ import io.cucumber.java.PendingException;
 import io.cucumber.java.en.Given;
 import io.cucumber.java.en.Then;
 import io.cucumber.java.en.When;
-import org.openqa.selenium.By;
-import org.openqa.selenium.WebElement;
-import org.openqa.selenium.support.ui.ExpectedConditions;
-import org.openqa.selenium.support.ui.WebDriverWait;
-
-import java.util.List;
 
 public class PriceAlarm {
     @Given("^the user has at least (\\d+) price alarm set$")
@@ -18,43 +12,42 @@ public class PriceAlarm {
 
     @When("^the user clicks on the profile icon$")
     public void the_user_clicks_on_the_profile_icon() throws Exception {
-        WebElement profileButton = (new WebDriverWait(Preconditions.driver, Preconditions.delaySeconds))
-                .until(ExpectedConditions.elementToBeClickable(By.xpath("//*[contains(text(),'profile')]")));
-        profileButton.click();
+    }
+
+    @Then("^the profile details popup should open$")
+    public void the_profile_details_popup_should_open() throws Exception {
+    }
+
+    @When("^the user clicks on price alarms$")
+    public void the_user_clicks_on_price_alarms() throws Exception {
+    }
+
+    @Then("^the price alarm list should open$")
+    public void the_price_alarm_list_should_open() throws Exception {
     }
 
     @Then("^the price alarm list should contain at least (\\d+) entry$")
     public void the_price_alarm_list_should_contain_at_least_entry(int arg1) throws Exception {
-        WebElement alarmEntry = (new WebDriverWait(Preconditions.driver, Preconditions.delaySeconds))
-                .until(ExpectedConditions.elementToBeClickable(By.cssSelector("table.table.table-hover tr:nth-child(2)")));
-
-        assert (alarmEntry != null);
     }
 
-    @Given("^the user is on the profile page$")
-    public void the_user_is_on_the_profile_page() throws Exception {
-        Preconditions.driver.get("https://www.betterzon.xyz/profile");
+    @Then("^the price alarm list should contain a maximum of (\\d+) entries per page$")
+    public void the_price_alarm_list_should_contain_a_maximum_of_entries_per_page(int arg1) throws Exception {
+    }
 
-        WebElement profile_info_text = (new WebDriverWait(Preconditions.driver, Preconditions.delaySeconds))
-                .until(ExpectedConditions.elementToBeClickable(By.cssSelector("table.table.table-user-information")));
-        assert (profile_info_text.isDisplayed());
+    @Given("^the user is on the price alarm list page$")
+    public void the_user_is_on_the_price_alarm_list_page() throws Exception {
     }
 
     @When("^the user clicks on the \"([^\"]*)\" button next to a price alarm$")
     public void the_user_clicks_on_the_button_next_to_a_price_alarm(String arg1) throws Exception {
-        if (arg1.equals("remove")) {
-            WebElement entry = (new WebDriverWait(Preconditions.driver, Preconditions.delaySeconds))
-                    .until(ExpectedConditions.elementToBeClickable(By.cssSelector("table.table.table-hover tr:nth-child(2)")));
+    }
 
-            if (entry == null) {
-                throw new Exception("Too few price alarm entries found!");
-            }
+    @Then("^a popup should open asking the user to confirm the removal$")
+    public void a_popup_should_open_asking_the_user_to_confirm_the_removal() throws Exception {
+    }
 
-            WebElement btn = entry.findElement(By.cssSelector("img.delete[src='../assets/images/Delete_icon-icons.com_55931.png']"));
-
-            btn.click();
-        } else if (arg1.equals("edit")) {
-        }
+    @When("^the user confirms the removal of the price alarm$")
+    public void the_user_confirms_the_removal_of_the_price_alarm() throws Exception {
     }
 
     @Then("^the price alarm should be removed from the database$")

CucumberTests/src/test/java/stepdefs/SearchProduct.java

@@ -4,7 +4,9 @@ import io.cucumber.java.PendingException;
 import io.cucumber.java.en.Given;
 import io.cucumber.java.en.Then;
 import io.cucumber.java.en.When;
-import org.openqa.selenium.*;
+import org.openqa.selenium.By;
+import org.openqa.selenium.Keys;
+import org.openqa.selenium.WebElement;
 import org.openqa.selenium.support.ui.ExpectedConditions;
 import org.openqa.selenium.support.ui.WebDriverWait;
 
@@ -13,8 +15,8 @@ public class SearchProduct {
     public void the_user_is_on_the_landing_page() throws Exception {
         //throw new PendingException();
         Preconditions.driver.get("https://betterzon.xyz");
-        WebElement logo = (new WebDriverWait(Preconditions.driver, Preconditions.delaySeconds))
-                .until(ExpectedConditions.elementToBeClickable(By.cssSelector("a.navbar-brand")));
+        WebElement logo = (new WebDriverWait(Preconditions.driver, 10))
+                .until(ExpectedConditions.elementToBeClickable(By.cssSelector(".logo")));
     }
 
     @When("^the user enters the search term \"([^\"]*)\" and clicks search$")
@@ -22,99 +24,49 @@ public class SearchProduct {
         WebElement searchField = Preconditions.driver.findElement(By.cssSelector(".ng-untouched.ng-pristine.ng-valid"));
         searchField.sendKeys(searchTerm);
         searchField.sendKeys(Keys.ENTER);
-        WebElement logo = (new WebDriverWait(Preconditions.driver, Preconditions.delaySeconds))
-                .until(ExpectedConditions.elementToBeClickable(By.cssSelector(".navbar-brand")));
+        WebElement logo = (new WebDriverWait(Preconditions.driver, 10))
+                .until(ExpectedConditions.elementToBeClickable(By.cssSelector(".logo")));
     }
 
     @Then("^the user should see the error page \"([^\"]*)\"$")
     public void the_user_should_see_the_error_page(String arg0) throws Exception {
-        WebElement noProdsFoundMsg = (new WebDriverWait(Preconditions.driver, Preconditions.delaySeconds))
-                .until(ExpectedConditions.elementToBeClickable(By.xpath("//*[contains(text(),'No Products found!')]")));
-        assert (noProdsFoundMsg.isDisplayed());
+        WebElement noProdsFoundMsg = (new WebDriverWait(Preconditions.driver, 10))
+                .until(ExpectedConditions.elementToBeClickable(By.cssSelector(".ng-star-inserted")));
+        assert(noProdsFoundMsg.getText().contains("No Products found!"));
     }
 
     @Given("^the user is not logged in$")
     public void the_user_is_not_logged_in() throws Exception {
-        try {
-            WebElement logoutButton = (new WebDriverWait(Preconditions.driver, Preconditions.delaySeconds))
-                    .until(ExpectedConditions.elementToBeClickable(By.xpath("//*[contains(text(),'log out')]")));
-
-            logoutButton.click();
-        } catch (TimeoutException e) {
-
-        }
     }
 
     @Given("^the user is logged in$")
     public void the_user_is_logged_in() throws Exception {
-        try {
-            WebElement loginButton = (new WebDriverWait(Preconditions.driver, Preconditions.delaySeconds))
-                    .until(ExpectedConditions.elementToBeClickable(By.xpath("//*[contains(text(),'sign in')]")));
-            loginButton.click();
-
-            WebElement usernameField = (new WebDriverWait(Preconditions.driver, Preconditions.delaySeconds))
-                    .until(ExpectedConditions.elementToBeClickable(By.id("username")));
-            usernameField.sendKeys("Selenium");
-
-            WebElement passwordField = (new WebDriverWait(Preconditions.driver, Preconditions.delaySeconds))
-                    .until(ExpectedConditions.elementToBeClickable(By.id("password")));
-            passwordField.sendKeys("Selenium");
-
-            WebElement loginBtn = (new WebDriverWait(Preconditions.driver, Preconditions.delaySeconds))
-                    .until(ExpectedConditions.elementToBeClickable(By.className("btn_signin")));
-            loginBtn.click();
-
-        } catch (TimeoutException e) {
-
-        }
     }
 
     @Then("^the user should see a list of products$")
     public void the_user_should_see_a_list_of_products() throws Exception {
-        WebElement product = (new WebDriverWait(Preconditions.driver, Preconditions.delaySeconds))
-                .until(ExpectedConditions.elementToBeClickable(By.cssSelector(".row.p-2.bg-white.border.rounded")));
-        assert (product.isDisplayed());
+        WebElement product = (new WebDriverWait(Preconditions.driver, 10))
+                .until(ExpectedConditions.elementToBeClickable(By.cssSelector(".productItem.ng-star-inserted")));
+        assert(product.isDisplayed());
     }
 
     @When("^the user clicks on the first product$")
     public void the_user_clicks_on_the_first_product() throws Exception {
-        WebElement productDetailsBtn = (new WebDriverWait(Preconditions.driver, Preconditions.delaySeconds))
-                .until(ExpectedConditions.elementToBeClickable(By.cssSelector(".row.p-2.bg-white.border.rounded button.btn.btn-primary.btn-sm")));
-        productDetailsBtn.click();
     }
 
     @Then("^the user should see the product detail page$")
     public void the_user_should_see_the_product_detail_page() throws Exception {
-        WebElement productTitle = (new WebDriverWait(Preconditions.driver, Preconditions.delaySeconds))
-                .until(ExpectedConditions.elementToBeClickable(By.cssSelector("div.productTitle")));
-        assert (productTitle.isDisplayed());
     }
 
     @Then("^the set price alarm box should show \"([^\"]*)\"$")
     public void the_set_price_alarm_box_should_show(String arg0) throws Exception {
-        WebElement alarmBox = (new WebDriverWait(Preconditions.driver, Preconditions.delaySeconds))
-                .until(ExpectedConditions.elementToBeClickable(By.cssSelector("div.priceAlarm")));
-        if (arg0.equals("Login to set a price alarm")) {
-            assert (alarmBox.getText().equals("Login to set a price alarm"));
-        } else {
-            assert (alarmBox.isDisplayed());
-        }
     }
 
     @When("^the user sets a price alarm$")
     public void the_user_sets_a_price_alarm() throws Exception {
-        WebElement alarmBoxField = (new WebDriverWait(Preconditions.driver, Preconditions.delaySeconds))
-                .until(ExpectedConditions.elementToBeClickable(By.cssSelector("div.priceAlarm input")));
-        alarmBoxField.sendKeys("12345");
-        WebElement alarmBox = (new WebDriverWait(Preconditions.driver, Preconditions.delaySeconds))
-                .until(ExpectedConditions.elementToBeClickable(By.cssSelector("div.priceAlarm")));
-        alarmBox.click();
-
-        assert (alarmBox.isDisplayed() && alarmBoxField.isDisplayed());
     }
 
     @Then("^the user should receive an email confirming the price alarm$")
     public void the_user_should_receive_an_email_confirming_the_price_alarm() throws Exception {
-        assert (true);
     }
 }

CucumberTests/src/test/resource/favoriteShopList.feature

@@ -1,18 +0,0 @@
-Feature: Favorite Shop List
-
-  Scenario: Access Favorite Shop List
-    Given the user is on the landing page
-    And the user is logged in
-    And the user has at least 1 favorite shop
-    When the user clicks on the profile icon
-    Then the profile page should open
-    Then he should see his favorite shops list
-
-  Scenario: Remove Favorite Shop Entry
-    Given the user is on the landing page
-    And the user is logged in
-    And the user has at least 1 favorite shop
-    When the user clicks on the profile icon
-    Then the profile page should open
-    When he clicks on delete a favorite shop entry
-    Then the favorite shop entry should be deleted

CucumberTests/src/test/resource/manageVendor.feature

@@ -1,15 +0,0 @@
-Feature: Manage Vendor Shop
-
-  Scenario: Deactivate Product Listing
-    Given the user is on the landing page
-    And the user is logged in as vendor manager
-    When the user opens the shop managing page
-    And the user clicks on deactivate a listing
-    Then the listing should be deactivated
-
-  Scenario: Deactivate Shop Completely
-    Given the user is on the landing page
-    And the user is logged in as vendor manager
-    When the user opens the shop managing page
-    And the user clicks on deactivate the shop
-    Then the shop and all related listings should be deactivated

CucumberTests/src/test/resource/priceAlarms.feature

@@ -5,22 +5,23 @@ Feature: Price Alarms
         And the user is logged in
         And the user has at least 1 price alarm set
         When the user clicks on the profile icon
-        Then the profile page should open
+        Then the profile details popup should open
+        When the user clicks on price alarms
+        Then the price alarm list should open
         And the price alarm list should contain at least 1 entry
+        And the price alarm list should contain a maximum of 20 entries per page
 
     Scenario: Remove a price alarm
-        Given the user is on the landing page
+        Given the user is on the price alarm list page
         And the user is logged in
-        When the user clicks on the profile icon
-        Then the profile page should open
         When the user clicks on the "remove" button next to a price alarm
+        Then a popup should open asking the user to confirm the removal
+        When the user confirms the removal of the price alarm
         Then the price alarm should be removed from the database
 
     Scenario: Edit a price alarm
-        Given the user is on the landing page
+        Given the user is on the price alarm list page
         And the user is logged in
-        When the user clicks on the profile icon
-        Then the profile page should open
         When the user clicks on the "edit" button next to a price alarm
         Then a popup should open where the user can edit the alarm
         When the user clicks on the "save changes" button

CucumberTests/src/test/resource/searchProduct.feature

@@ -12,7 +12,7 @@ Feature: Search a Product
         Then the user should see a list of products
         When the user clicks on the first product
         Then the user should see the product detail page
-        And the set price alarm box should show "Login to set a price alarm"
+        And the set price alarm box should show "Log in to continue"
 
     Scenario: User is logged in, searches for known product
         Given the user is on the landing page

Frontend/karma.conf.js

@@ -2,35 +2,32 @@
 // https://karma-runner.github.io/1.0/config/configuration-file.html
 
 module.exports = function (config) {
-    config.set({
-        basePath: '',
-        frameworks: ['jasmine', '@angular-devkit/build-angular'],
-        plugins: [
-            require('karma-jasmine'),
-            require('karma-firefox-launcher'),
-            require('karma-chrome-launcher'),
-            require('karma-jasmine-html-reporter'),
-            require('karma-coverage-istanbul-reporter'),
-            require('@angular-devkit/build-angular/plugins/karma')
-        ],
-        client: {
-            clearContext: false, // leave Jasmine Spec Runner output visible in browser
-            jasmine: {
-                random: false
-            }
-        },
-        coverageIstanbulReporter: {
-            dir: require('path').join(__dirname, './coverage/Betterzon'),
-            reports: ['html', 'lcovonly', 'text-summary'],
-            fixWebpackSourcePaths: true
-        },
-        reporters: ['progress', 'kjhtml'],
-        port: 9876,
-        colors: true,
-        logLevel: config.LOG_INFO,
-        autoWatch: true,
-        browsers: ['Firefox'],
-        singleRun: false,
-        restartOnFileChange: true
-    });
+  config.set({
+    basePath: '',
+    frameworks: ['jasmine', '@angular-devkit/build-angular'],
+    plugins: [
+      require('karma-jasmine'),
+      require('karma-firefox-launcher'),
+      require('karma-chrome-launcher'),
+      require('karma-jasmine-html-reporter'),
+      require('karma-coverage-istanbul-reporter'),
+      require('@angular-devkit/build-angular/plugins/karma')
+    ],
+    client: {
+      clearContext: false // leave Jasmine Spec Runner output visible in browser
+    },
+    coverageIstanbulReporter: {
+      dir: require('path').join(__dirname, './coverage/Betterzon'),
+      reports: ['html', 'lcovonly', 'text-summary'],
+      fixWebpackSourcePaths: true
+    },
+    reporters: ['progress', 'kjhtml'],
+    port: 9876,
+    colors: true,
+    logLevel: config.LOG_INFO,
+    autoWatch: true,
+    browsers: ['Firefox'],
+    singleRun: false,
+    restartOnFileChange: true
+  });
 };

Frontend/src/app/app.component.css

@@ -1,10 +1,9 @@
 .wrapper_app {
-    padding-bottom: 2.5rem; /* Footer height */
+    padding-bottom: 2.5rem;    /* Footer height */
 }
-
 .footer_app {
     position: relative;
     bottom: 0;
     width: 100%;
-    height: 2.5rem; /* Footer height */
+    height: 2.5rem;            /* Footer height */
 }

Frontend/src/app/app.component.spec.ts

@@ -1,8 +1,8 @@
 import {TestBed} from '@angular/core/testing';
 import {AppComponent} from './app.component';
-import {RouterTestingModule} from '@angular/router/testing';
-import {NgcCookieConsentConfig, NgcCookieConsentModule} from 'ngx-cookieconsent';
-import {FormsModule} from '@angular/forms';
+import {RouterTestingModule} from "@angular/router/testing";
+import {NgcCookieConsentConfig, NgcCookieConsentModule} from "ngx-cookieconsent";
+import {FormsModule} from "@angular/forms";
 
 // For cookie consent module testing
 const cookieConfig: NgcCookieConsentConfig = {

Frontend/src/app/app.component.ts

@@ -1,8 +1,6 @@
 import {Component, OnDestroy, OnInit} from '@angular/core';
 import {NgcCookieConsentService, NgcInitializeEvent, NgcNoCookieLawEvent, NgcStatusChangeEvent} from 'ngx-cookieconsent';
 import {Subscription} from 'rxjs';
-import {ApiService} from './services/api.service';
-
 
 @Component({
     selector: 'app-root',
@@ -21,17 +19,12 @@ export class AppComponent implements OnInit, OnDestroy {
     private revokeChoiceSubscription: Subscription;
     private noCookieLawSubscription: Subscription;
 
-    isLoggedIn = false;
-    showUserBoard = false;
-    username?: string;
-
     constructor(
         private ccService: NgcCookieConsentService
     ) {
     }
 
     ngOnInit(): void {
-
         // subscribe to cookieconsent observables to react to main events
         this.popupOpenSubscription = this.ccService.popupOpen$.subscribe(
             () => {

Frontend/src/app/app.module.ts

@@ -23,23 +23,21 @@ import {NgcCookieConsentModule, NgcCookieConsentConfig} from 'ngx-cookieconsent'
 import {MatSlideToggleModule} from '@angular/material/slide-toggle';
 import {TopBarComponent} from './components/top-bar/top-bar.component';
 import {RouterModule} from '@angular/router';
-import {MatButtonModule} from '@angular/material/button';
+import {MatButtonModule} from "@angular/material/button";
 import {MatToolbarModule} from '@angular/material/toolbar';
 import {MatIconModule} from '@angular/material/icon';
 import {MatSidenavModule} from '@angular/material/sidenav';
-import {MatListModule} from '@angular/material/list';
+import {MatListModule} from "@angular/material/list";
 import {BottomBarComponent} from './components/bottom-bar/bottom-bar.component';
-import {HotDealsWidgetComponent} from './components/hot-deals-widget/hot-deals-widget.component';
-import {SliderForProductsComponent} from './components/slider-for-products/slider-for-products.component';
-import {RegistrationComponent} from './components/auth/registration/registration.component';
-import {MatCardModule} from '@angular/material/card';
-import {SigninComponent} from './components/auth/signin/signin.component';
-import {CopyrightComponent} from './components/copyright/copyright.component';
-import {GreetingInfoSliderComponent} from './components/greeting-info-slider/greeting-info-slider.component';
-import {KundenComponent} from './components/kunden/kunden.component';
-import {AboutUsComponent} from './components/about-us/about-us.component';
-import {ProfileComponent} from './pages/profile/profile.component';
-import {ProfilePageComponent} from './pages/profile-page/profile-page.component';
+import { HotDealsWidgetComponent } from './components/hot-deals-widget/hot-deals-widget.component';
+import { SliderForProductsComponent } from './components/slider-for-products/slider-for-products.component';
+import { RegistrationComponent } from './components/auth/registration/registration.component';
+import { MatCardModule } from "@angular/material/card";
+import {SigninComponent} from "./components/auth/signin/signin.component";
+import { CopyrightComponent } from './components/copyright/copyright.component';
+import { GreetingInfoSliderComponent } from './components/greeting-info-slider/greeting-info-slider.component';
+import { KundenComponent } from './components/kunden/kunden.component';
+import { AboutUsComponent } from './components/about-us/about-us.component';
 
 // For cookie popup
 const cookieConfig: NgcCookieConsentConfig = {
@@ -104,8 +102,6 @@ const cookieConfig: NgcCookieConsentConfig = {
         GreetingInfoSliderComponent,
         KundenComponent,
         AboutUsComponent,
-        ProfileComponent,
-        ProfilePageComponent,
     ],
     imports: [
         BrowserModule,

Frontend/src/app/app.routing.ts

@@ -9,10 +9,8 @@ import {ProductSearchPageComponent} from './pages/product-search-page/product-se
 import {PageNotFoundPageComponent} from './pages/page-not-found-page/page-not-found-page.component';
 import {ImprintComponent} from './pages/imprint/imprint.component';
 import {PrivacyComponent} from './pages/privacy/privacy.component';
-import {SigninComponent} from './components/auth/signin/signin.component';
-import {RegistrationComponent} from './components/auth/registration/registration.component';
-import {ProfileComponent} from './pages/profile/profile.component';
-import {ProfilePageComponent} from './pages/profile-page/profile-page.component';
+import {SigninComponent} from "./components/auth/signin/signin.component";
+import {RegistrationComponent} from "./components/auth/registration/registration.component";
 
 const routes: Routes = [
     {path: '', component: LandingpageComponent, pathMatch: 'full'},
@@ -22,8 +20,7 @@ const routes: Routes = [
     {path: 'datenschutz', component: PrivacyComponent},
     {path: 'signin', component: SigninComponent},
     {path: 'registration', component: RegistrationComponent},
-    {path: 'product-detail', component: ProductDetailPageComponent},
-    {path: 'profile', component: ProfilePageComponent},
+    {path: "product-detail", component: ProductDetailPageComponent},
     {path: '**', component: PageNotFoundPageComponent}
 ];
 

Frontend/src/app/components/about-us/about-us.component.html

@@ -10,10 +10,8 @@
         </div>
         <!-- About Section Content-->
         <div class="row">
-            <div class="col-lg-4 ms-auto"><p class="lead">You follow the same passion as we do and you want to find
-                alternatives to the de-facto monopolist Amazon?</p></div>
-            <div class="col-lg-4 me-auto"><p class="lead">In this case, welcome aboard! We’re happy that you share our
-                passion and hope that we can help you achieving this goal with the website.</p></div>
+            <div class="col-lg-4 ms-auto"><p class="lead">text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries</p></div>
+            <div class="col-lg-4 me-auto"><p class="lead">text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries</p></div>
         </div>
     </div>
 </section>

Frontend/src/app/components/about-us/about-us.component.spec.ts

@@ -1,25 +1,25 @@
-import {ComponentFixture, TestBed} from '@angular/core/testing';
+import { ComponentFixture, TestBed } from '@angular/core/testing';
 
-import {AboutUsComponent} from './about-us.component';
+import { AboutUsComponent } from './about-us.component';
 
 describe('AboutUsComponent', () => {
-    let component: AboutUsComponent;
-    let fixture: ComponentFixture<AboutUsComponent>;
+  let component: AboutUsComponent;
+  let fixture: ComponentFixture<AboutUsComponent>;
 
-    beforeEach(async () => {
-        await TestBed.configureTestingModule({
-            declarations: [AboutUsComponent]
-        })
-            .compileComponents();
-    });
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      declarations: [ AboutUsComponent ]
+    })
+    .compileComponents();
+  });
 
-    beforeEach(() => {
-        fixture = TestBed.createComponent(AboutUsComponent);
-        component = fixture.componentInstance;
-        fixture.detectChanges();
-    });
+  beforeEach(() => {
+    fixture = TestBed.createComponent(AboutUsComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
 
-    it('should create', () => {
-        expect(component).toBeTruthy();
-    });
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
 });

Frontend/src/app/components/about-us/about-us.component.ts

@@ -1,16 +1,15 @@
-import {Component, OnInit} from '@angular/core';
+import { Component, OnInit } from '@angular/core';
 
 @Component({
-    selector: 'app-about-us',
-    templateUrl: './about-us.component.html',
-    styleUrls: ['./about-us.component.css']
+  selector: 'app-about-us',
+  templateUrl: './about-us.component.html',
+  styleUrls: ['./about-us.component.css']
 })
 export class AboutUsComponent implements OnInit {
 
-    constructor() {
-    }
+  constructor() { }
 
-    ngOnInit(): void {
-    }
+  ngOnInit(): void {
+  }
 
 }

Frontend/src/app/components/auth/auth-routing.module.ts

@@ -1,8 +1,8 @@
-import {NgModule} from '@angular/core';
-import {Routes, RouterModule} from '@angular/router';
-import {RegistrationComponent} from './registration/registration.component';
-import {SigninComponent} from './signin/signin.component';
-import {ResetpasswortComponent} from './resetpasswort/resetpasswort.component';
+import { NgModule } from '@angular/core';
+import { Routes, RouterModule } from '@angular/router';
+import {RegistrationComponent} from "./registration/registration.component";
+import {SigninComponent} from "./signin/signin.component";
+import {ResetpasswortComponent} from "./resetpasswort/resetpasswort.component";
 
 const routes: Routes = [
     {
@@ -20,8 +20,7 @@ const routes: Routes = [
 ];
 
 @NgModule({
-    imports: [RouterModule.forChild(routes)],
-    exports: [RouterModule]
+  imports: [RouterModule.forChild(routes)],
+  exports: [RouterModule]
 })
-export class AuthRoutingModule {
-}
+export class AuthRoutingModule { }

Frontend/src/app/components/auth/auth.module.ts

@@ -1,23 +1,22 @@
-import {NgModule} from '@angular/core';
-import {CommonModule} from '@angular/common';
+import { NgModule } from '@angular/core';
+import { CommonModule } from '@angular/common';
 
-import {AuthRoutingModule} from './auth-routing.module';
-import {SigninComponent} from './signin/signin.component';
-import {RegistrationComponent} from './registration/registration.component';
-import {ResetpasswortComponent} from './resetpasswort/resetpasswort.component';
+import { AuthRoutingModule } from './auth-routing.module';
+import { SigninComponent } from "./signin/signin.component";
+import { RegistrationComponent } from './registration/registration.component';
+import { ResetpasswortComponent } from './resetpasswort/resetpasswort.component';
 
 
 @NgModule({
-    declarations: [SigninComponent, RegistrationComponent, ResetpasswortComponent],
-    imports: [
-        CommonModule,
-        AuthRoutingModule,
-    ],
-    exports: [
-        SigninComponent,
-        RegistrationComponent,
-        ResetpasswortComponent,
-    ],
+  declarations: [SigninComponent, RegistrationComponent, ResetpasswortComponent],
+  imports: [
+    CommonModule,
+    AuthRoutingModule,
+  ],
+  exports: [
+      SigninComponent,
+      RegistrationComponent,
+      ResetpasswortComponent,
+  ],
 })
-export class AuthModule {
-}
+export class AuthModule { }

Frontend/src/app/components/auth/registration/registration.component.css

@@ -1,12 +1,11 @@
-.main-content {
+.main-content{
     width: 50%;
     border-radius: 20px;
-    box-shadow: 0 5px 5px rgba(0, 0, 0, .4);
+    box-shadow: 0 5px 5px rgba(0,0,0,.4);
     margin: 5em auto;
     display: flex;
 }
-
-.company__info {
+.company__info{
     background-color: #008080;
     border-top-left-radius: 20px;
     border-bottom-left-radius: 20px;
@@ -15,79 +14,63 @@
     justify-content: center;
     color: #fff;
 }
-
-.fa-android {
-    font-size: 3em;
+.fa-android{
+    font-size:3em;
 }
-
 @media screen and (max-width: 640px) {
-    .main-content {
-        width: 90%;
-    }
-
-    .company__info {
+    .main-content{width: 90%;}
+    .company__info{
         display: none;
     }
-
-    .login_form {
-        border-top-left-radius: 20px;
-        border-bottom-left-radius: 20px;
+    .login_form{
+        border-top-left-radius:20px;
+        border-bottom-left-radius:20px;
     }
 }
-
-@media screen and (min-width: 642px) and (max-width: 800px) {
-    .main-content {
-        width: 70%;
-    }
+@media screen and (min-width: 642px) and (max-width:800px){
+    .main-content{width: 70%;}
 }
-
-.row > h2 {
-    color: #008080;
+.row > h2{
+    color:#008080;
 }
-
-.login_form {
+.login_form{
     background-color: #fff;
-    border-top-right-radius: 20px;
-    border-bottom-right-radius: 20px;
-    border-top: 1px solid #ccc;
-    border-right: 1px solid #ccc;
+    border-top-right-radius:20px;
+    border-bottom-right-radius:20px;
+    border-top:1px solid #ccc;
+    border-right:1px solid #ccc;
 }
-
-form {
+form{
     padding: 0 2em;
 }
-
-.form__input {
+.form__input{
     width: 100%;
-    border: 0px solid transparent;
+    border:0px solid transparent;
     border-radius: 0;
     border-bottom: 1px solid #aaa;
     padding: 1em .5em .5em;
     padding-left: 2em;
-    outline: none;
-    margin: 1.5em auto;
+    outline:none;
+    margin:1.5em auto;
     transition: all .5s ease;
 }
-
-.form__input:focus {
+.form__input:focus{
     border-bottom-color: #008080;
-    box-shadow: 0 0 5px rgba(0, 80, 80, .4);
+    box-shadow: 0 0 5px rgba(0,80,80,.4);
     border-radius: 4px;
 }
-
-.btn_signin {
+.btn_signin{
     transition: all .5s ease;
-    width: 100%;
+    width: 70%;
     border-radius: 30px;
-    color: #008080;
+    color:#008080;
     font-weight: 600;
     background-color: #fff;
     border: 1px solid #008080;
     margin-top: 1.5em;
     margin-bottom: 1em;
 }
-
-.btn_signin:hover, .btn:focus {
+.btn_signin:hover, .btn:focus{
     background-color: #008080;
-    color: #fff;
+    color:#fff;
 }

Frontend/src/app/components/auth/registration/registration.component.html

@@ -6,36 +6,30 @@
         <div class="col-md-8 col-xs-12 col-sm-12 login_form ">
             <div class="container-fluid">
                 <div class="row">
-                    <h2>Registration</h2>
+                    <h2>Konto erstellen</h2>
                 </div>
                 <div class="row">
-                    <form [formGroup]="form" class="form-group" (ngSubmit)="onSubmit()">
+                    <form control="" class="form-group">
                         <div class="row">
-                            <input type="text" formControlName="username" id="username" name="username"
-                                   class="form__input" placeholder="Username">
-                            <div *ngIf="submitted && me.username.errors" class="invalid-feedback">
-                                <div *ngIf="me.username.errors.required">Username is required</div>
-                            </div>
+                            <input type="text" name="username" id="username" class="form__input" placeholder="Nickname">
                         </div>
                         <div class="row">
                             <!-- <span class="fa fa-lock"></span> -->
-                            <input type="email" formControlName="email" name="email" id="email" class="form__input"
-                                   placeholder="E-Mail">
+                            <input type="password" name="password" id="email" class="form__input" placeholder= "E-Mail">
                         </div>
                         <div class="row">
                             <!-- <span class="fa fa-lock"></span> -->
-                            <input type="password" formControlName="password" name="password" id="password"
-                                   class="form__input" placeholder="Password">
+                            <input type="password" name="password" id="password" class="form__input" placeholder="Kennwort erstellen">
                         </div>
-                        <!--
                         <div class="row">
+                            <!-- <span class="fa fa-lock"></span> -->
                             <input type="password" name="password" id="password_repeated" class="form__input" placeholder="Kennwort bestätigen">
-                        </div> -->
-                        <div class="row">
-                            <input type="submit" value="Sign up" class="btn_signin">
                         </div>
                         <div class="row">
-                            <p>Have an account?<a href="/signin">Log In</a></p>
+                            <input type="submit" value="Erstellen" class="btn_signin">
+                        </div>
+                        <div class="row">
+                            <p>Haben Sie bereits ein Konto?<a href="/signin">Sich anmelden</a></p>
                         </div>
                     </form>
                 </div>

Frontend/src/app/components/auth/registration/registration.component.spec.ts

@@ -1,54 +1,25 @@
-import {ComponentFixture, TestBed} from '@angular/core/testing';
+import { ComponentFixture, TestBed } from '@angular/core/testing';
 
-import {RegistrationComponent} from './registration.component';
-import {AbstractMockObservableService} from '../../../mocks/mock.service';
-import {ApiService} from '../../../services/api.service';
-import {FormBuilder, FormControl, Validators} from '@angular/forms';
-import {Router} from '@angular/router';
-
-class MockApiService extends AbstractMockObservableService {
-    registerUser(username: string, password: string, email: string): any {
-        this.content = [];
-        return this;
-    }
-}
+import { RegistrationComponent } from './registration.component';
 
 describe('RegistrationComponent', () => {
-    let component: RegistrationComponent;
-    let fixture: ComponentFixture<RegistrationComponent>;
-    let mockService;
-    let formBuilder: FormBuilder;
-    const router = {
-        navigate: jasmine.createSpy('navigate'),
-        routerState: jasmine.createSpy('routerState')
-    };
+  let component: RegistrationComponent;
+  let fixture: ComponentFixture<RegistrationComponent>;
 
-    beforeEach(async () => {
-        mockService = new MockApiService();
-        await TestBed.configureTestingModule({
-            declarations: [RegistrationComponent],
-            providers: [{provide: ApiService, useValue: mockService}, {provide: Router, useValue: router}, FormBuilder]
-        })
-            .compileComponents();
-    });
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      declarations: [ RegistrationComponent ]
+    })
+    .compileComponents();
+  });
 
-    beforeEach(() => {
-        fixture = TestBed.createComponent(RegistrationComponent);
-        component = fixture.componentInstance;
-        formBuilder = TestBed.get(FormBuilder);
-        component.form = formBuilder.group({
-            recipientTypes: new FormControl(
-                {
-                    value: ['mock'],
-                    disabled: true
-                },
-                Validators.required
-            )
-        });
-        fixture.detectChanges();
-    });
+  beforeEach(() => {
+    fixture = TestBed.createComponent(RegistrationComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
 
-    it('should create', () => {
-        expect(component).toBeTruthy();
-    });
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
 });

Frontend/src/app/components/auth/registration/registration.component.ts

@@ -1,47 +1,15 @@
-import {Component, OnInit} from '@angular/core';
-import {FormBuilder, FormGroup, Validators} from '@angular/forms';
-import {ApiService} from '../../../services/api.service';
-import {Router} from '@angular/router';
-
+import { Component, OnInit } from '@angular/core';
 
 @Component({
-    selector: 'app-registration',
-    templateUrl: './registration.component.html',
-    styleUrls: ['./registration.component.css']
+  selector: 'app-registration',
+  templateUrl: './registration.component.html',
+  styleUrls: ['./registration.component.css']
 })
 export class RegistrationComponent implements OnInit {
-    form: any;
-    loading = false;
-    submitted = false;
 
-    constructor(
-        private formBuilder: FormBuilder,
-        private api: ApiService,
-        private router: Router
-    ) {
-    }
+  constructor() { }
 
-    ngOnInit(): void {
-        this.form = this.formBuilder.group({
-            username: ['', Validators.required],
-            email: ['', Validators.required],
-            password: ['', [
-                Validators.required,
-                Validators.minLength(8)]
-            ],
-        });
-    }
+  ngOnInit(): void {
+  }
 
-    get me() {
-        return this.form.controls;
-    }
-
-    onSubmit(): void {
-        this.api.registerUser(this.form.value.username, this.form.value.password, this.form.value.email).subscribe(
-            res => {
-                this.api.saveSessionInfoToLocalStorage(res);
-                this.router.navigate(['/']);
-            }
-        );
-    }
 }

Frontend/src/app/components/auth/resetpasswort/resetpasswort.component.spec.ts

@@ -1,25 +1,25 @@
-import {ComponentFixture, TestBed} from '@angular/core/testing';
+import { ComponentFixture, TestBed } from '@angular/core/testing';
 
-import {ResetpasswortComponent} from './resetpasswort.component';
+import { ResetpasswortComponent } from './resetpasswort.component';
 
 describe('ResetpasswortComponent', () => {
-    let component: ResetpasswortComponent;
-    let fixture: ComponentFixture<ResetpasswortComponent>;
+  let component: ResetpasswortComponent;
+  let fixture: ComponentFixture<ResetpasswortComponent>;
 
-    beforeEach(async () => {
-        await TestBed.configureTestingModule({
-            declarations: [ResetpasswortComponent]
-        })
-            .compileComponents();
-    });
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      declarations: [ ResetpasswortComponent ]
+    })
+    .compileComponents();
+  });
 
-    beforeEach(() => {
-        fixture = TestBed.createComponent(ResetpasswortComponent);
-        component = fixture.componentInstance;
-        fixture.detectChanges();
-    });
+  beforeEach(() => {
+    fixture = TestBed.createComponent(ResetpasswortComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
 
-    it('should create', () => {
-        expect(component).toBeTruthy();
-    });
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
 });

Frontend/src/app/components/auth/resetpasswort/resetpasswort.component.ts

@@ -1,16 +1,15 @@
-import {Component, OnInit} from '@angular/core';
+import { Component, OnInit } from '@angular/core';
 
 @Component({
-    selector: 'app-resetpasswort',
-    templateUrl: './resetpasswort.component.html',
-    styleUrls: ['./resetpasswort.component.css']
+  selector: 'app-resetpasswort',
+  templateUrl: './resetpasswort.component.html',
+  styleUrls: ['./resetpasswort.component.css']
 })
 export class ResetpasswortComponent implements OnInit {
 
-    constructor() {
-    }
+  constructor() { }
 
-    ngOnInit(): void {
-    }
+  ngOnInit(): void {
+  }
 
 }

Frontend/src/app/components/auth/signin/signin.component.css

@@ -1,12 +1,11 @@
-.main-content {
+.main-content{
     width: 50%;
     border-radius: 20px;
-    box-shadow: 0 5px 5px rgba(0, 0, 0, .4);
+    box-shadow: 0 5px 5px rgba(0,0,0,.4);
     margin: 5em auto;
     display: flex;
 }
-
-.company__info {
+.company__info{
     background-color: #008080;
     border-top-left-radius: 20px;
     border-bottom-left-radius: 20px;
@@ -15,79 +14,63 @@
     justify-content: center;
     color: #fff;
 }
-
-.fa-android {
-    font-size: 3em;
+.fa-android{
+    font-size:3em;
 }
-
 @media screen and (max-width: 640px) {
-    .main-content {
-        width: 90%;
-    }
-
-    .company__info {
+    .main-content{width: 90%;}
+    .company__info{
         display: none;
     }
-
-    .login_form {
-        border-top-left-radius: 20px;
-        border-bottom-left-radius: 20px;
+    .login_form{
+        border-top-left-radius:20px;
+        border-bottom-left-radius:20px;
     }
 }
-
-@media screen and (min-width: 642px) and (max-width: 800px) {
-    .main-content {
-        width: 70%;
-    }
+@media screen and (min-width: 642px) and (max-width:800px){
+    .main-content{width: 70%;}
 }
-
-.row > h2 {
-    color: #008080;
+.row > h2{
+    color:#008080;
 }
-
-.login_form {
+.login_form{
     background-color: #fff;
-    border-top-right-radius: 20px;
-    border-bottom-right-radius: 20px;
-    border-top: 1px solid #ccc;
-    border-right: 1px solid #ccc;
+    border-top-right-radius:20px;
+    border-bottom-right-radius:20px;
+    border-top:1px solid #ccc;
+    border-right:1px solid #ccc;
 }
-
-form {
+form{
     padding: 0 2em;
 }
-
-.form__input {
+.form__input{
     width: 100%;
-    border: 0px solid transparent;
+    border:0px solid transparent;
     border-radius: 0;
     border-bottom: 1px solid #aaa;
     padding: 1em .5em .5em;
     padding-left: 2em;
-    outline: none;
-    margin: 1.5em auto;
+    outline:none;
+    margin:1.5em auto;
     transition: all .5s ease;
 }
-
-.form__input:focus {
+.form__input:focus{
     border-bottom-color: #008080;
-    box-shadow: 0 0 5px rgba(0, 80, 80, .4);
+    box-shadow: 0 0 5px rgba(0,80,80,.4);
     border-radius: 4px;
 }
-
-.btn_signin {
+.btn_signin{
     transition: all .5s ease;
-    width: 100%;
+    width: 70%;
     border-radius: 30px;
-    color: #008080;
+    color:#008080;
     font-weight: 600;
     background-color: #fff;
     border: 1px solid #008080;
     margin-top: 1.5em;
     margin-bottom: 1em;
 }
-
-.btn_signin:hover, .btn:focus {
+.btn_signin:hover, .btn:focus{
     background-color: #008080;
-    color: #fff;
+    color:#fff;
 }

Frontend/src/app/components/auth/signin/signin.component.html

@@ -6,26 +6,24 @@
         <div class="col-md-8 col-xs-12 col-sm-12 login_form ">
             <div class="container-fluid">
                 <div class="row">
-                    <h2>Sign In</h2>
+                    <h2>Anmelden</h2>
                 </div>
                 <div class="row">
-                    <form [formGroup]="loginForm" class="form-group" (ngSubmit)="onSubmit()">
+                    <form control="" class="form-group">
                         <div class="row">
-                            <input type="text" formControlName="username" name="username" id="username"
-                                   class="form__input" placeholder="Username">
+                            <input type="text" name="username" id="username" class="form__input" placeholder="Username">
                         </div>
                         <div class="row">
                             <!-- <span class="fa fa-lock"></span> -->
-                            <input type="password" formControlName="password" name="password" id="password"
-                                   class="form__input" placeholder="Password">
+                            <input type="password" name="password" id="password" class="form__input" placeholder="Password">
                         </div>
                         <div class="row">
-                            <input type="submit" value="Log in" class="btn_signin">
+                            <input type="submit" value="Anmelden" class="btn_signin">
                         </div>
                     </form>
                 </div>
                 <div class="row">
-                    <p>No account yet?<a href="/registration">sign up</a></p>
+                    <p>Noch kein Konto?<a href="/registration">Konto erstellen</a></p>
                 </div>
             </div>
         </div>

Frontend/src/app/components/auth/signin/signin.component.spec.ts

@@ -1,54 +1,25 @@
-import {ComponentFixture, TestBed} from '@angular/core/testing';
+import { ComponentFixture, TestBed } from '@angular/core/testing';
 
-import {SigninComponent} from './signin.component';
-import {AbstractMockObservableService} from '../../../mocks/mock.service';
-import {ApiService} from '../../../services/api.service';
-import {FormBuilder, FormControl, Validators} from '@angular/forms';
-import {Router} from '@angular/router';
-
-class MockApiService extends AbstractMockObservableService {
-    loginUser(username: string, password: string): any {
-        this.content = [];
-        return this;
-    }
-}
+import { SigninComponent } from './signin.component';
 
 describe('SigninComponent', () => {
-    let component: SigninComponent;
-    let fixture: ComponentFixture<SigninComponent>;
-    let mockService;
-    let formBuilder: FormBuilder;
-    const router = {
-        navigate: jasmine.createSpy('navigate'),
-        routerState: jasmine.createSpy('routerState')
-    };
+  let component: SigninComponent;
+  let fixture: ComponentFixture<SigninComponent>;
 
-    beforeEach(async () => {
-        mockService = new MockApiService();
-        await TestBed.configureTestingModule({
-            declarations: [SigninComponent],
-            providers: [{provide: ApiService, useValue: mockService}, {provide: Router, useValue: router}, FormBuilder]
-        })
-            .compileComponents();
-    });
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      declarations: [ SigninComponent ]
+    })
+    .compileComponents();
+  });
 
-    beforeEach(() => {
-        fixture = TestBed.createComponent(SigninComponent);
-        component = fixture.componentInstance;
-        formBuilder = TestBed.get(FormBuilder);
-        component.loginForm = formBuilder.group({
-            recipientTypes: new FormControl(
-                {
-                    value: ['mock'],
-                    disabled: true
-                },
-                Validators.required
-            )
-        });
-        fixture.detectChanges();
-    });
+  beforeEach(() => {
+    fixture = TestBed.createComponent(SigninComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
 
-    it('should create', () => {
-        expect(component).toBeTruthy();
-    });
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
 });

Frontend/src/app/components/auth/signin/signin.component.ts

@@ -1,7 +1,4 @@
-import {Component, OnInit} from '@angular/core';
-import {FormBuilder, FormGroup, Validators} from '@angular/forms';
-import {ApiService} from '../../../services/api.service';
-import {Router} from '@angular/router';
+import { Component, OnInit } from '@angular/core';
 
 @Component({
     selector: 'app-signin',
@@ -11,44 +8,12 @@ import {Router} from '@angular/router';
 
 export class SigninComponent implements OnInit {
 
-    loginForm: FormGroup;
-    loading = false;
-    submitted = false;
-    private isSuccessful: boolean;
-    private isSignUpFailed: boolean;
-    private errorMessage: '';
+  constructor() { }
 
-    constructor(
-        private formBuilder: FormBuilder,
-        private api: ApiService,
-        private router: Router
-    ) {
-    }
+  ngOnInit(): void {
+  }
 
-    ngOnInit(): void {
-        this.loginForm = this.formBuilder.group({
-            username: ['', Validators.required],
-            password: ['', [Validators.required, Validators.minLength(8)]]
-        });
-    }
+    onSubmit() {
 
-    onSubmit(): void {
-        this.submitted = true;
-
-        if (this.loginForm.invalid) {
-            return;
-        }
-
-        this.api.loginUser(this.loginForm.value.username, this.loginForm.value.password)
-            .subscribe(
-                data => {
-                    this.isSuccessful = true;
-                    this.router.navigate(['']);
-                    this.api.saveSessionInfoToLocalStorage(data);
-                },
-                err => {
-                    this.errorMessage = err.error.message;
-                    this.isSignUpFailed = true;
-                });
     }
 }

Frontend/src/app/components/bottom-bar/bottom-bar.component.css

@@ -7,14 +7,12 @@
 }
 
 .folge-uns-item {
-    grid-column: 2;
-    grid-row: 1;
+    grid-column: 2; grid-row: 1;
     justify-self: center;
 }
 
 .link-items {
-    grid-column: 2;
-    grid-row: 2;
+    grid-column: 2; grid-row: 2;
     justify-self: center;
 }
 
@@ -31,13 +29,11 @@
 }
 
 .bottom-logo {
-    grid-column: 1;
-    grid-row: 3;
+    grid-column: 1; grid-row: 3;
 }
 
 .bottom-info {
-    grid-column: 3;
-    grid-row: 3;
+    grid-column: 3; grid-row: 3;
     justify-self: right;
 }
 

Frontend/src/app/components/bottom-bar/bottom-bar.component.html

@@ -5,24 +5,24 @@
             <div class="col-lg-4 mb-5 mb-lg-0">
                 <h4 class="text-uppercase mb-4">Location</h4>
                 <p class="lead mb-0">
-                    76133 Karlsruhe
-                    <br/>
+                    70376 Stuttgart
+                    <br />
 
                 </p>
             </div>
             <!-- Footer Social Icons-->
             <div class="col-lg-4 mb-5 mb-lg-0">
-                <h4 class="text-uppercase mb-4">FOLLOW US</h4>
-                <a class="btn btn-outline-light btn-social mx-1" href="https://github.com/Mueller-Patrick/Betterzon"><i
-                    class="fab fa-fw fa-github"></i></a>
-                <a class="btn btn-outline-light btn-social mx-1" href="https://blog.betterzon.xyz/"><i
-                    class="fab fa-fw fa-dribbble"></i></a>
+                <h4 class="text-uppercase mb-4">FOLGE UNS</h4>
+                <a class="btn btn-outline-light btn-social mx-1" href="#!"><i class="fab fa-fw fa-github"></i></a>
+                <a class="btn btn-outline-light btn-social mx-1" href="#!"><i class="fab fa-fw fa-twitter"></i></a>
+                <a class="btn btn-outline-light btn-social mx-1" href="#!"><i class="fab fa-fw fa-linkedin-in"></i></a>
+                <a class="btn btn-outline-light btn-social mx-1" href="#!"><i class="fab fa-fw fa-dribbble"></i></a>
             </div>
             <!-- Footer About Text-->
             <div class="col-lg-4">
-                <h4 class="text-uppercase mb-4">CONTACT US</h4>
+                <h4 class="text-uppercase mb-4">SOME INFO</h4>
                 <p class="lead mb-0">
-                    betterzon-contact@mueller-patrick.tech
+                    text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries
                 </p>
             </div>
         </div>

Frontend/src/app/components/bottom-bar/bottom-bar.component.spec.ts

@@ -1,25 +1,25 @@
-import {ComponentFixture, TestBed} from '@angular/core/testing';
+import { ComponentFixture, TestBed } from '@angular/core/testing';
 
-import {BottomBarComponent} from './bottom-bar.component';
+import { BottomBarComponent } from "./bottom-bar.component";
 
-describe('BottomBarComponent', () => {
-    let component: BottomBarComponent;
-    let fixture: ComponentFixture<BottomBarComponent>;
+describe("BottomBarComponent", () => {
+  let component: BottomBarComponent;
+  let fixture: ComponentFixture<BottomBarComponent>;
 
-    beforeEach(async () => {
-        await TestBed.configureTestingModule({
-            declarations: [BottomBarComponent]
-        })
-            .compileComponents();
-    });
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      declarations: [ BottomBarComponent ]
+    })
+    .compileComponents();
+  });
 
-    beforeEach(() => {
-        fixture = TestBed.createComponent(BottomBarComponent);
-        component = fixture.componentInstance;
-        fixture.detectChanges();
-    });
+  beforeEach(() => {
+    fixture = TestBed.createComponent(BottomBarComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
 
-    it('should create', () => {
-        expect(component).toBeTruthy();
-    });
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
 });

Frontend/src/app/components/bottom-bar/bottom-bar.component.ts

@@ -1,16 +1,15 @@
-import {Component, OnInit} from '@angular/core';
+import { Component, OnInit } from '@angular/core';
 
 @Component({
-    selector: 'app-bottom-bar',
-    templateUrl: './bottom-bar.component.html',
-    styleUrls: ['./bottom-bar.component.css']
+  selector: 'app-bottom-bar',
+  templateUrl: "./bottom-bar.component.html",
+  styleUrls: ["./bottom-bar.component.css"]
 })
 export class BottomBarComponent implements OnInit {
 
-    constructor() {
-    }
+  constructor() { }
 
-    ngOnInit(): void {
-    }
+  ngOnInit(): void {
+  }
 
 }

Frontend/src/app/components/copyright/copyright.component.css

@@ -1,24 +0,0 @@
-#imprintSection {
-    right: 1em;
-    bottom: 1em;
-    width: 100%;
-    text-align: right;
-    padding-right: 1em;
-    grid-area: right;
-}
-
-#imprintSection a {
-    color: white;
-    text-decoration: none;
-}
-
-#copyright {
-    display: grid;
-    grid-template-areas:
-        'left center right';
-    grid-template-columns: 30% 40% 30%;
-}
-
-#copyright-text {
-    grid-area: center;
-}

Frontend/src/app/components/copyright/copyright.component.html

@@ -1,7 +1,3 @@
-<div class="copyright py-4 text-center text-white" id="copyright">
-    <div class="container" id="copyright-text"><small>Copyright &copy; Betterzon 2021</small></div>
-    <div id="imprintSection">
-        <a href="/impressum">Imprint</a><br>
-        <a href="/datenschutz">Privacy Policy</a>
-    </div>
+<div class="copyright py-4 text-center text-white">
+    <div class="container"><small>Copyright &copy; Your Website 2021</small></div>
 </div>

Frontend/src/app/components/copyright/copyright.component.spec.ts

@@ -1,25 +1,25 @@
-import {ComponentFixture, TestBed} from '@angular/core/testing';
+import { ComponentFixture, TestBed } from '@angular/core/testing';
 
-import {CopyrightComponent} from './copyright.component';
+import { CopyrightComponent } from './copyright.component';
 
 describe('CopyrightComponent', () => {
-    let component: CopyrightComponent;
-    let fixture: ComponentFixture<CopyrightComponent>;
+  let component: CopyrightComponent;
+  let fixture: ComponentFixture<CopyrightComponent>;
 
-    beforeEach(async () => {
-        await TestBed.configureTestingModule({
-            declarations: [CopyrightComponent]
-        })
-            .compileComponents();
-    });
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      declarations: [ CopyrightComponent ]
+    })
+    .compileComponents();
+  });
 
-    beforeEach(() => {
-        fixture = TestBed.createComponent(CopyrightComponent);
-        component = fixture.componentInstance;
-        fixture.detectChanges();
-    });
+  beforeEach(() => {
+    fixture = TestBed.createComponent(CopyrightComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
 
-    it('should create', () => {
-        expect(component).toBeTruthy();
-    });
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
 });

Frontend/src/app/components/copyright/copyright.component.ts

@@ -1,16 +1,15 @@
-import {Component, OnInit} from '@angular/core';
+import { Component, OnInit } from '@angular/core';
 
 @Component({
-    selector: 'app-copyright',
-    templateUrl: './copyright.component.html',
-    styleUrls: ['./copyright.component.css']
+  selector: 'app-copyright',
+  templateUrl: './copyright.component.html',
+  styleUrls: ['./copyright.component.css']
 })
 export class CopyrightComponent implements OnInit {
 
-    constructor() {
-    }
+  constructor() { }
 
-    ngOnInit(): void {
-    }
+  ngOnInit(): void {
+  }
 
 }

Frontend/src/app/components/footer/footer.component.html

@@ -9,10 +9,10 @@
             <a href="https://blog.betterzon.xyz/" class="fa fa-info fa-4x icon-3d"></a>
             <a href="https://github.com/Mueller-Patrick/Betterzon/wiki" class="fa fa-wikipedia-w fa-4x icon-3d"></a>
         </div>
-        <div class="blocks" id="copyright">© COPYRIGHT 2020</div>
+        <div class = "blocks" id="copyright">© COPYRIGHT 2020</div>
     </div>
     <div id="imprintSection">
-        <a href="/impressum">Imprint</a><br>
+        <a href="/impressum" >Imprint</a><br>
         <a href="/datenschutz">Privacy Policy</a>
     </div>
 </footer>

Frontend/src/app/components/footer/footer.component.ts

@@ -1,24 +1,23 @@
-import {Component, OnInit} from '@angular/core';
+import { Component, OnInit } from '@angular/core';
 import {ActivatedRoute, Router} from '@angular/router';
 
 @Component({
-    selector: 'app-footer',
-    templateUrl: './footer.component.html',
-    styleUrls: ['./footer.component.css']
+  selector: 'app-footer',
+  templateUrl: './footer.component.html',
+  styleUrls: ['./footer.component.css']
 })
 export class FooterComponent implements OnInit {
 
-    constructor(
-        private router: Router,
-        private route: ActivatedRoute
-    ) {
-    }
+  constructor(
+      private router: Router,
+      private route: ActivatedRoute
+  ) {}
 
-    ngOnInit(): void {
-    }
+  ngOnInit(): void {
+  }
 
-    navigateImprint(): void {
-        this.router.navigate([('/impressum')]);
-    }
+  navigateImprint(): void {
+      this.router.navigate([('/impressum')]);
+  }
 
 }

Frontend/src/app/components/greeting-info-slider/greeting-info-slider.component.html

@@ -1,7 +1,7 @@
 <header class="masthead bg-primary text-white text-center">
     <div class="container d-flex align-items-center flex-column">
         <!-- Masthead Avatar Image-->
-        <img class="masthead-avatar mb-5" src="assets/images/Betterzon.svg" alt="..."/>
+        <img class="masthead-avatar mb-5" src="assets/images/Betterzon.svg" alt="..." />
         <!-- Masthead Heading-->
         <h1 class="masthead-heading text-uppercase mb-0"></h1>
         <!-- Icon Divider-->

Frontend/src/app/components/greeting-info-slider/greeting-info-slider.component.spec.ts

@@ -1,25 +1,25 @@
-import {ComponentFixture, TestBed} from '@angular/core/testing';
+import { ComponentFixture, TestBed } from '@angular/core/testing';
 
-import {GreetingInfoSliderComponent} from './greeting-info-slider.component';
+import { GreetingInfoSliderComponent } from './greeting-info-slider.component';
 
 describe('GreetingInfoSliderComponent', () => {
-    let component: GreetingInfoSliderComponent;
-    let fixture: ComponentFixture<GreetingInfoSliderComponent>;
+  let component: GreetingInfoSliderComponent;
+  let fixture: ComponentFixture<GreetingInfoSliderComponent>;
 
-    beforeEach(async () => {
-        await TestBed.configureTestingModule({
-            declarations: [GreetingInfoSliderComponent]
-        })
-            .compileComponents();
-    });
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      declarations: [ GreetingInfoSliderComponent ]
+    })
+    .compileComponents();
+  });
 
-    beforeEach(() => {
-        fixture = TestBed.createComponent(GreetingInfoSliderComponent);
-        component = fixture.componentInstance;
-        fixture.detectChanges();
-    });
+  beforeEach(() => {
+    fixture = TestBed.createComponent(GreetingInfoSliderComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
 
-    it('should create', () => {
-        expect(component).toBeTruthy();
-    });
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
 });

Frontend/src/app/components/greeting-info-slider/greeting-info-slider.component.ts

@@ -1,16 +1,15 @@
-import {Component, OnInit} from '@angular/core';
+import { Component, OnInit } from '@angular/core';
 
 @Component({
-    selector: 'app-greeting-info-slider',
-    templateUrl: './greeting-info-slider.component.html',
-    styleUrls: ['./greeting-info-slider.component.css']
+  selector: 'app-greeting-info-slider',
+  templateUrl: './greeting-info-slider.component.html',
+  styleUrls: ['./greeting-info-slider.component.css']
 })
 export class GreetingInfoSliderComponent implements OnInit {
 
-    constructor() {
-    }
+  constructor() { }
 
-    ngOnInit(): void {
-    }
+  ngOnInit(): void {
+  }
 
 }

Frontend/src/app/components/header/header.component.html

@@ -5,8 +5,7 @@
             <img src="assets/images/Betterzon.svg" alt="Betterzon Logo" width="50px" (click)="clickedLogo()">
         </div>
         <div class="searchBox">
-            <input *ngIf="showSearch===true" type="text" [(ngModel)]="searchInput" placeholder="Search"
-                   (keyup.enter)="startedSearch()">
+            <input *ngIf="showSearch===true" type="text" [(ngModel)]="searchInput" placeholder="Search" (keyup.enter)="startedSearch()">
         </div>
         <div class="slider">
             <mat-slide-toggle color="primary">dark me</mat-slide-toggle>

Frontend/src/app/components/hot-deals-widget/hot-deals-widget.component.html

@@ -1,7 +1,7 @@
 <section class="page-section portfolio" id="top-gesuchte">
     <div class="container">
         <!-- Portfolio Section Heading-->
-        <h2 class="page-section-heading text-center text-uppercase text-secondary mb-0">TOP-OFFERS</h2>
+        <h2 class="page-section-heading text-center text-uppercase text-secondary mb-0">TOP-ANGEBOTE</h2>
         <!-- Icon Divider-->
         <div class="divider-custom">
             <div class="divider-custom-line"></div>
@@ -9,33 +9,26 @@
         <!-- Portfolio Grid Items-->
         <div class="row justify-content-center">
             <!-- Portfolio Item 1-->
-            <div class="col-md-4 mx-auto my-5" *ngFor="let productId of bestDealsProductIds"
-                 (click)="clickedProduct(productId)">
+            <div class="col-md-4 mx-auto my-5" *ngFor="let product of products">
                 <div class="bbb_deals_wrapper">
-                    <div class="bbb_deals_image"><img
-                        src="https://www.mueller-patrick.tech/betterzon/images/{{productsPricesMap[productId]?.product?.image_guid}}.jpg"
-                        alt=""></div>
+                    <div class="bbb_deals_image"><img src="https://www.mueller-patrick.tech/betterzon/images/{{product.image_guid}}.jpg" alt=""></div>
                     <div class="bbb_deals_content">
                         <div class="bbb_deals_info_line d-flex flex-row justify-content-start">
-                            <div class="bbb_deals_item_name">{{productsPricesMap[productId]?.product?.name}}</div>
+                            <div class="bbb_deals_item_name">{{product.name}}</div>
                         </div>
                         <div class="bbb_deals_info_line d-flex flex-row justify-content-start">
-                            <div class="bbb_deals_item_category">Amazon: <span
-                                id="bbb_deals_item_price_a"><strike>{{productsPricesMap[productId]?.amazonPrice?.price_in_cents / 100}}
-                                €</strike></span></div>
+                            <div class="bbb_deals_item_category">Amazon: <span id="bbb_deals_item_price_a"><strike>699.00$</strike></span></div>
                         </div>
                         <div class="bbb_deals_info_line d-flex flex-row justify-content-start">
-                            <div class="bbb_deals_item_category">{{productsPricesMap[productId]?.vendor?.name}}: <span
-                                id="bbb_deals_item_price_b">{{productsPricesMap[productId]?.lowestPrice?.price_in_cents / 100}}
-                                €</span></div>
+                            <div class="bbb_deals_item_category">Plantshub: <span id="bbb_deals_item_price_b">599,00$</span></div>
                         </div>
                         <div class="available_bar">
                             <span style="width:17%"></span>
                         </div>
+                        </div>
                     </div>
                 </div>
             </div>
         </div>
-    </div>
 </section>
 

Frontend/src/app/components/hot-deals-widget/hot-deals-widget.component.spec.ts

@@ -1,58 +1,25 @@
-import {ComponentFixture, TestBed} from '@angular/core/testing';
+import { ComponentFixture, TestBed } from '@angular/core/testing';
 
-import {HotDealsWidgetComponent} from './hot-deals-widget.component';
-import {AbstractMockObservableService} from '../../mocks/mock.service';
-import {ApiService} from '../../services/api.service';
-import {ActivatedRoute, convertToParamMap, Router} from '@angular/router';
-import {Observable, of} from 'rxjs';
-
-class MockApiService extends AbstractMockObservableService {
-    getBestDeals(): any {
-        this.content = [];
-        return this;
-    }
-
-    getProductsByIds(): any {
-        this.content = [];
-        return this;
-    }
-}
-
-class ActivatedRouteMock {
-    public paramMap = of(convertToParamMap({
-        testId: 'abc123',
-        anotherId: 'd31e8b48-7309-4c83-9884-4142efdf7271',
-    }));
-}
+import { HotDealsWidgetComponent } from './hot-deals-widget.component';
 
 describe('HotDealsWidgetComponent', () => {
-    let component: HotDealsWidgetComponent;
-    let fixture: ComponentFixture<HotDealsWidgetComponent>;
-    let mockService;
-    const router = {
-        navigate: jasmine.createSpy('navigate'),
-        routerState: jasmine.createSpy('routerState')
-    };
+  let component: HotDealsWidgetComponent;
+  let fixture: ComponentFixture<HotDealsWidgetComponent>;
 
-    beforeEach(async () => {
-        mockService = new MockApiService();
-        await TestBed.configureTestingModule({
-            declarations: [HotDealsWidgetComponent],
-            providers: [{provide: ApiService, useValue: mockService}, {provide: Router, useValue: router}, {
-                provide: ActivatedRoute,
-                useValue: ActivatedRouteMock
-            }]
-        })
-            .compileComponents();
-    });
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      declarations: [ HotDealsWidgetComponent ]
+    })
+    .compileComponents();
+  });
 
-    beforeEach(() => {
-        fixture = TestBed.createComponent(HotDealsWidgetComponent);
-        component = fixture.componentInstance;
-        fixture.detectChanges();
-    });
+  beforeEach(() => {
+    fixture = TestBed.createComponent(HotDealsWidgetComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
 
-    it('should create', () => {
-        expect(component).toBeTruthy();
-    });
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
 });

Frontend/src/app/components/hot-deals-widget/hot-deals-widget.component.ts

@@ -4,16 +4,13 @@ import {Product} from '../../models/product';
 import {ActivatedRoute, Router} from '@angular/router';
 
 @Component({
-    selector: 'app-hot-deals-widget',
-    templateUrl: './hot-deals-widget.component.html',
-    styleUrls: ['./hot-deals-widget.component.css']
+  selector: 'app-hot-deals-widget',
+  templateUrl: './hot-deals-widget.component.html',
+  styleUrls: ['./hot-deals-widget.component.css']
 })
 export class HotDealsWidgetComponent implements OnInit {
 
     products: Product[] = [];
-    bestDealsProductIds = [];
-    amazonPrices = [];
-    productsPricesMap = new Map();
     @Input() numberOfProducts: number;
     @Input() showProductPicture: boolean;
     @Input() searchQuery: string;
@@ -27,13 +24,12 @@ export class HotDealsWidgetComponent implements OnInit {
     }
 
     ngOnInit(): void {
-
-        this.getBestDeals();
+        this.loadParams();
     }
 
     loadParams(): void {
         if (!this.numberOfProducts) {
-            this.numberOfProducts = 9;
+            this.numberOfProducts = 10;
         }
         if (!this.showProductPicture) {
             this.showProductPicture = false;
@@ -47,69 +43,26 @@ export class HotDealsWidgetComponent implements OnInit {
 
         switch (this.type) {
             case 'search': {
+                this.getSearchedProducts();
                 break;
             }
             default: {
-                this.getProductsByIds();
-                this.getAmazonPricesForBestDeals();
-                this.getVendors();
+                this.getProducts();
                 break;
             }
         }
     }
 
-    getProductsByIds(): void {
-        this.apiService.getProductsByIds(this.bestDealsProductIds).subscribe(
-            products => {
-                products.forEach(product => {
-                    this.productsPricesMap [product.product_id].product = product;
-                });
-            }
-        );
-    }
-
-    getBestDeals(): void {
-        this.apiService.getBestDeals(9).subscribe(
-            deals => {
-                deals.forEach(deal => {
-                    this.bestDealsProductIds.push(deal.product_id);
-                    this.productsPricesMap [deal.product_id] = {lowestPrice: deal};
-                });
-                this.loadParams();
-            }
-        );
-    }
-
-    getVendors(): void {
-        this.bestDealsProductIds.forEach(
-            productId => {
-                const currentDeal = this.productsPricesMap[productId].lowestPrice;
-                this.apiService.getVendorById(currentDeal.vendor_id).subscribe(
-                    vendor => {
-                        this.productsPricesMap[productId].vendor = vendor;
-                    });
-            });
-    }
-
-
-    getAmazonPricesForBestDeals(): void {
-        this.bestDealsProductIds.forEach(id => {
-                this.apiService.getAmazonPrice(id).subscribe(
-                    price => {
-                        this.amazonPrices.push(price);
-                        this.productsPricesMap[price[0].product_id].amazonPrice = price[0];
-                    }
-                );
-            }
-        );
+    getProducts(): void {
+        this.apiService.getProducts().subscribe(products => this.products = products);
     }
 
     getSearchedProducts(): void {
         this.apiService.getProductsByQuery(this.searchQuery).subscribe(products => this.products = products);
     }
 
-    clickedProduct(productId: string): void {
-        this.router.navigate([('/product/' + productId)]);
+    clickedProduct(product: Product): void {
+        this.router.navigate([('/product/' + product.product_id)]);
     }
 
 

Frontend/src/app/components/kunden/kunden.component.html

@@ -1,7 +1,7 @@
 <section class="page-section portfolio" id="unsere-kunden">
     <div class="container">
         <!-- Portfolio Section Heading-->
-        <h2 class="page-section-heading text-center text-uppercase text-secondary mb-0">THEY TRUST US</h2>
+        <h2 class="page-section-heading text-center text-uppercase text-secondary mb-0">SIE VERTRAUEN UNS</h2>
         <!-- Icon Divider-->
         <div class="divider-custom">
             <div class="divider-custom-line"></div>
@@ -12,28 +12,25 @@
             <div class="col-md-6 col-lg-4 mb-5">
                 <div class="portfolio-item mx-auto" data-bs-toggle="modal" data-bs-target="#portfolioModal1">
                     <div class="portfolio-item-caption d-flex align-items-center justify-content-center h-100 w-100">
-                        <div class="portfolio-item-caption-content text-center text-white"><i
-                            class="fas fa-plus fa-3x"></i></div>
+                        <div class="portfolio-item-caption-content text-center text-white"><i class="fas fa-plus fa-3x"></i></div>
                     </div>
-                    <img width="100%" class="productImage" src="assets/images/cropped-unknown-1-1.png"/>
+                    <img class="productImage" src="assets/images/Betterzon.svg"/>
                 </div>
             </div>
             <div class="col-md-6 col-lg-4 mb-5">
                 <div class="portfolio-item mx-auto" data-bs-toggle="modal" data-bs-target="#portfolioModal1">
                     <div class="portfolio-item-caption d-flex align-items-center justify-content-center h-100 w-100">
-                        <div class="portfolio-item-caption-content text-center text-white"><i
-                            class="fas fa-plus fa-3x"></i></div>
+                        <div class="portfolio-item-caption-content text-center text-white"><i class="fas fa-plus fa-3x"></i></div>
                     </div>
-                    <img width="100%" class="productImage" src="assets/images/plantshub.jpg"/>
+                    <img class="productImage" src="assets/images/Betterzon.svg"/>
                 </div>
             </div>
             <div class="col-md-6 col-lg-4 mb-5">
                 <div class="portfolio-item mx-auto" data-bs-toggle="modal" data-bs-target="#portfolioModal1">
                     <div class="portfolio-item-caption d-flex align-items-center justify-content-center h-100 w-100">
-                        <div class="portfolio-item-caption-content text-center text-white"><i
-                            class="fas fa-plus fa-3x"></i></div>
+                        <div class="portfolio-item-caption-content text-center text-white"><i class="fas fa-plus fa-3x"></i></div>
                     </div>
-                    <img width="70%" class="productImage" src="assets/images/CeangalLogo.png"/>
+                    <img class="productImage" src="assets/images/Betterzon.svg"/>
                 </div>
             </div>
         </div>

Frontend/src/app/components/kunden/kunden.component.spec.ts

@@ -1,53 +1,25 @@
-import {ComponentFixture, TestBed} from '@angular/core/testing';
+import { ComponentFixture, TestBed } from '@angular/core/testing';
 
-import {KundenComponent} from './kunden.component';
-import {AbstractMockObservableService} from '../../mocks/mock.service';
-import {ApiService} from '../../services/api.service';
-import {ActivatedRoute, convertToParamMap, Router} from '@angular/router';
-import {of} from 'rxjs';
-
-class MockApiService extends AbstractMockObservableService {
-    getProducts(): any {
-        this.content = [];
-        return this;
-    }
-}
-
-class ActivatedRouteMock {
-    public paramMap = of(convertToParamMap({
-        testId: 'abc123',
-        anotherId: 'd31e8b48-7309-4c83-9884-4142efdf7271',
-    }));
-}
+import { KundenComponent } from './kunden.component';
 
 describe('KundenComponent', () => {
-    let component: KundenComponent;
-    let fixture: ComponentFixture<KundenComponent>;
-    let mockService;
-    const router = {
-        navigate: jasmine.createSpy('navigate'),
-        routerState: jasmine.createSpy('routerState')
-    };
+  let component: KundenComponent;
+  let fixture: ComponentFixture<KundenComponent>;
 
-    beforeEach(async () => {
-        mockService = new MockApiService();
-        await TestBed.configureTestingModule({
-            declarations: [KundenComponent],
-            providers: [{provide: ApiService, useValue: mockService}, {provide: Router, useValue: router}, {
-                provide: ActivatedRoute,
-                useValue: ActivatedRouteMock
-            }]
-        })
-            .compileComponents();
-    });
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      declarations: [ KundenComponent ]
+    })
+    .compileComponents();
+  });
 
-    beforeEach(() => {
-        fixture = TestBed.createComponent(KundenComponent);
-        component = fixture.componentInstance;
-        fixture.detectChanges();
-    });
+  beforeEach(() => {
+    fixture = TestBed.createComponent(KundenComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
 
-    it('should create', () => {
-        expect(component).toBeTruthy();
-    });
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
 });

Frontend/src/app/components/kunden/kunden.component.ts

@@ -4,9 +4,9 @@ import {Product} from '../../models/product';
 import {ActivatedRoute, Router} from '@angular/router';
 
 @Component({
-    selector: 'app-kunden',
-    templateUrl: './kunden.component.html',
-    styleUrls: ['./kunden.component.css']
+  selector: 'app-kunden',
+  templateUrl: './kunden.component.html',
+  styleUrls: ['./kunden.component.css']
 })
 export class KundenComponent implements OnInit {
     products: Product[] = [];

Frontend/src/app/components/product-details/product-details.component.html

@@ -1,6 +1,3 @@
-<header class="masthead bg-transparent text-white text-center" id="w1">
-
-</header>
 <div class="productItem">
     <div class="productImageContainer">
         <img class="productImage" src="https://www.mueller-patrick.tech/betterzon/images/{{product.image_guid}}.jpg"/>
@@ -23,12 +20,8 @@
             {{product?.short_description}}
         </div>
     </div>
-    <div class="priceAlarm" *ngIf="!isLoggedIn" routerLink="/signin">
-        Login to set a price alarm
-    </div>
-    <div class="priceAlarm" *ngIf="isLoggedIn">
-        <input type="search" id="s" name="price" [(ngModel)]="price">
-        <div (click)="setPriceAlarm()">Set Price Alarm</div>
+    <div class="priceAlarm">
+        Set Price Alarm
     </div>
     <div class="bestPriceContainer">
         <div class="bestPrice">

Frontend/src/app/components/product-details/product-details.component.spec.ts

@@ -58,11 +58,6 @@ class MockApiService extends AbstractMockObservableService {
         this.content = [vendor];
         return this;
     }
-
-    getSessionInfoFromLocalStorage(): any {
-        this.content = [];
-        return this;
-    }
 }
 
 describe('ProductDetailsComponent', () => {

Frontend/src/app/components/product-details/product-details.component.ts

@@ -34,8 +34,6 @@ export class ProductDetailsComponent implements OnInit {
     vendorMap = {};
     @ViewChild('chart') chart: ChartComponent;
     public chartOptions: ChartOptions;
-    isLoggedIn: boolean;
-    price: any;
 
     constructor(
         private apiService: ApiService
@@ -46,9 +44,6 @@ export class ProductDetailsComponent implements OnInit {
         this.getProduct();
         this.getVendors();
         this.getPrices();
-        if (this.apiService.getSessionInfoFromLocalStorage().session_id != '') {
-            this.isLoggedIn = true;
-        }
     }
 
     getProduct(): void {
@@ -122,12 +117,4 @@ export class ProductDetailsComponent implements OnInit {
 
         return Math.round(percentage);
     }
-
-    setPriceAlarm(): void {
-        this.apiService.createPriceAlarms(this.productId, this.price * 100).subscribe(
-            alarms => console.log(alarms)
-        );
-    }
-
-
 }

Frontend/src/app/components/product-list/product-list.component.html

@@ -1,53 +1,22 @@
 <div *ngIf="products.length==0">
     No Products found!
 </div>
-<div class="container mt-5 mb-5">
-    <div class="d-flex justify-content-center row">
-        <div class="col-md-10">
-            <div class="row p-2 bg-white border rounded" *ngFor="let product of products">
-                <div class="col-md-3 mt-1"><img width="50%" class="img-fluid img-responsive rounded product-image"
-                                                src="https://www.mueller-patrick.tech/betterzon/images/{{product.image_guid}}.jpg">
-                </div>
-                <div class="col-md-6 mt-1">
-                    <h5>{{product.name}}</h5>
-                    <div class="d-flex flex-row">
-                        <p class="text-justify text-truncate para mb-0">{{product.short_description}}</p>
-                    </div>
-                    <div class="mt-1 mb-1 spec-1"><span></span><span class="dot"></span><span></span><span
-                        class="dot"></span><span><br></span></div>
-                    <div class="mt-1 mb-1 spec-1"><span></span><span class="dot"></span><span></span><span
-                        class="dot"></span><span><br></span></div>
-                </div>
-                <div class="align-items-center align-content-center col-md-3 border-left mt-1">
-                    <div class="d-flex flex-row align-items-center">
-                        <h4 class="mr-1">${{pricesMap[product.product_id]?.price_in_cents / 100}}</h4>
-                    </div>
-                    <div class="d-flex flex-column mt-4">
-                        <button class="btn btn-primary btn-sm" type="button" (click)="clickedProduct(product)">Details
-                        </button>
-                    </div>
-                </div>
-            </div>
+<div class="productItem" *ngFor="let product of products" (click)="clickedProduct(product)">
+    <div class="productImageContainer" *ngIf="showProductPicture===true">
+        <img class="productImage" src="https://www.mueller-patrick.tech/betterzon/images/{{product.image_guid}}.jpg"/>
+    </div>
+    <div class="productTitle">
+        <b>{{product.name}}</b>
+    </div>
+    <div class="productPrice">
+        5€
+    </div>
+    <div class="productDescription">
+        <div *ngIf="product.short_description.length > 300">
+            {{product.short_description.substring(0, 300) + "..."}}
+        </div>
+        <div *ngIf="product.short_description.length <= 300">
+            {{product.short_description}}
         </div>
     </div>
-    <!--
-    <div class="productItem" *ngFor="let product of products" (click)="clickedProduct(product)">
-        <div class="productImageContainer" *ngIf="showProductPicture===true">
-            <img class="productImage" src="https://www.mueller-patrick.tech/betterzon/images/{{product.image_guid}}.jpg"/>
-        </div>
-        <div class="productTitle">
-            <b>{{product.name}}</b>
-        </div>
-        <div class="productPrice">
-            5€
-        </div>
-        <div class="productDescription">
-            <div *ngIf="product.short_description.length > 300">
-                {{product.short_description.substring(0, 300) + "..."}}
-            </div>
-            <div *ngIf="product.short_description.length <= 300">
-                {{product.short_description}}
-            </div>
-        </div>
-    </div>
-    -->
+</div>

Frontend/src/app/components/product-list/product-list.component.spec.ts

@@ -70,8 +70,7 @@ describe('ProductListComponent', () => {
             last_modified: new Date(),
             manufacturer_id: 1,
             selling_rank: '1',
-            category_id: 1,
-            price: 0
+            category_id: 1
         };
 
         component.clickedProduct(product);

Frontend/src/app/components/product-list/product-list.component.ts

@@ -10,7 +10,6 @@ import {ActivatedRoute, Router} from '@angular/router';
 })
 export class ProductListComponent implements OnInit {
     products: Product[] = [];
-    pricesMap: any = {};
     @Input() numberOfProducts: number;
     @Input() showProductPicture: boolean;
     @Input() searchQuery: string;
@@ -54,35 +53,15 @@ export class ProductListComponent implements OnInit {
     }
 
     getProducts(): void {
-        this.apiService.getProducts().subscribe(products => {
-            this.products = products;
-            this.getPrices();
-        });
+        this.apiService.getProducts().subscribe(products => this.products = products);
     }
 
-    getPrices(): void {
-        this.products.forEach(
-            product => {
-                this.apiService.getLowestPrices(product.product_id).subscribe(
-                    prices => {
-                        this.pricesMap[product.product_id] = prices[prices.length - 1];
-                    }
-                );
-            }
-        );
-    }
-
-
     getSearchedProducts(): void {
-        this.apiService.getProductsByQuery(this.searchQuery).subscribe(products => {
-            this.products = products;
-            this.getPrices();
-        });
+        this.apiService.getProductsByQuery(this.searchQuery).subscribe(products => this.products = products);
     }
 
     clickedProduct(product: Product): void {
         this.router.navigate([('/product/' + product.product_id)]);
     }
 
-
 }

Frontend/src/app/components/slider-for-products/slider-for-products.component.spec.ts

@@ -1,25 +1,25 @@
-import {ComponentFixture, TestBed} from '@angular/core/testing';
+import { ComponentFixture, TestBed } from '@angular/core/testing';
 
-import {SliderForProductsComponent} from './slider-for-products.component';
+import { SliderForProductsComponent } from './slider-for-products.component';
 
 describe('SliderForProductsComponent', () => {
-    let component: SliderForProductsComponent;
-    let fixture: ComponentFixture<SliderForProductsComponent>;
+  let component: SliderForProductsComponent;
+  let fixture: ComponentFixture<SliderForProductsComponent>;
 
-    beforeEach(async () => {
-        await TestBed.configureTestingModule({
-            declarations: [SliderForProductsComponent]
-        })
-            .compileComponents();
-    });
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      declarations: [ SliderForProductsComponent ]
+    })
+    .compileComponents();
+  });
 
-    beforeEach(() => {
-        fixture = TestBed.createComponent(SliderForProductsComponent);
-        component = fixture.componentInstance;
-        fixture.detectChanges();
-    });
+  beforeEach(() => {
+    fixture = TestBed.createComponent(SliderForProductsComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
 
-    it('should create', () => {
-        expect(component).toBeTruthy();
-    });
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
 });

Frontend/src/app/components/slider-for-products/slider-for-products.component.ts

@@ -1,16 +1,15 @@
-import {Component, OnInit} from '@angular/core';
+import { Component, OnInit } from '@angular/core';
 
 @Component({
-    selector: 'app-slider-for-products',
-    templateUrl: './slider-for-products.component.html',
-    styleUrls: ['./slider-for-products.component.css']
+  selector: 'app-slider-for-products',
+  templateUrl: './slider-for-products.component.html',
+  styleUrls: ['./slider-for-products.component.css']
 })
 export class SliderForProductsComponent implements OnInit {
 
-    constructor() {
-    }
+  constructor() { }
 
-    ngOnInit(): void {
-    }
+  ngOnInit(): void {
+  }
 
 }

Frontend/src/app/components/top-bar/top-bar.component.html

@@ -1,33 +1,20 @@
 <nav class="navbar navbar-expand-lg bg-secondary text-uppercase fixed-top" id="mainNav">
     <div class="container">
         <a class="navbar-brand" routerLink=""> Betterzon</a>
-        <div class="form-inline my-2 my-lg-0">
-            <input class="form-control mr-sm-2" type="search" placeholder="Search" aria-label="Search"
-                   (keyup.enter)="getSearchedProducts()" [(ngModel)]="searchQuery">
-        </div>
-        <button class="navbar-toggler text-uppercase font-weight-bold bg-primary text-white rounded" type="button"
-                data-bs-toggle="collapse" data-bs-target="#navbarResponsive" aria-controls="navbarResponsive"
-                aria-expanded="false" aria-label="Toggle navigation">
+        <form class="form-inline my-2 my-lg-0">
+            <input class="form-control mr-sm-2" type="search" placeholder="Search" aria-label="Search">
+        </form>
+        <button class="navbar-toggler text-uppercase font-weight-bold bg-primary text-white rounded" type="button" data-bs-toggle="collapse" data-bs-target="#navbarResponsive" aria-controls="navbarResponsive" aria-expanded="false" aria-label="Toggle navigation">
             Menu
             <i class="fas fa-bars"></i>
         </button>
         <div class="collapse navbar-collapse" id="navbarResponsive">
             <ul class="navbar-nav ms-auto">
-                <li class="nav-item mx-0 mx-lg-1"><a class="nav-link py-3 px-0 px-lg-3 rounded" href="#top-gesuchte">top-offers</a>
-                </li>
-                <li class="nav-item mx-0 mx-lg-1"><a class="nav-link py-3 px-0 px-lg-3 rounded" href="#about">about</a>
-                </li>
-                <li class="nav-item mx-0 mx-lg-1"><a class="nav-link py-3 px-0 px-lg-3 rounded" href="#unsere-kunden">our
-                    clients</a></li>
-                <li class="nav-item mx-0 mx-lg-1" *ngIf="!isLoggedIn"><a class="nav-link py-3 px-0 px-lg-3 rounded"
-                                                                         routerLink="/signin">sign in</a></li>
-                <li class="nav-item mx-0 mx-lg-1" *ngIf="!isLoggedIn"><a class="nav-link py-3 px-0 px-lg-3 rounded"
-                                                                         routerLink="/registration">sign up</a></li>
-                <li class="nav-item mx-0 mx-lg-1" *ngIf="isLoggedIn"><a class="nav-link py-3 px-0 px-lg-3 rounded"
-                                                                        routerLink="" (click)="logout()">log out</a>
-                </li>
-                <li class="nav-item mx-0 mx-lg-1" *ngIf="isLoggedIn"><a class="nav-link py-3 px-0 px-lg-3 rounded"
-                                                                        routerLink="/profile">profile</a></li>
+                <li class="nav-item mx-0 mx-lg-1"><a class="nav-link py-3 px-0 px-lg-3 rounded" href="#top-gesuchte">Top-Gesuchte</a></li>
+                <li class="nav-item mx-0 mx-lg-1"><a class="nav-link py-3 px-0 px-lg-3 rounded" href="#about">über uns</a></li>
+                <li class="nav-item mx-0 mx-lg-1"><a class="nav-link py-3 px-0 px-lg-3 rounded" href="#unsere-kunden">Unsere Kunden</a></li>
+                <li class="nav-item mx-0 mx-lg-1"><a class="nav-link py-3 px-0 px-lg-3 rounded" routerLink="/signin">Anmelden</a></li>
+                <li class="nav-item mx-0 mx-lg-1"><a class="nav-link py-3 px-0 px-lg-3 rounded" routerLink="/registration">Konto Erstellen</a></li>
             </ul>
         </div>
     </div>

Frontend/src/app/components/top-bar/top-bar.component.spec.ts

@@ -1,48 +1,25 @@
-import {ComponentFixture, TestBed} from '@angular/core/testing';
+import { ComponentFixture, TestBed } from '@angular/core/testing';
 
-import {TopBarComponent} from './top-bar.component';
-import {FormBuilder} from '@angular/forms';
-import {ApiService} from '../../services/api.service';
-import {Router} from '@angular/router';
-import {AbstractMockObservableService} from '../../mocks/mock.service';
-
-class MockApiService extends AbstractMockObservableService {
-    getUserInfo(): any {
-        this.content = [];
-        return this;
-    }
-
-    getSessionInfoFromLocalStorage(): any {
-        this.content = [];
-        return this;
-    }
-}
+import { TopBarComponent } from './top-bar.component';
 
 describe('TopBarComponent', () => {
-    let component: TopBarComponent;
-    let fixture: ComponentFixture<TopBarComponent>;
-    let mockService;
-    const router = {
-        navigate: jasmine.createSpy('navigate'),
-        routerState: jasmine.createSpy('routerState')
-    };
+  let component: TopBarComponent;
+  let fixture: ComponentFixture<TopBarComponent>;
 
-    beforeEach(async () => {
-        mockService = new MockApiService();
-        await TestBed.configureTestingModule({
-            declarations: [TopBarComponent],
-            providers: [{provide: ApiService, useValue: mockService}, {provide: Router, useValue: router}]
-        })
-            .compileComponents();
-    });
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      declarations: [ TopBarComponent ]
+    })
+    .compileComponents();
+  });
 
-    beforeEach(() => {
-        fixture = TestBed.createComponent(TopBarComponent);
-        component = fixture.componentInstance;
-        fixture.detectChanges();
-    });
+  beforeEach(() => {
+    fixture = TestBed.createComponent(TopBarComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
 
-    it('should create', () => {
-        expect(component).toBeTruthy();
-    });
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
 });

Frontend/src/app/components/top-bar/top-bar.component.ts

@@ -1,52 +1,17 @@
-import {Component, Input, OnInit} from '@angular/core';
-import {ApiService} from '../../services/api.service';
-import {NavigationEnd, Router} from '@angular/router';
-
+import { Component, OnInit } from '@angular/core';
 
 @Component({
-    selector: 'app-top-bar',
-    templateUrl: './top-bar.component.html',
-    styleUrls: ['./top-bar.component.css']
+  selector: 'app-top-bar',
+  templateUrl: './top-bar.component.html',
+  styleUrls: ['./top-bar.component.css']
 })
 export class TopBarComponent implements OnInit {
 
-    sidenav: any;
-    isLoggedIn: boolean;
-    searchQuery: string;
+  sidenav: any;
 
-    constructor(
-        private api: ApiService,
-        private router: Router
-    ) {
+  constructor() { }
+
+    ngOnInit() {
     }
 
-    ngOnInit(): void {
-        this.api.getUserInfo().subscribe(data => {
-            console.log(data);
-        });
-
-        if (this.api.getSessionInfoFromLocalStorage().session_id !== '') {
-            this.isLoggedIn = true;
-        }
-    }
-
-    logout(): void {
-        localStorage.setItem('session_id', '');
-        localStorage.setItem('session_key', '');
-        if (this.router.url === '/profile') {
-            this.router.navigate(['/']);
-        } else {
-            window.location.reload();
-        }
-    }
-
-    getSearchedProducts(): void {
-        console.log(this.searchQuery);
-        this.redirectTo('/search', {queryParams: {q: this.searchQuery}});
-    }
-
-    redirectTo(uri: string, queryParams: object): void {
-        this.router.navigateByUrl('/', {skipLocationChange: true}).then(() =>
-            this.router.navigate([uri], queryParams));
-    }
 }

Frontend/src/app/models/product.ts

@@ -11,5 +11,4 @@ export interface Product {
     manufacturer_id: number;
     selling_rank: string;
     category_id: number;
-    price: number;
 }

Frontend/src/app/pages/imprint/imprint.component.html

@@ -1,5 +1,5 @@
-<app-top-bar></app-top-bar>
-<div id="imprint" class="container masthead">
+<app-header [showSearch]="true"></app-header>
+<div id="imprint">
     <h1>Impressum</h1>
 
     <h2>Angaben gem&auml;&szlig; &sect; 5 TMG</h2>
@@ -17,16 +17,14 @@
     <h3>Haftung f&uuml;r Inhalte</h3>
     <p>
         Als Diensteanbieter sind wir gem&auml;&szlig; &sect; 7 Abs.1 TMG f&uuml;r eigene
-        Inhalte auf diesen Seiten nach den allgemeinen Gesetzen verantwortlich. Nach &sect;&sect; 8 bis 10 TMG sind wir
-        als
+        Inhalte auf diesen Seiten nach den allgemeinen Gesetzen verantwortlich. Nach &sect;&sect; 8 bis 10 TMG sind wir als
         Diensteanbieter jedoch nicht verpflichtet, &uuml;bermittelte oder gespeicherte fremde Informationen zu &uuml;berwachen
         oder nach Umst&auml;nden zu forschen, die auf eine rechtswidrige T&auml;tigkeit hinweisen.
     </p>
     <p>
         Verpflichtungen zur Entfernung oder Sperrung der Nutzung von Informationen nach den allgemeinen Gesetzen bleiben
         hiervon unber&uuml;hrt.
-        Eine diesbez&uuml;gliche Haftung ist jedoch erst ab dem Zeitpunkt der Kenntnis einer konkreten Rechtsverletzung
-        m&ouml;glich.
+        Eine diesbez&uuml;gliche Haftung ist jedoch erst ab dem Zeitpunkt der Kenntnis einer konkreten Rechtsverletzung m&ouml;glich.
         Bei Bekanntwerden von entsprechenden Rechtsverletzungen werden wir diese Inhalte umgehend entfernen.
     </p>
 
@@ -46,21 +44,16 @@
 
     <h3>Urheberrecht</h3>
     <p>
-        Die durch die Seitenbetreiber erstellten Inhalte und Werke auf diesen Seiten unterliegen dem deutschen
-        Urheberrecht.
+        Die durch die Seitenbetreiber erstellten Inhalte und Werke auf diesen Seiten unterliegen dem deutschen Urheberrecht.
         Die Vervielf&auml;ltigung, Bearbeitung, Verbreitung und jede Art der Verwertung au&szlig;erhalb der Grenzen des
         Urheberrechtes bed&uuml;rfen der schriftlichen Zustimmung des jeweiligen Autors bzw. Erstellers. Downloads und
         Kopien dieser Seite sind nur f&uuml;r den privaten, nicht kommerziellen Gebrauch gestattet.
     </p>
     <p>
-        Soweit die Inhalte auf dieser Seite nicht vom Betreiber erstellt wurden, werden die Urheberrechte Dritter
-        beachtet.
-        Insbesondere werden Inhalte Dritter als solche gekennzeichnet. Sollten Sie trotzdem auf eine
-        Urheberrechtsverletzung
-        aufmerksam werden, bitten wir um einen entsprechenden Hinweis. Bei Bekanntwerden von Rechtsverletzungen werden
-        wir
+        Soweit die Inhalte auf dieser Seite nicht vom Betreiber erstellt wurden, werden die Urheberrechte Dritter beachtet.
+        Insbesondere werden Inhalte Dritter als solche gekennzeichnet. Sollten Sie trotzdem auf eine Urheberrechtsverletzung
+        aufmerksam werden, bitten wir um einen entsprechenden Hinweis. Bei Bekanntwerden von Rechtsverletzungen werden wir
         derartige Inhalte umgehend entfernen.
     </p>
 </div>
-<app-bottom-bar></app-bottom-bar>
-<app-copyright></app-copyright>
+<app-footer></app-footer>

Frontend/src/app/pages/imprint/imprint.component.ts

@@ -1,16 +1,15 @@
-import {Component, OnInit} from '@angular/core';
+import { Component, OnInit } from '@angular/core';
 
 @Component({
-    selector: 'app-imprint',
-    templateUrl: './imprint.component.html',
-    styleUrls: ['./imprint.component.css']
+  selector: 'app-imprint',
+  templateUrl: './imprint.component.html',
+  styleUrls: ['./imprint.component.css']
 })
 export class ImprintComponent implements OnInit {
 
-    constructor() {
-    }
+  constructor() { }
 
-    ngOnInit(): void {
-    }
+  ngOnInit(): void {
+  }
 
 }

Frontend/src/app/pages/landingpage/landingpage.component.css

@@ -0,0 +1,50 @@
+#mainComponents {
+    margin: 5em;
+    margin-top: .5em;
+    margin-bottom: .5em;
+}
+
+#productListsContainer {
+    display: grid;
+    grid-template-areas:
+    'search search'
+    'popularSearches bestDeals';
+    grid-template-columns: 50% 50%;
+}
+
+#searchContainer {
+    position: relative;
+    grid-area: search;
+    height: 10em;
+}
+
+#searchContainer input {
+    position: relative;
+    font-size: 1.5em;
+    padding: .25em;
+    display: block;
+    border: 1px solid #ccc;
+    border-radius: 4px;
+    box-sizing: border-box;
+    margin: auto;
+    -ms-transform: translateY(50%);
+    transform: translateY(2.5em);
+}
+
+#popularSearchesList {
+    grid-area: popularSearches;
+    padding: .5em;
+}
+
+#popularSearchesList h2 {
+    text-align: center;
+}
+
+#bestDealsList {
+    grid-area: bestDeals;
+    padding: .5em;
+}
+
+#bestDealsList h2 {
+    text-align: center;
+}

Frontend/src/app/pages/landingpage/landingpage.component.ts

@@ -1,6 +1,5 @@
 import {Component, OnInit} from '@angular/core';
 import {Router} from '@angular/router';
-import {ApiService} from '../../services/api.service';
 
 @Component({
     selector: 'app-landingpage',
@@ -9,7 +8,6 @@ import {ApiService} from '../../services/api.service';
 })
 export class LandingpageComponent implements OnInit {
     searchInput: string;
-    isLoggedIn = false;
 
     constructor(
         private router: Router
@@ -17,7 +15,6 @@ export class LandingpageComponent implements OnInit {
     }
 
     ngOnInit(): void {
-
     }
 
     startedSearch(): void {
@@ -28,4 +25,5 @@ export class LandingpageComponent implements OnInit {
         this.router.navigateByUrl('/', {skipLocationChange: true}).then(() =>
             this.router.navigate([uri], queryParams));
     }
+
 }

Frontend/src/app/pages/page-not-found-page/page-not-found-page.component.ts

@@ -1,16 +1,15 @@
-import {Component, OnInit} from '@angular/core';
+import { Component, OnInit } from '@angular/core';
 
 @Component({
-    selector: 'app-page-not-found-page',
-    templateUrl: './page-not-found-page.component.html',
-    styleUrls: ['./page-not-found-page.component.css']
+  selector: 'app-page-not-found-page',
+  templateUrl: './page-not-found-page.component.html',
+  styleUrls: ['./page-not-found-page.component.css']
 })
 export class PageNotFoundPageComponent implements OnInit {
 
-    constructor() {
-    }
+  constructor() { }
 
-    ngOnInit(): void {
-    }
+  ngOnInit(): void {
+  }
 
 }

Frontend/src/app/pages/privacy/privacy.component.html

@@ -1,12 +1,11 @@
-<app-top-bar></app-top-bar>
-<div id="privacy" class="container masthead">
+<app-header [showSearch]="true"></app-header>
+<div id="privacy">
     <h1>Datenschutz&shy;erkl&auml;rung</h1>
     <h2>1. Datenschutz auf einen Blick</h2>
     <h3>Allgemeine Hinweise</h3>
     <p>
         Die folgenden Hinweise geben einen einfachen &Uuml;berblick dar&uuml;ber, was mit Ihren
-        personenbezogenen Daten passiert, wenn Sie diese Website besuchen. Personenbezogene Daten sind alle Daten, mit
-        denen
+        personenbezogenen Daten passiert, wenn Sie diese Website besuchen. Personenbezogene Daten sind alle Daten, mit denen
         Sie pers&ouml;nlich identifiziert werden k&ouml;nnen. Ausf&uuml;hrliche Informationen zum Thema Datenschutz
         entnehmen Sie unserer unter diesem Text aufgef&uuml;hrten Datenschutzerkl&auml;rung.
     </p>
@@ -41,10 +40,8 @@
         Sie haben jederzeit das Recht, unentgeltlich Auskunft &uuml;ber
         Herkunft, Empf&auml;nger und Zweck Ihrer gespeicherten personenbezogenen Daten zu erhalten. Sie haben au&szlig;erdem
         ein Recht, die Berichtigung oder L&ouml;schung dieser Daten zu verlangen. Wenn Sie eine Einwilligung zur
-        Datenverarbeitung erteilt haben, k&ouml;nnen Sie diese Einwilligung jederzeit f&uuml;r die Zukunft widerrufen.
-        Au&szlig;erdem
-        haben Sie das Recht, unter bestimmten Umst&auml;nden die Einschr&auml;nkung der Verarbeitung Ihrer
-        personenbezogenen
+        Datenverarbeitung erteilt haben, k&ouml;nnen Sie diese Einwilligung jederzeit f&uuml;r die Zukunft widerrufen. Au&szlig;erdem
+        haben Sie das Recht, unter bestimmten Umst&auml;nden die Einschr&auml;nkung der Verarbeitung Ihrer personenbezogenen
         Daten zu verlangen. Des Weiteren steht Ihnen ein Beschwerderecht bei der zust&auml;ndigen Aufsichtsbeh&ouml;rde
         zu.
     </p>
@@ -88,15 +85,13 @@
     <h3>Datenschutz</h3>
     <p>
         Die Betreiber dieser Seiten nehmen den Schutz Ihrer pers&ouml;nlichen Daten sehr ernst. Wir
-        behandeln Ihre personenbezogenen Daten vertraulich und entsprechend der gesetzlichen Datenschutzvorschriften
-        sowie
+        behandeln Ihre personenbezogenen Daten vertraulich und entsprechend der gesetzlichen Datenschutzvorschriften sowie
         dieser Datenschutzerkl&auml;rung.
     </p>
     <p>
         Wenn Sie diese Website benutzen, werden verschiedene personenbezogene Daten
         erhoben. Personenbezogene Daten sind Daten, mit denen Sie pers&ouml;nlich identifiziert werden k&ouml;nnen. Die
-        vorliegende Datenschutzerkl&auml;rung erl&auml;utert, welche Daten wir erheben und wof&uuml;r wir sie nutzen.
-        Sie
+        vorliegende Datenschutzerkl&auml;rung erl&auml;utert, welche Daten wir erheben und wof&uuml;r wir sie nutzen. Sie
         erl&auml;utert auch, wie und zu welchem Zweck das geschieht.
     </p>
     <p>
@@ -120,8 +115,7 @@
         E-Mail: betterzon-privacy@mueller-patrick.tech
     </p>
     <p>
-        Verantwortliche Stelle ist die nat&uuml;rliche oder juristische Person, die allein oder gemeinsam mit anderen
-        &uuml;ber
+        Verantwortliche Stelle ist die nat&uuml;rliche oder juristische Person, die allein oder gemeinsam mit anderen &uuml;ber
         die Zwecke und Mittel der Verarbeitung von personenbezogenen Daten (z.&nbsp;B. Namen, E-Mail-Adressen o. &Auml;.)
         entscheidet.
     </p>
@@ -130,8 +124,7 @@
     <p>
         Soweit innerhalb dieser Datenschutzerkl&auml;rung keine speziellere Speicherdauer genannt
         wurde, verbleiben Ihre personenbezogenen Daten bei uns, bis der Zweck f&uuml;r die Datenverarbeitung entf&auml;llt.
-        Wenn Sie ein berechtigtes L&ouml;schersuchen geltend machen oder eine Einwilligung zur Datenverarbeitung
-        widerrufen,
+        Wenn Sie ein berechtigtes L&ouml;schersuchen geltend machen oder eine Einwilligung zur Datenverarbeitung widerrufen,
         werden Ihre Daten gel&ouml;scht, sofern wir keine anderen rechtlich zul&auml;ssigen Gr&uuml;nde f&uuml;r die
         Speicherung Ihrer personenbezogenen Daten haben (z.B. steuer- oder handelsrechtliche Aufbewahrungsfristen); im
         letztgenannten Fall erfolgt die L&ouml;schung nach Fortfall dieser Gr&uuml;nde.
@@ -146,8 +139,7 @@
         Datenschutzniveau garantiert werden kann. Beispielsweise sind US-Unternehmen dazu verpflichtet, personenbezogene
         Daten an Sicherheitsbeh&ouml;rden herauszugeben, ohne dass Sie als Betroffener hiergegen gerichtlich vorgehen k&ouml;nnten.
         Es kann daher nicht ausgeschlossen werden, dass US-Beh&ouml;rden (z.B. Geheimdienste) Ihre auf US-Servern
-        befindlichen Daten zu &Uuml;berwachungszwecken verarbeiten, auswerten und dauerhaft speichern. Wir haben auf
-        diese
+        befindlichen Daten zu &Uuml;berwachungszwecken verarbeiten, auswerten und dauerhaft speichern. Wir haben auf diese
         Verarbeitungst&auml;tigkeiten keinen Einfluss.
     </p>
 
@@ -158,19 +150,15 @@
         erfolgten Datenverarbeitung bleibt vom Widerruf unber&uuml;hrt.
     </p>
 
-    <h3>Widerspruchsrecht gegen die Datenerhebung in besonderen F&auml;llen sowie gegen Direktwerbung (Art. 21
-        DSGVO)</h3>
+    <h3>Widerspruchsrecht gegen die Datenerhebung in besonderen F&auml;llen sowie gegen Direktwerbung (Art. 21 DSGVO)</h3>
     <p>
         WENN DIE DATENVERARBEITUNG AUF GRUNDLAGE VON ART. 6 ABS. 1 LIT. E ODER F DSGVO ERFOLGT, HABEN SIE JEDERZEIT DAS
         RECHT, AUS GR&Uuml;NDEN, DIE SICH AUS IHRER BESONDEREN SITUATION ERGEBEN, GEGEN DIE VERARBEITUNG IHRER
         PERSONENBEZOGENEN DATEN WIDERSPRUCH EINZULEGEN; DIES GILT AUCH F&Uuml;R EIN AUF DIESE BESTIMMUNGEN GEST&Uuml;TZTES
-        PROFILING. DIE JEWEILIGE RECHTSGRUNDLAGE, AUF DENEN EINE VERARBEITUNG BERUHT, ENTNEHMEN SIE DIESER
-        DATENSCHUTZERKL&Auml;RUNG.
-        WENN SIE WIDERSPRUCH EINLEGEN, WERDEN WIR IHRE BETROFFENEN PERSONENBEZOGENEN DATEN NICHT MEHR VERARBEITEN, ES
-        SEI
+        PROFILING. DIE JEWEILIGE RECHTSGRUNDLAGE, AUF DENEN EINE VERARBEITUNG BERUHT, ENTNEHMEN SIE DIESER DATENSCHUTZERKL&Auml;RUNG.
+        WENN SIE WIDERSPRUCH EINLEGEN, WERDEN WIR IHRE BETROFFENEN PERSONENBEZOGENEN DATEN NICHT MEHR VERARBEITEN, ES SEI
         DENN, WIR K&Ouml;NNEN ZWINGENDE SCHUTZW&Uuml;RDIGE GR&Uuml;NDE F&Uuml;R DIE VERARBEITUNG NACHWEISEN, DIE IHRE
-        INTERESSEN, RECHTE UND FREIHEITEN &Uuml;BERWIEGEN ODER DIE VERARBEITUNG DIENT DER GELTENDMACHUNG, AUS&Uuml;BUNG
-        ODER
+        INTERESSEN, RECHTE UND FREIHEITEN &Uuml;BERWIEGEN ODER DIE VERARBEITUNG DIENT DER GELTENDMACHUNG, AUS&Uuml;BUNG ODER
         VERTEIDIGUNG VON RECHTSANSPR&Uuml;CHEN (WIDERSPRUCH NACH ART. 21 ABS. 1 DSGVO).
     </p>
     <p>
@@ -178,8 +166,7 @@
         DATEN VERARBEITET, UM DIREKTWERBUNG ZU BETREIBEN, SO HABEN SIE DAS RECHT, JEDERZEIT WIDERSPRUCH GEGEN DIE
         VERARBEITUNG SIE BETREFFENDER PERSONENBEZOGENER DATEN ZUM ZWECKE DERARTIGER WERBUNG EINZULEGEN; DIES GILT AUCH F&Uuml;R
         DAS PROFILING, SOWEIT ES MIT SOLCHER DIREKTWERBUNG IN VERBINDUNG STEHT. WENN SIE WIDERSPRECHEN, WERDEN IHRE
-        PERSONENBEZOGENEN DATEN ANSCHLIESSEND NICHT MEHR ZUM ZWECKE DER DIREKTWERBUNG VERWENDET (WIDERSPRUCH NACH ART.
-        21
+        PERSONENBEZOGENEN DATEN ANSCHLIESSEND NICHT MEHR ZUM ZWECKE DER DIREKTWERBUNG VERWENDET (WIDERSPRUCH NACH ART. 21
         ABS. 2 DSGVO).
     </p>
 
@@ -187,8 +174,7 @@
     <p>
         Im Falle von Verst&ouml;&szlig;en
         gegen die DSGVO steht den Betroffenen ein Beschwerderecht bei einer Aufsichtsbeh&ouml;rde, insbesondere in dem
-        Mitgliedstaat ihres gew&ouml;hnlichen Aufenthalts, ihres Arbeitsplatzes oder des Orts des mutma&szlig;lichen
-        Versto&szlig;es
+        Mitgliedstaat ihres gew&ouml;hnlichen Aufenthalts, ihres Arbeitsplatzes oder des Orts des mutma&szlig;lichen Versto&szlig;es
         zu. Das Beschwerderecht besteht unbeschadet anderweitiger verwaltungsrechtlicher oder gerichtlicher
         Rechtsbehelfe.
     </p>
@@ -196,8 +182,7 @@
     <h3>Recht auf Daten&shy;&uuml;bertrag&shy;barkeit</h3>
     <p>
         Sie haben das Recht, Daten, die wir auf Grundlage Ihrer
-        Einwilligung oder in Erf&uuml;llung eines Vertrags automatisiert verarbeiten, an sich oder an einen Dritten in
-        einem
+        Einwilligung oder in Erf&uuml;llung eines Vertrags automatisiert verarbeiten, an sich oder an einen Dritten in einem
         g&auml;ngigen, maschinenlesbaren Format aush&auml;ndigen zu lassen. Sofern Sie die direkte &Uuml;bertragung der
         Daten an einen anderen Verantwortlichen verlangen, erfolgt dies nur, soweit es technisch machbar ist.
     </p>
@@ -205,10 +190,8 @@
     <h3>SSL- bzw. TLS-Verschl&uuml;sselung</h3>
     <p>
         Diese Seite nutzt aus Sicherheitsgr&uuml;nden und zum Schutz der &Uuml;bertragung
-        vertraulicher Inhalte, wie zum Beispiel Bestellungen oder Anfragen, die Sie an uns als Seitenbetreiber senden,
-        eine
-        SSL- bzw. TLS-Verschl&uuml;sselung. Eine verschl&uuml;sselte Verbindung erkennen Sie daran, dass die Adresszeile
-        des
+        vertraulicher Inhalte, wie zum Beispiel Bestellungen oder Anfragen, die Sie an uns als Seitenbetreiber senden, eine
+        SSL- bzw. TLS-Verschl&uuml;sselung. Eine verschl&uuml;sselte Verbindung erkennen Sie daran, dass die Adresszeile des
         Browsers von &bdquo;http://&ldquo; auf &bdquo;https://&ldquo; wechselt und an dem Schloss-Symbol in Ihrer
         Browserzeile.
     </p>
@@ -220,10 +203,8 @@
     <h3>Auskunft, L&ouml;schung und Berichtigung</h3>
     <p>
         Sie haben im Rahmen der geltenden gesetzlichen Bestimmungen
-        jederzeit das Recht auf unentgeltliche Auskunft &uuml;ber Ihre gespeicherten personenbezogenen Daten, deren
-        Herkunft
-        und Empf&auml;nger und den Zweck der Datenverarbeitung und ggf. ein Recht auf Berichtigung oder L&ouml;schung
-        dieser
+        jederzeit das Recht auf unentgeltliche Auskunft &uuml;ber Ihre gespeicherten personenbezogenen Daten, deren Herkunft
+        und Empf&auml;nger und den Zweck der Datenverarbeitung und ggf. ein Recht auf Berichtigung oder L&ouml;schung dieser
         Daten. Hierzu sowie zu weiteren Fragen zum Thema personenbezogene Daten k&ouml;nnen Sie sich jederzeit an uns
         wenden.
     </p>
@@ -235,29 +216,22 @@
     </p>
     <ul>
         <li>
-            Wenn Sie die Richtigkeit Ihrer bei uns gespeicherten personenbezogenen Daten bestreiten, ben&ouml;tigen wir
-            in
-            der Regel Zeit, um dies zu &uuml;berpr&uuml;fen. F&uuml;r die Dauer der Pr&uuml;fung haben Sie das Recht,
-            die
+            Wenn Sie die Richtigkeit Ihrer bei uns gespeicherten personenbezogenen Daten bestreiten, ben&ouml;tigen wir in
+            der Regel Zeit, um dies zu &uuml;berpr&uuml;fen. F&uuml;r die Dauer der Pr&uuml;fung haben Sie das Recht, die
             Einschr&auml;nkung der Verarbeitung Ihrer personenbezogenen Daten zu verlangen.
         </li>
         <li>
-            Wenn die Verarbeitung Ihrer personenbezogenen Daten unrechtm&auml;&szlig;ig geschah/geschieht, k&ouml;nnen
-            Sie
+            Wenn die Verarbeitung Ihrer personenbezogenen Daten unrechtm&auml;&szlig;ig geschah/geschieht, k&ouml;nnen Sie
             statt der L&ouml;schung die Einschr&auml;nkung der Datenverarbeitung verlangen.
         </li>
         <li>
-            Wenn wir Ihre personenbezogenen Daten nicht mehr ben&ouml;tigen, Sie sie jedoch zur Aus&uuml;bung,
-            Verteidigung
-            oder Geltendmachung von Rechtsanspr&uuml;chen ben&ouml;tigen, haben Sie das Recht, statt der L&ouml;schung
-            die
+            Wenn wir Ihre personenbezogenen Daten nicht mehr ben&ouml;tigen, Sie sie jedoch zur Aus&uuml;bung, Verteidigung
+            oder Geltendmachung von Rechtsanspr&uuml;chen ben&ouml;tigen, haben Sie das Recht, statt der L&ouml;schung die
             Einschr&auml;nkung der Verarbeitung Ihrer personenbezogenen Daten zu verlangen.
         </li>
         <li>
-            Wenn Sie einen Widerspruch nach Art. 21 Abs. 1 DSGVO eingelegt haben, muss eine Abw&auml;gung zwischen Ihren
-            und
-            unseren Interessen vorgenommen werden. Solange noch nicht feststeht, wessen Interessen &uuml;berwiegen,
-            haben
+            Wenn Sie einen Widerspruch nach Art. 21 Abs. 1 DSGVO eingelegt haben, muss eine Abw&auml;gung zwischen Ihren und
+            unseren Interessen vorgenommen werden. Solange noch nicht feststeht, wessen Interessen &uuml;berwiegen, haben
             Sie das Recht, die Einschr&auml;nkung der Verarbeitung Ihrer personenbezogenen Daten zu verlangen.
         </li>
     </ul>
@@ -265,8 +239,7 @@
         Wenn Sie die Verarbeitung Ihrer personenbezogenen Daten eingeschr&auml;nkt haben, d&uuml;rfen diese Daten
         &ndash; von ihrer Speicherung abgesehen &ndash; nur mit Ihrer Einwilligung oder zur Geltendmachung, Aus&uuml;bung
         oder Verteidigung von Rechtsanspr&uuml;chen oder zum Schutz der Rechte einer anderen nat&uuml;rlichen oder
-        juristischen Person oder aus Gr&uuml;nden eines wichtigen &ouml;ffentlichen Interesses der Europ&auml;ischen
-        Union
+        juristischen Person oder aus Gr&uuml;nden eines wichtigen &ouml;ffentlichen Interesses der Europ&auml;ischen Union
         oder eines Mitgliedstaats verarbeitet werden.
     </p>
 
@@ -277,14 +250,12 @@
         und richten auf Ihrem Endger&auml;t keinen Schaden an. Sie werden entweder vor&uuml;bergehend f&uuml;r die Dauer
         einer Sitzung (Session-Cookies) oder dauerhaft (permanente Cookies) auf Ihrem Endger&auml;t gespeichert.
         Session-Cookies werden nach Ende Ihres Besuchs automatisch gel&ouml;scht. Permanente Cookies bleiben auf Ihrem
-        Endger&auml;t gespeichert, bis Sie diese selbst l&ouml;schen&nbsp;oder eine automatische L&ouml;schung durch
-        Ihren
+        Endger&auml;t gespeichert, bis Sie diese selbst l&ouml;schen&nbsp;oder eine automatische L&ouml;schung durch Ihren
         Webbrowser erfolgt.
     </p>
     <p>
         Teilweise k&ouml;nnen auch Cookies von Drittunternehmen auf Ihrem Endger&auml;t
-        gespeichert werden, wenn Sie unsere Seite betreten (Third-Party-Cookies). Diese erm&ouml;glichen uns oder Ihnen
-        die
+        gespeichert werden, wenn Sie unsere Seite betreten (Third-Party-Cookies). Diese erm&ouml;glichen uns oder Ihnen die
         Nutzung bestimmter Dienstleistungen des Drittunternehmens (z.B. Cookies zur Abwicklung von
         Zahlungsdienstleistungen).
     </p>
@@ -296,31 +267,24 @@
     </p>
     <p>
         Cookies, die zur Durchf&uuml;hrung des elektronischen Kommunikationsvorgangs (notwendige Cookies)
-        oder zur Bereitstellung bestimmter, von Ihnen erw&uuml;nschter Funktionen (funktionale Cookies, z. B. f&uuml;r
-        die
-        Warenkorbfunktion) oder zur Optimierung der Website (z.B. Cookies zur Messung des Webpublikums) erforderlich
-        sind,
-        werden auf Grundlage von Art. 6 Abs. 1 lit. f DSGVO gespeichert, sofern keine andere Rechtsgrundlage angegeben
-        wird.
-        Der Websitebetreiber hat ein berechtigtes Interesse an der Speicherung von Cookies zur technisch fehlerfreien
-        und
+        oder zur Bereitstellung bestimmter, von Ihnen erw&uuml;nschter Funktionen (funktionale Cookies, z. B. f&uuml;r die
+        Warenkorbfunktion) oder zur Optimierung der Website (z.B. Cookies zur Messung des Webpublikums) erforderlich sind,
+        werden auf Grundlage von Art. 6 Abs. 1 lit. f DSGVO gespeichert, sofern keine andere Rechtsgrundlage angegeben wird.
+        Der Websitebetreiber hat ein berechtigtes Interesse an der Speicherung von Cookies zur technisch fehlerfreien und
         optimierten Bereitstellung seiner Dienste. Sofern eine Einwilligung zur Speicherung von Cookies abgefragt wurde,
-        erfolgt die Speicherung der betreffenden Cookies ausschlie&szlig;lich auf Grundlage dieser Einwilligung (Art. 6
-        Abs.
+        erfolgt die Speicherung der betreffenden Cookies ausschlie&szlig;lich auf Grundlage dieser Einwilligung (Art. 6 Abs.
         1 lit. a DSGVO); die Einwilligung ist jederzeit widerrufbar.
     </p>
     <p>
         Sie k&ouml;nnen Ihren Browser so einstellen,
-        dass Sie &uuml;ber das Setzen von Cookies informiert werden und Cookies nur im Einzelfall erlauben, die Annahme
-        von
+        dass Sie &uuml;ber das Setzen von Cookies informiert werden und Cookies nur im Einzelfall erlauben, die Annahme von
         Cookies f&uuml;r bestimmte F&auml;lle oder generell ausschlie&szlig;en sowie das automatische L&ouml;schen der
         Cookies beim Schlie&szlig;en des Browsers aktivieren. Bei der Deaktivierung von Cookies kann die Funktionalit&auml;t
         dieser Website eingeschr&auml;nkt sein.
     </p>
     <p>
         Soweit Cookies von Drittunternehmen oder zu Analysezwecken eingesetzt
-        werden, werden wir Sie hier&uuml;ber im Rahmen dieser Datenschutzerkl&auml;rung gesondert informieren und ggf.
-        eine
+        werden, werden wir Sie hier&uuml;ber im Rahmen dieser Datenschutzerkl&auml;rung gesondert informieren und ggf. eine
         Einwilligung abfragen.
     </p>
 
@@ -354,13 +318,10 @@
         den Fall von Anschlussfragen bei uns gespeichert. Diese Daten geben wir nicht ohne Ihre Einwilligung weiter.
     </p>
     <p>
-        Die Verarbeitung dieser Daten erfolgt auf Grundlage von Art. 6 Abs. 1 lit. b DSGVO, sofern Ihre Anfrage mit der
-        Erf&uuml;llung
-        eines Vertrags zusammenh&auml;ngt oder zur Durchf&uuml;hrung vorvertraglicher Ma&szlig;nahmen erforderlich ist.
-        In
+        Die Verarbeitung dieser Daten erfolgt auf Grundlage von Art. 6 Abs. 1 lit. b DSGVO, sofern Ihre Anfrage mit der Erf&uuml;llung
+        eines Vertrags zusammenh&auml;ngt oder zur Durchf&uuml;hrung vorvertraglicher Ma&szlig;nahmen erforderlich ist. In
         allen &uuml;brigen F&auml;llen beruht die Verarbeitung auf unserem berechtigten Interesse an der effektiven
-        Bearbeitung der an uns gerichteten Anfragen (Art. 6 Abs. 1 lit. f DSGVO) oder auf Ihrer Einwilligung (Art. 6
-        Abs. 1
+        Bearbeitung der an uns gerichteten Anfragen (Art. 6 Abs. 1 lit. f DSGVO) oder auf Ihrer Einwilligung (Art. 6 Abs. 1
         lit. a DSGVO) sofern diese abgefragt wurde.
     </p>
     <p>
@@ -374,25 +335,21 @@
     <p>
         Wenn Sie uns per E-Mail, Telefon oder Telefax kontaktieren, wird
         Ihre Anfrage inklusive aller daraus hervorgehenden personenbezogenen Daten (Name, Anfrage) zum Zwecke der
-        Bearbeitung Ihres Anliegens bei uns gespeichert und verarbeitet. Diese Daten geben wir nicht ohne Ihre
-        Einwilligung
+        Bearbeitung Ihres Anliegens bei uns gespeichert und verarbeitet. Diese Daten geben wir nicht ohne Ihre Einwilligung
         weiter.
     </p>
     <p>
         Die Verarbeitung dieser Daten erfolgt auf Grundlage von Art. 6 Abs. 1 lit. b DSGVO, sofern Ihre
         Anfrage mit der Erf&uuml;llung eines Vertrags zusammenh&auml;ngt oder zur Durchf&uuml;hrung vorvertraglicher Ma&szlig;nahmen
-        erforderlich ist. In allen &uuml;brigen F&auml;llen beruht die Verarbeitung auf unserem berechtigten Interesse
-        an
-        der effektiven Bearbeitung der an uns gerichteten Anfragen (Art. 6 Abs. 1 lit. f DSGVO) oder auf Ihrer
-        Einwilligung
+        erforderlich ist. In allen &uuml;brigen F&auml;llen beruht die Verarbeitung auf unserem berechtigten Interesse an
+        der effektiven Bearbeitung der an uns gerichteten Anfragen (Art. 6 Abs. 1 lit. f DSGVO) oder auf Ihrer Einwilligung
         (Art. 6 Abs. 1 lit. a DSGVO) sofern diese abgefragt wurde.
     </p>
     <p>
         Die von Ihnen an uns per Kontaktanfragen &uuml;bersandten
         Daten verbleiben bei uns, bis Sie uns zur L&ouml;schung auffordern, Ihre Einwilligung zur Speicherung widerrufen
         oder der Zweck f&uuml;r die Datenspeicherung entf&auml;llt (z.&nbsp;B. nach abgeschlossener Bearbeitung Ihres
-        Anliegens). Zwingende gesetzliche Bestimmungen &ndash; insbesondere gesetzliche Aufbewahrungsfristen &ndash;
-        bleiben
+        Anliegens). Zwingende gesetzliche Bestimmungen &ndash; insbesondere gesetzliche Aufbewahrungsfristen &ndash; bleiben
         unber&uuml;hrt.
     </p>
 
@@ -406,13 +363,10 @@
     <p>
         Zu diesem Zweck muss der von Ihnen
         verwendete Browser Verbindung zu den Servern von Google aufnehmen. Hierdurch erlangt Google Kenntnis dar&uuml;ber,
-        dass &uuml;ber Ihre IP-Adresse diese Website aufgerufen wurde. Die Nutzung von Google WebFonts erfolgt auf
-        Grundlage
-        von Art. 6 Abs. 1 lit. f DSGVO. Der Websitebetreiber hat ein berechtigtes Interesse an der einheitlichen
-        Darstellung
+        dass &uuml;ber Ihre IP-Adresse diese Website aufgerufen wurde. Die Nutzung von Google WebFonts erfolgt auf Grundlage
+        von Art. 6 Abs. 1 lit. f DSGVO. Der Websitebetreiber hat ein berechtigtes Interesse an der einheitlichen Darstellung
         des Schriftbildes auf seiner Website. Sofern eine entsprechende Einwilligung abgefragt wurde (z. B. eine
-        Einwilligung zur Speicherung von Cookies), erfolgt die Verarbeitung ausschlie&szlig;lich auf Grundlage von Art.
-        6
+        Einwilligung zur Speicherung von Cookies), erfolgt die Verarbeitung ausschlie&szlig;lich auf Grundlage von Art. 6
         Abs. 1 lit. a DSGVO; die Einwilligung ist jederzeit widerrufbar.
     </p>
     <p>
@@ -422,8 +376,7 @@
     <p>
         Weitere Informationen zu Google Web Fonts finden Sie
         unter <a href="https://developers.google.com/fonts/faq" target="_blank" rel="noopener noreferrer">https://developers.google.com/fonts/faq</a>
-        und in der Datenschutzerkl&auml;rung von Google: <a href="https://policies.google.com/privacy?hl=de"
-                                                            target="_blank"
+        und in der Datenschutzerkl&auml;rung von Google: <a href="https://policies.google.com/privacy?hl=de" target="_blank"
                                                             rel="noopener noreferrer">https://policies.google.com/privacy?hl=de</a>.
     </p>
 
@@ -435,12 +388,10 @@
     <p>
         Beim Aufruf
         einer Seite l&auml;dt Ihr Browser die ben&ouml;tigten Fonts in ihren Browsercache, um Texte, Schriftarten und
-        Symbole korrekt anzuzeigen. Zu diesem Zweck muss der von Ihnen verwendete Browser Verbindung zu den Servern von
-        Font
+        Symbole korrekt anzuzeigen. Zu diesem Zweck muss der von Ihnen verwendete Browser Verbindung zu den Servern von Font
         Awesome aufnehmen. Hierdurch erlangt Font Awesome Kenntnis dar&uuml;ber, dass &uuml;ber Ihre IP-Adresse diese
         Website aufgerufen wurde. Die Nutzung von Font Awesome erfolgt auf Grundlage von Art. 6 Abs. 1 lit. f DSGVO. Wir
-        haben ein berechtigtes Interesse an der einheitlichen Darstellung des Schriftbildes auf unserer Website. Sofern
-        eine
+        haben ein berechtigtes Interesse an der einheitlichen Darstellung des Schriftbildes auf unserer Website. Sofern eine
         entsprechende Einwilligung abgefragt wurde (z. B. eine Einwilligung zur Speicherung von Cookies), erfolgt die
         Verarbeitung ausschlie&szlig;lich auf Grundlage von Art. 6 Abs. 1 lit. a DSGVO; die Einwilligung ist jederzeit
         widerrufbar.
@@ -454,5 +405,4 @@
         von Font Awesome unter: <a href="https://fontawesome.com/privacy" target="_blank" rel="noopener noreferrer">https://fontawesome.com/privacy</a>.
     </p>
 </div>
-<app-bottom-bar></app-bottom-bar>
-<app-copyright></app-copyright>
+<app-footer></app-footer>

Frontend/src/app/pages/privacy/privacy.component.ts

@@ -1,16 +1,15 @@
-import {Component, OnInit} from '@angular/core';
+import { Component, OnInit } from '@angular/core';
 
 @Component({
-    selector: 'app-privacy',
-    templateUrl: './privacy.component.html',
-    styleUrls: ['./privacy.component.css']
+  selector: 'app-privacy',
+  templateUrl: './privacy.component.html',
+  styleUrls: ['./privacy.component.css']
 })
 export class PrivacyComponent implements OnInit {
 
-    constructor() {
-    }
+  constructor() { }
 
-    ngOnInit(): void {
-    }
+  ngOnInit(): void {
+  }
 
 }

Frontend/src/app/pages/product-detail-page/product-detail-page.component.html

@@ -1,7 +1,7 @@
 <app-top-bar></app-top-bar>
+
 <div id="mainComponents">
     <app-product-details [productId]="productId"></app-product-details>
     <app-newest-prices-list [productId]="productId"></app-newest-prices-list>
 </div>
-<app-bottom-bar></app-bottom-bar>
 

Frontend/src/app/pages/product-search-page/product-search-page.component.css

@@ -1,43 +1,5 @@
-body {
-    background: #eee
+#mainComponents {
+    margin: 5em;
+    margin-top: .5em;
+    margin-bottom: .5em;
 }
-
-.ratings i {
-    font-size: 16px;
-    color: red
-}
-
-.strike-text {
-    color: red;
-    text-decoration: line-through
-}
-
-.product-image {
-    width: 20%;
-    height: 20%;
-}
-
-.dot {
-    height: 7px;
-    width: 7px;
-    margin-left: 6px;
-    margin-right: 6px;
-    margin-top: 3px;
-    background-color: blue;
-    border-radius: 50%;
-    display: inline-block
-}
-
-.spec-1 {
-    color: #938787;
-    font-size: 15px
-}
-
-h5 {
-    font-weight: 400
-}
-
-.para {
-    font-size: 16px
-}
-

Frontend/src/app/pages/product-search-page/product-search-page.component.html

@@ -1,14 +1,6 @@
-<app-top-bar></app-top-bar>
-<header class="masthead bg-transparent text-white text-center" id="w1">
-
-</header>
-
 <div id="mainComponents">
     <app-product-list numberOfProducts="20" [showProductPicture]="true" searchQuery="{{searchTerm}}"
                       type="search"></app-product-list>
 </div>
 
-<header class="masthead bg-transparent text-white text-center">
-
-</header>
-<app-bottom-bar></app-bottom-bar>
+<app-footer></app-footer>

Frontend/src/app/pages/profile-page/profile-page.component.css

@@ -1,4 +0,0 @@
-.header-in-page {
-    padding-top: calc(2rem + 20px);
-    padding-bottom: 6rem;
-}

Frontend/src/app/pages/profile-page/profile-page.component.html

@@ -1,10 +0,0 @@
-<app-top-bar></app-top-bar>
-<header class="header-in-page">
-
-</header>
-<app-profile></app-profile>
-<header class="header-in-page">
-
-</header>
-<app-bottom-bar></app-bottom-bar>
-<app-copyright></app-copyright>

Frontend/src/app/pages/profile-page/profile-page.component.spec.ts

@@ -1,25 +0,0 @@
-import {ComponentFixture, TestBed} from '@angular/core/testing';
-
-import {ProfilePageComponent} from './profile-page.component';
-
-describe('ProfilePageComponent', () => {
-    let component: ProfilePageComponent;
-    let fixture: ComponentFixture<ProfilePageComponent>;
-
-    beforeEach(async () => {
-        await TestBed.configureTestingModule({
-            declarations: [ProfilePageComponent]
-        })
-            .compileComponents();
-    });
-
-    beforeEach(() => {
-        fixture = TestBed.createComponent(ProfilePageComponent);
-        component = fixture.componentInstance;
-        fixture.detectChanges();
-    });
-
-    it('should create', () => {
-        expect(component).toBeTruthy();
-    });
-});

Frontend/src/app/pages/profile-page/profile-page.component.ts

@@ -1,16 +0,0 @@
-import {Component, OnInit} from '@angular/core';
-
-@Component({
-    selector: 'app-profile-page',
-    templateUrl: './profile-page.component.html',
-    styleUrls: ['./profile-page.component.css']
-})
-export class ProfilePageComponent implements OnInit {
-
-    constructor() {
-    }
-
-    ngOnInit(): void {
-    }
-
-}

Frontend/src/app/pages/profile/profile.component.css

@@ -1,26 +0,0 @@
-.inf-content {
-    border: 1px solid #DDDDDD;
-    -webkit-border-radius: 10px;
-    -moz-border-radius: 10px;
-    border-radius: 10px;
-    box-shadow: 7px 7px 7px rgba(0, 0, 0, 0.3);
-}
-
-.header-in-page {
-    padding-top: calc(1rem + 20px);
-    padding-bottom: 1rem;
-}
-
-table, th, td {
-    border: 1px solid black;
-}
-
-.delete:hover {
-    cursor: pointer;
-    color: #0d5a4b;
-}
-
-.edit {
-    width: 5%;
-    height: 5%;
-}

Frontend/src/app/pages/profile/profile.component.html

@@ -1,139 +0,0 @@
-<div class="container bootstrap snippets bootdey">
-    <div class="panel-body inf-content">
-        <div class="row">
-            <div class="col-md-4">
-                <img alt="" style="width:600px;" title="" class="img-circle img-thumbnail isTooltip"
-                     src="https://bootdey.com/img/Content/avatar/avatar7.png" data-original-title="Usuario">
-                <ul title="Ratings" class="list-inline ratings text-center">
-                    <li><a href="#"><span class="glyphicon glyphicon-star"></span></a></li>
-                    <li><a href="#"><span class="glyphicon glyphicon-star"></span></a></li>
-                    <li><a href="#"><span class="glyphicon glyphicon-star"></span></a></li>
-                    <li><a href="#"><span class="glyphicon glyphicon-star"></span></a></li>
-                    <li><a href="#"><span class="glyphicon glyphicon-star"></span></a></li>
-                </ul>
-            </div>
-            <div class="col-md-6">
-                <strong>Information</strong><br>
-                <div class="table-responsive">
-                    <table class="table table-user-information">
-                        <tbody>
-                        <tr>
-                            <td>
-                                <strong>
-                                    <span class="glyphicon glyphicon-bookmark text-primary"></span>
-                                    Username
-                                </strong>
-                            </td>
-                            <td class="text-primary">
-                                {{currentUser.username}}
-                            </td>
-                        </tr>
-
-
-                        <tr>
-                            <td>
-                                <strong>
-                                    <span class="glyphicon glyphicon-eye-open text-primary"></span>
-                                    Role
-                                </strong>
-                            </td>
-                            <td class="text-primary">
-                                User
-                            </td>
-                        </tr>
-                        <tr>
-                            <td>
-                                <strong>
-                                    <span class="glyphicon glyphicon-envelope text-primary"></span>
-                                    Email
-                                </strong>
-                            </td>
-                            <td class="text-primary">
-                                {{currentUser.email}}
-                            </td>
-                        </tr>
-                        <tr>
-                            <td>
-                                <strong>
-                                    <span class="glyphicon glyphicon-calendar text-primary"></span>
-                                    created
-                                </strong>
-                            </td>
-                            <td class="text-primary">
-                                {{currentUser.registration_date}}
-                            </td>
-                        </tr>
-                        </tbody>
-                    </table>
-                </div>
-            </div>
-        </div>
-    </div>
-</div>
-<header class="header-in-page">
-
-</header>
-<div class="container bootstrap snippets bootdey">
-    <div class="col-auto">
-        <table class="table table-hover">
-            <tr>
-                <th>Product</th>
-                <th>Price</th>
-                <th>Change</th>
-                <th>Delete</th>
-            </tr>
-            <tr *ngFor="let alarm of alarms">
-                <td>
-                    {{productsMap[alarm.product_id]?.name}}
-                </td>
-                <td>
-                    {{alarm.defined_price / 100}}€
-                </td>
-                <td>
-                    <img class="delete" src="../assets/images/pencil.png">
-                </td>
-                <td>
-                    <img class="delete" src="../assets/images/Delete_icon-icons.com_55931.png"
-                         (click)="delete(alarm.alarm_id)">
-                </td>
-            </tr>
-        </table>
-    </div>
-</div>
-<!--
-<div class="container" *ngIf="currentUser; else loggedOut">
-    <p>
-        <strong>e-mail</strong>
-        {{ currentUser.email}}
-    </p>
-    <p>
-        <strong>username:</strong>
-        {{ currentUser.username}}
-    </p>
-    <p>
-        <strong>alarms</strong>
-        {{alarms}}
-    </p>
-    <table>
-        <tr>
-            <th>Produkt</th>
-            <th>Preis</th>
-        </tr>
-        <tr *ngFor="let alarm of alarms">
-            <td>
-                {{productsMap[alarm.product_id]?.name}}
-            </td>
-            <td>
-                {{alarm.defined_price/100}}
-            </td>
-        </tr>
-    </table>
-    <p>
-        <strong><a routerLink="/">zurück</a></strong>
-    </p>
-</div>
-
-<ng-template #loggedOut>
-    Please login.
-</ng-template>
--->

Frontend/src/app/pages/profile/profile.component.spec.ts

@@ -1,47 +0,0 @@
-import {ComponentFixture, TestBed} from '@angular/core/testing';
-
-import {ProfileComponent} from './profile.component';
-import {AbstractMockObservableService} from '../../mocks/mock.service';
-import {ApiService} from '../../services/api.service';
-
-class MockApiService extends AbstractMockObservableService {
-    getUserInfo(): any {
-        this.content = [];
-        return this;
-    }
-
-    getPriceAlarms(): any {
-        this.content = [];
-        return this;
-    }
-
-    getProductsByIds(): any {
-        this.content = [];
-        return this;
-    }
-}
-
-describe('ProfileComponent', () => {
-    let component: ProfileComponent;
-    let fixture: ComponentFixture<ProfileComponent>;
-    let mockService;
-
-    beforeEach(async () => {
-        mockService = new MockApiService();
-        await TestBed.configureTestingModule({
-            declarations: [ProfileComponent],
-            providers: [{provide: ApiService, useValue: mockService}]
-        })
-            .compileComponents();
-    });
-
-    beforeEach(() => {
-        fixture = TestBed.createComponent(ProfileComponent);
-        component = fixture.componentInstance;
-        fixture.detectChanges();
-    });
-
-    it('should create', () => {
-        expect(component).toBeTruthy();
-    });
-});

Frontend/src/app/pages/profile/profile.component.ts

@@ -1,63 +0,0 @@
-import {Component, OnInit} from '@angular/core';
-import {ApiService} from '../../services/api.service';
-
-@Component({
-    selector: 'app-profile',
-    templateUrl: './profile.component.html',
-    styleUrls: ['./profile.component.css']
-})
-export class ProfileComponent implements OnInit {
-
-    currentUser: any;
-    obj: any;
-    alarms: any [];
-    productsMap: any = {};
-
-    constructor(private api: ApiService) {
-    }
-
-    ngOnInit(): void {
-
-        this.api.getUserInfo().subscribe(
-            user => {
-                this.currentUser = user;
-                console.log(this.currentUser);
-            },
-        );
-
-        this.getPriceAlarms();
-    }
-
-    getPriceAlarms(): void {
-        this.api.getPriceAlarms().subscribe(
-            alarms => {
-                this.alarms = alarms;
-                this.getProductsByIds();
-            }
-        );
-    }
-
-    getProductsByIds(): void {
-        const productIds: number [] = [];
-        this.alarms.forEach(
-            alarm => {
-                productIds.push(alarm.product_id);
-            }
-        );
-        this.api.getProductsByIds(productIds).subscribe(
-            products => {
-                products.forEach(
-                    product => {
-                        this.productsMap[product.product_id] = product;
-                    }
-                );
-            }
-        );
-    }
-
-    delete(id: number): void {
-        this.api.deletePriceAlarm(id).subscribe(
-            res => window.location.reload()
-        );
-    }
-}

Frontend/src/app/services/api.service.spec.ts

@@ -1,7 +1,7 @@
 import {TestBed} from '@angular/core/testing';
 
 import {ApiService} from './api.service';
-import {HttpClientModule} from '@angular/common/http';
+import {HttpClientModule} from "@angular/common/http";
 
 describe('ApiService', () => {
     let service: ApiService;

Frontend/src/app/services/api.service.ts

@@ -11,7 +11,6 @@ import {ContactPerson} from '../models/contactperson';
 import {Category} from '../models/category';
 import {Manufacturer} from '../models/manufacturer';
 import {CrawlingStatus} from '../models/crawlingstatus';
-import {log} from 'util';
 
 @Injectable({
     providedIn: 'root'
@@ -106,7 +105,7 @@ export class ApiService {
         let asin = '';
 
         // Check if the parameter is a link or an asin
-        const linkRegex: RegExp = /^http[s]?:\/\/.*\/dp\/(.[^\/]*)\/?.*$/;
+        const linkRegex: RegExp = /^http[s]{0,1}:\/\/.*\/dp\/(.[^\/]*)\/{0,1}.*$/;
         const matches = linkRegex.exec(asinOrLink);
         if (matches) {
             // param is a link, extract asin
@@ -243,11 +242,7 @@ export class ApiService {
      */
     addNewPrice(vendorId: number, productId: number, price: number): Observable<any> {
         try {
-            const sessionInfo = this.getSessionInfoFromLocalStorage();
-
             return this.http.post((this.apiUrl + '/prices'), JSON.stringify({
-                session_id: sessionInfo.session_id,
-                session_key: sessionInfo.session_key,
                 vendor_id: vendorId,
                 product_id: productId,
                 price_in_cents: price
@@ -282,13 +277,7 @@ export class ApiService {
      */
     getManagedVendors(): Observable<Vendor[]> {
         try {
-            const sessionInfo = this.getSessionInfoFromLocalStorage();
-
-            let params = new HttpParams();
-            params = params.append('session_id', sessionInfo.session_id);
-            params = params.append('session_key', sessionInfo.session_key);
-
-            return this.http.get<Vendor[]>((this.apiUrl + '/vendors/managed'), {params});
+            return this.http.get<Vendor[]>((this.apiUrl + '/vendors/managed'));
         } catch (exception) {
             process.stderr.write(`ERROR received from ${this.apiUrl}: ${exception}\n`);
         }
@@ -328,14 +317,10 @@ export class ApiService {
      */
     deactivateSingleVendorListing(vendorId: number, productId: number): Observable<any> {
         try {
-            const sessionInfo = this.getSessionInfoFromLocalStorage();
-
-            return this.http.put((this.apiUrl + '/vendors/manage/deactivatelisting'), {
-                session_id: sessionInfo.session_id,
-                session_key: sessionInfo.session_key,
+            return this.http.put((this.apiUrl + '/vendors/manage/deactivatelisting'), JSON.stringify({
                 vendor_id: vendorId,
                 product_id: productId
-            });
+            }));
         } catch (exception) {
             process.stderr.write(`ERROR received from ${this.apiUrl}: ${exception}\n`);
         }
@@ -348,12 +333,7 @@ export class ApiService {
      */
     deactivateVendor(vendorId: number): Observable<any> {
         try {
-            const sessionInfo = this.getSessionInfoFromLocalStorage();
-
-            return this.http.put((this.apiUrl + '/vendors/manage/shop/deactivate/' + vendorId), {
-                session_id: sessionInfo.session_id,
-                session_key: sessionInfo.session_key,
-            });
+            return this.http.put((this.apiUrl + '/vendors/manage/shop/deactivate/' + vendorId), JSON.stringify({}));
         } catch (exception) {
             process.stderr.write(`ERROR received from ${this.apiUrl}: ${exception}\n`);
         }
@@ -366,12 +346,7 @@ export class ApiService {
      */
     activateVendor(vendorId: number): Observable<any> {
         try {
-            const sessionInfo = this.getSessionInfoFromLocalStorage();
-
-            return this.http.put((this.apiUrl + '/vendors/manage/shop/activate/' + vendorId), {
-                session_id: sessionInfo.session_id,
-                session_key: sessionInfo.session_key,
-            });
+            return this.http.put((this.apiUrl + '/vendors/manage/shop/activate/' + vendorId), JSON.stringify({}));
         } catch (exception) {
             process.stderr.write(`ERROR received from ${this.apiUrl}: ${exception}\n`);
         }
@@ -391,13 +366,7 @@ export class ApiService {
      */
     getPriceAlarms(): Observable<PriceAlarm[]> {
         try {
-            const sessionInfo = this.getSessionInfoFromLocalStorage();
-
-            let params = new HttpParams();
-            params = params.append('session_id', sessionInfo.session_id);
-            params = params.append('session_key', sessionInfo.session_key);
-
-            return this.http.get<PriceAlarm[]>((this.apiUrl + '/pricealarms'), {params});
+            return this.http.get<PriceAlarm[]>((this.apiUrl + '/pricealarms'));
         } catch (exception) {
             process.stderr.write(`ERROR received from ${this.apiUrl}: ${exception}\n`);
         }
@@ -411,14 +380,10 @@ export class ApiService {
      */
     createPriceAlarms(productId: number, definedPrice: number): Observable<any> {
         try {
-            const sessionInfo = this.getSessionInfoFromLocalStorage();
-
-            return this.http.post((this.apiUrl + '/pricealarms'), {
-                session_id: sessionInfo.session_id,
-                session_key: sessionInfo.session_key,
+            return this.http.post((this.apiUrl + '/pricealarms'), JSON.stringify({
                 product_id: productId,
                 defined_price: definedPrice
-            });
+            }));
         } catch (exception) {
             process.stderr.write(`ERROR received from ${this.apiUrl}: ${exception}\n`);
         }
@@ -432,33 +397,10 @@ export class ApiService {
      */
     updatePriceAlarms(alarmId: number, definedPrice: number): Observable<any> {
         try {
-            const sessionInfo = this.getSessionInfoFromLocalStorage();
-
-            return this.http.put((this.apiUrl + '/pricealarms'), {
-                session_id: sessionInfo.session_id,
-                session_key: sessionInfo.session_key,
+            return this.http.put((this.apiUrl + '/pricealarms'), JSON.stringify({
                 alarm_id: alarmId,
                 defined_price: definedPrice
-            });
-        } catch (exception) {
-            process.stderr.write(`ERROR received from ${this.apiUrl}: ${exception}\n`);
-        }
-    }
-
-    /**
-     * Deletes the given price alarm
-     * @param alarmId the price alarm to delete
-     * @return Observable<any> The observable response of the api
-     */
-    deletePriceAlarm(alarmId: number): Observable<any> {
-        try {
-            const sessionInfo = this.getSessionInfoFromLocalStorage();
-
-            let params = new HttpParams();
-            params = params.append('session_id', sessionInfo.session_id);
-            params = params.append('session_key', sessionInfo.session_key);
-
-            return this.http.delete((this.apiUrl + '/pricealarms/' + alarmId), {params});
+            }));
         } catch (exception) {
             process.stderr.write(`ERROR received from ${this.apiUrl}: ${exception}\n`);
         }
@@ -481,11 +423,11 @@ export class ApiService {
      */
     registerUser(username: string, password: string, email: string): Observable<any> {
         try {
-            return this.http.post((this.apiUrl + '/users/register'), {
+            return this.http.post((this.apiUrl + '/users/register'), JSON.stringify({
                 username,
                 password,
                 email
-            });
+            }));
         } catch (exception) {
             process.stderr.write(`ERROR received from ${this.apiUrl}: ${exception}\n`);
         }
@@ -499,52 +441,15 @@ export class ApiService {
      */
     loginUser(username: string, password: string): Observable<any> {
         try {
-            return this.http.post((this.apiUrl + '/users/login'), {
+            return this.http.post((this.apiUrl + '/users/login'), JSON.stringify({
                 username,
                 password
-            });
+            }));
         } catch (exception) {
             process.stderr.write(`ERROR received from ${this.apiUrl}: ${exception}\n`);
         }
     }
 
-    /**
-     * Get all required information about the currently logged in user. If the user is not logged in or the
-     * session is not valid anymore, a 401 will come back from the backend.
-     * @return Observable<any> The observable response of the api
-     */
-    getUserInfo(): Observable<any> {
-        try {
-            const sessionInfo = this.getSessionInfoFromLocalStorage();
-            return this.http.post((this.apiUrl + '/users/checkSessionValid'), {
-                session_id: sessionInfo.session_id,
-                session_key: sessionInfo.session_key
-            });
-        } catch (exception) {
-            process.stderr.write(`ERROR received from ${this.apiUrl}: ${exception}\n`);
-        }
-    }
-
-    /**
-     * Gets session id and session key from local storage
-     * @return any {session_id: '', session_key: ''}
-     */
-    getSessionInfoFromLocalStorage(): any {
-        const session_id = localStorage.getItem('session_id') ?? '';
-        const session_key = localStorage.getItem('session_key') ?? '';
-        return {session_id, session_key};
-    }
-
-    /**
-     * Extracts and saves the session data from an api response
-     * @param data The api response
-     */
-    saveSessionInfoToLocalStorage(data: any): boolean {
-        localStorage.setItem('session_id', data.session_id);
-        localStorage.setItem('session_key', data.session_key);
-        return true;
-    }
-
     /*       ______                       _ __               __
             / ____/___ __   ______  _____(_) /____     _____/ /_  ____  ____  _____
            / /_  / __ `/ | / / __ \/ ___/ / __/ _ \   / ___/ __ \/ __ \/ __ \/ ___/
@@ -559,13 +464,7 @@ export class ApiService {
      */
     getFavoriteShops(): Observable<FavoriteShop[]> {
         try {
-            const sessionInfo = this.getSessionInfoFromLocalStorage();
-
-            let params = new HttpParams();
-            params = params.append('session_id', sessionInfo.session_id);
-            params = params.append('session_key', sessionInfo.session_key);
-
-            return this.http.get<FavoriteShop[]>((this.apiUrl + '/favoriteshops'), {params});
+            return this.http.get<FavoriteShop[]>((this.apiUrl + '/favoriteshops'));
         } catch (exception) {
             process.stderr.write(`ERROR received from ${this.apiUrl}: ${exception}\n`);
         }
@@ -578,13 +477,9 @@ export class ApiService {
      */
     addFavoriteShop(vendorId: number): Observable<any> {
         try {
-            const sessionInfo = this.getSessionInfoFromLocalStorage();
-
-            return this.http.post((this.apiUrl + '/favoriteshops'), {
-                session_id: sessionInfo.session_id,
-                session_key: sessionInfo.session_key,
+            return this.http.post((this.apiUrl + '/favoriteshops'), JSON.stringify({
                 vendor_id: vendorId
-            });
+            }));
         } catch (exception) {
             process.stderr.write(`ERROR received from ${this.apiUrl}: ${exception}\n`);
         }
@@ -597,13 +492,7 @@ export class ApiService {
      */
     deleteFavoriteShop(vendorId: number): Observable<any> {
         try {
-            const sessionInfo = this.getSessionInfoFromLocalStorage();
-
-            let params = new HttpParams();
-            params = params.append('session_id', sessionInfo.session_id);
-            params = params.append('session_key', sessionInfo.session_key);
-
-            return this.http.delete((this.apiUrl + '/favoriteshops/' + vendorId), {params});
+            return this.http.delete((this.apiUrl + '/favoriteshops/' + vendorId));
         } catch (exception) {
             process.stderr.write(`ERROR received from ${this.apiUrl}: ${exception}\n`);
         }
@@ -667,18 +556,14 @@ export class ApiService {
      */
     addContactPerson(vendorId: number, firstName: string, lastName: string, gender: string, email: string, phone: string): Observable<any> {
         try {
-            const sessionInfo = this.getSessionInfoFromLocalStorage();
-
-            return this.http.post((this.apiUrl + '/contactpersons'), {
-                session_id: sessionInfo.session_id,
-                session_key: sessionInfo.session_key,
+            return this.http.post((this.apiUrl + '/contactpersons'), JSON.stringify({
                 vendor_id: vendorId,
                 first_name: firstName,
                 last_name: lastName,
                 gender,
                 email,
                 phone
-            });
+            }));
         } catch (exception) {
             process.stderr.write(`ERROR received from ${this.apiUrl}: ${exception}\n`);
         }
@@ -697,18 +582,14 @@ export class ApiService {
      */
     updateContactPerson(contactId: number, vendorId: number, firstName: string, lastName: string, gender: string, email: string, phone: string): Observable<any> {
         try {
-            const sessionInfo = this.getSessionInfoFromLocalStorage();
-
-            return this.http.put((this.apiUrl + '/contactpersons/' + contactId), {
-                session_id: sessionInfo.session_id,
-                session_key: sessionInfo.session_key,
+            return this.http.put((this.apiUrl + '/contactpersons/' + contactId), JSON.stringify({
                 vendor_id: vendorId,
                 first_name: firstName,
                 last_name: lastName,
                 gender,
                 email,
                 phone
-            });
+            }));
         } catch (exception) {
             process.stderr.write(`ERROR received from ${this.apiUrl}: ${exception}\n`);
         }
@@ -823,13 +704,7 @@ export class ApiService {
      */
     getCurrentCrawlingStatus(): Observable<CrawlingStatus> {
         try {
-            const sessionInfo = this.getSessionInfoFromLocalStorage();
-
-            let params = new HttpParams();
-            params = params.append('session_id', sessionInfo.session_id);
-            params = params.append('session_key', sessionInfo.session_key);
-
-            return this.http.get<CrawlingStatus>((this.apiUrl + '/crawlingstatus'), {params});
+            return this.http.get<CrawlingStatus>((this.apiUrl + '/crawlingstatus'));
         } catch (exception) {
             process.stderr.write(`ERROR received from ${this.apiUrl}: ${exception}\n`);
         }

Frontend/src/main.ts

@@ -1,12 +1,12 @@
-import {enableProdMode} from '@angular/core';
-import {platformBrowserDynamic} from '@angular/platform-browser-dynamic';
+import { enableProdMode } from '@angular/core';
+import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
 
-import {AppModule} from './app/app.module';
-import {environment} from './environments/environment';
+import { AppModule } from './app/app.module';
+import { environment } from './environments/environment';
 
 if (environment.production) {
-    enableProdMode();
+  enableProdMode();
 }
 
 platformBrowserDynamic().bootstrapModule(AppModule)
-    .catch(err => console.error(err));
+  .catch(err => console.error(err));