diff --git a/client/src/app/+video-studio/edit/video-studio-edit.component.html b/client/src/app/+video-studio/edit/video-studio-edit.component.html
index a9f34811f..acfc1a452 100644
--- a/client/src/app/+video-studio/edit/video-studio-edit.component.html
+++ b/client/src/app/+video-studio/edit/video-studio-edit.component.html
@@ -28,8 +28,8 @@
![]()
diff --git a/client/src/app/shared/shared-forms/preview-upload.component.ts b/client/src/app/shared/shared-forms/preview-upload.component.ts
index a857b0a4f..46920dd27 100644
--- a/client/src/app/shared/shared-forms/preview-upload.component.ts
+++ b/client/src/app/shared/shared-forms/preview-upload.component.ts
@@ -50,6 +50,10 @@ export class PreviewUploadComponent implements OnInit, ControlValueAccessor {
return this.bytesPipe.transform(this.maxVideoImageSize)
}
+ getReactiveFileButtonTooltip () {
+ return $localize`(extensions: ${this.videoImageExtensions}, ${this.maxSizeText}: ${this.maxVideoImageSizeInBytes})`
+ }
+
ngOnInit () {
this.serverConfig = this.serverService.getHTMLConfig()
diff --git a/client/src/app/shared/shared-forms/reactive-file.component.html b/client/src/app/shared/shared-forms/reactive-file.component.html
index f6bf5f9ae..d18a99d46 100644
--- a/client/src/app/shared/shared-forms/reactive-file.component.html
+++ b/client/src/app/shared/shared-forms/reactive-file.component.html
@@ -1,5 +1,5 @@
-
diff --git a/client/src/app/shared/shared-forms/reactive-file.component.scss b/client/src/app/shared/shared-forms/reactive-file.component.scss
index f8db1aa25..7643f29af 100644
--- a/client/src/app/shared/shared-forms/reactive-file.component.scss
+++ b/client/src/app/shared/shared-forms/reactive-file.component.scss
@@ -20,4 +20,15 @@
font-weight: $font-semibold;
}
+
+ .reset-button {
+ @include peertube-button;
+ @include grey-button;
+
+ font-size: 80%;
+ margin-left: 5px;
+ line-height: initial;
+ padding: 2px 5px;
+ height: auto;
+ }
}
diff --git a/client/src/app/shared/shared-forms/reactive-file.component.ts b/client/src/app/shared/shared-forms/reactive-file.component.ts
index 9d27ad07a..50b7d4c3e 100644
--- a/client/src/app/shared/shared-forms/reactive-file.component.ts
+++ b/client/src/app/shared/shared-forms/reactive-file.component.ts
@@ -20,8 +20,12 @@ export class ReactiveFileComponent implements OnInit, ControlValueAccessor {
@Input() inputName: string
@Input() extensions: string[] = []
@Input() maxFileSize: number
+
@Input() displayFilename = false
+ @Input() displayReset = false
+
@Input() icon: GlobalIconName
+ @Input() buttonTooltip: string
@Output() fileChanged = new EventEmitter
()
@@ -62,8 +66,14 @@ export class ReactiveFileComponent implements OnInit, ControlValueAccessor {
this.file = file
this.propagateChange(this.file)
- this.fileChanged.emit(this.file)
}
+ this.fileChanged.emit(this.file)
+ }
+
+ reset () {
+ this.writeValue(undefined)
+ this.propagateChange(undefined)
+ this.fileChanged.emit(undefined)
}
propagateChange = (_: any) => { /* empty */ }