Add ability to reset originallyPublishedAt

client/src/app/+search/search-filters.component.html

@@ -226,7 +226,7 @@
   </div>
 
   <div class="submit-button">
-    <button i18n class="reset-button" (click)="reset()" *ngIf="advancedSearch.size()">
+    <button i18n class="reset-button me-3" (click)="reset()" *ngIf="advancedSearch.size()">
       Reset
     </button>
 

client/src/app/+search/search-filters.component.scss

@@ -34,27 +34,3 @@ input[type=submit] {
 .submit-button {
   text-align: end;
 }
-
-.reset-button {
-  @include peertube-button;
-  @include margin-right(1rem);
-
-  font-weight: $font-semibold;
-  display: inline-block;
-  padding: 0 10px;
-  white-space: nowrap;
-  background: transparent;
-}
-
-.reset-button-small {
-  font-size: 80%;
-  height: unset;
-  line-height: unset;
-  margin: unset;
-  margin-bottom: 0.5rem;
-}
-
-.label-container {
-  display: flex;
-  white-space: nowrap;
-}

client/src/app/+videos/+video-edit/shared/video-edit.component.html

@@ -365,14 +365,18 @@
             </div>
 
             <div class="form-group originally-published-at">
+              <div class="label-container">
                 <label i18n for="originallyPublishedAt">Original publication date</label>
-              <my-help>
+
-                <ng-template ptTemplate="preHtml">
+                <button i18n class="reset-button reset-button-small" (click)="resetField('originallyPublishedAt')" *ngIf="hasPublicationDate()">
-                  <ng-container i18n>
+                  Reset
+                </button>
+              </div>
+
+              <div class="form-group-description" i18n>
                 This is the date when the content was originally published (e.g. the release date for a film)
-                  </ng-container>
+              </div>
-                </ng-template>
+
-              </my-help>
               <p-calendar
                 id="originallyPublishedAt" formControlName="originallyPublishedAt" [dateFormat]="calendarDateFormat" [firstDayOfWeek]="0"
                 [showTime]="true" [hideOnDateTimeSelect]="true" [monthNavigator]="true" [yearNavigator]="true" [yearRange]="myYearRange"

client/src/app/+videos/+video-edit/shared/video-edit.component.ts

@@ -264,6 +264,8 @@ export class VideoEditComponent implements OnInit, OnDestroy {
     if (this.schedulerInterval) clearInterval(this.schedulerInterval)
   }
 
+  // ---------------------------------------------------------------------------
+
   getExistingCaptions () {
     return this.videoCaptions
                .filter(c => c.action !== 'REMOVE')
@@ -312,6 +314,8 @@ export class VideoEditComponent implements OnInit, OnDestroy {
     modalRef.componentInstance.captionEdited.subscribe(this.onCaptionEdited.bind(this))
   }
 
+  // ---------------------------------------------------------------------------
+
   isSaveReplayAllowed () {
     return this.serverConfig.live.allowReplay
   }
@@ -328,6 +332,18 @@ export class VideoEditComponent implements OnInit, OnDestroy {
     return this.serverConfig.live.latencySetting.enabled
   }
 
+  hasPublicationDate () {
+    return !!this.form.value['originallyPublishedAt']
+  }
+
+  // ---------------------------------------------------------------------------
+
+  resetField (name: string) {
+    this.form.patchValue({ [name]: null })
+  }
+
+  // ---------------------------------------------------------------------------
+
   isPluginFieldHidden (pluginField: PluginField) {
     if (typeof pluginField.commonOptions.hidden !== 'function') return false
 

client/src/app/shared/shared-forms/reactive-file.component.html

@@ -13,7 +13,7 @@
 
   <div class="filename" *ngIf="displayFilename === true && filename">{{ filename }}</div>
 
-  <button *ngIf="displayReset && filename" i18n class="reset-button" (click)="reset()">
+  <button *ngIf="displayReset && filename" i18n class="reset-button reset-button-small ms-2" (click)="reset()">
     Reset
   </button>
 </div>

client/src/app/shared/shared-forms/reactive-file.component.scss

@@ -19,15 +19,4 @@
 
     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;
-  }
 }

client/src/sass/class-helpers/_forms.scss

@@ -49,7 +49,32 @@
   margin-top: 10px;
 }
 
-label+.form-group-description {
+// Useful with a "reset" button
+.label-container {
+  display: flex;
+  white-space: nowrap;
+  align-items: baseline;
+}
+
+label + .form-group-description,
+.label-container + .form-group-description {
   margin-bottom: 10px;
   margin-top: 0;
 }
+
+.reset-button {
+  @include peertube-button;
+  @include grey-button;
+
+  height: auto;
+
+  &.reset-button-small {
+    font-size: 80%;
+    padding: 2px 5px;
+    margin: 0 0.25rem;
+    height: fit-content;
+    line-height: initial;
+  }
+}
+
+

server/server/controllers/api/videos/update.ts

@@ -86,8 +86,10 @@ async function updateVideo (req: express.Request, res: express.Response) {
         if (videoInfoToUpdate[key] !== undefined) video.set(key, videoInfoToUpdate[key])
       }
 
-      if (videoInfoToUpdate.originallyPublishedAt !== undefined && videoInfoToUpdate.originallyPublishedAt !== null) {
+      if (videoInfoToUpdate.originallyPublishedAt !== undefined) {
-        video.originallyPublishedAt = new Date(videoInfoToUpdate.originallyPublishedAt)
+        video.originallyPublishedAt = videoInfoToUpdate.originallyPublishedAt
+          ? new Date(videoInfoToUpdate.originallyPublishedAt)
+          : null
       }
 
       // Privacy update?