From 24679faf85c509e04c86f00dae1e6dbc08ce6e2a Mon Sep 17 00:00:00 2001
From: Sonja Galovic <galovicsonja@gmail.com>
Date: Sun, 13 Mar 2022 23:30:29 +0100
Subject: Doradjen login-modal.component i uradjen register-modal.component
 (stilski uredjen modal register forme)

---
 .../register-page/register-page.component.html     |  80 -------------
 .../register-page/register-page.component.ts       | 126 ---------------------
 2 files changed, 206 deletions(-)

(limited to 'frontend/src/app/_pages/register-page')

diff --git a/frontend/src/app/_pages/register-page/register-page.component.html b/frontend/src/app/_pages/register-page/register-page.component.html
index f8ae046e..e69de29b 100644
--- a/frontend/src/app/_pages/register-page/register-page.component.html
+++ b/frontend/src/app/_pages/register-page/register-page.component.html
@@ -1,80 +0,0 @@
-<div style="min-height: 100vh; position: relative;">
-    
-    <!-- TODO <app-navbar [activeNav]="'register'"></app-navbar>-->
-    
-    <div class="container" style="margin-top: 50px;">
-        <div class="text-black">
-          <div class="row justify-content-center">
-            <div class="col-8 bg-white border rounded-3 shadow-sm p-5">
-              <p class="text-center h2 fw-bold mb-5 mx-1 mx-md-4">Registracija</p>
-      
-              <form class="mx-1 mx-md-4">
-                <!--Ime-->
-                <div class="row">
-                    <div class="col-6 p-2">
-                        <label class="form-label" for="firstName">Ime</label>
-                        <input type="text" id="firstName" class="form-control" [(ngModel)]="firstName" name="firstName">
-                        <p *ngIf="wrongFirstNameBool" class="small fw-bold text-danger">Unesite ispravno ime. (minimum 1, maksimum 30 karaktera)</p>
-                    </div>
-                    <!--Prezime-->
-                    <div class="col-6 p-2">
-                        <label class="form-label" for="lastName">Prezime</label>
-                        <input type="text" id="lastName" class="form-control" [(ngModel)]="lastName" name="lastName" />
-                        <p *ngIf="wrongLastNameBool" class="small fw-bold text-danger">Unesite ispravno prezime. (minimum 1, maksimum 30 karaktera)</p>
-                    </div>
-                </div>
-                <br>
-      
-                <div class="row">
-                    <!--Korisnicko ime-->
-                    <div class="col-6 p-2">
-                        <label class="form-label" for="nickName">Korisničko ime</label>
-                        <input type="text" id="nickName" class="form-control" [(ngModel)]="nickName" name="nickName" />
-                        <p *ngIf="wrongNickNameBool" class="small fw-bold text-danger">Unesite ispravno korisničko ime.</p>
-                    </div>
-                    <!--Email-->
-                    <div class="col-6 p-2">
-                        <label class="form-label" for="email">E-mail adresa</label>
-                        <input type="email" id="email" class="form-control" [(ngModel)]="email" name="email" />
-                        <p *ngIf="wrongEmailBool" class="small fw-bold text-danger">Unesite ispravnu e-mail adresu.</p>
-                    </div>
-                </div>
-                <br>
-      
-                <div class="row">
-                    <!-- Lozinka 1. -->
-                    <div class="col-6 p-2">
-                        <label class="form-label" for="pass1">Lozinka</label>
-                        <input type="password" id="pass1" class="form-control" [(ngModel)]="pass1" name="pass1" />
-                        <p *ngIf="wrongPass1Bool" class="small fw-bold text-danger">Lozinka se mora sastojati od najmanje 6 karaktera.</p>
-                    </div>
-      
-                    <!-- Lozinka 2. -->
-                    <div class="col-6 p-2">
-                        <label class="form-label" for="pass2">Potvrdite lozinku</label>
-                        <input type="password" id="pass2" class="form-control" [(ngModel)]="pass2" name="pass2" />
-                        <p *ngIf="wrongPass2Bool" class="small fw-bold text-danger">Lozinke se ne podudaraju.</p>
-                    </div>
-                </div>
-      
-                <br><br><br>
-                <!--Dugme Registruj se-->
-                <div class="d-flex justify-content-center mx-4 mb-3 mb-lg-4">
-                    <button type="button" class="btn btn-primary btn-lg" (click)="validation()">Registrujte se</button>
-                </div>
-      
-                <div class="form-check d-flex justify-content-center mb-5">
-                  <label class="form-check-label" class="small fw-bold mt-2 pt-1 mb-0" for="form2Example3">
-                    Već imate kreiran nalog?
-                    <a routerLink="/login" class="link-danger">Prijavite se</a>
-                  </label>
-                </div>
-              </form>
-            </div>
-          </div>
-        </div>
-      </div>
-    
-    <!-- TODO <app-footer></app-footer> -->
-
-</div>
\ No newline at end of file
diff --git a/frontend/src/app/_pages/register-page/register-page.component.ts b/frontend/src/app/_pages/register-page/register-page.component.ts
index 712fc55e..3add63a4 100644
--- a/frontend/src/app/_pages/register-page/register-page.component.ts
+++ b/frontend/src/app/_pages/register-page/register-page.component.ts
@@ -8,133 +8,7 @@ import { AuthService } from 'src/app/_services/auth.service';
   styleUrls: ['./register-page.component.css']
 })
 export class RegisterPageComponent implements OnInit {
-  firstName: string = '';
-  lastName: string = '';
-  nickName: string = '';
-  email: string = '';
-  pass1: string = '';
-  pass2: string = '';
-
-  wrongFirstNameBool: boolean = false;
-  wrongLastNameBool: boolean = false;
-  wrongNickNameBool: boolean = false;
-  wrongEmailBool: boolean = false;
-  wrongPass1Bool: boolean = false;
-  wrongPass2Bool: boolean = false;
-
-  pattName: RegExp = /^[a-zA-ZšŠđĐčČćĆžŽ]+([ \-][a-zA-ZšŠđĐčČćĆžŽ]+)*$/;
-  pattTwoSpaces: RegExp = /  /;
-  pattEmail: RegExp = /^[a-zA-Z0-9]+([\.\-\+][a-zA-Z0-9]+)*\@([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}$/;
-  pattPassword: RegExp = /.{6,30}$/;
-
-  constructor(
-    private router: Router,
-    private authService: AuthService,
-  ) { }
 
   ngOnInit(): void {
   }
-
-  isCorrectName(element: string): boolean {
-    if (this.pattName.test(element) && !(this.pattTwoSpaces.test(element)) && (element.length >= 1 && element.length <= 30))
-      return true;
-    return false;
-  }
-  isCorrectEmail(element: string): boolean {
-    if (this.pattEmail.test(element.toLowerCase()) && element.length <= 320)
-      return true;
-    return false;
-  }
-  isCorrectPassword(element: string): boolean {
-    if (this.pattPassword.test(element))
-      return true;
-    return false;
-  }
-
-  firstNameValidation() {
-    if (this.isCorrectName(this.firstName) == true) {
-      this.wrongFirstNameBool = false;
-      return;
-    }
-    (<HTMLSelectElement>document.getElementById('firstName')).focus();
-    this.wrongFirstNameBool = true;
-  }
-  lastNameValidation() {
-    if (this.isCorrectName(this.lastName) == true) {
-      this.wrongLastNameBool = false;
-      return;
-    }
-    (<HTMLSelectElement>document.getElementById('lastName')).focus();
-    this.wrongLastNameBool = true;
-  }
-  nickNameValidation() {
-    if (this.isCorrectName(this.nickName) == true) {
-      this.wrongNickNameBool = false;
-      return;
-    }
-    (<HTMLSelectElement>document.getElementById('nickName')).focus();
-    this.wrongNickNameBool = true;
-  }
-  emailValidation() {
-    if (this.isCorrectEmail(this.email) == true) {
-      this.wrongEmailBool = false;
-      return;
-    }
-    (<HTMLSelectElement>document.getElementById('email')).focus();
-    this.wrongEmailBool = true;
-  }
-  passwordValidation() {
-    if (this.isCorrectPassword(this.pass1) && this.isCorrectPassword(this.pass2) && this.pass1 == this.pass2) {
-      this.wrongPass1Bool = false;
-      this.wrongPass2Bool = false;
-      return;
-    }
-    this.pass1 = ''; //brisi obe ukucane lozinke
-    this.pass2 = '';
-    (<HTMLSelectElement>document.getElementById('pass1')).focus();
-    this.wrongPass1Bool = true;
-    this.wrongPass2Bool = true;
-  }
-
-  validation() {
-    this.firstName = this.firstName.trim();
-    this.lastName = this.lastName.trim();
-    this.nickName = this.nickName.trim();
-    this.email = this.email.trim();
-
-    this.firstNameValidation();
-    this.lastNameValidation();
-    //this.nickNameValidation();
-    this.emailValidation();
-    this.passwordValidation();
-
-    if (!(this.wrongFirstNameBool || this.wrongLastNameBool || this.wrongNickNameBool ||
-      this.wrongEmailBool || this.wrongPass1Bool || this.wrongPass2Bool)) { //sve ok, registruj ga
-
-      let user = {
-        firstName: this.firstName,
-        lastName: this.lastName,
-        username: this.nickName,
-        password: this.pass1,
-        email: this.email
-      }
-
-      this.authService.register(user)
-        .subscribe(
-          (response) => {
-            console.log(response);
-            if (response === 'User added')
-              this.router.navigate(['/login']); //registracija uspesna, idi na login
-            else if (response === 'Email Already Exists')
-              alert('Nalog sa unetim email-om već postoji!');
-            else if (response === 'Username Already Exists')
-              alert('Nalog sa unetim korisnićkim imenom već postoji!');
-          }
-        );
-    }
-  }
-
-
-
-
 }
-- 
cgit v1.2.3


From dd5834672ba1cc54362425462bfebd31959f693a Mon Sep 17 00:00:00 2001
From: Danijel Andjelkovic <adanijel99@gmail.com>
Date: Tue, 15 Mar 2022 16:32:35 +0100
Subject: Dodate stranice za sve linkove.

---
 .../src/app/_elements/navbar/navbar.component.html | 12 +++++------
 .../browse-datasets/browse-datasets.component.css  |  0
 .../browse-datasets/browse-datasets.component.html |  1 +
 .../browse-datasets.component.spec.ts              | 25 ++++++++++++++++++++++
 .../browse-datasets/browse-datasets.component.ts   | 15 +++++++++++++
 .../browse-predictors.component.css                |  0
 .../browse-predictors.component.html               |  1 +
 .../browse-predictors.component.spec.ts            | 25 ++++++++++++++++++++++
 .../browse-predictors.component.ts                 | 15 +++++++++++++
 frontend/src/app/_pages/home/home.component.html   |  8 +++----
 .../app/_pages/login-page/login-page.component.css |  0
 .../_pages/login-page/login-page.component.html    |  9 --------
 .../_pages/login-page/login-page.component.spec.ts | 25 ----------------------
 .../app/_pages/login-page/login-page.component.ts  | 15 -------------
 .../_pages/my-datasets/my-datasets.component.css   |  0
 .../_pages/my-datasets/my-datasets.component.html  |  1 +
 .../my-datasets/my-datasets.component.spec.ts      | 25 ++++++++++++++++++++++
 .../_pages/my-datasets/my-datasets.component.ts    | 15 +++++++++++++
 .../app/_pages/my-models/my-models.component.css   |  0
 .../app/_pages/my-models/my-models.component.html  |  1 +
 .../_pages/my-models/my-models.component.spec.ts   | 25 ++++++++++++++++++++++
 .../app/_pages/my-models/my-models.component.ts    | 15 +++++++++++++
 .../my-predictors/my-predictors.component.css      |  0
 .../my-predictors/my-predictors.component.html     |  1 +
 .../my-predictors/my-predictors.component.spec.ts  | 25 ++++++++++++++++++++++
 .../my-predictors/my-predictors.component.ts       | 15 +++++++++++++
 .../only-authorized/only-authorized.component.css  |  0
 .../only-authorized/only-authorized.component.html |  1 -
 .../only-authorized.component.spec.ts              | 25 ----------------------
 .../only-authorized/only-authorized.component.ts   | 15 -------------
 .../src/app/_pages/predict/predict.component.css   |  0
 .../src/app/_pages/predict/predict.component.html  |  1 +
 .../app/_pages/predict/predict.component.spec.ts   | 25 ++++++++++++++++++++++
 .../src/app/_pages/predict/predict.component.ts    | 15 +++++++++++++
 .../src/app/_pages/profile/profile.component.css   |  0
 .../src/app/_pages/profile/profile.component.html  |  1 +
 .../app/_pages/profile/profile.component.spec.ts   | 25 ++++++++++++++++++++++
 .../src/app/_pages/profile/profile.component.ts    | 15 +++++++++++++
 .../register-page/register-page.component.css      |  0
 .../register-page/register-page.component.html     |  0
 .../register-page/register-page.component.spec.ts  | 25 ----------------------
 .../register-page/register-page.component.ts       | 14 ------------
 .../src/app/_pages/settings/settings.component.css |  0
 .../app/_pages/settings/settings.component.html    |  1 +
 .../app/_pages/settings/settings.component.spec.ts | 25 ++++++++++++++++++++++
 .../src/app/_pages/settings/settings.component.ts  | 15 +++++++++++++
 frontend/src/app/_services/auth.service.ts         |  8 ++++---
 frontend/src/app/app-routing.module.ts             | 24 ++++++++++++---------
 frontend/src/app/app.module.ts                     | 22 ++++++++++++++-----
 49 files changed, 374 insertions(+), 157 deletions(-)
 create mode 100644 frontend/src/app/_pages/browse-datasets/browse-datasets.component.css
 create mode 100644 frontend/src/app/_pages/browse-datasets/browse-datasets.component.html
 create mode 100644 frontend/src/app/_pages/browse-datasets/browse-datasets.component.spec.ts
 create mode 100644 frontend/src/app/_pages/browse-datasets/browse-datasets.component.ts
 create mode 100644 frontend/src/app/_pages/browse-predictors/browse-predictors.component.css
 create mode 100644 frontend/src/app/_pages/browse-predictors/browse-predictors.component.html
 create mode 100644 frontend/src/app/_pages/browse-predictors/browse-predictors.component.spec.ts
 create mode 100644 frontend/src/app/_pages/browse-predictors/browse-predictors.component.ts
 delete mode 100644 frontend/src/app/_pages/login-page/login-page.component.css
 delete mode 100644 frontend/src/app/_pages/login-page/login-page.component.html
 delete mode 100644 frontend/src/app/_pages/login-page/login-page.component.spec.ts
 delete mode 100644 frontend/src/app/_pages/login-page/login-page.component.ts
 create mode 100644 frontend/src/app/_pages/my-datasets/my-datasets.component.css
 create mode 100644 frontend/src/app/_pages/my-datasets/my-datasets.component.html
 create mode 100644 frontend/src/app/_pages/my-datasets/my-datasets.component.spec.ts
 create mode 100644 frontend/src/app/_pages/my-datasets/my-datasets.component.ts
 create mode 100644 frontend/src/app/_pages/my-models/my-models.component.css
 create mode 100644 frontend/src/app/_pages/my-models/my-models.component.html
 create mode 100644 frontend/src/app/_pages/my-models/my-models.component.spec.ts
 create mode 100644 frontend/src/app/_pages/my-models/my-models.component.ts
 create mode 100644 frontend/src/app/_pages/my-predictors/my-predictors.component.css
 create mode 100644 frontend/src/app/_pages/my-predictors/my-predictors.component.html
 create mode 100644 frontend/src/app/_pages/my-predictors/my-predictors.component.spec.ts
 create mode 100644 frontend/src/app/_pages/my-predictors/my-predictors.component.ts
 delete mode 100644 frontend/src/app/_pages/only-authorized/only-authorized.component.css
 delete mode 100644 frontend/src/app/_pages/only-authorized/only-authorized.component.html
 delete mode 100644 frontend/src/app/_pages/only-authorized/only-authorized.component.spec.ts
 delete mode 100644 frontend/src/app/_pages/only-authorized/only-authorized.component.ts
 create mode 100644 frontend/src/app/_pages/predict/predict.component.css
 create mode 100644 frontend/src/app/_pages/predict/predict.component.html
 create mode 100644 frontend/src/app/_pages/predict/predict.component.spec.ts
 create mode 100644 frontend/src/app/_pages/predict/predict.component.ts
 create mode 100644 frontend/src/app/_pages/profile/profile.component.css
 create mode 100644 frontend/src/app/_pages/profile/profile.component.html
 create mode 100644 frontend/src/app/_pages/profile/profile.component.spec.ts
 create mode 100644 frontend/src/app/_pages/profile/profile.component.ts
 delete mode 100644 frontend/src/app/_pages/register-page/register-page.component.css
 delete mode 100644 frontend/src/app/_pages/register-page/register-page.component.html
 delete mode 100644 frontend/src/app/_pages/register-page/register-page.component.spec.ts
 delete mode 100644 frontend/src/app/_pages/register-page/register-page.component.ts
 create mode 100644 frontend/src/app/_pages/settings/settings.component.css
 create mode 100644 frontend/src/app/_pages/settings/settings.component.html
 create mode 100644 frontend/src/app/_pages/settings/settings.component.spec.ts
 create mode 100644 frontend/src/app/_pages/settings/settings.component.ts

(limited to 'frontend/src/app/_pages/register-page')

diff --git a/frontend/src/app/_elements/navbar/navbar.component.html b/frontend/src/app/_elements/navbar/navbar.component.html
index cea41e5a..116694b4 100644
--- a/frontend/src/app/_elements/navbar/navbar.component.html
+++ b/frontend/src/app/_elements/navbar/navbar.component.html
@@ -12,8 +12,8 @@
                         [class]="(currentUrl === '') ? 'text-secondary' : 'text-white'">Početna</a></li>
                 <li><a routerLink="add-model" class="nav-link px-2"
                         [class]="(currentUrl === '/add-model') ? 'text-secondary' : 'text-white'">Dodaj model</a></li>
-                <li><a routerLink="predict" class="nav-link px-2"
-                        [class]="(currentUrl === '/predict') ? 'text-secondary' : 'text-white'">Predvidi</a></li>
+                <li><a routerLink="my-predictors" class="nav-link px-2"
+                        [class]="(currentUrl === '/my-predictors') ? 'text-secondary' : 'text-white'">Predvidi</a></li>
             </ul>
 
             <div *ngIf="shared.loggedIn" class="dropdown text-end">
@@ -24,13 +24,13 @@
                 <ul class="dropdown-menu text-small" aria-labelledby="dropdownUser1"
                     style="position: absolute; inset: 0px 0px auto auto; margin: 0px; transform: translate(0px, 34px);"
                     data-popper-placement="bottom-end">
-                    <li><a class="dropdown-item" href="#">Nov model...</a></li>
-                    <li><a class="dropdown-item" href="#">Podešavanja</a></li>
-                    <li><a class="dropdown-item" href="#">Moj profil</a></li>
+                    <li><a class="dropdown-item" routerLink="add-model">Nov model...</a></li>
+                    <li><a class="dropdown-item" routerLink="settings">Podešavanja</a></li>
+                    <li><a class="dropdown-item" routerLink="profile">Moj profil</a></li>
                     <li>
                         <hr class="dropdown-divider">
                     </li>
-                    <li><a class="dropdown-item" (click)="logOut()">Odjavi se</a></li>
+                    <li><a class="dropdown-item" routerLink="" (click)="logOut()">Odjavi se</a></li>
                 </ul>
             </div>
             <div *ngIf="!shared.loggedIn" class="dropdown text-end">
diff --git a/frontend/src/app/_pages/browse-datasets/browse-datasets.component.css b/frontend/src/app/_pages/browse-datasets/browse-datasets.component.css
new file mode 100644
index 00000000..e69de29b
diff --git a/frontend/src/app/_pages/browse-datasets/browse-datasets.component.html b/frontend/src/app/_pages/browse-datasets/browse-datasets.component.html
new file mode 100644
index 00000000..fa38a1bc
--- /dev/null
+++ b/frontend/src/app/_pages/browse-datasets/browse-datasets.component.html
@@ -0,0 +1 @@
+<p>browse-datasets works!</p>
diff --git a/frontend/src/app/_pages/browse-datasets/browse-datasets.component.spec.ts b/frontend/src/app/_pages/browse-datasets/browse-datasets.component.spec.ts
new file mode 100644
index 00000000..fda74dbe
--- /dev/null
+++ b/frontend/src/app/_pages/browse-datasets/browse-datasets.component.spec.ts
@@ -0,0 +1,25 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { BrowseDatasetsComponent } from './browse-datasets.component';
+
+describe('BrowseDatasetsComponent', () => {
+  let component: BrowseDatasetsComponent;
+  let fixture: ComponentFixture<BrowseDatasetsComponent>;
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      declarations: [ BrowseDatasetsComponent ]
+    })
+    .compileComponents();
+  });
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(BrowseDatasetsComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});
diff --git a/frontend/src/app/_pages/browse-datasets/browse-datasets.component.ts b/frontend/src/app/_pages/browse-datasets/browse-datasets.component.ts
new file mode 100644
index 00000000..dba6c25e
--- /dev/null
+++ b/frontend/src/app/_pages/browse-datasets/browse-datasets.component.ts
@@ -0,0 +1,15 @@
+import { Component, OnInit } from '@angular/core';
+
+@Component({
+  selector: 'app-browse-datasets',
+  templateUrl: './browse-datasets.component.html',
+  styleUrls: ['./browse-datasets.component.css']
+})
+export class BrowseDatasetsComponent implements OnInit {
+
+  constructor() { }
+
+  ngOnInit(): void {
+  }
+
+}
diff --git a/frontend/src/app/_pages/browse-predictors/browse-predictors.component.css b/frontend/src/app/_pages/browse-predictors/browse-predictors.component.css
new file mode 100644
index 00000000..e69de29b
diff --git a/frontend/src/app/_pages/browse-predictors/browse-predictors.component.html b/frontend/src/app/_pages/browse-predictors/browse-predictors.component.html
new file mode 100644
index 00000000..01c4af82
--- /dev/null
+++ b/frontend/src/app/_pages/browse-predictors/browse-predictors.component.html
@@ -0,0 +1 @@
+<p>browse-predictors works!</p>
diff --git a/frontend/src/app/_pages/browse-predictors/browse-predictors.component.spec.ts b/frontend/src/app/_pages/browse-predictors/browse-predictors.component.spec.ts
new file mode 100644
index 00000000..6d13fedf
--- /dev/null
+++ b/frontend/src/app/_pages/browse-predictors/browse-predictors.component.spec.ts
@@ -0,0 +1,25 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { BrowsePredictorsComponent } from './browse-predictors.component';
+
+describe('BrowsePredictorsComponent', () => {
+  let component: BrowsePredictorsComponent;
+  let fixture: ComponentFixture<BrowsePredictorsComponent>;
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      declarations: [ BrowsePredictorsComponent ]
+    })
+    .compileComponents();
+  });
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(BrowsePredictorsComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});
diff --git a/frontend/src/app/_pages/browse-predictors/browse-predictors.component.ts b/frontend/src/app/_pages/browse-predictors/browse-predictors.component.ts
new file mode 100644
index 00000000..b4fb2a9d
--- /dev/null
+++ b/frontend/src/app/_pages/browse-predictors/browse-predictors.component.ts
@@ -0,0 +1,15 @@
+import { Component, OnInit } from '@angular/core';
+
+@Component({
+  selector: 'app-browse-predictors',
+  templateUrl: './browse-predictors.component.html',
+  styleUrls: ['./browse-predictors.component.css']
+})
+export class BrowsePredictorsComponent implements OnInit {
+
+  constructor() { }
+
+  ngOnInit(): void {
+  }
+
+}
diff --git a/frontend/src/app/_pages/home/home.component.html b/frontend/src/app/_pages/home/home.component.html
index 6713cd59..7731054c 100644
--- a/frontend/src/app/_pages/home/home.component.html
+++ b/frontend/src/app/_pages/home/home.component.html
@@ -1,9 +1,9 @@
 <div>
     <div class="d-flex flex-column align-items-center">
