From d40344aa92c5e39fbc1616508ca6ec959516f54f Mon Sep 17 00:00:00 2001
From: softsimon <softsimon@protonmail.com>
Date: Fri, 5 May 2023 01:38:58 +0400
Subject: [PATCH] Global footer component that fixes Liquid

---
 .../bisq-main-dashboard.component.html        |  7 +----
 .../app/components/about/about.component.html |  3 +-
 .../liquid-master-page.component.html         |  3 +-
 .../master-page/master-page.component.html    | 23 +--------------
 .../master-page/master-page.component.scss    | 24 ----------------
 .../global-footer.component.html              | 22 +++++++++++++++
 .../global-footer.component.scss              | 23 +++++++++++++++
 .../global-footer/global-footer.component.ts  | 28 +++++++++++++++++++
 frontend/src/app/shared/shared.module.ts      |  3 ++
 9 files changed, 82 insertions(+), 54 deletions(-)
 create mode 100644 frontend/src/app/shared/components/global-footer/global-footer.component.html
 create mode 100644 frontend/src/app/shared/components/global-footer/global-footer.component.scss
 create mode 100644 frontend/src/app/shared/components/global-footer/global-footer.component.ts

diff --git a/frontend/src/app/bisq/bisq-main-dashboard/bisq-main-dashboard.component.html b/frontend/src/app/bisq/bisq-main-dashboard/bisq-main-dashboard.component.html
index 2d7df05e1..eab0537c7 100644
--- a/frontend/src/app/bisq/bisq-main-dashboard/bisq-main-dashboard.component.html
+++ b/frontend/src/app/bisq/bisq-main-dashboard/bisq-main-dashboard.component.html
@@ -107,12 +107,7 @@
 
   <app-language-selector></app-language-selector>
 
-  <div class="text-small text-center mt-3">
-    <a [routerLink]="['/terms-of-service']" i18n="shared.terms-of-service|Terms of Service">Terms of Service</a>
-    |
-    <a [routerLink]="['/privacy-policy']" i18n="shared.privacy-policy|Privacy Policy">Privacy Policy</a>
-  </div>
-
+  <app-global-footer></app-global-footer>
 </div>
 
 <ng-template #loadingTmpl>
diff --git a/frontend/src/app/components/about/about.component.html b/frontend/src/app/components/about/about.component.html
index 0b9b81dc6..f711bb167 100644
--- a/frontend/src/app/components/about/about.component.html
+++ b/frontend/src/app/components/about/about.component.html
@@ -432,11 +432,12 @@
     {{ (backendInfo$ | async)?.hostname }} (v{{ (backendInfo$ | async )?.version }}) [<a href="https://github.com/mempool/mempool/commit/{{ (backendInfo$ | async )?.gitCommit | slice:0:8 }}">{{ (backendInfo$ | async )?.gitCommit | slice:0:8 }}</a>]
   </div>
 
+  <br><br>
 </div>
 
-<br>
 
 <ng-template #loadingSponsors>
   <br>
   <div class="spinner-border text-light"></div>
 </ng-template>
+
diff --git a/frontend/src/app/components/liquid-master-page/liquid-master-page.component.html b/frontend/src/app/components/liquid-master-page/liquid-master-page.component.html
index 3df488c7f..6a2ad4965 100644
--- a/frontend/src/app/components/liquid-master-page/liquid-master-page.component.html
+++ b/frontend/src/app/components/liquid-master-page/liquid-master-page.component.html
@@ -96,5 +96,6 @@
 
 <router-outlet></router-outlet>
 
-<br>
+<app-global-footer></app-global-footer>
+
 </ng-container>
\ No newline at end of file
diff --git a/frontend/src/app/components/master-page/master-page.component.html b/frontend/src/app/components/master-page/master-page.component.html
index 3075b109a..a5efeeea2 100644
--- a/frontend/src/app/components/master-page/master-page.component.html
+++ b/frontend/src/app/components/master-page/master-page.component.html
@@ -69,26 +69,5 @@
   <router-outlet></router-outlet>
 </main>
 
-<footer *ngIf="networkPaths['mainnet'] !== '/about'">
-  <div class="pref-selectors">
-    <div class="selector">
-      <app-language-selector></app-language-selector>
-    </div>
-    <div class="selector">
-      <app-fiat-selector></app-fiat-selector>
-    </div>
-  </div>
-
-  <div class="terms-of-service">
-    <a [routerLink]="['/terms-of-service']" i18n="shared.terms-of-service|Terms of Service">Terms of Service</a>
-    |
-    <a [routerLink]="['/privacy-policy']" i18n="shared.privacy-policy|Privacy Policy">Privacy Policy</a>
-    |
-    <a *ngIf="officialMempoolSpace && networkPaths['mainnet'] === '/lightning' else broadcastTransaction" [routerLink]="['/lightning/group/the-mempool-open-source-project' | relativeUrl]">Connect to our nodes</a>
-    <ng-template #broadcastTransaction>
-      <a [routerLink]="['/tx/push' | relativeUrl]" i18n="shared.broadcast-transaction|Broadcast Transaction">Broadcast Transaction</a>
-    </ng-template>
-  </div>
-  <br>
-</footer>
+<app-global-footer></app-global-footer>
 </ng-container>
diff --git a/frontend/src/app/components/master-page/master-page.component.scss b/frontend/src/app/components/master-page/master-page.component.scss
index 39aee903d..54a22a470 100644
--- a/frontend/src/app/components/master-page/master-page.component.scss
+++ b/frontend/src/app/components/master-page/master-page.component.scss
@@ -193,27 +193,3 @@ nav {
     font-size: 7px;
   }
 }
