From 72d8ae7edd46a4d967c5df3e280b2cd527793a39 Mon Sep 17 00:00:00 2001
From: Chocobozzz <me@florianbigard.com>
Date: Thu, 30 May 2024 10:37:01 +0200
Subject: [PATCH] Highlights responsive embed checkbox

---
 .../video-share.component.html                | 22 ++++++++++---------
 .../video-share.component.ts                  |  2 +-
 2 files changed, 13 insertions(+), 11 deletions(-)

diff --git a/client/src/app/shared/shared-share-modal/video-share.component.html b/client/src/app/shared/shared-share-modal/video-share.component.html
index 6904c0584..2f9f0d462 100644
--- a/client/src/app/shared/shared-share-modal/video-share.component.html
+++ b/client/src/app/shared/shared-share-modal/video-share.component.html
@@ -11,7 +11,7 @@
   <div class="modal-body">
 
     <div class="playlist" *ngIf="playlist">
-      <h5 i18n *ngIf="video">Share the playlist</h5>
+      <h5 *ngIf="playlist" i18n class="text-center">Share the playlist</h5>
 
       <div *ngIf="isPrivatePlaylist()" class="alert-private alert alert-warning">
         <div i18n>This playlist is private so you won't be able to share it with external users</div>
@@ -97,7 +97,7 @@
 
 
     <div class="video" *ngIf="video">
-      <h5 *ngIf="playlist" i18n>Share the video</h5>
+      <h5 *ngIf="playlist" i18n class="text-center">Share the video</h5>
 
       <div *ngIf="isPrivateVideo()" class="alert-private alert alert-warning">
         <div i18n>This video is private so you won't be able to share it with external users</div>
@@ -185,13 +185,22 @@
           </div>
         </div>
 
-        <div class="form-group" *ngIf="isInVideoEmbedTab()">
+        @if (isInVideoEmbedTab()) {
+        <div class="form-group">
           <my-peertube-checkbox
             inputName="onlyEmbedUrl" [(ngModel)]="customizations.onlyEmbedUrl"
             i18n-labelText labelText="Only display embed URL"
           ></my-peertube-checkbox>
         </div>
 
+          <div class="form-group">
+            <my-peertube-checkbox
+              inputName="responsive" [(ngModel)]="customizations.responsive"
+              i18n-labelText labelText="Responsive embed"
+            ></my-peertube-checkbox>
+          </div>
+        }
+
         <my-plugin-placeholder pluginId="share-modal-video-settings"></my-plugin-placeholder>
 
         <div class="advanced-filters" [ngbCollapse]="isAdvancedCustomizationCollapsed" [animation]="true">
@@ -239,13 +248,6 @@
           </div>
 
           <ng-container *ngIf="isInVideoEmbedTab()">
-            <div class="form-group">
-              <my-peertube-checkbox
-                inputName="responsive" [(ngModel)]="customizations.responsive"
-                i18n-labelText labelText="Responsive embed"
-              ></my-peertube-checkbox>
-            </div>
-
             <div class="form-group">
               <my-peertube-checkbox
                 inputName="title" [(ngModel)]="customizations.title"
diff --git a/client/src/app/shared/shared-share-modal/video-share.component.ts b/client/src/app/shared/shared-share-modal/video-share.component.ts
index 15395446f..170abf286 100644
--- a/client/src/app/shared/shared-share-modal/video-share.component.ts
+++ b/client/src/app/shared/shared-share-modal/video-share.component.ts
@@ -236,7 +236,7 @@ export class VideoShareComponent {
         embedUrl: await this.getPlaylistEmbedUrl(),
         embedTitle: this.playlist.displayName,
         responsive,
-        aspectRatio: this.video.aspectRatio
+        aspectRatio: this.video?.aspectRatio
       },
       'video-watch',
       'filter:share.video-playlist-embed-code.build.params',