rework LAN display and service launchability

ui/src/app/pages/apps-routes/app-installed-list/app-installed-list.page.html

@@ -22,11 +22,17 @@
     <ion-grid>
       <ion-row>
         <ion-col *ngFor="let app of apps" sizeXs="4" sizeSm="3" sizeMd="2" sizeLg="2">
-          <ng-container *ngIf="{ status: app.subject.status | async, ui: app.subject.ui | async, iconURL: app.subject.iconURL | async | iconParse, title: app.subject.title | async } as vars"  >
+          <ng-container *ngIf="{
+            status: app.subject.status | async,
+            hasUI: app.subject.hasUI | async,
+            launchable: app.subject.launchable | async,
+            iconURL: app.subject.iconURL | async | iconParse,
+            title: app.subject.title | async
+          } as vars">
 
-            <ion-card class="installed-card" [class.installed-card-on]="vars.status === 'RUNNING'" style="position:relative" [routerLink]="['/services', 'installed', app.id]">
-              <div class="launch-container" *ngIf="vars.ui && !isConsulate">
-                <div class="launch-button-triangle"  (click)="launchUiTab(app.id, $event)" [class.disabled]="vars.status !== AppStatus.RUNNING">
+            <ion-card class="installed-card" style="position:relative" [routerLink]="['/services', 'installed', app.id]">
+              <div class="launch-container" *ngIf="vars.hasUI">
+                <div class="launch-button-triangle"  (click)="launchUiTab(app.id, $event)" [class.disabled]="!vars.launchable">
                   <ion-icon name="rocket-outline"></ion-icon>
                 </div>
               </div>

ui/src/app/pages/apps-routes/app-installed-list/app-installed-list.page.ts

@@ -35,19 +35,15 @@ export class AppInstalledListPage extends Cleanup {
   segmentValue: 'services' | 'embassy' = 'services'
 
   showCertDownload : boolean
-  isConsulate: boolean
-  isTor: boolean
 
   constructor (
     private readonly serverModel: ServerModel,
     private readonly appModel: AppModel,
     private readonly preload: ModelPreload,
     private readonly syncDaemon: SyncDaemon,
-    config: ConfigService,
+    private readonly config: ConfigService,
   ) {
     super()
-    this.isConsulate = config.isConsulateAndroid || config.isConsulateIos
-    this.isTor = config.isTor()
   }
 
   ngOnDestroy () {
@@ -105,12 +101,11 @@ export class AppInstalledListPage extends Cleanup {
     const app = this.apps.find(app => app.id === id).subject
 
     let uiAddress: string
-    if (this.isTor) {
+    if (this.config.isTor()) {
       uiAddress = `http://${app.torAddress.getValue()}`
     } else {
       uiAddress = `https://${app.lanAddress.getValue()}`
     }
-    console.log(uiAddress)
     return window.open(uiAddress, '_blank')
   }
 

ui/src/app/pages/apps-routes/app-installed-show/app-installed-show.page.html

@@ -20,7 +20,8 @@
      hasFetchedFull: app.hasFetchedFull | async,
      iconURL: app.iconURL | async,
      title: app.title | async,
-     ui: app.ui | async,
+     hasUI: app.hasUI | async,
+     launchable: app.launchable | async,
      lanAddress: app.lanAddress | async
   } as vars" class="ion-padding-bottom">
   <ion-spinner *ngIf="$loading$ | async" class="center" name="lines" color="warning"></ion-spinner>
@@ -77,7 +78,7 @@
         </ion-label>
       </ion-item>
 
-      <ion-button size="small" *ngIf="vars.status === AppStatus.RUNNING && vars.ui && !isConsulate" class="launch-button" expand="block" fill="outline" (click)="launchUiTab()">
+      <ion-button size="small" *ngIf="vars.hasUI" [disabled]="!vars.launchable" class="launch-button" expand="block" (click)="launchUiTab()">
         Launch Web Interface
         <ion-icon slot="end" name="rocket-outline"></ion-icon>
       </ion-button>
@@ -96,7 +97,7 @@
             <ion-icon slot="icon-only" name="copy-outline" color="primary"></ion-icon>
           </ion-button>
         </ion-item>
-        <ion-item *ngIf="vars.lanAddress" lines="none">
+        <ion-item *ngIf="!hideLAN" lines="none">
           <ion-label class="ion-text-wrap">
             <h2>LAN Address</h2>
             <p>{{ vars.lanAddress }}</p>

ui/src/app/pages/apps-routes/app-installed-show/app-installed-show.page.ts

@@ -32,8 +32,8 @@ export class AppInstalledShowPage extends Cleanup {
   appId: string
   AppStatus = AppStatus
   showInstructions = false
-  isConsulate: boolean
-  isTor: boolean
+
+  hideLAN: boolean
 
   dependencyDefintion = () => `<span style="font-style: italic">Dependencies</span> are other services which must be installed, configured appropriately, and started in order to start ${this.app.title.getValue()}`
 
@@ -51,11 +51,9 @@ export class AppInstalledShowPage extends Cleanup {
     private readonly wizardBaker: WizardBaker,
     private readonly appModel: AppModel,
     private readonly popoverController: PopoverController,
-    config: ConfigService,
+    private readonly config: ConfigService,
   ) {
     super()
-    this.isConsulate = config.isConsulateIos || config.isConsulateAndroid
-    this.isTor = config.isTor()
   }
 
   async ngOnInit () {
@@ -64,8 +62,12 @@ export class AppInstalledShowPage extends Cleanup {
     this.cleanup(
       markAsLoadingDuring$(this.$loading$, this.preload.appFull(this.appId))
         .pipe(
-          tap(app => this.app = app),
-          concatMap(() => this.syncWhenDependencyInstalls()), //must be final in stack
+          tap(app => {
+            this.app = app
+            const appP = peekProperties(this.app)
+            this.hideLAN = !appP.lanAddress || (appP.id === 'mastodon' && appP.versionInstalled === '3.3.0') // @TODO delete this hack in 0.3.0
+          }),
+          concatMap(() => this.syncWhenDependencyInstalls()), // must be final in stack
           catchError(e => of(this.setError(e))),
         ).subscribe(),
     )
@@ -98,7 +100,7 @@ export class AppInstalledShowPage extends Cleanup {
 
   async launchUiTab () {
     let uiAddress: string
-    if (this.isTor) {
+    if (this.config.isTor()) {
       uiAddress = `http://${this.app.torAddress.getValue()}`
     } else {
       uiAddress = `https://${this.app.lanAddress.getValue()}`

ui/src/app/pages/apps-routes/app-metrics/app-metrics.page.ts

@@ -130,7 +130,6 @@ export class AppMetricsPage {
 
   toggleMask (key: string) {
     this.unmasked[key] = !this.unmasked[key]
-    console.log(this.unmasked)
   }
 
   asIsOrder (a: any, b: any) {