-        <div *ngIf="shared.loggedIn">
+        <div *ngIf="shared.loggedIn" class="d-flex flex-column align-items-center">
             <h2 class="my-4">Započnite sa treniranjem!</h2>
             <div id="cards" class="d-flex flex-row justify-content-center align-items-start">
-                <div class="card" style="width: 18rem;">
+                <div class="card shadow" style="width: 18rem;">
                     <div class="card-body">
                         <mat-icon width="48px" height="48px"
                             style="font-size: 48px; margin-left: 50%; transform: translateX(-100%);">storage</mat-icon>
@@ -15,7 +15,7 @@
                         </p>
                     </div>
                 </div>
-                <div class="card mx-3" style="width: 18rem;">
+                <div class="card mx-3 shadow" style="width: 18rem;">
                     <div class="card-body">
                         <mat-icon width="48px" height="48px"
                             style="font-size: 48px; margin-left: 50%; transform: translateX(-100%);">model_training
@@ -28,7 +28,7 @@
                         </p>
                     </div>
                 </div>
-                <div class="card" style="width: 18rem;">
+                <div class="card shadow" style="width: 18rem;">
                     <div class="card-body">
                         <mat-icon width="48px" height="48px"
                             style="font-size: 48px; margin-left: 50%; transform: translateX(-100%);">batch_prediction
