From bbf04648f95e9169369992bdad9600b8e44dcb37 Mon Sep 17 00:00:00 2001
From: Mononaut <github@monospace.live>
Date: Wed, 3 Aug 2022 16:43:47 +0000
Subject: [PATCH] Handle missing blocks/addresses in preview

---
 .../address/address-preview.component.ts      |  2 ++
 .../block/block-preview.component.ts          | 23 +++++++++++++++----
 .../src/app/services/opengraph.service.ts     |  6 +++--
 unfurler/package.json                         |  2 +-
 unfurler/src/index.ts                         |  6 ++---
 5 files changed, 29 insertions(+), 10 deletions(-)

diff --git a/frontend/src/app/components/address/address-preview.component.ts b/frontend/src/app/components/address/address-preview.component.ts
index b762d7c9e..37ee44e2e 100644
--- a/frontend/src/app/components/address/address-preview.component.ts
+++ b/frontend/src/app/components/address/address-preview.component.ts
@@ -73,6 +73,7 @@ export class AddressPreviewComponent implements OnInit, OnDestroy {
                 this.isLoadingAddress = false;
                 this.error = err;
                 console.log(err);
+                this.openGraphService.waitOver('address-data');
                 return of(null);
               })
             );
@@ -98,6 +99,7 @@ export class AddressPreviewComponent implements OnInit, OnDestroy {
           console.log(error);
           this.error = error;
           this.isLoadingAddress = false;
+          this.openGraphService.waitOver('address-data');
         }
       );
   }
diff --git a/frontend/src/app/components/block/block-preview.component.ts b/frontend/src/app/components/block/block-preview.component.ts
index e59bc9c6c..dd8ca170f 100644
--- a/frontend/src/app/components/block/block-preview.component.ts
+++ b/frontend/src/app/components/block/block-preview.component.ts
@@ -1,7 +1,7 @@
 import { Component, OnInit, OnDestroy, ViewChild, ElementRef } from '@angular/core';
 import { ActivatedRoute, ParamMap } from '@angular/router';
 import { ElectrsApiService } from '../../services/electrs-api.service';
-import { switchMap, tap, throttleTime, catchError, shareReplay, startWith, pairwise } from 'rxjs/operators';
+import { switchMap, tap, throttleTime, catchError, shareReplay, startWith, pairwise, filter } from 'rxjs/operators';
 import { of, Subscription, asyncScheduler } from 'rxjs';
 import { StateService } from '../../services/state.service';
 import { SeoService } from 'src/app/services/seo.service';
@@ -54,6 +54,7 @@ export class BlockPreviewComponent implements OnInit, OnDestroy {
         const blockHash: string = params.get('id') || '';
         this.block = undefined;
         this.error = undefined;
+        this.overviewError = undefined;
         this.fees = undefined;
 
         let isBlockHeight = false;
@@ -70,13 +71,24 @@ export class BlockPreviewComponent implements OnInit, OnDestroy {
           return this.electrsApiService.getBlockHashFromHeight$(parseInt(blockHash, 10))
             .pipe(
               switchMap((hash) => {
-                this.blockHash = hash;
-                return this.apiService.getBlock$(hash);
-              })
+                if (hash) {
+                  this.blockHash = hash;
+                  return this.apiService.getBlock$(hash);
+                } else {
+                  return null;
+                }
+              }),
+              catchError((err) => {
+                this.error = err;
+                this.openGraphService.waitOver('block-data');
+                this.openGraphService.waitOver('block-viz');
+                return of(null);
+              }),
             );
         }
         return this.apiService.getBlock$(blockHash);
       }),
+      filter((block: BlockExtended | void) => block != null),
       tap((block: BlockExtended) => {
         this.block = block;
         this.blockHeight = block.height;
@@ -104,6 +116,7 @@ export class BlockPreviewComponent implements OnInit, OnDestroy {
         .pipe(
           catchError((err) => {
             this.overviewError = err;
+            this.openGraphService.waitOver('block-viz');
             return of([]);
           }),
           switchMap((transactions) => {
@@ -123,6 +136,8 @@ export class BlockPreviewComponent implements OnInit, OnDestroy {
     (error) => {
       this.error = error;
       this.isLoadingOverview = false;
+      this.openGraphService.waitOver('block-viz');
+      this.openGraphService.waitOver('block-data');
       if (this.blockGraph) {
         this.blockGraph.destroy();
       }
diff --git a/frontend/src/app/services/opengraph.service.ts b/frontend/src/app/services/opengraph.service.ts
index 50f84fa11..9ed57b9e8 100644
--- a/frontend/src/app/services/opengraph.service.ts
+++ b/frontend/src/app/services/opengraph.service.ts
@@ -43,8 +43,10 @@ export class OpenGraphService {
       }
     });
 
-    // expose this service to global scope, so we can access it from the unfurler
-    window['ogService'] = this;
+    // expose routing method to global scope, so we can access it from the unfurler
+    window['ogService'] = {
+      loadPage: (path) => { return this.loadPage(path) }
+    };
   }
 
   setOgImage() {
diff --git a/unfurler/package.json b/unfurler/package.json
index 0d6d938d6..2d353bfdf 100644
--- a/unfurler/package.json
+++ b/unfurler/package.json
@@ -1,6 +1,6 @@
 {
   "name": "mempool-unfurl",
-  "version": "0.0.1",
+  "version": "0.0.2",
   "description": "Renderer for mempool open graph link preview images",
   "repository": {
     "type": "git",
diff --git a/unfurler/src/index.ts b/unfurler/src/index.ts
index f9ce6fd31..d97bd652d 100644
--- a/unfurler/src/index.ts
+++ b/unfurler/src/index.ts
@@ -193,11 +193,11 @@ class Server {
   getDefaultImageUrl() {
     switch (this.network) {
       case 'liquid':
-        return '/resources/liquid/liquid-network-preview.png';
+        return this.mempoolHost + '/resources/liquid/liquid-network-preview.png';
       case 'bisq':
-        return '/resources/bisq/bisq-markets-preview.png';
+        return this.mempoolHost + '/resources/bisq/bisq-markets-preview.png';
       default:
-        return '/resources/mempool-space-preview.png';
+        return this.mempoolHost + '/resources/mempool-space-preview.png';
     }
   }
 }