Merge pull request #3444 from mempool/nymkappa/missing-docker

Update docker configs

backend/src/__tests__/config.test.ts

@@ -108,10 +108,10 @@ describe('Mempool Backend Config', () => {
       });
 
       expect(config.MAXMIND).toStrictEqual({
-        ENABLED: false,
+        ENABLED: true,
-        GEOLITE2_CITY: '/usr/local/share/GeoIP/GeoLite2-City.mmdb',
+        GEOLITE2_CITY: './backend/GeoIP/GeoLite2-City.mmdb',
-        GEOLITE2_ASN: '/usr/local/share/GeoIP/GeoLite2-ASN.mmdb',
+        GEOLITE2_ASN: './backend/GeoIP/GeoLite2-ASN.mmdb',
-        GEOIP2_ISP: '/usr/local/share/GeoIP/GeoIP2-ISP.mmdb'
+        GEOIP2_ISP: ''
       });
     });
   });

docker/README.md

@@ -438,7 +438,7 @@ Corresponding `docker-compose.yml` overrides:
 `mempool-config.json`:
 ```json
   "MAXMIND": {
-    "ENABLED": false,
+    "ENABLED": true,
     "GEOLITE2_CITY": "/usr/local/share/GeoIP/GeoLite2-City.mmdb",
     "GEOLITE2_ASN": "/usr/local/share/GeoIP/GeoLite2-ASN.mmdb",
     "GEOIP2_ISP": "/usr/local/share/GeoIP/GeoIP2-ISP.mmdb"
@@ -449,9 +449,9 @@ Corresponding `docker-compose.yml` overrides:
 ```yaml
   api:
     environment:
