feat: fix images

Angular2Guy · May 14, 2024 · 1f396f2 · 1f396f2
1 parent e4bb891
commit 1f396f2
Show file tree

Hide file tree

Showing 3 changed files with 9 additions and 1 deletion.
diff --git a/frontend/src/angular/src/app/image-query/image-query.component.html b/frontend/src/angular/src/app/image-query/image-query.component.html
@@ -89,12 +89,14 @@
     		<input matInput placeholder="query" [formControl]="queryControl">
   		</mat-form-field>
   		<button mat-flat-button color="primary" (click)="query()" [disabled]="queryControl.invalid || this.queryControl.untouched" i18n="@@query">Upload</button>
+  		<div class="images">
   		@for(myresult of results; track myresult.answer) {
   			<div class="horizontal-container">
   				<div><img [src]="myresult.b64Image"></div>
   				<div>{{myresult.answer}}</div>
   			</div>
   		}
+  		</div>
   	</div>
   }
 </div>
diff --git a/frontend/src/angular/src/app/image-query/image-query.component.scss b/frontend/src/angular/src/app/image-query/image-query.component.scss
@@ -56,3 +56,9 @@
 .horizontal-container {
 	display: flex;
 }
+
+.images {
+	margin-top: 20px;
+	overflow-y: scroll;
+	height: calc(100vh - (36px + 21px + 64px));
+}
diff --git a/frontend/src/angular/src/app/image-query/image-query.component.ts b/frontend/src/angular/src/app/image-query/image-query.component.ts
@@ -75,7 +75,7 @@ export class ImageQueryComponent {
 	const formData = new FormData();
 	formData.append('query', this.queryControl.value as unknown as string);
 	formData.append('type', '');
-	this.imageService.postQueryForm(formData).subscribe(result => this.results = result);
+	this.imageService.postQueryForm(formData).subscribe(myResults => this.results = myResults.map(myResult => myResult = this.createImageUrl(myResult)));
   }
 
   protected upload(): void {