11 files changed, 34 insertions, 134 deletions

diff --git a/client/src/app/+admin/follows/followers-list/followers-list.component.ts b/client/src/app/+admin/follows/followers-list/followers-list.component.ts
index aff59a691..585902827 100644
--- a/client/src/app/+admin/follows/followers-list/followers-list.component.ts
+++ b/client/src/app/+admin/follows/followers-list/followers-list.component.ts
@@ -15,7 +15,7 @@ export class FollowersListComponent extends RestTable implements OnInit {
   followers: ActorFollow[] = []
   totalRecords = 0
   rowsPerPage = 10
-  sort: SortMeta = { field: 'createdAt', order: 1 }
+  sort: SortMeta = { field: 'createdAt', order: -1 }
   pagination: RestPagination = { count: this.rowsPerPage, start: 0 }
 
   constructor (
diff --git a/client/src/app/+admin/follows/following-add/following-add.component.html b/client/src/app/+admin/follows/following-add/following-add.component.html
deleted file mode 100644
index e08decb3f..000000000
--- a/client/src/app/+admin/follows/following-add/following-add.component.html
+++ /dev/null
@@ -1,22 +0,0 @@
-<div *ngIf="error" class="alert alert-danger">{{ error }}</div>
-
-<form (ngSubmit)="addFollowing()">
-  <div class="form-group">
-    <label i18n for="hosts">1 host (without "http://") per line</label>
-
-    <textarea
-      type="text" class="form-control" placeholder="example.com" id="hosts" name="hosts"
-      [(ngModel)]="hostsString" (ngModelChange)="onHostsChanged()" [ngClass]="{ 'input-error': hostsError }"
-    ></textarea>
-
-    <div *ngIf="hostsError" class="form-error">
-      {{ hostsError }}
-    </div>
-  </div>
-
-  <div i18n *ngIf="httpEnabled() === false"  class="alert alert-warning">
-    It seems that you are not on a HTTPS server. Your webserver needs to have TLS activated in order to follow servers.
-  </div>
-
-  <input type="submit" i18n-value value="Add following" [disabled]="hostsError || !hostsString" class="btn btn-secondary">
-</form>
diff --git a/client/src/app/+admin/follows/following-add/following-add.component.scss b/client/src/app/+admin/follows/following-add/following-add.component.scss
deleted file mode 100644
index 7594b502c..000000000
--- a/client/src/app/+admin/follows/following-add/following-add.component.scss
+++ /dev/null
@@ -1,11 +0,0 @@
-@import '_variables';
-@import '_mixins';
-
-textarea {
-  height: 250px;
-}
-
-input[type=submit] {
-  @include peertube-button;
-  @include orange-button;
-}
diff --git a/client/src/app/+admin/follows/following-add/following-add.component.ts b/client/src/app/+admin/follows/following-add/following-add.component.ts
deleted file mode 100644
index 308bbb0c5..000000000
--- a/client/src/app/+admin/follows/following-add/following-add.component.ts
+++ /dev/null
@@ -1,85 +0,0 @@
-import { Component } from '@angular/core'
-import { Router } from '@angular/router'
-import { Notifier } from '@app/core'
-import { ConfirmService } from '../../../core'
-import { validateHost } from '../../../shared'
-import { FollowService } from '@app/shared/instance/follow.service'
-import { I18n } from '@ngx-translate/i18n-polyfill'
-
-@Component({
-  selector: 'my-following-add',
-  templateUrl: './following-add.component.html',
-  styleUrls: [ './following-add.component.scss' ]
-})
-export class FollowingAddComponent {
-  hostsString = ''
-  hostsError: string = null
-  error: string = null
-
-  constructor (
-    private router: Router,
-    private notifier: Notifier,
-    private confirmService: ConfirmService,
-    private followService: FollowService,
-    private i18n: I18n
-  ) {}
-
-  httpEnabled () {
-    return window.location.protocol === 'https:'
-  }
-
-  onHostsChanged () {
-    this.hostsError = null
-
-    const newHostsErrors = []
-    const hosts = this.getNotEmptyHosts()
-
-    for (const host of hosts) {
-      if (validateHost(host) === false) {
-        newHostsErrors.push(this.i18n('{{host}} is not valid', { host }))
-      }
-    }
-
-    if (newHostsErrors.length !== 0) {
-      this.hostsError = newHostsErrors.join('. ')
-    }
-  }
-
-  async addFollowing () {
-    this.error = ''
-
-    const hosts = this.getNotEmptyHosts()
-    if (hosts.length === 0) {
-      this.error = this.i18n('You need to specify hosts to follow.')
-    }
-
-    if (!this.isHostsUnique(hosts)) {
-      this.error = this.i18n('Hosts need to be unique.')
-      return
-    }
-
-    const confirmMessage = this.i18n('If you confirm, you will send a follow request to:<br /> - ') + hosts.join('<br /> - ')
-    const res = await this.confirmService.confirm(confirmMessage, this.i18n('Follow new server(s)'))
-    if (res === false) return
-
-    this.followService.follow(hosts).subscribe(
-      () => {
-        this.notifier.success(this.i18n('Follow request(s) sent!'))
-
-        setTimeout(() => this.router.navigate([ '/admin/follows/following-list' ]), 500)
-      },
-
-      err => this.notifier.error(err.message)
-    )
-  }
-
-  private isHostsUnique (hosts: string[]) {
-    return hosts.every(host => hosts.indexOf(host) === hosts.lastIndexOf(host))
-  }
-
-  private getNotEmptyHosts () {
-    return this.hostsString
-      .split('\n')
-      .filter(host => host && host.length !== 0) // Eject empty hosts
-  }
-}
diff --git a/client/src/app/+admin/follows/following-add/index.ts b/client/src/app/+admin/follows/following-add/index.ts
deleted file mode 100644
index 1b1897ffa..000000000
--- a/client/src/app/+admin/follows/following-add/index.ts
+++ /dev/null
@@ -1 +0,0 @@
-export * from './following-add.component'
diff --git a/client/src/app/+admin/follows/following-list/following-list.component.html b/client/src/app/+admin/follows/following-list/following-list.component.html
index 01aba0c11..cb62d52dd 100644
--- a/client/src/app/+admin/follows/following-list/following-list.component.html
+++ b/client/src/app/+admin/follows/following-list/following-list.component.html
@@ -4,12 +4,16 @@
 >
   <ng-template pTemplate="caption">
     <div class="caption">
-      <div>
+      <div class="ml-auto">
         <input
           type="text" name="table-filter" id="table-filter" i18n-placeholder placeholder="Filter..."
           (keyup)="onSearch($event)"
         >
       </div>
+      <a class="ml-2 follow-button" (click)="addDomainsToFollow()" (key.enter)="addDomainsToFollow()">
+        <my-global-icon iconName="add"></my-global-icon>
+        <ng-container i18n>Follow domain</ng-container>
+      </a>
     </div>
   </ng-template>
 
@@ -42,3 +46,5 @@
     </tr>
   </ng-template>
 </p-table>
+
+<my-batch-domains-modal #batchDomainsModal i18n-action action="Follow domains" (domains)="addFollowing($event)"></my-batch-domains-modal>
diff --git a/client/src/app/+admin/follows/following-list/following-list.component.scss b/client/src/app/+admin/follows/following-list/following-list.component.scss
index a6f0656b8..f4656b88d 100644
--- a/client/src/app/+admin/follows/following-list/following-list.component.scss
+++ b/client/src/app/+admin/follows/following-list/following-list.component.scss
@@ -7,4 +7,8 @@
   input {
     @include peertube-input-text(250px);
   }
-}
\ No newline at end of file
+}
+
+.follow-button {
+  @include create-button;
+}
diff --git a/client/src/app/+admin/follows/following-list/following-list.component.ts b/client/src/app/+admin/follows/following-list/following-list.component.ts
index dd7629ead..477a6c0d7 100644
--- a/client/src/app/+admin/follows/following-list/following-list.component.ts
+++ b/client/src/app/+admin/follows/following-list/following-list.component.ts
@@ -1,4 +1,4 @@
-import { Component, OnInit } from '@angular/core'
+import { Component, OnInit, ViewChild } from '@angular/core'
 import { Notifier } from '@app/core'
 import { SortMeta } from 'primeng/api'
 import { ActorFollow } from '../../../../../../shared/models/actors/follow.model'
