From 8541274d9cf6e104a123661221eccb1f30cf5a6e Mon Sep 17 00:00:00 2001
From: Ronny Esterluss <ronny.esterluss@hoprnet.org>
Date: Thu, 30 May 2024 14:53:37 +0200
Subject: [PATCH] update production to uHTTP v3

---
 frontend/package.json |  2 +-
 frontend/src/Icon.js  | 26 ++++++++------------------
 frontend/yarn.lock    |  8 ++++----
 server/index.ts       | 12 +++---------
 4 files changed, 16 insertions(+), 32 deletions(-)

diff --git a/frontend/package.json b/frontend/package.json
index 450acb9..83a5b23 100644
--- a/frontend/package.json
+++ b/frontend/package.json
@@ -3,7 +3,7 @@
   "version": "0.2.0",
   "private": true,
   "dependencies": {
-    "@hoprnet/phttp-lib": "^2.0.4",
+    "@hoprnet/phttp-lib": "^3.0.1",
     "@testing-library/jest-dom": "^5.17.0",
     "@testing-library/react": "^13.4.0",
     "@testing-library/user-event": "^13.5.0",
diff --git a/frontend/src/Icon.js b/frontend/src/Icon.js
index 8a778cc..9d5e067 100644
--- a/frontend/src/Icon.js
+++ b/frontend/src/Icon.js
@@ -19,11 +19,9 @@ function Icon(props) {
         set_ethAddress(ethAddress);
         try {
             const rez = await fetch(`https://${props.serverurl}/logo/${ethAddress}`, { cache: "no-store" })
-            const base64 = await rez.text();
-            if(base64 && base64.includes('base64')) {
-                console.log('Got icon', ethAddress, base64);
-                set_icon(base64);
-            }
+            const blob = await rez.blob();
+            const icon = URL.createObjectURL(blob);
+            set_icon(icon);
         } catch (e) {
             console.warn(`No icon for ${ethAddress}`, e)
         }
@@ -32,20 +30,12 @@ function Icon(props) {
     async function getIcon_uHTTP(ethAddress) {
         set_ethAddress(ethAddress);
         try {
-            props.uHTTP
-            .fetch(`https://${props.serverurl}/logo/${ethAddress}`)
-            .then(async (resp) => {
-                const base64 = resp.text;
-                if(base64 && base64.includes('base64')) {
-                    console.log('Got icon through uHTTP', ethAddress, base64);
-                    set_icon(base64);
-                }
-            })
-            .catch((err) => {
-                console.error('uHTTP error:', err);
-            });
+            const rez = await props.uHTTP.fetch(`https://${props.serverurl}/logo/${ethAddress}`)
+            const blob = await rez.blob();
+            const icon = URL.createObjectURL(blob);
+            set_icon(icon);
         } catch (e) {
-            console.warn(`No icon for ${ethAddress}`, e)
+            console.warn(`[uHTTP] No icon for ${ethAddress}`, e)
         }
     }
 
diff --git a/frontend/yarn.lock b/frontend/yarn.lock
index fae2bef..392d886 100644
--- a/frontend/yarn.lock
+++ b/frontend/yarn.lock
@@ -1319,10 +1319,10 @@
     "@noble/curves" "^1.3.0"
     "@noble/hashes" "^1.3.3"
 
-"@hoprnet/phttp-lib@^2.0.4":
-  version "2.0.4"
-  resolved "https://registry.yarnpkg.com/@hoprnet/phttp-lib/-/phttp-lib-2.0.4.tgz#8d7c70f749ee396f5296720d899afe969feffac9"
-  integrity sha512-+slydvfmr0X/k/rUO7CHPpSrXkmtIPwsMOOWhuTLNCBonf/PcupQQNipF/fKSrB0z3oOUqxyRuvOv/P8Qe4WXg==
+"@hoprnet/phttp-lib@^3.0.1":
+  version "3.0.1"
+  resolved "https://registry.yarnpkg.com/@hoprnet/phttp-lib/-/phttp-lib-3.0.1.tgz#2204a45c08829db85b009d5fd9d504a6c59f460f"
+  integrity sha512-+YIYJjetF/oxj06pAuHxjPlffQcMiXoJJRn2QStiriV8IarRL/bm4OnS3GOiqacLrHIt6vVrARCgTb0cagkC4Q==
   dependencies:
     "@hoprnet/phttp-crypto" "^1.0.0"
     debug "^4.3.4"
diff --git a/server/index.ts b/server/index.ts
index 58dde03..0fa0ae9 100644
--- a/server/index.ts
+++ b/server/index.ts
@@ -74,15 +74,9 @@ export async function handleRequest(
 
 async function fetchLogo(url: string, request: WorkerRequest) {
   return fetch(url, request).then(async function (response) {
-    const blob = await response.blob();
-    let buffer = Buffer.from(await blob.arrayBuffer());
-    const base64 =  "data:" + blob.type + ';base64,' + buffer.toString('base64');
-    return new Response(base64, {
-      status: 200,
-      headers: {
-        'Access-Control-Allow-Origin': '*',
-      }
-    });
+      const headers = new Headers(response.headers);
+      headers.set('Access-Control-Allow-Origin', '*');
+      return new Response(response.body, { headers });
   });
 }