Feature/issue 156/allow download folder rename (#158)

* fixes #156

vripper-web-ui/src/app/rename-dialog/rename-dialog.component.html

@@ -0,0 +1,13 @@
+<h2 mat-dialog-title>Confirmation</h2>
+<mat-dialog-content class='mat-typography' style='min-width: 30vw'>
+  <form>
+    <mat-form-field appearance='outline' style='width: 100%; padding-top: 20px'>
+      <mat-label>Folder name</mat-label>
+      <input [formControl]='formControl' matInput name='folderName' required />
+    </mat-form-field>
+  </form>
+  <mat-dialog-actions align='end'>
+    <button mat-flat-button mat-dialog-close cdkFocusInitial>Cancel</button>
+    <button mat-flat-button color='primary' (click)='confirm()'>Ok</button>
+  </mat-dialog-actions>
+</mat-dialog-content>

vripper-web-ui/src/app/rename-dialog/rename-dialog.component.spec.ts

@@ -0,0 +1,21 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { RenameDialogComponent } from './rename-dialog.component';
+
+describe('ConfirmComponent', () => {
+  let component: RenameDialogComponent;
+  let fixture: ComponentFixture<RenameDialogComponent>;
+
+  beforeEach(() => {
+    TestBed.configureTestingModule({
+      imports: [RenameDialogComponent],
+    });
+    fixture = TestBed.createComponent(RenameDialogComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

vripper-web-ui/src/app/rename-dialog/rename-dialog.component.ts

@@ -0,0 +1,53 @@
+import { ChangeDetectionStrategy, Component, Inject } from '@angular/core';
+import { CommonModule } from '@angular/common';
+import {
+  MAT_DIALOG_DATA,
+  MatDialogModule,
+  MatDialogRef,
+} from '@angular/material/dialog';
+import { MatButtonModule } from '@angular/material/button';
+import { FormControl, FormsModule, ReactiveFormsModule } from '@angular/forms';
+import { MatFormFieldModule } from '@angular/material/form-field';
+import { MatInputModule } from '@angular/material/input';
+
+export interface RenameDialogData {
+  postId: number;
+  name: string;
+}
+
+export interface RenameDialogResult {
+  postId: number;
+  name: string;
+}
+
+@Component({
+  selector: 'app-rename-dialog',
+  standalone: true,
+  imports: [
+    CommonModule,
+    MatDialogModule,
+    MatButtonModule,
+    FormsModule,
+    MatFormFieldModule,
+    MatInputModule,
+    ReactiveFormsModule,
+  ],
+  templateUrl: './rename-dialog.component.html',
+  styleUrls: ['./rename-dialog.component.scss'],
+  changeDetection: ChangeDetectionStrategy.OnPush,
+})
+export class RenameDialogComponent {
+  formControl = new FormControl(this.data.name);
+
+  constructor(
+    public dialogRef: MatDialogRef<RenameDialogComponent>,
+    @Inject(MAT_DIALOG_DATA) public data: RenameDialogData
+  ) {}
+
+  confirm() {
+    this.dialogRef.close({
+      postId: this.data.postId,
+      name: this.formControl.value,
+    } as RenameDialogResult);
+  }
+}