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/marketplace/src/pipes/filter-packages.pipe.ts

@@ -0,0 +1,65 @@
+import { Pipe, PipeTransform } from '@angular/core'
+import Fuse from 'fuse.js/dist/fuse.min.js'
+
+import { LocalPkg } from '../types/local-pkg'
+import { MarketplacePkg } from '../types/marketplace-pkg'
+
+const defaultOps = {
+  isCaseSensitive: false,
+  includeScore: true,
+  shouldSort: true,
+  includeMatches: false,
+  findAllMatches: false,
+  minMatchCharLength: 1,
+  location: 0,
+  threshold: 0.6,
+  distance: 100,
+  useExtendedSearch: false,
+  ignoreLocation: false,
+  ignoreFieldNorm: false,
+  keys: [
+    'manifest.id',
+    'manifest.title',
+    'manifest.description.short',
+    'manifest.description.long',
+  ],
+}
+
+@Pipe({
+  name: 'filterPackages',
+})
+export class FilterPackagesPipe implements PipeTransform {
+  transform(
+    packages: MarketplacePkg[] | null,
+    local: Record<string, LocalPkg>,
+    query: string,
+    category: string,
+  ): MarketplacePkg[] | null {
+    if (!packages) {
+      return null
+    }
+
+    if (query) {
+      const fuse = new Fuse(packages, defaultOps)
+
+      return fuse.search(query).map(p => p.item)
+    }
+
+    if (category === 'updates') {
+      return packages.filter(
+        ({ manifest }) =>
+          local[manifest.id] &&
+          manifest.version !== local[manifest.id].manifest.version,
+      )
+    }
+
+    const pkgsToSort = packages.filter(
+      p => category === 'all' || p.categories.includes(category),
+    )
+    const fuse = new Fuse(pkgsToSort, { ...defaultOps, threshold: 1 })
+
+    return fuse
+      .search(category !== 'all' ? category || '' : 'bit')
+      .map(p => p.item)
+  }
+}

frontend/projects/marketplace/src/pipes/install-progress.pipe.ts

@@ -0,0 +1,13 @@
+import { Pipe, PipeTransform } from '@angular/core'
+import { InstallProgress, packageLoadingProgress } from '@start9labs/shared'
+
+@Pipe({
+  name: 'installProgress',
+})
+export class InstallProgressPipe implements PipeTransform {
+  transform(loadData: InstallProgress): string {
+    const { totalProgress } = packageLoadingProgress(loadData)
+
+    return totalProgress < 99 ? totalProgress + '%' : 'finalizing'
+  }
+}

frontend/projects/marketplace/src/pipes/marketplace-pipes.module.ts

@@ -0,0 +1,10 @@
+import { NgModule } from '@angular/core'
+import { InstallProgressPipe } from './install-progress.pipe'
+import { TrustPipe } from './trust.pipe'
+import { FilterPackagesPipe } from './filter-packages.pipe'
+
+@NgModule({
+  declarations: [InstallProgressPipe, TrustPipe, FilterPackagesPipe],
+  exports: [InstallProgressPipe, TrustPipe, FilterPackagesPipe],
+})
+export class MarketplacePipesModule {}

frontend/projects/marketplace/src/pipes/trust.pipe.ts

@@ -0,0 +1,13 @@
+import { Pipe, PipeTransform } from '@angular/core'
+import { DomSanitizer, SafeResourceUrl } from '@angular/platform-browser'
+
+@Pipe({
+  name: 'trust',
+})
+export class TrustPipe implements PipeTransform {
+  constructor(public readonly sanitizer: DomSanitizer) {}
+
+  transform(base64Icon: string): SafeResourceUrl {
+    return this.sanitizer.bypassSecurityTrustResourceUrl(base64Icon)
+  }
+}

frontend/projects/marketplace/src/public-api.ts

@@ -0,0 +1,17 @@
+/*
+ * Public API Surface of @start9labs/marketplace
+ */
+
+export * from './pipes/install-progress.pipe'
+export * from './pipes/trust.pipe'
+export * from './pipes/marketplace-pipes.module'
+
+export * from './services/marketplace.service'
+
+export * from './types/local-pkg'
+export * from './types/marketplace'
+export * from './types/marketplace-data'
+export * from './types/marketplace-manifest'
+export * from './types/marketplace-pkg'
+
+export * from './utils/spread-progress'

frontend/projects/marketplace/src/services/marketplace.service.ts

@@ -0,0 +1,17 @@
+import { Observable } from 'rxjs'
+import { MarketplacePkg } from '../types/marketplace-pkg'
+import { Marketplace } from '../types/marketplace'
+
+export abstract class AbstractMarketplaceService {
+  abstract install(id: string, version?: string): Observable<unknown>
+
+  abstract getMarketplace(): Observable<Marketplace>
+
+  abstract getReleaseNotes(id: string): Observable<Record<string, string>>
+
+  abstract getCategories(): Observable<string[]>
+
+  abstract getPackages(): Observable<MarketplacePkg[]>
+
+  abstract getPackage(id: string, version: string): Observable<MarketplacePkg>
+}

frontend/projects/marketplace/src/types/local-pkg.ts

@@ -0,0 +1,8 @@
+import { PackageState } from '@start9labs/shared'
+
+import { MarketplaceManifest } from './marketplace-manifest'
+
+export interface LocalPkg {
+  state: PackageState
+  manifest: MarketplaceManifest
+}

frontend/projects/marketplace/src/types/marketplace-data.ts

@@ -0,0 +1,4 @@
+export interface MarketplaceData {
+  categories: string[]
+  name: string
+}

frontend/projects/marketplace/src/types/marketplace-manifest.ts

@@ -0,0 +1,25 @@
+import { Url } from '@start9labs/shared'
+
+export interface MarketplaceManifest {
+  id: string
+  title: string
+  version: string
+  description: {
+    short: string
+    long: string
+  }
+  'release-notes': string
+  license: string // name
+  'wrapper-repo': Url
+  'upstream-repo': Url
+  'support-site': Url
+  'marketing-site': Url
+  'donation-url': Url | null
+  alerts: {
+    install: string | null
+    uninstall: string | null
+    restore: string | null
+    start: string | null
+    stop: string | null
+  }
+}

frontend/projects/marketplace/src/types/marketplace-pkg.ts

@@ -0,0 +1,17 @@
+import { Url } from '@start9labs/shared'
+import { MarketplaceManifest } from './marketplace-manifest'
+
+export interface MarketplacePkg {
+  icon: Url
+  license: Url
+  instructions: Url
+  manifest: MarketplaceManifest
+  categories: string[]
+  versions: string[]
+  'dependency-metadata': {
+    [id: string]: {
+      title: string
+      icon: Url
+    }
+  }
+}

frontend/projects/marketplace/src/types/marketplace.ts

@@ -0,0 +1,4 @@
+export interface Marketplace {
+  url: string
+  name: string
+}

frontend/projects/marketplace/src/utils/spread-progress.ts

@@ -0,0 +1,5 @@
+import { LocalPkg } from '../types/local-pkg'
+
+export function spreadProgress(pkg: LocalPkg) {
+  pkg['install-progress'] = { ...pkg['install-progress'] }
+}