diff --git a/frontend/src/app/_pages/login-page/login-page.component.css b/frontend/src/app/_pages/login-page/login-page.component.css
deleted file mode 100644
index e69de29b..00000000
diff --git a/frontend/src/app/_pages/login-page/login-page.component.html b/frontend/src/app/_pages/login-page/login-page.component.html
deleted file mode 100644
index 766268d9..00000000
--- a/frontend/src/app/_pages/login-page/login-page.component.html
+++ /dev/null
@@ -1,9 +0,0 @@
-<!-- Button trigger modal, OVO JE U STVARI DUGME U NAVBARU -->
-<button type="button" class="btn btn-primary" data-bs-toggle="modal" data-bs-target="#modalForLogin">
-    Otvori login modal
-</button>
-
-<!-- Button trigger modal, OVO JE U STVARI DUGME U NAVBARU -->
-<button type="button" class="btn btn-primary" data-bs-toggle="modal" data-bs-target="#modalForRegister">
-    Otvori register modal
-</button>
\ No newline at end of file
diff --git a/frontend/src/app/_pages/login-page/login-page.component.spec.ts b/frontend/src/app/_pages/login-page/login-page.component.spec.ts
deleted file mode 100644
index 9da3aca8..00000000
--- a/frontend/src/app/_pages/login-page/login-page.component.spec.ts
+++ /dev/null
@@ -1,25 +0,0 @@
-import { ComponentFixture, TestBed } from '@angular/core/testing';
-
-import { LoginPageComponent } from './login-page.component';
-
-describe('LoginPageComponent', () => {
-  let component: LoginPageComponent;
-  let fixture: ComponentFixture<LoginPageComponent>;
-
-  beforeEach(async () => {
-    await TestBed.configureTestingModule({
-      declarations: [ LoginPageComponent ]
-    })
-    .compileComponents();
-  });
-
-  beforeEach(() => {
-    fixture = TestBed.createComponent(LoginPageComponent);
-    component = fixture.componentInstance;
-    fixture.detectChanges();
-  });
-
-  it('should create', () => {
-    expect(component).toBeTruthy();
-  });
-});
diff --git a/frontend/src/app/_pages/login-page/login-page.component.ts b/frontend/src/app/_pages/login-page/login-page.component.ts
deleted file mode 100644
index 58cd75a0..00000000
--- a/frontend/src/app/_pages/login-page/login-page.component.ts
+++ /dev/null
@@ -1,15 +0,0 @@
-import { Component } from '@angular/core';
-
-
-
-declare var window: any;
-
-@Component({
-  selector: 'app-login-page',
-  templateUrl: './login-page.component.html',
-  styleUrls: ['./login-page.component.css'],
-
-})
-export class LoginPageComponent {
-
-}
diff --git a/frontend/src/app/_pages/my-datasets/my-datasets.component.css b/frontend/src/app/_pages/my-datasets/my-datasets.component.css
new file mode 100644
index 00000000..e69de29b
diff --git a/frontend/src/app/_pages/my-datasets/my-datasets.component.html b/frontend/src/app/_pages/my-datasets/my-datasets.component.html
new file mode 100644
index 00000000..4b3095be
--- /dev/null
+++ b/frontend/src/app/_pages/my-datasets/my-datasets.component.html
@@ -0,0 +1 @@
+<p>my-datasets works!</p>
diff --git a/frontend/src/app/_pages/my-datasets/my-datasets.component.spec.ts b/frontend/src/app/_pages/my-datasets/my-datasets.component.spec.ts
new file mode 100644
index 00000000..fc1fc3f3
--- /dev/null
+++ b/frontend/src/app/_pages/my-datasets/my-datasets.component.spec.ts
@@ -0,0 +1,25 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { MyDatasetsComponent } from './my-datasets.component';
+
+describe('MyDatasetsComponent', () => {
+  let component: MyDatasetsComponent;
+  let fixture: ComponentFixture<MyDatasetsComponent>;
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      declarations: [ MyDatasetsComponent ]
+    })
+    .compileComponents();
+  });
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(MyDatasetsComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});
diff --git a/frontend/src/app/_pages/my-datasets/my-datasets.component.ts b/frontend/src/app/_pages/my-datasets/my-datasets.component.ts
new file mode 100644
index 00000000..af5eab97
--- /dev/null
+++ b/frontend/src/app/_pages/my-datasets/my-datasets.component.ts
@@ -0,0 +1,15 @@
+import { Component, OnInit } from '@angular/core';
+
+@Component({
+  selector: 'app-my-datasets',
+  templateUrl: './my-datasets.component.html',
+  styleUrls: ['./my-datasets.component.css']
+})
+export class MyDatasetsComponent implements OnInit {
+
+  constructor() { }
+
+  ngOnInit(): void {
+  }
+
+}
diff --git a/frontend/src/app/_pages/my-models/my-models.component.css b/frontend/src/app/_pages/my-models/my-models.component.css
new file mode 100644
index 00000000..e69de29b
diff --git a/frontend/src/app/_pages/my-models/my-models.component.html b/frontend/src/app/_pages/my-models/my-models.component.html
new file mode 100644
index 00000000..2fea257d
--- /dev/null
+++ b/frontend/src/app/_pages/my-models/my-models.component.html
@@ -0,0 +1 @@
+<p>my-models works!</p>
diff --git a/frontend/src/app/_pages/my-models/my-models.component.spec.ts b/frontend/src/app/_pages/my-models/my-models.component.spec.ts
new file mode 100644
index 00000000..e431d04c
--- /dev/null
+++ b/frontend/src/app/_pages/my-models/my-models.component.spec.ts
@@ -0,0 +1,25 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { MyModelsComponent } from './my-models.component';
+
+describe('MyModelsComponent', () => {
+  let component: MyModelsComponent;
+  let fixture: ComponentFixture<MyModelsComponent>;
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      declarations: [ MyModelsComponent ]
+    })
+    .compileComponents();
+  });
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(MyModelsComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});
diff --git a/frontend/src/app/_pages/my-models/my-models.component.ts b/frontend/src/app/_pages/my-models/my-models.component.ts
new file mode 100644
index 00000000..e9bc52de
--- /dev/null
+++ b/frontend/src/app/_pages/my-models/my-models.component.ts
@@ -0,0 +1,15 @@
+import { Component, OnInit } from '@angular/core';
+
+@Component({
+  selector: 'app-my-models',
+  templateUrl: './my-models.component.html',
+  styleUrls: ['./my-models.component.css']
+})
+export class MyModelsComponent implements OnInit {
+
+  constructor() { }
+
+  ngOnInit(): void {
+  }
+
+}
diff --git a/frontend/src/app/_pages/my-predictors/my-predictors.component.css b/frontend/src/app/_pages/my-predictors/my-predictors.component.css
new file mode 100644
index 00000000..e69de29b
diff --git a/frontend/src/app/_pages/my-predictors/my-predictors.component.html b/frontend/src/app/_pages/my-predictors/my-predictors.component.html
new file mode 100644
index 00000000..32d085af
--- /dev/null
+++ b/frontend/src/app/_pages/my-predictors/my-predictors.component.html
@@ -0,0 +1 @@
+<p>my-predictors works!</p>
diff --git a/frontend/src/app/_pages/my-predictors/my-predictors.component.spec.ts b/frontend/src/app/_pages/my-predictors/my-predictors.component.spec.ts
new file mode 100644
index 00000000..37dddf6d
--- /dev/null
+++ b/frontend/src/app/_pages/my-predictors/my-predictors.component.spec.ts
@@ -0,0 +1,25 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { MyPredictorsComponent } from './my-predictors.component';
+
+describe('MyPredictorsComponent', () => {
+  let component: MyPredictorsComponent;
+  let fixture: ComponentFixture<MyPredictorsComponent>;
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      declarations: [ MyPredictorsComponent ]
+    })
+    .compileComponents();
+  });
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(MyPredictorsComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});
diff --git a/frontend/src/app/_pages/my-predictors/my-predictors.component.ts b/frontend/src/app/_pages/my-predictors/my-predictors.component.ts
new file mode 100644
index 00000000..b0d6e9dd
--- /dev/null
+++ b/frontend/src/app/_pages/my-predictors/my-predictors.component.ts
@@ -0,0 +1,15 @@
+import { Component, OnInit } from '@angular/core';
+
+@Component({
+  selector: 'app-my-predictors',
+  templateUrl: './my-predictors.component.html',
+  styleUrls: ['./my-predictors.component.css']
+})
+export class MyPredictorsComponent implements OnInit {
+
+  constructor() { }
+
+  ngOnInit(): void {
+  }
+
+}
diff --git a/frontend/src/app/_pages/only-authorized/only-authorized.component.css b/frontend/src/app/_pages/only-authorized/only-authorized.component.css
deleted file mode 100644
index e69de29b..00000000
diff --git a/frontend/src/app/_pages/only-authorized/only-authorized.component.html b/frontend/src/app/_pages/only-authorized/only-authorized.component.html
deleted file mode 100644
index 27bbcf09..00000000
--- a/frontend/src/app/_pages/only-authorized/only-authorized.component.html
+++ /dev/null
@@ -1 +0,0 @@
-<p>only-authorized works!</p>
diff --git a/frontend/src/app/_pages/only-authorized/only-authorized.component.spec.ts b/frontend/src/app/_pages/only-authorized/only-authorized.component.spec.ts
deleted file mode 100644
index 82a01f63..00000000
--- a/frontend/src/app/_pages/only-authorized/only-authorized.component.spec.ts
+++ /dev/null
@@ -1,25 +0,0 @@
-import { ComponentFixture, TestBed } from '@angular/core/testing';
-
-import { OnlyAuthorizedComponent } from './only-authorized.component';
-
-describe('OnlyAuthorizedComponent', () => {
-  let component: OnlyAuthorizedComponent;
-  let fixture: ComponentFixture<OnlyAuthorizedComponent>;
-
-  beforeEach(async () => {
-    await TestBed.configureTestingModule({
-      declarations: [ OnlyAuthorizedComponent ]
-    })
-    .compileComponents();
-  });
-
-  beforeEach(() => {
-    fixture = TestBed.createComponent(OnlyAuthorizedComponent);
-    component = fixture.componentInstance;
-    fixture.detectChanges();
-  });
-
-  it('should create', () => {
-    expect(component).toBeTruthy();
-  });
-});
diff --git a/frontend/src/app/_pages/only-authorized/only-authorized.component.ts b/frontend/src/app/_pages/only-authorized/only-authorized.component.ts
deleted file mode 100644
index be88365f..00000000
--- a/frontend/src/app/_pages/only-authorized/only-authorized.component.ts
+++ /dev/null
@@ -1,15 +0,0 @@
-import { Component, OnInit } from '@angular/core';
-
-@Component({
-  selector: 'app-only-authorized',
-  templateUrl: './only-authorized.component.html',
-  styleUrls: ['./only-authorized.component.css']
-})
-export class OnlyAuthorizedComponent implements OnInit {
-
-  constructor() { }
-
-  ngOnInit(): void {
-  }
-
-}
diff --git a/frontend/src/app/_pages/predict/predict.component.css b/frontend/src/app/_pages/predict/predict.component.css
new file mode 100644
index 00000000..e69de29b
diff --git a/frontend/src/app/_pages/predict/predict.component.html b/frontend/src/app/_pages/predict/predict.component.html
new file mode 100644
index 00000000..74a83b71
--- /dev/null
+++ b/frontend/src/app/_pages/predict/predict.component.html
@@ -0,0 +1 @@
+<p>predict works!</p>
diff --git a/frontend/src/app/_pages/predict/predict.component.spec.ts b/frontend/src/app/_pages/predict/predict.component.spec.ts
new file mode 100644
index 00000000..65871ecc
--- /dev/null
+++ b/frontend/src/app/_pages/predict/predict.component.spec.ts
@@ -0,0 +1,25 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { PredictComponent } from './predict.component';
+
+describe('PredictComponent', () => {
+  let component: PredictComponent;
+  let fixture: ComponentFixture<PredictComponent>;
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      declarations: [ PredictComponent ]
+    })
+    .compileComponents();
+  });
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(PredictComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});
diff --git a/frontend/src/app/_pages/predict/predict.component.ts b/frontend/src/app/_pages/predict/predict.component.ts
new file mode 100644
index 00000000..0e313c65
--- /dev/null
+++ b/frontend/src/app/_pages/predict/predict.component.ts
@@ -0,0 +1,15 @@
+import { Component, OnInit } from '@angular/core';
+
+@Component({
+  selector: 'app-predict',
+  templateUrl: './predict.component.html',
+  styleUrls: ['./predict.component.css']
+})
+export class PredictComponent implements OnInit {
+
+  constructor() { }
+
+  ngOnInit(): void {
+  }
+
+}
diff --git a/frontend/src/app/_pages/profile/profile.component.css b/frontend/src/app/_pages/profile/profile.component.css
new file mode 100644
index 00000000..e69de29b
diff --git a/frontend/src/app/_pages/profile/profile.component.html b/frontend/src/app/_pages/profile/profile.component.html
new file mode 100644
index 00000000..9df0576d
--- /dev/null
+++ b/frontend/src/app/_pages/profile/profile.component.html
@@ -0,0 +1 @@
+<p>profile works!</p>
diff --git a/frontend/src/app/_pages/profile/profile.component.spec.ts b/frontend/src/app/_pages/profile/profile.component.spec.ts
new file mode 100644
index 00000000..e88012e7
--- /dev/null
+++ b/frontend/src/app/_pages/profile/profile.component.spec.ts
@@ -0,0 +1,25 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { ProfileComponent } from './profile.component';
+
+describe('ProfileComponent', () => {
+  let component: ProfileComponent;
+  let fixture: ComponentFixture<ProfileComponent>;
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      declarations: [ ProfileComponent ]
+    })
+    .compileComponents();
+  });
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(ProfileComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});
diff --git a/frontend/src/app/_pages/profile/profile.component.ts b/frontend/src/app/_pages/profile/profile.component.ts
new file mode 100644
index 00000000..93040f3e
--- /dev/null
+++ b/frontend/src/app/_pages/profile/profile.component.ts
@@ -0,0 +1,15 @@
+import { Component, OnInit } from '@angular/core';
+
+@Component({
+  selector: 'app-profile',
+  templateUrl: './profile.component.html',
+  styleUrls: ['./profile.component.css']
+})
+export class ProfileComponent implements OnInit {
+
+  constructor() { }
+
+  ngOnInit(): void {
+  }
+
+}
diff --git a/frontend/src/app/_pages/register-page/register-page.component.css b/frontend/src/app/_pages/register-page/register-page.component.css
deleted file mode 100644
index e69de29b..00000000
diff --git a/frontend/src/app/_pages/register-page/register-page.component.html b/frontend/src/app/_pages/register-page/register-page.component.html
deleted file mode 100644
index e69de29b..00000000
diff --git a/frontend/src/app/_pages/register-page/register-page.component.spec.ts b/frontend/src/app/_pages/register-page/register-page.component.spec.ts
deleted file mode 100644
index 347fe9f4..00000000
--- a/frontend/src/app/_pages/register-page/register-page.component.spec.ts
+++ /dev/null
@@ -1,25 +0,0 @@
-import { ComponentFixture, TestBed } from '@angular/core/testing';
-
-import { RegisterPageComponent } from './register-page.component';
-
-describe('RegisterPageComponent', () => {
-  let component: RegisterPageComponent;
-  let fixture: ComponentFixture<RegisterPageComponent>;
-
-  beforeEach(async () => {
-    await TestBed.configureTestingModule({
-      declarations: [ RegisterPageComponent ]
-    })
-    .compileComponents();
-  });
-
-  beforeEach(() => {
-    fixture = TestBed.createComponent(RegisterPageComponent);
-    component = fixture.componentInstance;
-    fixture.detectChanges();
-  });
-
-  it('should create', () => {
-    expect(component).toBeTruthy();
-  });
-});
diff --git a/frontend/src/app/_pages/register-page/register-page.component.ts b/frontend/src/app/_pages/register-page/register-page.component.ts
deleted file mode 100644
index 3add63a4..00000000
--- a/frontend/src/app/_pages/register-page/register-page.component.ts
+++ /dev/null
@@ -1,14 +0,0 @@
-import { Component, OnInit } from '@angular/core';
-import { Router } from '@angular/router';
-import { AuthService } from 'src/app/_services/auth.service';
-
-@Component({
-  selector: 'app-register-page',
-  templateUrl: './register-page.component.html',
-  styleUrls: ['./register-page.component.css']
-})
-export class RegisterPageComponent implements OnInit {
-
-  ngOnInit(): void {
-  }
-}
diff --git a/frontend/src/app/_pages/settings/settings.component.css b/frontend/src/app/_pages/settings/settings.component.css
new file mode 100644
index 00000000..e69de29b
diff --git a/frontend/src/app/_pages/settings/settings.component.html b/frontend/src/app/_pages/settings/settings.component.html
new file mode 100644
index 00000000..4ab2a415
--- /dev/null
+++ b/frontend/src/app/_pages/settings/settings.component.html
@@ -0,0 +1 @@
+<p>settings works!</p>
diff --git a/frontend/src/app/_pages/settings/settings.component.spec.ts b/frontend/src/app/_pages/settings/settings.component.spec.ts
new file mode 100644
index 00000000..a3a508b0
--- /dev/null
+++ b/frontend/src/app/_pages/settings/settings.component.spec.ts
@@ -0,0 +1,25 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { SettingsComponent } from './settings.component';
+
+describe('SettingsComponent', () => {
+  let component: SettingsComponent;
+  let fixture: ComponentFixture<SettingsComponent>;
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      declarations: [ SettingsComponent ]
+    })
+    .compileComponents();
+  });
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(SettingsComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});
diff --git a/frontend/src/app/_pages/settings/settings.component.ts b/frontend/src/app/_pages/settings/settings.component.ts
new file mode 100644
index 00000000..19862fb0
--- /dev/null
+++ b/frontend/src/app/_pages/settings/settings.component.ts
@@ -0,0 +1,15 @@
+import { Component, OnInit } from '@angular/core';
+
+@Component({
+  selector: 'app-settings',
+  templateUrl: './settings.component.html',
+  styleUrls: ['./settings.component.css']
+})
+export class SettingsComponent implements OnInit {
+
+  constructor() { }
+
+  ngOnInit(): void {
+  }
+
+}
diff --git a/frontend/src/app/_services/auth.service.ts b/frontend/src/app/_services/auth.service.ts
index e6611880..afc1567b 100644
--- a/frontend/src/app/_services/auth.service.ts
+++ b/frontend/src/app/_services/auth.service.ts
@@ -41,7 +41,6 @@ export class AuthService {
     if (!exp) {
       exp = new Date();
     }
-    console.log(exp, exp?.getTime());
     this.refresher = setTimeout(() => {
       console.log('refreshing token!');
       this.http.post(`${API_SETTINGS.apiURL}/auth/renewJwt`, {}, { headers: this.authHeader(), responseType: 'text' }).subscribe((response) => {
@@ -51,8 +50,11 @@ export class AuthService {
   }
 
   authenticate(token: string) {
-    const user = jwtHelper.decodeToken(token);
-    this.cookie.set('token', token, user.exp);
+    let exp = jwtHelper.getTokenExpirationDate(token);
+    if (!exp) {
+      exp = new Date();
+    }
+    this.cookie.set('token', token, exp);
     this.updateUser();
   }
 
diff --git a/frontend/src/app/app-routing.module.ts b/frontend/src/app/app-routing.module.ts
index 9ce08a8f..a42257df 100644
--- a/frontend/src/app/app-routing.module.ts
+++ b/frontend/src/app/app-routing.module.ts
@@ -2,22 +2,26 @@ import { NgModule } from '@angular/core';
 import { RouterModule, Routes } from '@angular/router';
 
 import { AuthGuardService } from './_services/auth-guard.service';
-import { LoginPageComponent } from './_pages/login-page/login-page.component';
-import { OnlyAuthorizedComponent } from './_pages/only-authorized/only-authorized.component';
-import { RegisterPageComponent } from './_pages/register-page/register-page.component';
 import { AddModelComponent } from './_pages/add-model/add-model.component';
-import { LoginModalComponent } from './_modals/login-modal/login-modal.component';
 import { HomeComponent } from './_pages/home/home.component';
-import { RegisterModalComponent } from './_modals/register-modal/register-modal.component';
+import { MyDatasetsComponent } from './_pages/my-datasets/my-datasets.component';
+import { MyModelsComponent } from './_pages/my-models/my-models.component';
+import { MyPredictorsComponent } from './_pages/my-predictors/my-predictors.component';
+import { BrowsePredictorsComponent } from './_pages/browse-predictors/browse-predictors.component';
+import { BrowseDatasetsComponent } from './_pages/browse-datasets/browse-datasets.component';
+import { SettingsComponent } from './_pages/settings/settings.component';
+import { ProfileComponent } from './_pages/profile/profile.component';
 
 const routes: Routes = [
   { path: '', component: HomeComponent },
-  { path: 'login', component: LoginPageComponent },
-  { path: 'register', component: RegisterPageComponent },
-  { path: 'only-authorized', component: OnlyAuthorizedComponent, canActivate: [AuthGuardService] },
   { path: 'add-model', component: AddModelComponent },
-  { path: 'login-modal-test', component: LoginModalComponent },
-  { path: 'register-modal-test', component: RegisterModalComponent }
+  { path: 'my-datasets', component: MyDatasetsComponent, canActivate: [AuthGuardService] },
+  { path: 'my-models', component: MyModelsComponent, canActivate: [AuthGuardService] },
+  { path: 'my-predictors', component: MyPredictorsComponent, canActivate: [AuthGuardService] },
+  { path: 'settings', component: SettingsComponent, canActivate: [AuthGuardService] },
+  { path: 'profile', component: ProfileComponent, canActivate: [AuthGuardService] },
+  { path: 'browse-datasets', component: BrowseDatasetsComponent },
+  { path: 'browse-predictors', component: BrowsePredictorsComponent }
 ];
 
 @NgModule({
diff --git a/frontend/src/app/app.module.ts b/frontend/src/app/app.module.ts
index c0f6130e..5aa405fb 100644
--- a/frontend/src/app/app.module.ts
+++ b/frontend/src/app/app.module.ts
@@ -7,9 +7,7 @@ import { MatSliderModule } from '@angular/material/slider';
 import { MatIconModule } from '@angular/material/icon';
 
 import { AppComponent } from './app.component';
-import { RegisterPageComponent } from './_pages/register-page/register-page.component';
 import { NgbModule } from '@ng-bootstrap/ng-bootstrap';
-import { OnlyAuthorizedComponent } from './_pages/only-authorized/only-authorized.component';
 import { DatasetLoadComponent } from './_elements/dataset-load/dataset-load.component';
 import { AddModelComponent } from './_pages/add-model/add-model.component';
 import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
@@ -23,12 +21,18 @@ import { NavbarComponent } from './_elements/navbar/navbar.component';
 import { ItemPredictorComponent } from './_elements/item-predictor/item-predictor.component';
 import { ItemDatasetComponent } from './_elements/item-dataset/item-dataset.component';
 import { CarouselComponent } from './_elements/carousel/carousel.component';
+import { SettingsComponent } from './_pages/settings/settings.component';
+import { ProfileComponent } from './_pages/profile/profile.component';
+import { MyPredictorsComponent } from './_pages/my-predictors/my-predictors.component';
+import { MyDatasetsComponent } from './_pages/my-datasets/my-datasets.component';
+import { MyModelsComponent } from './_pages/my-models/my-models.component';
+import { BrowseDatasetsComponent } from './_pages/browse-datasets/browse-datasets.component';
+import { BrowsePredictorsComponent } from './_pages/browse-predictors/browse-predictors.component';
+import { PredictComponent } from './_pages/predict/predict.component';
 
 @NgModule({
   declarations: [
     AppComponent,
-    RegisterPageComponent,
-    OnlyAuthorizedComponent,
     DatasetLoadComponent,
     AddModelComponent,
     LoginModalComponent,
@@ -37,7 +41,15 @@ import { CarouselComponent } from './_elements/carousel/carousel.component';
     NavbarComponent,
     ItemPredictorComponent,
     ItemDatasetComponent,
-    CarouselComponent
+    CarouselComponent,
+    SettingsComponent,
+    ProfileComponent,
+    MyPredictorsComponent,
+    MyDatasetsComponent,
+    MyModelsComponent,
+    BrowseDatasetsComponent,
+    BrowsePredictorsComponent,
+    PredictComponent
   ],
   imports: [
     BrowserModule,
-- 
cgit v1.2.3