allow private syndication feeds via a user feedToken

3 files changed, 120 insertions, 0 deletions

diff --git a/client/src/app/+my-account/my-account-applications/my-account-applications.component.html b/client/src/app/+my-account/my-account-applications/my-account-applications.component.html
new file mode 100644
index 000000000..62e2cb59b
--- /dev/null
+++ b/client/src/app/+my-account/my-account-applications/my-account-applications.component.html
@@ -0,0 +1,35 @@
+<h1>
+  <my-global-icon iconName="codesandbox" aria-hidden="true"></my-global-icon>
+  <ng-container i18n>Applications</ng-container>
+</h1>
+
+<div class="form-row"> <!-- built-in token grid -->
+  <div class="form-group col-12 col-lg-4 col-xl-3">
+    <h2 i18n class="applications-title">SUBSCRIPTION FEED</h2>
+    <div i18n class="applications-description">
+      Used to retrieve the list of videos of the creators 
+      you subscribed to from outside PeerTube
+    </div>
+  </div>
+
+  <div class="form-group form-group-right col-12 col-lg-8 col-xl-9">
+
+    <div class="form-group">
+      <label i18n for="feed-url">Feed URL</label>
+      <my-input-readonly-copy [value]="feedUrl"></my-input-readonly-copy>
+    </div>
+    
+    <div class="form-group">
+      <label i18n for="feed-token">Feed Token</label>
+      <my-input-readonly-copy [value]="feedToken"></my-input-readonly-copy>
+    </div>
+
+  </div>
+</div>
+
+<div class="form-row mt-4"> <!-- submit placement block -->
+  <div class="col-md-7 col-xl-5"></div>
+  <div class="col-md-5 col-xl-5">
+    <input (click)="renewToken()" type="submit" i18n-value value="Renew token">
+  </div>
+</div>
diff --git a/client/src/app/+my-account/my-account-applications/my-account-applications.component.scss b/client/src/app/+my-account/my-account-applications/my-account-applications.component.scss
new file mode 100644
index 000000000..704132c03
--- /dev/null
+++ b/client/src/app/+my-account/my-account-applications/my-account-applications.component.scss
@@ -0,0 +1,28 @@
+@import '_variables';
+@import '_mixins';
+
+label {
+  font-weight: $font-regular;
+  font-size: 100%;
+}
+
+.applications-title {
+  @include settings-big-title;
+}
+
+.form-group {
+  max-width: 500px;
+}
+
+input[type=submit] {
+  @include peertube-button;
+  @include orange-button;
+
+  display: flex;
+  margin-left: auto;
+
+  & + .form-error {
+    display: inline;
+    margin-left: 5px;
+  }
+}
diff --git a/client/src/app/+my-account/my-account-applications/my-account-applications.component.ts b/client/src/app/+my-account/my-account-applications/my-account-applications.component.ts
new file mode 100644
index 000000000..c3f09dfe3
--- /dev/null
+++ b/client/src/app/+my-account/my-account-applications/my-account-applications.component.ts
@@ -0,0 +1,57 @@
+
+import { Component, OnInit } from '@angular/core'
+import { AuthService, Notifier, ConfirmService } from '@app/core'
+import { VideoService } from '@app/shared/shared-main'
+import { FeedFormat } from '@shared/models'
+import { Subject, merge } from 'rxjs'
+import { debounceTime } from 'rxjs/operators'
+
+@Component({
+  selector: 'my-account-applications',
+  templateUrl: './my-account-applications.component.html',
+  styleUrls: [ './my-account-applications.component.scss' ]
+})
+export class MyAccountApplicationsComponent implements OnInit {
+  feedUrl: string
+  feedToken: string
+
+  private baseURL = window.location.protocol + '//' + window.location.host
+  private tokenStream = new Subject()
+
+  constructor (
+    private authService: AuthService,
+    private videoService: VideoService,
+    private notifier: Notifier,
+    private confirmService: ConfirmService
+  ) {}
+
+  ngOnInit () {
+    this.feedUrl = this.baseURL
+
+    merge(
+      this.tokenStream,
+      this.authService.userInformationLoaded
+    ).pipe(debounceTime(400))
+     .subscribe(
+       _ => {
+         const user = this.authService.getUser()
+         this.videoService.getVideoSubscriptionFeedUrls(user.account.id)
+                          .then(feeds => this.feedUrl = this.baseURL + feeds.find(f => f.format === FeedFormat.RSS).url)
+                          .then(_ => this.authService.getScopedTokens().then(tokens => this.feedToken = tokens.feedToken))
+       },
+
+       err => {
+         this.notifier.error(err.message)
+       }
+     )
+  }
+
+  async renewToken () {
+    const res = await this.confirmService.confirm('Renewing the token will disallow previously configured clients from retrieving the feed until they use the new token. Proceed?', 'Renew token')
+    if (res === false) return
+
+    await this.authService.renewScopedTokens()
+    this.notifier.success('Token renewed. Update your client configuration accordingly.')
+    this.tokenStream.next()
+  }
+}