Minor bugfixes

src-angular/app/components/browse/chart-sidebar/chart-sidebar-menu/chart-sidebar-menu.component.html

@@ -40,7 +40,17 @@
 								}
 							</div>
 							<div class="form-control">
-								<textarea class="textarea textarea-bordered h-24" placeholder="More details (optional)" [formControl]="reportExtraInfo"></textarea>
+								<div class="label">
+									<span class="label-text">More details <span class="text-error">*</span></span>
+								</div>
+								<textarea
+									required
+									class="textarea textarea-bordered h-24"
+									[class.border-error]="reportExtraInfo.invalid && reportExtraInfo.touched"
+									placeholder="Please be specific. Vague reports may be ignored if the problem is not obvious."
+									[formControl]="reportExtraInfo">
+								</textarea>
+								<span *ngIf="reportExtraInfo.invalid && reportExtraInfo.touched" class="text-error">Please provide more details.</span>
 							</div>
 							<div class="form-control flex-row justify-end">
 								<button class="btn btn-primary" (click)="report()">Submit</button>
@@ -65,11 +75,19 @@
 							<th></th>
 						}
 						<th class="text-neutral-content">Uploaded</th>
-						<th class="text-neutral-content">
-							<span class="label-text cursor-help underline decoration-dotted" title="The MD5 hash of the chart folder or .sng file.">Hash</span>
+						<th>
+							<span
+								class="label-text cursor-help underline decoration-dotted text-neutral-content"
+								title="The MD5 hash of the chart folder or .sng file.">
+								Hash
+							</span>
 						</th>
-						<th class="text-neutral-content">
-							<span class="label-text cursor-help underline decoration-dotted" title="The MD5 hash of just the .chart or .mid file.">Chart Hash</span>
+						<th>
+							<span
+								class="label-text cursor-help underline decoration-dotted text-neutral-content"
+								title="The MD5 hash of just the .chart or .mid file.">
+								Chart Hash
+							</span>
 						</th>
 						<th class="text-neutral-content">Google Drive Location</th>
 					</tr>

src-angular/app/components/browse/chart-sidebar/chart-sidebar-menu/chart-sidebar-menu.component.ts

@@ -1,6 +1,6 @@
 import { HttpClient } from '@angular/common/http'
 import { Component, EventEmitter, Input, OnInit, Output } from '@angular/core'
-import { FormControl } from '@angular/forms'
+import { FormControl, Validators } from '@angular/forms'
 
 import { sortBy } from 'lodash'
 import { environment } from 'src-angular/environments/environment'
@@ -33,7 +33,7 @@ export class ChartSidebarMenutComponent implements OnInit {
 		this.selectedVersion.valueChanges.subscribe(v => this.selectedVersionChanges.emit(v))
 
 		this.reportOption = new FormControl<string>(this.reportOptions[0], { nonNullable: true })
-		this.reportExtraInfo = new FormControl<string>('', { nonNullable: true })
+		this.reportExtraInfo = new FormControl<string>('', { nonNullable: true, validators: [Validators.required] })
 	}
 
 	get displayVersions() {
@@ -78,13 +78,17 @@ export class ChartSidebarMenutComponent implements OnInit {
 	}
 
 	report() {
-		this.http.post(`${environment.apiUrl}/report`, {
-			chartId: this.selectedVersion.value.chartId,
-			reason: this.reportOption.value,
-			extraInfo: this.reportExtraInfo.value,
-		}).subscribe((response: { message: string }) => {
-			this.reportMessage = response.message
-			this.reportSent = true
-		})
+		if (this.reportExtraInfo.valid) {
+			this.http.post(`${environment.apiUrl}/report`, {
+				chartId: this.selectedVersion.value.chartId,
+				reason: this.reportOption.value,
+				extraInfo: this.reportExtraInfo.value,
+			}).subscribe((response: { message: string }) => {
+				this.reportMessage = response.message
+				this.reportSent = true
+			})
+		} else {
+			this.reportExtraInfo.markAsTouched()
+		}
 	}
 }

src-angular/app/components/browse/search-bar/search-bar.component.ts

@@ -87,22 +87,6 @@ export class SearchBarComponent implements OnInit, AfterViewInit {
 		}
 	}
 
-	get logoType() {
-		switch (localStorage.getItem('theme')) {
-			case 'emerald': return 'emerald'
-			case 'halloween': return 'halloween'
-			case 'lemonade': return 'lemonade'
-			case 'night': return 'night'
-			case 'synthwave': return 'synthwave'
-			case 'aqua': return 'orange'
-			case 'valentine': return 'valentine'
-			case 'winter': return 'winter'
-			case 'aren': return 'aren'
-			case 'froogs': return 'froogs'
-			default: return 'default'
-		}
-	}
-
 	get todayDate() {
 		return dayjs().format('YYYY-MM-DD')
 	}