feat(marketplace): add separate package and move some entities in it (#1283)

* feat(marketplace): add separate package and move some entities in it

* feat(marketplace): refactor release notes and list

* feat(marketplace): refactor showing a package

* chore: fix install progress

* chore: fix angular.json

* chore: properly share stream

frontend/projects/ui/src/app/components/backup-drives/backup-drives.component.ts

@@ -14,7 +14,7 @@ import {
 import { GenericFormPage } from 'src/app/modals/generic-form/generic-form.page'
 import { ConfigSpec } from 'src/app/pkg-config/config-types'
 import { ApiService } from 'src/app/services/api/embassy-api.service'
-import { ErrorToastService } from 'src/app/services/error-toast.service'
+import { ErrorToastService } from '@start9labs/shared'
 import { MappedBackupTarget } from 'src/app/types/mapped-backup-target'
 
 @Component({

frontend/projects/ui/src/app/components/backup-drives/backup.service.ts

@@ -1,14 +1,13 @@
 import { Injectable } from '@angular/core'
 import { IonicSafeString } from '@ionic/core'
 import { ApiService } from 'src/app/services/api/embassy-api.service'
-import { getErrorMessage } from 'src/app/services/error-toast.service'
 import {
   BackupTarget,
   CifsBackupTarget,
   DiskBackupTarget,
 } from 'src/app/services/api/api.types'
 import { MappedBackupTarget } from 'src/app/types/mapped-backup-target'
-import { Emver } from '@start9labs/shared'
+import { getErrorMessage, Emver } from '@start9labs/shared'
 
 @Injectable({
   providedIn: 'root',

frontend/projects/ui/src/app/components/install-wizard/prebaked-wizards.ts

@@ -1,7 +1,8 @@
-import { Injectable } from '@angular/core'
+import { Inject, Injectable } from '@angular/core'
+import { exists } from '@start9labs/shared'
+import { AbstractMarketplaceService } from '@start9labs/marketplace'
 import { PackageDataEntry } from 'src/app/services/patch-db/data-model'
 import { Breakages } from 'src/app/services/api/api.types'
-import { exists } from '@start9labs/shared'
 import { ApiService } from '../../services/api/embassy-api.service'
 import {
   InstallWizardComponent,
@@ -9,13 +10,14 @@ import {
   TopbarParams,
 } from './install-wizard.component'
 import { ConfigService } from 'src/app/services/config.service'
-import { MarketplaceService } from 'src/app/pages/marketplace-routes/marketplace.service'
+import { MarketplaceService } from 'src/app/services/marketplace.service'
 
 @Injectable({ providedIn: 'root' })
 export class WizardBaker {
   constructor(
     private readonly embassyApi: ApiService,
     private readonly config: ConfigService,
+    @Inject(AbstractMarketplaceService)
     private readonly marketplaceService: MarketplaceService,
   ) {}
 
@@ -77,10 +79,12 @@ export class WizardBaker {
             verb: 'beginning update for',
             title,
             executeAction: () =>
-              this.marketplaceService.installPackage({
-                id,
-                'version-spec': version ? `=${version}` : undefined,
-              }),
+              this.marketplaceService
+                .installPackage({
+                  id,
+                  'version-spec': version ? `=${version}` : undefined,
+                })
+                .toPromise(),
           },
         },
         bottomBar: {
@@ -202,10 +206,12 @@ export class WizardBaker {
             verb: 'beginning downgrade for',
             title,
             executeAction: () =>
-              this.marketplaceService.installPackage({
-                id,
-                'version-spec': version ? `=${version}` : undefined,
-              }),
+              this.marketplaceService
+                .installPackage({
+                  id,
+                  'version-spec': version ? `=${version}` : undefined,
+                })
+                .toPromise(),
           },
         },
         bottomBar: {

frontend/projects/ui/src/app/components/logs/logs.page.ts

@@ -1,6 +1,6 @@
 import { Component, Input, ViewChild } from '@angular/core'
 import { IonContent } from '@ionic/angular'
-import { ErrorToastService } from 'src/app/services/error-toast.service'
+import { ErrorToastService } from '@start9labs/shared'
 import { RR } from 'src/app/services/api/api.types'
 var Convert = require('ansi-to-html')
 var convert = new Convert({
@@ -14,7 +14,11 @@ var convert = new Convert({
 })
 export class LogsPage {
   @ViewChild(IonContent) private content: IonContent
-  @Input() fetchLogs: (params: { before_flag?: boolean, limit?: number, cursor?: string }) => Promise<RR.LogsRes>
+  @Input() fetchLogs: (params: {
+    before_flag?: boolean
+    limit?: number
+    cursor?: string
+  }) => Promise<RR.LogsRes>
   loading = true
   loadingMore = false
   logs: string
@@ -25,15 +29,13 @@ export class LogsPage {
   scrollToBottomButton = false
   isOnBottom = true
 
-  constructor (
-    private readonly errToast: ErrorToastService,
-  ) { }
+  constructor(private readonly errToast: ErrorToastService) {}
 
-  ngOnInit () {
+  ngOnInit() {
     this.getLogs()
   }
 
-  async fetch (isBefore: boolean = true) {
+  async fetch(isBefore: boolean = true) {
     try {
       const cursor = isBefore ? this.startCursor : this.endCursor
       const logsRes = await this.fetchLogs({
@@ -57,7 +59,7 @@ export class LogsPage {
     }
   }
 
-  async getLogs () {
+  async getLogs() {
     try {
       // get logs
       const logs = await this.fetch()
@@ -65,47 +67,60 @@ export class LogsPage {
 
       const container = document.getElementById('container')
       const beforeContainerHeight = container.scrollHeight
-      const newLogs = document.getElementById('template').cloneNode(true) as HTMLElement
-      newLogs.innerHTML = logs.map(l => `${l.timestamp} ${convert.toHtml(l.message)}`).join('\n') + (logs.length ? '\n' : '')
+      const newLogs = document
+        .getElementById('template')
+        .cloneNode(true) as HTMLElement
+      newLogs.innerHTML =
+        logs
+          .map(l => `${l.timestamp} ${convert.toHtml(l.message)}`)
+          .join('\n') + (logs.length ? '\n' : '')
       container.prepend(newLogs)
       const afterContainerHeight = container.scrollHeight
 
       // scroll down
       scrollBy(0, afterContainerHeight - beforeContainerHeight)
-      this.content.scrollToPoint(0, afterContainerHeight - beforeContainerHeight)
+      this.content.scrollToPoint(
+        0,
+        afterContainerHeight - beforeContainerHeight,
+      )
 
       if (logs.length < this.limit) {
         this.needInfinite = false
       }
-
-    } catch (e) { }
+    } catch (e) {}
   }
 
-  async loadMore () {
+  async loadMore() {
     try {
       this.loadingMore = true
       const logs = await this.fetch(false)
-      if (!logs.length) return this.loadingMore = false
+      if (!logs.length) return (this.loadingMore = false)
 
       const container = document.getElementById('container')
-      const newLogs = document.getElementById('template').cloneNode(true) as HTMLElement
-      newLogs.innerHTML = logs.map(l => `${l.timestamp} ${convert.toHtml(l.message)}`).join('\n') + (logs.length ? '\n' : '')
+      const newLogs = document
+        .getElementById('template')
+        .cloneNode(true) as HTMLElement
+      newLogs.innerHTML =
+        logs
+          .map(l => `${l.timestamp} ${convert.toHtml(l.message)}`)
+          .join('\n') + (logs.length ? '\n' : '')
       container.append(newLogs)
       this.loadingMore = false
       this.scrollEvent()
-    } catch (e) { }
+    } catch (e) {}
   }
 
-  scrollEvent () {
+  scrollEvent() {
     const buttonDiv = document.getElementById('button-div')
-    this.isOnBottom = buttonDiv && buttonDiv.getBoundingClientRect().top < window.innerHeight
+    this.isOnBottom =
+      buttonDiv && buttonDiv.getBoundingClientRect().top < window.innerHeight
   }
 
-  scrollToBottom () {
+  scrollToBottom() {
     this.content.scrollToBottom(500)
   }
 
-  async loadData (e: any): Promise<void> {
+  async loadData(e: any): Promise<void> {
     await this.getLogs()
     e.target.complete()
   }