Add file upload functionality with dialog components and update image handling

jambotron-ui/src/app/modules/user-module/dialog-select-image.component/dialog-select-image.component.html

@@ -1,5 +1,5 @@
 <h1 mat-dialog-title>Hi </h1>
-<div mat-dialog-content >
+<!--<div mat-dialog-content >-->
   <mat-dialog-content class="mat-typography">
 <!--  <mat-nav-list>-->
     @for (fileInfo of fileInfos; track fileInfo){
@@ -16,7 +16,7 @@
 
 <!--  </mat-nav-list>-->
   </mat-dialog-content>
-</div>
+<!--</div>-->
 <div mat-dialog-actions>
   <button mat-button (click)="upload()">Upload</button>
   <span class="menu-spacer"></span>

jambotron-ui/src/app/modules/user-module/dialog-select-image.component/dialog-select-image.component.scss

@@ -2,20 +2,30 @@
   flex: 1 1 auto;
 }
 
-.mat-dialog-content{
+.mat-mdc-list-item{
+
+}
+a.mdc-list-item
+{
+  cursor: grab;
+  height: 120px;
+  padding-bottom: 66px;
+  background-color: rgba(24,255,255,0.04);
+}
+/*.mat-dialog-content{
   min-height: 300px;
   min-width: 300px;
 
   height: 75%;
   width: 75%;
-}
-.mdc-dialog--open .mat-mdc-dialog-inner-container
+}*/
+/*.mdc-dialog--open .mat-mdc-dialog-inner-container
 {
   opacity: 1;
   width: 600px;
-}
+}*/
 
-.mat-mdc-dialog-container {
+/*.mat-mdc-dialog-container {
   width: 600px;
   height: 500px;
   display: block;
@@ -25,4 +35,9 @@
   min-width: inherit;
   max-width: inherit;
   outline: 0;
+}*/
+/*
+.mat-mdc-dialog-content{
+  overflow: auto;
 }
+*/

jambotron-ui/src/app/modules/user-module/dialog-select-image.component/dialog-select-image.component.ts

@@ -7,8 +7,7 @@ import {
   MatDialogTitle
 } from '@angular/material/dialog';
 import {MatButton} from '@angular/material/button';
-import {MatListItem, MatNavList} from '@angular/material/list';
-import {RouterLink} from '@angular/router';
+import {MatListItem} from '@angular/material/list';
 import {FileInfo} from '../../../models/file-info';
 import {UserApiService} from '../user-api.service';
 
@@ -20,10 +19,7 @@ import {UserApiService} from '../user-api.service';
     MatButton,
     MatDialogActions,
     MatDialogClose,
-
-    MatListItem,
-    MatNavList,
-
+    MatListItem
   ],
   templateUrl: './dialog-select-image.component.html',
   styleUrl: './dialog-select-image.component.scss'
@@ -42,10 +38,10 @@ export class DialogSelectImageComponent {
       console.log(data);
     });
   }
+
+  //open upload dialog
   upload() {
-
     this.uploadClicked.emit();
-
   }
 
   onNoClick() {
@@ -54,5 +50,6 @@ export class DialogSelectImageComponent {
 
   select(fileInfo:FileInfo) {
     this.selectClicked.emit(fileInfo);
+    this.dialogRef.close();
   }
 }