From debcd1808e3262a5f8e42527df4869af834239c0 Mon Sep 17 00:00:00 2001
From: softsimon <softsimon@protonmail.com>
Date: Sat, 15 Jan 2022 04:19:50 +0400
Subject: [PATCH] Displaying translators as twitter photos

---
 backend/src/index.ts                                   | 10 ++++++++++
 frontend/src/app/components/about/about.component.html |  7 ++++---
 2 files changed, 14 insertions(+), 3 deletions(-)

diff --git a/backend/src/index.ts b/backend/src/index.ts
index 96961affb..f6615d1c8 100644
--- a/backend/src/index.ts
+++ b/backend/src/index.ts
@@ -229,6 +229,16 @@ class Server {
           res.status(500).end();
         }
       })
+      .get(config.MEMPOOL.API_URL_PREFIX + 'translators/images/:id', async (req, res) => {
+        try {
+          const response = await axios.get('https://mempool.space/api/v1/translators/images/' + req.params.id, {
+            responseType: 'stream', timeout: 10000
+          });
+          response.data.pipe(res);
+        } catch (e) {
+          res.status(500).end();
+        }
+      })
     ;
 
     if (config.STATISTICS.ENABLED && config.DATABASE.ENABLED) {
diff --git a/frontend/src/app/components/about/about.component.html b/frontend/src/app/components/about/about.component.html
index d034c90a5..6f2cdec36 100644
--- a/frontend/src/app/components/about/about.component.html
+++ b/frontend/src/app/components/about/about.component.html
@@ -165,16 +165,17 @@
   </div>
 
   <ng-container *ngIf="translators$ | async | keyvalue as translators else loadingSponsors">
-    <div class="maintainers">
+    <div class="community-sponsor">
       <h3 i18n="about.translators">Translators</h3>
       <div class="wrapper">
         <ng-template ngFor let-translator [ngForOf]="translators">
           <a [href]="'https://twitter.com/' + translator.value" target="_blank" [title]="translator.key">
-            <span>{{ translator.value }}</span>
-          </a>,
+            <img class="image" [src]="'/api/v1/translators/images/' + translator.value" />
+          </a>
         </ng-template>
       </div>
     </div>
+    <br>
   </ng-container>
   
   <ng-container *ngIf="allContributors$ | async as contributors else loadingSponsors">