-
-footer {
-  text-align: center;
-  margin-top: auto;
-}
-
-.terms-of-service {
-  margin-top: 1rem;
-}
-
-.pref-selectors {
-  display: flex;
-  flex-direction: row;
-  flex-wrap: wrap;
-  justify-content: center;
-
-  .selector {
-    margin-left: .5em;
-    margin-bottom: .5em;
-    &:first {
-      margin-left: 0;
-    }
-  }
-}
diff --git a/frontend/src/app/shared/components/global-footer/global-footer.component.html b/frontend/src/app/shared/components/global-footer/global-footer.component.html
new file mode 100644
index 000000000..1eca9e303
--- /dev/null
+++ b/frontend/src/app/shared/components/global-footer/global-footer.component.html
@@ -0,0 +1,22 @@
+<footer *ngIf="networkPaths['mainnet'] !== '/about'">
+  <div class="pref-selectors">
+    <div class="selector">
+      <app-language-selector></app-language-selector>
+    </div>
+    <div class="selector">
+      <app-fiat-selector></app-fiat-selector>
+    </div>
+  </div>
+
+  <div class="terms-of-service">
+    <a [routerLink]="['/terms-of-service']" i18n="shared.terms-of-service|Terms of Service">Terms of Service</a>
+    |
+    <a [routerLink]="['/privacy-policy']" i18n="shared.privacy-policy|Privacy Policy">Privacy Policy</a>
+    |
+    <a *ngIf="officialMempoolSpace && networkPaths['mainnet'] === '/lightning' else broadcastTransaction" [routerLink]="['/lightning/group/the-mempool-open-source-project' | relativeUrl]">Connect to our nodes</a>
+    <ng-template #broadcastTransaction>
+      <a [routerLink]="['/tx/push' | relativeUrl]" i18n="shared.broadcast-transaction|Broadcast Transaction">Broadcast Transaction</a>
+    </ng-template>
+  </div>
+  <br>
+</footer>
\ No newline at end of file
diff --git a/frontend/src/app/shared/components/global-footer/global-footer.component.scss b/frontend/src/app/shared/components/global-footer/global-footer.component.scss
new file mode 100644
index 000000000..37da744fe
--- /dev/null
+++ b/frontend/src/app/shared/components/global-footer/global-footer.component.scss
@@ -0,0 +1,23 @@
+footer {
+  text-align: center;
+  margin-top: auto;
+}
+
+.terms-of-service {
+  margin-top: 1rem;
+}
+
+.pref-selectors {
+  display: flex;
+  flex-direction: row;
+  flex-wrap: wrap;
+  justify-content: center;
+
+  .selector {
+    margin-left: .5em;
+    margin-bottom: .5em;
+    &:first {
+      margin-left: 0;
+    }
+  }
+}
diff --git a/frontend/src/app/shared/components/global-footer/global-footer.component.ts b/frontend/src/app/shared/components/global-footer/global-footer.component.ts
new file mode 100644
index 000000000..6d161b7dd
--- /dev/null
+++ b/frontend/src/app/shared/components/global-footer/global-footer.component.ts
@@ -0,0 +1,28 @@
+import { ChangeDetectionStrategy, Component, OnInit } from '@angular/core';
+import { NavigationService } from '../../../services/navigation.service';
+import { Env, StateService } from '../../../services/state.service';
+
+@Component({
+  selector: 'app-global-footer',
+  templateUrl: './global-footer.component.html',
+  styleUrls: ['./global-footer.component.scss'],
+  changeDetection: ChangeDetectionStrategy.OnPush,
+})
+export class GlobalFooterComponent implements OnInit {
+  env: Env;
+  networkPaths: { [network: string]: string };
+  officialMempoolSpace = this.stateService.env.OFFICIAL_MEMPOOL_SPACE;
+
+  constructor(
+    public stateService: StateService,
+    private navigationService: NavigationService,
+  ) {}
+
+  ngOnInit(): void {
+    this.env = this.stateService.env;
+    this.navigationService.subnetPaths.subscribe((paths) => {
+      this.networkPaths = paths;
+    });
+  }
+
+}
diff --git a/frontend/src/app/shared/shared.module.ts b/frontend/src/app/shared/shared.module.ts
index 7286056f9..7d3e51d20 100644
--- a/frontend/src/app/shared/shared.module.ts
+++ b/frontend/src/app/shared/shared.module.ts
@@ -88,6 +88,7 @@ import { TimestampComponent } from './components/timestamp/timestamp.component';
 import { ToggleComponent } from './components/toggle/toggle.component';
 import { GeolocationComponent } from '../shared/components/geolocation/geolocation.component';
 import { TestnetAlertComponent } from './components/testnet-alert/testnet-alert.component';
+import { GlobalFooterComponent } from './components/global-footer/global-footer.component';
 
 @NgModule({
   declarations: [
@@ -170,6 +171,7 @@ import { TestnetAlertComponent } from './components/testnet-alert/testnet-alert.
     ToggleComponent,
     GeolocationComponent,
     TestnetAlertComponent,
+    GlobalFooterComponent,
   ],
   imports: [
     CommonModule,
@@ -276,6 +278,7 @@ import { TestnetAlertComponent } from './components/testnet-alert/testnet-alert.
     ToggleComponent,
     GeolocationComponent,
     PreviewTitleComponent,
+    GlobalFooterComponent,
   ]
 })
 export class SharedModule {