From 93d54cc769d88ecb2d7ead3ca293dac52653c13f Mon Sep 17 00:00:00 2001
From: Chocobozzz <me@florianbigard.com>
Date: Mon, 6 Jan 2020 15:13:37 +0100
Subject: [PATCH] Align search field with checkboxes in playlist add

---
 .../video-add-to-playlist.component.scss      | 21 ++++++-------------
 .../video-add-to-playlist.component.ts        |  5 ++---
 .../video-playlist/video-playlist.service.ts  |  2 +-
 3 files changed, 9 insertions(+), 19 deletions(-)

diff --git a/client/src/app/shared/video-playlist/video-add-to-playlist.component.scss b/client/src/app/shared/video-playlist/video-add-to-playlist.component.scss
index 5f9bb51a7..f1b6cd601 100644
--- a/client/src/app/shared/video-playlist/video-add-to-playlist.component.scss
+++ b/client/src/app/shared/video-playlist/video-add-to-playlist.component.scss
@@ -1,10 +1,14 @@
 @import '_variables';
 @import '_mixins';
 
+.header,
+.dropdown-item,
+.input-container {
+  padding: 6px 24px 10px 24px;
+}
+
 .header {
   min-width: 240px;
-  padding: 6px 24px 10px 24px;
-
   margin-bottom: 10px;
   border-bottom: 1px solid $separator-border-color;
 
@@ -44,24 +48,11 @@
   }
 }
 
-.dropdown-item {
-  padding: 6px 24px;
-}
-
 .playlists {
   max-height: 180px;
   overflow-y: auto;
 }
 
-.input-container {
-  display: flex;
-
-  input {
-    flex-grow: 1;
-    margin: 0 15px 10px 15px;
-  }
-}
-
 .playlist {
   display: flex;
   cursor: pointer;
diff --git a/client/src/app/shared/video-playlist/video-add-to-playlist.component.ts b/client/src/app/shared/video-playlist/video-add-to-playlist.component.ts
index e60a8381d..0c593a79a 100644
--- a/client/src/app/shared/video-playlist/video-add-to-playlist.component.ts
+++ b/client/src/app/shared/video-playlist/video-add-to-playlist.component.ts
@@ -1,5 +1,5 @@
 import { ChangeDetectionStrategy, ChangeDetectorRef, Component, Input, OnChanges, OnDestroy, OnInit, SimpleChanges } from '@angular/core'
-import { VideoPlaylistService } from '@app/shared/video-playlist/video-playlist.service'
+import { CachedPlaylist, VideoPlaylistService } from '@app/shared/video-playlist/video-playlist.service'
 import { AuthService, Notifier } from '@app/core'
 import { Subject, Subscription } from 'rxjs'
 import { debounceTime, filter } from 'rxjs/operators'
@@ -7,7 +7,6 @@ import { Video, VideoPlaylistCreate, VideoPlaylistElementCreate, VideoPlaylistPr
 import { FormReactive, FormValidatorService, VideoPlaylistValidatorsService } from '@app/shared/forms'
 import { I18n } from '@ngx-translate/i18n-polyfill'
 import { secondsToTime } from '../../../assets/player/utils'
-import { VideoPlaylist } from '@app/shared/video-playlist/video-playlist.model'
 import * as debug from 'debug'
 import { DisableForReuseHook } from '@app/core/routing/disable-for-reuse-hook'
 import { VideoExistInPlaylist } from '@shared/models/videos/playlist/video-exist-in-playlist.model'
@@ -50,7 +49,7 @@ export class VideoAddToPlaylistComponent extends FormReactive implements OnInit,
   private disabled = false
 
   private listenToPlaylistChangeSub: Subscription
-  private playlistsData: VideoPlaylist[] = []
+  private playlistsData: CachedPlaylist[] = []
 
   constructor (
     protected formValidatorService: FormValidatorService,
diff --git a/client/src/app/shared/video-playlist/video-playlist.service.ts b/client/src/app/shared/video-playlist/video-playlist.service.ts
index c5b87fc11..7eddf81e1 100644
--- a/client/src/app/shared/video-playlist/video-playlist.service.ts
+++ b/client/src/app/shared/video-playlist/video-playlist.service.ts
@@ -26,7 +26,7 @@ import * as debug from 'debug'
 
 const logger = debug('peertube:playlists:VideoPlaylistService')
 
-type CachedPlaylist = VideoPlaylist | { id: number, displayName: string }
+export type CachedPlaylist = VideoPlaylist | { id: number, displayName: string }
 
 @Injectable()
 export class VideoPlaylistService {