-      MAXMIND_ENABLED: "",
+      MAXMIND_ENABLED: true,
-      MAXMIND_GEOLITE2_CITY: "/usr/local/share/GeoIP/GeoLite2-City.mmdb",
+      MAXMIND_GEOLITE2_CITY: "/backend/GeoIP/GeoLite2-City.mmdb",
-      MAXMIND_GEOLITE2_ASN": "/usr/local/share/GeoIP/GeoLite2-ASN.mmdb",
+      MAXMIND_GEOLITE2_ASN": "/backend/GeoIP/GeoLite2-ASN.mmdb",
-      MAXMIND_GEOIP2_ISP": "/usr/local/share/GeoIP/GeoIP2-ISP.mmdb"
+      MAXMIND_GEOIP2_ISP": "/backend/GeoIP/GeoIP2-ISP.mmdb"
       ...
 ```

docker/backend/Dockerfile

@@ -17,6 +17,7 @@ WORKDIR /backend
 
 RUN chown 1000:1000 ./
 COPY --from=builder --chown=1000:1000 /build/package ./package/
+COPY --from=builder --chown=1000:1000 /build/GeoIP ./GeoIP/
 COPY --from=builder --chown=1000:1000 /build/mempool-config.json /build/start.sh /build/wait-for-it.sh ./
 
 USER 1000

docker/backend/mempool-config.json

@@ -109,7 +109,7 @@
     "BISQ_ONION": "__EXTERNAL_DATA_SERVER_BISQ_ONION__"
   },
   "MAXMIND": {
-    "ENABLED": "__MAXMIND_ENABLED__",
+    "ENABLED": __MAXMIND_ENABLED__,
     "GEOLITE2_CITY": "__MAXMIND_GEOLITE2_CITY__",
     "GEOLITE2_ASN": "__MAXMIND_GEOLITE2_ASN__",
     "GEOIP2_ISP": "__MAXMIND_GEOIP2_ISP__"

docker/backend/start.sh

@@ -112,10 +112,10 @@ __LND_REST_API_URL__=${LND_REST_API_URL:="https://localhost:8080"}
 __CLIGHTNING_SOCKET__=${CLIGHTNING_SOCKET:=""}
 
 # MAXMIND
-__MAXMIND_ENABLED__=${MAXMIND_ENABLED:=false}
+__MAXMIND_ENABLED__=${MAXMIND_ENABLED:=true}
-__MAXMIND_GEOLITE2_CITY__=${MAXMIND_GEOLITE2_CITY:="/usr/local/share/GeoIP/GeoLite2-City.mmdb"}
+__MAXMIND_GEOLITE2_CITY__=${MAXMIND_GEOLITE2_CITY:="/backend/GeoIP/GeoLite2-City.mmdb"}
-__MAXMIND_GEOLITE2_ASN__=${MAXMIND_GEOLITE2_ASN:="/usr/local/share/GeoIP/GeoLite2-ASN.mmdb"}
+__MAXMIND_GEOLITE2_ASN__=${MAXMIND_GEOLITE2_ASN:="/backend/GeoIP/GeoLite2-ASN.mmdb"}
-__MAXMIND_GEOIP2_ISP__=${MAXMIND_GEOIP2_IS:="/usr/local/share/GeoIP/GeoIP2-ISP.mmdb"}
+__MAXMIND_GEOIP2_ISP__=${MAXMIND_GEOIP2_ISP:=""}
 
 
 mkdir -p "${__MEMPOOL_CACHE_DIR__}"

docker/init.sh

@@ -3,6 +3,11 @@
 #backend
 cp ./docker/backend/* ./backend/
 
+#geoip-data
+mkdir -p ./backend/GeoIP/
+wget -O ./backend/GeoIP/GeoLite2-City.mmdb https://raw.githubusercontent.com/mempool/geoip-data/master/GeoLite2-City.mmdb
+wget -O ./backend/GeoIP/GeoLite2-ASN.mmdb https://raw.githubusercontent.com/mempool/geoip-data/master/GeoLite2-ASN.mmdb
+
 #frontend
 localhostIP="127.0.0.1"
 cp ./docker/frontend/* ./frontend

frontend/src/app/components/blocks-list/blocks-list.component.html

@@ -26,7 +26,7 @@
       </thead>
       <tbody *ngIf="blocks$ | async as blocks; else skeleton" [style]="isLoading ? 'opacity: 0.75' : ''">
         <tr *ngFor="let block of blocks; let i= index; trackBy: trackByBlock">
-          <td class="text-left" [class]="widget ? 'widget' : ''">
+          <td class="height text-left" [class]="widget ? 'widget' : ''">
             <a [routerLink]="['/block' | relativeUrl, block.id]" [state]="{ data: { block: block } }">{{ block.height }}</a>
           </td>
           <td  *ngIf="indexingAvailable" class="pool text-left" [ngClass]="{'widget': widget, 'legacy': !indexingAvailable}">
@@ -89,7 +89,6 @@
               <span class="skeleton-loader" style="max-width: 75px"></span>
             </td>
             <td *ngIf="indexingAvailable" class="pool text-left" [ngClass]="{'widget': widget, 'legacy': !indexingAvailable}">
-              <img width="1" height="25" style="opacity: 0">
               <span class="skeleton-loader" style="max-width: 125px"></span>
             </td>
             <td class="timestamp" *ngIf="!widget" [class]="indexingAvailable ? '' : 'legacy'">
@@ -98,7 +97,7 @@
             <td class="mined" *ngIf="!widget" [class]="indexingAvailable ? '' : 'legacy'">
               <span class="skeleton-loader" style="max-width: 125px"></span>
             </td>
-            <td *ngIf="auditAvailable" class="health text-left" [ngClass]="{'widget': widget, 'legacy': !indexingAvailable}">
+            <td *ngIf="auditAvailable" class="health text-right" [ngClass]="{'widget': widget, 'legacy': !indexingAvailable}">
               <span class="skeleton-loader" style="max-width: 75px"></span>
             </td>
             <td *ngIf="indexingAvailable" class="reward text-right" [ngClass]="{'widget': widget, 'legacy': !indexingAvailable}">

frontend/src/app/components/blocks-list/blocks-list.component.scss

@@ -51,7 +51,12 @@ tr, td, th {
 .pool.widget {
   width: 40%;
   padding-left: 24px;
-  @media (max-width: 376px) {
+  @media (min-width: 768px) AND (max-width: 926px) {
+    padding-left: 0px;
+    width: 60%;
+  }
+  @media (max-width: 430px) {
+    padding-left: 0px;
     width: 60%;
   }
 }
@@ -59,6 +64,10 @@ tr, td, th {
   display: inline-block;
   vertical-align: text-top;
   padding-left: 10px;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  max-width: 160px;
 }
 
 .height {
@@ -69,6 +78,12 @@ tr, td, th {
   @media (max-width: 576px) {
     width: 10%;
   }
+  @media (min-width: 768px) AND (max-width: 926px) {
+    width: 30%;
+  }
+  @media (max-width: 430px) {
+    width: 30%;
+  }
 }
 .height.legacy {
   width: 15%;
@@ -92,7 +107,7 @@ tr, td, th {
 
 .mined {
   width: 13%;
-  @media (max-width: 576px) {
+  @media (max-width: 730px) {
     display: none;
   }
 }
@@ -138,7 +153,7 @@ tr, td, th {
 
 .fees {
   width: 8%;
-  @media (max-width: 650px) {
+  @media (max-width: 820px) {
     display: none;
   }
 }
@@ -163,6 +178,16 @@ tr, td, th {
     width: 30%;
     padding-right: 0;
   }
+  @media (min-width: 768px) AND (max-width: 926px) {
+    overflow: hidden;
+    text-overflow: ellipsis;
+    max-width: 90px;
+  }
+  @media (max-width: 430px) {
+    overflow: hidden;
+    text-overflow: ellipsis;
+    max-width: 90px;
+  }
 }
 
 .size {
@@ -189,10 +214,10 @@ tr, td, th {
 
 .health {
   width: 10%;
-  @media (max-width: 1000px) {
+  @media (max-width: 1105px) {
     width: 13%;
   }
-  @media (max-width: 950px) {
+  @media (max-width: 560px) {
     display: none;
   }
 
@@ -202,7 +227,7 @@ tr, td, th {
 }
 .health.widget {
   width: 25%;
-  @media (max-width: 1000px) {
+  @media (max-width: 1105px) {
     display: none;
   }
   @media (max-width: 767px) {

frontend/src/app/components/difficulty-adjustments-table/difficulty-adjustments-table.component.html

@@ -2,17 +2,18 @@
   <table class="table latest-adjustments">
     <thead>
       <tr>
-        <th class="d-none d-md-block" i18n="block.height">Height</th>
+        <th class="" i18n="block.height">Height</th>
-        <th i18n="mining.adjusted" class="text-left">Adjusted</th>
+        <th class="date text-left" i18n="mining.adjusted">Adjusted</th>
-        <th i18n="mining.difficulty" class="text-right">Difficulty</th>
+        <th class="text-right" i18n="mining.difficulty">Difficulty</th>
-        <th i18n="mining.change" class="text-right">Change</th>
+        <th class="text-right" i18n="mining.change">Change</th>
       </tr>
     </thead>
     <tbody *ngIf="(hashrateObservable$ | async) as data">
       <tr *ngFor="let diffChange of data">
-        <td class="d-none d-md-block"><a [routerLink]="['/block' | relativeUrl, diffChange.height]">{{ diffChange.height
+        <td class="">
-            }}</a></td>
+          <a [routerLink]="['/block' | relativeUrl, diffChange.height]">{{ diffChange.height }}</a>
-        <td class="text-left">
+        </td>
+        <td class="date text-left">
           <app-time kind="since" [time]="diffChange.timestamp" [fastRender]="true"></app-time>
         </td>
         <td class="text-right">{{ diffChange.difficultyShorten }}</td>
@@ -23,8 +24,8 @@
     </tbody>
     <tbody *ngIf="isLoading">
       <tr *ngFor="let item of [1,2,3,4,5,6]">
-        <td class="d-none d-md-block w-75"><span class="skeleton-loader"></span></td>
+        <td class=""><span class="skeleton-loader"></span></td>
-        <td class="text-left"><span class="skeleton-loader w-75"></span></td>
+        <td class="date text-left"><span class="skeleton-loader w-75"></span></td>
         <td class="text-right"><span class="skeleton-loader w-75"></span></td>
         <td class="text-right"><span class="skeleton-loader w-75"></span></td>
       </tr>

frontend/src/app/components/difficulty-adjustments-table/difficulty-adjustments-table.component.scss

@@ -17,3 +17,12 @@
     }
   }
 }
+
+.date {
+  @media (min-width: 767px) AND (max-width: 991px) {
+    display: none;
+  }
+  @media (max-width: 500px) {
+    display: none;
+  }
+}