Added file upload UI

frontend/src/app/upload/upload.component.ts

@@ -1,12 +1,78 @@
-import { Component } from '@angular/core';
+import {Component, ElementRef, ViewChild} from '@angular/core';
+import {NgIf} from "@angular/common";
+import {FormatFileSizePipePipe} from "../format-file-size-pipe.pipe";
+import {FormsModule} from "@angular/forms";
 
 @Component({
   selector: 'app-upload',
   standalone: true,
-  imports: [],
+  imports: [
+    NgIf,
+    FormatFileSizePipePipe,
+    FormsModule
+  ],
   templateUrl: './upload.component.html',
   styleUrl: './upload.component.scss'
 })
 export class UploadComponent {
+  @ViewChild('fileInput') fileInput!: ElementRef;
 
+  fileToUpload: File | null = null;
+
+  shortStorage: boolean = false;
+  singleDownload: boolean = false;
+  passwordProtected: boolean = false;
+  password: string = '';
+
+  uploadStarted: boolean = false;
+  uploadProgress = 0;
+  uploadFinished = false;
+
+  /**
+   * Manages the file input click or drag and drop
+   */
+  onFileSelected(event: any): void {
+    const files = event.target.files;
+    if (files && files.length > 0) {
+      this.handleFiles(files);
+    }
+  }
+  onDragOver(event: DragEvent): void {
+    event.preventDefault();
+    event.stopPropagation();
+    // Optionally add visual feedback
+  }
+  onDrop(event: DragEvent): void {
+    event.preventDefault();
+    event.stopPropagation();
+    const files = event.dataTransfer?.files;
+    if (files && files.length > 0) {
+      this.handleFiles(files);
+    }
+    // Remove visual feedback
+  }
+  handleFiles(files: FileList): void {
+    for(let i = 0; i < files.length; i++) {
+      const file = files[i];
+      this.fileToUpload = file;
+    }
+  }
+
+  startUpload(): void {
+    if (this.fileToUpload) {
+      console.log(`Uploading file: ${this.fileToUpload.name}, Short storage: ${this.shortStorage}, Single download: ${this.singleDownload}, Password protected: ${this.passwordProtected}`);
+      this.uploadStarted = true;
+
+
+      const interval = setInterval(() => {
+        if (this.uploadProgress < 100) {
+          this.uploadProgress++;
+        } else {
+          clearInterval(interval); // Stop the interval when progress reaches 100%
+          this.uploadFinished = true;
+        }
+      }, 10);
+
+    }
+  }
 }