Create navbar and sidebar for view page

frontend/src/app/_services/send-data.service.ts

@@ -14,7 +14,7 @@ export class SendDataService {
     formData.append('file', file, file.name);
 
     return this.http.post<File>(
-      'http://127.0.0.1:8000/prototype/form',
+      'http://127.0.0.1:8000/prototype/form/',
       formData,
       requestOptions
     );

frontend/src/app/app.module.ts

@@ -2,10 +2,16 @@ import { BrowserModule } from '@angular/platform-browser';
 import { NgModule } from '@angular/core';
 import { HttpClientModule } from '@angular/common/http';
 import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
-import { NbThemeModule } from '@nebular/theme';
+
 import { AppRoutingModule } from './app-routing.module';
 import { AppComponent } from './app.component';
+
 import { NbEvaIconsModule } from '@nebular/eva-icons';
+import {
+  NbThemeModule,
+  NbSidebarModule,
+  NbSidebarService,
+} from '@nebular/theme';
 
 import { FrontPageModule } from './front-page/front-page.module';
 import { SharedDataService } from './_services/shared-data.service';
@@ -18,10 +24,11 @@ import { SharedDataService } from './_services/shared-data.service';
     AppRoutingModule,
     HttpClientModule,
     NbThemeModule.forRoot(),
+    NbSidebarModule.forRoot(),
     NbEvaIconsModule,
     FrontPageModule,
   ],
   bootstrap: [AppComponent],
-  providers: [SharedDataService],
+  providers: [SharedDataService, NbSidebarService],
 })
 export class AppModule {}

frontend/src/app/front-page/front-page.component.ts

@@ -37,7 +37,9 @@ export class FrontPageComponent {
   }
 
   sendFile(event: any): void {
-    this.sharedDataService.setData('Dupa');
+    this.sendDataService.postFile(this.file).subscribe((res: any) => {
+      this.sharedDataService.setData(res);
+    });
     this.router.navigate(['/view']);
   }
 }

frontend/src/app/main-view/main-view.component.html

@@ -1 +1,13 @@
-
+<nb-layout>
+  <nb-layout-header>
+    <div class="actions-container">
+      <nb-actions>
+        <nb-action icon="menu" (click)="toggleSidebar()"></nb-action>
+      </nb-actions>
+      <nb-actions>
+        <nb-action icon="power" title="Wyloguj">Wyloguj</nb-action>
+      </nb-actions>
+    </div>
+  </nb-layout-header>
+  <nb-sidebar tag="main"></nb-sidebar>
+</nb-layout>

frontend/src/app/main-view/main-view.component.scss

@@ -0,0 +1,6 @@
+.actions-container {
+  width: 100%;
+  display: flex;
+  flex-flow: row;
+  justify-content: space-between;
+}

frontend/src/app/main-view/main-view.component.ts

@@ -1,6 +1,9 @@
 import { Component, OnInit, OnDestroy } from '@angular/core';
 import { SharedDataService } from '../_services/shared-data.service';
 
+import { NbSidebarService } from '@nebular/theme';
+import { Subscription } from 'rxjs';
+
 @Component({
   selector: 'app-main-view',
   templateUrl: './main-view.component.html',
@@ -8,14 +11,24 @@ import { SharedDataService } from '../_services/shared-data.service';
 })
 export class MainViewComponent implements OnInit, OnDestroy {
   public data: any;
+  private dataSub: Subscription;
 
-  constructor(private sharedDataService: SharedDataService) {}
+  constructor(
+    private sharedDataService: SharedDataService,
+    private sidebarService: NbSidebarService
+  ) {}
 
   ngOnInit(): void {
-    this.sharedDataService.getData().subscribe((res) => {
+    this.dataSub = this.sharedDataService.getData().subscribe((res) => {
       this.data = res;
     });
   }
 
-  ngOnDestroy(): void {}
+  ngOnDestroy(): void {
+    this.dataSub.unsubscribe();
+  }
+
+  toggleSidebar() {
+    this.sidebarService.toggle(true, 'main');
+  }
 }

frontend/src/app/main-view/main-view.module.ts

@@ -1,10 +1,23 @@
 import { NgModule } from '@angular/core';
 import { CommonModule } from '@angular/common';
+
 import { MainViewComponent } from './main-view.component';
 import { MainViewRoutingModule } from './main-view-routing.module';
 
+import {
+  NbLayoutModule,
+  NbActionsModule,
+  NbSidebarModule,
+} from '@nebular/theme';
+
 @NgModule({
   declarations: [MainViewComponent],
-  imports: [CommonModule, MainViewRoutingModule],
+  imports: [
+    CommonModule,
+    MainViewRoutingModule,
+    NbLayoutModule,
+    NbActionsModule,
+    NbSidebarModule,
+  ],
 })
 export class MainViewModule {}