@@ -6,6 +6,7 @@ import { ConfirmService } from '../../../core/confirm/confirm.service'
 import { RestPagination, RestTable } from '../../../shared'
 import { FollowService } from '@app/shared/instance/follow.service'
 import { I18n } from '@ngx-translate/i18n-polyfill'
+import { BatchDomainsModalComponent } from '@app/+admin/config/shared/batch-domains-modal.component'
 
 @Component({
   selector: 'my-followers-list',
@@ -13,10 +14,12 @@ import { I18n } from '@ngx-translate/i18n-polyfill'
   styleUrls: [ './following-list.component.scss' ]
 })
 export class FollowingListComponent extends RestTable implements OnInit {
+  @ViewChild('batchDomainsModal') batchDomainsModal: BatchDomainsModalComponent
+
   following: ActorFollow[] = []
   totalRecords = 0
   rowsPerPage = 10
-  sort: SortMeta = { field: 'createdAt', order: 1 }
+  sort: SortMeta = { field: 'createdAt', order: -1 }
   pagination: RestPagination = { count: this.rowsPerPage, start: 0 }
 
   constructor (
@@ -36,6 +39,21 @@ export class FollowingListComponent extends RestTable implements OnInit {
     return 'FollowingListComponent'
   }
 
+  addDomainsToFollow () {
+    this.batchDomainsModal.openModal()
+  }
+
+  async addFollowing (hosts: string[]) {
+    this.followService.follow(hosts).subscribe(
+      () => {
+        this.notifier.success(this.i18n('Follow request(s) sent!'))
+        this.loadData()
+      },
+
+      err => this.notifier.error(err.message)
+    )
+  }
+
   async removeFollowing (follow: ActorFollow) {
     const res = await this.confirmService.confirm(
       this.i18n('Do you really want to unfollow {{host}}?', { host: follow.following.host }),
diff --git a/client/src/app/+admin/follows/follows.component.html b/client/src/app/+admin/follows/follows.component.html
index 46581daf9..7b5bcc2db 100644
--- a/client/src/app/+admin/follows/follows.component.html
+++ b/client/src/app/+admin/follows/follows.component.html
@@ -4,8 +4,6 @@
   <div class="admin-sub-nav">
     <a i18n routerLink="following-list" routerLinkActive="active">Following</a>
 
-    <a i18n routerLink="following-add" routerLinkActive="active">Follow</a>
-
     <a i18n routerLink="followers-list" routerLinkActive="active">Followers</a>
 
     <a i18n routerLink="video-redundancies-list" routerLinkActive="active">Video redundancies</a>
diff --git a/client/src/app/+admin/follows/follows.routes.ts b/client/src/app/+admin/follows/follows.routes.ts
index 298733eb0..8270ae444 100644
--- a/client/src/app/+admin/follows/follows.routes.ts
+++ b/client/src/app/+admin/follows/follows.routes.ts
@@ -2,7 +2,6 @@ import { Routes } from '@angular/router'
 
 import { UserRightGuard } from '../../core'
 import { FollowsComponent } from './follows.component'
-import { FollowingAddComponent } from './following-add'
 import { FollowersListComponent } from './followers-list'
 import { UserRight } from '../../../../../shared'
 import { FollowingListComponent } from './following-list/following-list.component'
@@ -42,12 +41,7 @@ export const FollowsRoutes: Routes = [
       },
       {
         path: 'following-add',
-        component: FollowingAddComponent,
-        data: {
-          meta: {
-            title: 'Add follow'
-          }
-        }
+        redirectTo: 'following-list'
       },
       {
         path: 'video-redundancies-list',
diff --git a/client/src/app/+admin/follows/index.ts b/client/src/app/+admin/follows/index.ts
index 4fcb35cb1..285955468 100644
--- a/client/src/app/+admin/follows/index.ts
+++ b/client/src/app/+admin/follows/index.ts
@@ -1,4 +1,3 @@
-export * from './following-add'
 export * from './followers-list'
 export * from './following-list'
 export * from './video-redundancies-list'