settings: added release notes

tabby-settings/package.json

@@ -18,6 +18,8 @@
   "license": "MIT",
   "devDependencies": {
     "@types/deep-equal": "1.0.1",
+    "marked": "^2.1.3",
+    "ngx-infinite-scroll": "^10.0.1",
     "utils-decorators": "^1.8.0"
   },
   "peerDependencies": {

tabby-settings/src/components/releaseNotesTab.component.pug

@@ -0,0 +1,12 @@
+.container(
+    infiniteScroll,
+    [infiniteScrollDistance]='2',
+    [infiniteScrollThrottle]='50',
+    infiniteScrollContainer='release-notes-tab',
+    [fromRoot]='true',
+    (scrolled)='onScrolled()'
+)
+    div(*ngFor='let release of releases')
+        h1 {{release.name}}
+        .text-muted {{release.version}} / {{release.date|date:'mediumDate'}}
+        section([fastHtmlBind]='release.content')

tabby-settings/src/components/releaseNotesTab.component.scss

@@ -0,0 +1,17 @@
+:host {
+    overflow-y: scroll;
+    width: 100%;
+    padding: 30px;
+}
+
+::ng-deep img {
+    max-width: 100%;
+}
+
+h1 {
+    margin: 0;
+}
+
+section {
+    margin: 20px 0;
+}

tabby-settings/src/components/releaseNotesTab.component.ts

@@ -0,0 +1,47 @@
+/* eslint-disable @typescript-eslint/explicit-module-boundary-types */
+import axios from 'axios'
+import marked from 'marked'
+import { Component } from '@angular/core'
+import { BaseTabComponent } from 'tabby-core'
+
+export interface Release {
+    name: string
+    version: string
+    content: string
+    date: Date
+}
+
+/** @hidden */
+@Component({
+    selector: 'release-notes-tab',
+    template: require('./releaseNotesTab.component.pug'),
+    styles: [require('./releaseNotesTab.component.scss')],
+})
+export class ReleaseNotesComponent extends BaseTabComponent {
+    releases: Release[] = []
+    lastPage = 1
+
+    constructor () {
+        super()
+        this.setTitle('Release notes')
+        this.loadReleases(1)
+    }
+
+    async loadReleases (page) {
+        console.log('Loading releases page', page)
+        const response = await axios.get(`https://api.github.com/repos/eugeny/tabby/releases?page=${page}`, {
+            headers: { Accept: 'application/vnd.github.v3+json' },
+        })
+        this.releases = this.releases.concat(response.data.map(r => ({
+            name: r.name,
+            version: r.tag_name,
+            content: marked(r.body),
+            date: new Date(r.created_at),
+        })))
+        this.lastPage = page
+    }
+
+    onScrolled () {
+        this.loadReleases(this.lastPage + 1)
+    }
+}

tabby-settings/src/components/settingsTab.component.pug

@@ -23,6 +23,12 @@ button.btn.btn-warning.btn-block(*ngIf='config.restartRequested', '(click)'='res
                             i.fas.fa-bug
                             span Report a problem
 
+                        button.btn.btn-secondary.mr-3(
+                            (click)='showReleaseNotes()',
+                        )
+                            i.fas.fa-book
+                            span What's new
+
                         button.btn.btn-secondary(
                             *ngIf='!updateAvailable && hostApp.platform !== Platform.Web',
                             (click)='checkForUpdates()',

tabby-settings/src/components/settingsTab.component.ts

@@ -11,9 +11,11 @@ import {
     UpdaterService,
     PlatformService,
     HostWindowService,
+    AppService,
 } from 'tabby-core'
 
 import { SettingsTabProvider } from '../api'
+import { ReleaseNotesComponent } from './releaseNotesTab.component'
 
 /** @hidden */
 @Component({
@@ -42,6 +44,7 @@ export class SettingsTabComponent extends BaseTabComponent {
         public platform: PlatformService,
         public zone: NgZone,
         private updater: UpdaterService,
+        private app: AppService,
         @Inject(SettingsTabProvider) public settingsProviders: SettingsTabProvider[],
     ) {
         super()
@@ -115,4 +118,10 @@ export class SettingsTabComponent extends BaseTabComponent {
         this.updateAvailable = await this.updater.check()
         this.checkingForUpdate = false
     }
+
+    showReleaseNotes () {
+        this.app.openNewTabRaw({
+            type: ReleaseNotesComponent,
+        })
+    }
 }

tabby-settings/src/index.ts

@@ -2,6 +2,7 @@ import { NgModule } from '@angular/core'
 import { BrowserModule } from '@angular/platform-browser'
 import { FormsModule } from '@angular/forms'
 import { NgbModule } from '@ng-bootstrap/ng-bootstrap'
+import { InfiniteScrollModule } from 'ngx-infinite-scroll'
 
 import TabbyCorePlugin, { ToolbarButtonProvider, HotkeyProvider, ConfigProvider } from 'tabby-core'
 
@@ -15,6 +16,7 @@ import { WindowSettingsTabComponent } from './components/windowSettingsTab.compo
 import { VaultSettingsTabComponent }  from './components/vaultSettingsTab.component'
 import { SetVaultPassphraseModalComponent } from './components/setVaultPassphraseModal.component'
 import { ProfilesSettingsTabComponent } from './components/profilesSettingsTab.component'
+import { ReleaseNotesComponent } from './components/releaseNotesTab.component'
 
 import { SettingsTabProvider } from './api'
 import { ButtonProvider } from './buttonProvider'
@@ -29,6 +31,7 @@ import { HotkeySettingsTabProvider, WindowSettingsTabProvider, VaultSettingsTabP
         FormsModule,
         NgbModule,
         TabbyCorePlugin,
+        InfiniteScrollModule,
     ],
     providers: [
         { provide: ToolbarButtonProvider, useClass: ButtonProvider, multi: true },
@@ -48,6 +51,7 @@ import { HotkeySettingsTabProvider, WindowSettingsTabProvider, VaultSettingsTabP
         SetVaultPassphraseModalComponent,
         VaultSettingsTabComponent,
         WindowSettingsTabComponent,
+        ReleaseNotesComponent,
     ],
     declarations: [
         EditProfileModalComponent,
@@ -60,6 +64,7 @@ import { HotkeySettingsTabProvider, WindowSettingsTabProvider, VaultSettingsTabP
         SetVaultPassphraseModalComponent,
         VaultSettingsTabComponent,
         WindowSettingsTabComponent,
+        ReleaseNotesComponent,
     ],
 })
 export default class SettingsModule { } // eslint-disable-line @typescript-eslint/no-extraneous-class

tabby-settings/yarn.lock

@@ -2,11 +2,34 @@
 # yarn lockfile v1
 
 
+"@scarf/scarf@^1.1.0":
+  version "1.1.1"
+  resolved "https://registry.yarnpkg.com/@scarf/scarf/-/scarf-1.1.1.tgz#d8b9f20037b3a37dbf8dcdc4b3b72f9285bfce35"
+  integrity sha512-VGbKDbk1RFIaSmdVb0cNjjWJoRWRI/Weo23AjRCC2nryO0iAS8pzsToJfPVPtVs74WHw4L1UTADNdIYRLkirZQ==
+
 "@types/deep-equal@1.0.1":
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/@types/deep-equal/-/deep-equal-1.0.1.tgz#71cfabb247c22bcc16d536111f50c0ed12476b03"
   integrity sha512-mMUu4nWHLBlHtxXY17Fg6+ucS/MnndyOWyOe7MmwkoMYxvfQU2ajtRaEvqSUv+aVkMqH/C0NCI8UoVfRNQ10yg==
 
+marked@^2.1.3:
+  version "2.1.3"
+  resolved "https://registry.yarnpkg.com/marked/-/marked-2.1.3.tgz#bd017cef6431724fd4b27e0657f5ceb14bff3753"
+  integrity sha512-/Q+7MGzaETqifOMWYEA7HVMaZb4XbcRfaOzcSsHZEith83KGlvaSG33u0SKu89Mj5h+T8V2hM+8O45Qc5XTgwA==
+
+ngx-infinite-scroll@^10.0.1:
+  version "10.0.1"
+  resolved "https://registry.yarnpkg.com/ngx-infinite-scroll/-/ngx-infinite-scroll-10.0.1.tgz#6f51f2f8775a7c50d1dd8bad125d4e748abbe880"
+  integrity sha512-7is0eJZ9kJPsaHohRmMhJ/QFHAW9jp9twO5HcHRvFM/Yl/R8QCiokgjwmH0/CR3MuxUanxfHZMfO3PbYTwlBEg==
+  dependencies:
+    "@scarf/scarf" "^1.1.0"
+    opencollective-postinstall "^2.0.2"
+
+opencollective-postinstall@^2.0.2:
+  version "2.0.3"
+  resolved "https://registry.yarnpkg.com/opencollective-postinstall/-/opencollective-postinstall-2.0.3.tgz#7a0fff978f6dbfa4d006238fbac98ed4198c3259"
+  integrity sha512-8AV/sCtuzUeTo8gQK5qDZzARrulB3egtLzFgteqB2tcT4Mw7B8Kt7JcDHmltjz6FOAHsvTevk70gZEbhM4ZS9Q==
+
 tinyqueue@^2.0.3:
   version "2.0.3"
   resolved "https://registry.yarnpkg.com/tinyqueue/-/tinyqueue-2.0.3.tgz#64d8492ebf39e7801d7bd34062e29b45b2035f08"