Adds the new shows admin screen and drives schedule from it

src/app/admin/admin-show-form.component.ts

@@ -5,6 +5,8 @@ import { firstValueFrom } from 'rxjs';
 
 import { Show } from '../interfaces/show';
 import { ShowService, ShowScheduleCreate, ShowCreatePayload, ShowUpdatePayload } from '../services/show.service';
+import { UploadService } from '../services/upload.service';
+import { getAppConfig } from '../services/app-config.service';
 
 @Component({
   selector: 'app-admin-show-form',
@@ -15,6 +17,7 @@ import { ShowService, ShowScheduleCreate, ShowCreatePayload, ShowUpdatePayload }
 })
 export class AdminShowFormComponent implements OnChanges {
   private showService = inject(ShowService);
+  private uploadService = inject(UploadService);
 
   @Input() editItem: Show | null = null;
   @Output() saved = new EventEmitter<void>();
@@ -43,7 +46,9 @@ export class AdminShowFormComponent implements OnChanges {
   ];
 
   loading = false;
+  uploading = false;
   error = '';
+  success = '';
   submitted = false;
 
   ngOnChanges(changes: SimpleChanges): void {
@@ -85,6 +90,7 @@ export class AdminShowFormComponent implements OnChanges {
     this.display_order = 0;
     this.schedules = [{ day_of_week: 1, time: '' }];
     this.error = '';
+    this.success = '';
     this.submitted = false;
   }
 
@@ -103,6 +109,42 @@ export class AdminShowFormComponent implements OnChanges {
     this.schedules.splice(index, 1);
   }
 
+  /** Handle image file upload and set the URL field. */
+  async onImageUpload(event: Event, field: string): Promise<void> {
+    const input = event.target as HTMLInputElement;
+    if (!input?.files?.length) return;
+
+    const file = input.files[0];
+    if (!file.type.startsWith('image/')) {
+      this.error = 'Only image files are allowed.';
+      return;
+    }
+    if (file.size > 5 * 1024 * 1024) {
+      this.error = 'File size exceeds 5 MB limit.';
+      return;
+    }
+
+    this.uploading = true;
+    this.error = '';
+
+    try {
+      const url = await this.uploadService.uploadImage(file);
+      (this as any)[field] = url;
+      this.success = 'Image uploaded successfully.';
+    } catch (err: any) {
+      this.error = this.formatError(err);
+    } finally {
+      this.uploading = false;
+    }
+  }
+
+  /** Resolve a relative uploads/… path to an absolute URL for preview. */
+  getPreviewUrl(url: string): string {
+    if (!url) return '';
+    if (url.startsWith('http://') || url.startsWith('https://')) return url;
+    return `${getAppConfig().apiBaseUrl}/${url}`;
+  }
+
   async onSubmit(): Promise<void> {
     this.submitted = true;
 
@@ -150,4 +192,4 @@ export class AdminShowFormComponent implements OnChanges {
       this.loading = false;
     }
   }
-}
+}