feat: add boltz service to cln

Ride-The-Lightning · Mar 7, 2024 · 15ff7c3 · 15ff7c3
1 parent b690206
commit 15ff7c3
Show file tree

Hide file tree

Showing 16 changed files with 68 additions and 28 deletions.
diff --git a/frontend/index.html b/frontend/index.html
diff --git a/frontend/main.1824016c5cb16488.js b/frontend/main.1824016c5cb16488.js
diff --git a/frontend/main.a7ebf40e077cad16.js b/frontend/main.a7ebf40e077cad16.js
diff --git a/frontend/styles.092da2fa10498671.css b/frontend/styles.092da2fa10498671.css
diff --git a/frontend/styles.427dee6dc31e9e59.css b/frontend/styles.427dee6dc31e9e59.css
diff --git a/src/app/app.routing.ts b/src/app/app.routing.ts
@@ -21,6 +21,7 @@ import { NotFoundComponent } from './shared/components/not-found/not-found.compo
 import { ErrorComponent } from './shared/components/error/error.component';
 import { AuthGuard } from './shared/services/auth.guard';
 import { ExperimentalSettingsComponent } from './shared/components/node-config/experimental-settings/experimental-settings.component';
+import { NoServiceFoundComponent } from './shared/components/node-config/services-settings/no-service-found/no-service-found.component';
 
 type PathMatch = 'full' | 'prefix' | undefined;
 
@@ -46,7 +47,8 @@ export const routes: Routes = [
         path: 'services', component: ServicesSettingsComponent, canActivate: [AuthGuard()], children: [
           { path: '', pathMatch: <PathMatch>'full', redirectTo: 'loop' },
           { path: 'loop', component: LoopServiceSettingsComponent, canActivate: [AuthGuard()] },
-          { path: 'boltz', component: BoltzServiceSettingsComponent, canActivate: [AuthGuard()] }
+          { path: 'boltz', component: BoltzServiceSettingsComponent, canActivate: [AuthGuard()] },
+          { path: 'noservice', component: NoServiceFoundComponent }
         ]
       },
       { path: 'experimental', component: ExperimentalSettingsComponent, canActivate: [AuthGuard()] },

diff --git a/src/app/shared/components/ln-services/boltz/swap-modal/swap-modal.component.html b/src/app/shared/components/ln-services/boltz/swap-modal/swap-modal.component.html
@@ -2,7 +2,7 @@
   <div fxFlex="100">
     <mat-card-header fxLayout="row" fxLayoutAlign="space-between center" class="modal-info-header">
       <div fxLayoutAlign="start start" [fxFlex]="screenSize === screenSizeEnum.XS || screenSize === screenSizeEnum.SM ? '83' : '91'"><span class="page-title">{{swapDirectionCaption}}</span></div>
-      <div fxLayoutAlign="space-between end" [fxFlex]="screenSize === screenSizeEnum.XS || screenSize === screenSizeEnum.SM ? '17' : '9'">
+      <div fxLayoutAlign="end end" [fxFlex]="screenSize === screenSizeEnum.XS || screenSize === screenSizeEnum.SM ? '17' : '9'">
         <button tabindex="21" class="btn-close-x p-0" mat-button (click)="showInfo()">?</button>
         <button tabindex="22" class="btn-close-x p-0" mat-button (click)="onClose()">X</button>
       </div>

diff --git a/src/app/shared/components/navigation/side-navigation/side-navigation.component.ts b/src/app/shared/components/navigation/side-navigation/side-navigation.component.ts
@@ -177,7 +177,8 @@ export class SideNavigationComponent implements OnInit, OnDestroy {
     this.navMenus.data = clonedMenu?.filter((navMenuData: any) => {
       if (navMenuData.children && navMenuData.children.length) {
         navMenuData.children = navMenuData.children?.filter((navMenuChild) => ((navMenuChild.userPersona === UserPersonaEnum.ALL || navMenuChild.userPersona === this.settings?.userPersona) && navMenuChild.link !== '/services/peerswap') ||
-        (navMenuChild.link === '/services/peerswap' && this.settings?.enablePeerswap));
+          (navMenuChild.link === '/services/peerswap' && this.settings?.enablePeerswap) ||
+          (navMenuChild.link === '/services/boltz' && this.settings?.boltzServerUrl && this.settings.boltzServerUrl.trim() !== ''));
         return navMenuData.children.length > 0;
       }
       return navMenuData.userPersona === UserPersonaEnum.ALL || navMenuData.userPersona === this.settings?.userPersona;

diff --git a/src/app/shared/components/node-config/node-config.component.html b/src/app/shared/components/node-config/node-config.component.html
@@ -8,7 +8,7 @@
       <nav mat-tab-nav-bar mat-stretch-tabs="false" mat-align-tabs="start" [tabPanel]="tabPanel">
         <div tabindex="1" role="tab" mat-tab-link class="mat-tab-label" [active]="activeLink === links[0].link" routerLink="{{links[0].link}}" (click)="activeLink = links[0].link">{{links[0].name}}</div>
         <div tabindex="2" role="tab" mat-tab-link class="mat-tab-label" [active]="activeLink === links[1].link" routerLink="{{links[1].link}}" (click)="activeLink = links[1].link">{{links[1].name}}</div>
-        <div *ngIf="selNode?.lnImplementation?.toUpperCase() === 'LND'" tabindex="3" role="tab" mat-tab-link class="mat-tab-label" [active]="activeLink === links[2].link" routerLink="{{links[2].link}}" [state]="{ initial: false }" (click)="activeLink = links[2].link">{{links[2].name}}</div>
+        <div *ngIf="selNode?.lnImplementation?.toUpperCase() !== 'ECL'" tabindex="3" role="tab" mat-tab-link class="mat-tab-label" [active]="activeLink === links[2].link" routerLink="{{links[2].link}}" [state]="{ initial: false }" (click)="activeLink = links[2].link">{{links[2].name}}</div>
         <div *ngIf="selNode?.lnImplementation?.toUpperCase() === 'CLN'" tabindex="4" role="tab" mat-tab-link class="mat-tab-label" [active]="activeLink === links[3].link" routerLink="{{links[3].link}}" (click)="activeLink = links[3].link">{{links[3].name}}</div>
         <div *ngIf="showLnConfig" tabindex="5" role="tab" mat-tab-link class="mat-tab-label" [active]="activeLink === links[4].link"  (click)="showLnConfigClicked()">{{links[4].name}}</div>
       </nav>

diff --git a/...components/node-config/services-settings/no-service-found/no-service-found.component.html b/...components/node-config/services-settings/no-service-found/no-service-found.component.html
@@ -0,0 +1,9 @@
+<div fxLayout="column" class="padding-gap-x">
+  <mat-card>
+    <mat-card-content fxLayout="column" class="padding-gap-large">
+      <div fxLayout="column" fxLayoutAlign="start start">
+        <div class="box-text">No Service Found!</div>
+      </div>
+    </mat-card-content>
+  </mat-card>
+</div>
diff --git a/...d/components/node-config/services-settings/no-service-found/no-service-found.component.ts b/...d/components/node-config/services-settings/no-service-found/no-service-found.component.ts
@@ -0,0 +1,11 @@
+import { Component } from '@angular/core';
+
+@Component({
+  selector: 'rtl-no-service-found',
+  templateUrl: './no-service-found.component.html'
+})
+export class NoServiceFoundComponent {
+
+  constructor() {}
+
+}
diff --git a/src/app/shared/components/node-config/services-settings/services-settings.component.html b/src/app/shared/components/node-config/services-settings/services-settings.component.html
@@ -8,9 +8,10 @@
   <mat-card>
     <mat-card-content fxLayout="column">
       <nav mat-tab-nav-bar mat-stretch-tabs="false" mat-align-tabs="start" [tabPanel]="tabPanel">
-        <div *ngIf="selNode?.lnImplementation?.toUpperCase() === 'LND'" tabindex="1" role="tab" mat-tab-link class="mat-tab-label" [active]="activeLink === links[0].link" routerLink="{{links[0].link}}" (click)="activeLink = links[0].link">{{links[0].name}}</div>
-        <div *ngIf="selNode?.lnImplementation?.toUpperCase() === 'LND'" tabindex="2" role="tab" mat-tab-link class="mat-tab-label" [active]="activeLink === links[1].link" routerLink="{{links[1].link}}" [state]="{ initial: false }" (click)="activeLink = links[1].link">{{links[1].name}}</div>
-        <div *ngIf="selNode?.lnImplementation?.toUpperCase() === 'CLN'" tabindex="3" role="tab" mat-tab-link class="mat-tab-label" [active]="activeLink === links[2].link" routerLink="{{links[2].link}}" (click)="activeLink = links[2].link">{{links[2].name}}</div>
+        <div *ngIf="selNode?.settings?.swapServerUrl?.trim() !== ''" tabindex="1" role="tab" mat-tab-link class="mat-tab-label" [active]="activeLink === links[0].link" routerLink="{{links[0].link}}" (click)="activeLink = links[0].link">{{links[0].name}}</div>
+        <div *ngIf="selNode?.settings?.boltzServerUrl?.trim() !== ''" tabindex="2" role="tab" mat-tab-link class="mat-tab-label" [active]="activeLink === links[1].link" routerLink="{{links[1].link}}" [state]="{ initial: false }" (click)="activeLink = links[1].link">{{links[1].name}}</div>
+        <div *ngIf="selNode?.settings?.enablePeerswap" tabindex="3" role="tab" mat-tab-link class="mat-tab-label" [active]="activeLink === links[2].link" routerLink="{{links[2].link}}" (click)="activeLink = links[2].link">{{links[2].name}}</div>
+        <div *ngIf="selNode?.settings?.swapServerUrl?.trim() === '' && selNode?.settings?.boltzServerUrl?.trim() === '' && !selNode?.settings?.enablePeerswap" tabindex="4" role="tab" mat-tab-link class="mat-tab-label" [active]="activeLink === links[3].link" routerLink="{{links[3].link}}" (click)="activeLink = links[3].link">{{links[3].name}}</div>
       </nav>
       <mat-tab-nav-panel #tabPanel />
       <div fxLayout="column" fxFlex="100" fxLayoutAlign="space-between stretch" class="mat-tab-body-wrapper">

diff --git a/src/app/shared/components/node-config/services-settings/services-settings.component.ts b/src/app/shared/components/node-config/services-settings/services-settings.component.ts
@@ -16,34 +16,42 @@ import { rootSelectedNode } from '../../../../store/rtl.selector';
 export class ServicesSettingsComponent implements OnInit, OnDestroy {
 
   public faLayerGroup = faLayerGroup;
-  public links = [{ link: 'loop', name: 'Loop' }, { link: 'boltz', name: 'Boltz' }, { link: 'peerswap', name: 'Peerswap' }];
+  public links = [{ link: 'loop', name: 'Loop' }, { link: 'boltz', name: 'Boltz' }, { link: 'peerswap', name: 'Peerswap' }, { link: 'noservice', name: 'No Service' }];
   public activeLink = '';
   public selNode: ConfigSettingsNode | any;
   private unSubs: Array<Subject<void>> = [new Subject(), new Subject(), new Subject()];
 
   constructor(private store: Store<RTLState>, private router: Router, private activatedRoute: ActivatedRoute) { }
 
   ngOnInit() {
-    const linkFound = this.links.find((link) => this.router.url.includes(link.link));
-    this.activeLink = linkFound ? linkFound.link : this.links[0].link;
+    this.setActiveLink();
     this.router.events.pipe(takeUntil(this.unSubs[0]), filter((e) => e instanceof ResolveEnd)).
       subscribe({
         next: (value: ResolveEnd | Event) => {
-          const linkFound = this.links.find((link) => (<ResolveEnd>value).urlAfterRedirects.includes(link.link));
-          if (this.selNode.lnImplementation.toUpperCase() === 'CLN') {
-            this.activeLink = this.links[2].link;
-          } else {
-            this.activeLink = linkFound ? linkFound.link : this.links[0].link;
-          }
+          this.setActiveLink();
         }
       });
     this.store.select(rootSelectedNode).pipe(takeUntil(this.unSubs[1])).subscribe((selNode) => {
       this.selNode = selNode;
-      if (this.selNode.lnImplementation.toUpperCase() === 'CLN') {
+      this.setActiveLink();
+      this.router.navigate(['./' + this.activeLink], { relativeTo: this.activatedRoute });
+    });
+  }
+
+  setActiveLink() {
+    if (this.selNode && this.selNode.settings) {
+      if (this.selNode.settings.swapServerUrl && this.selNode.settings.swapServerUrl.trim() !== '') {
+        this.activeLink = this.links[0].link;
+      } else if (this.selNode.settings.boltzServerUrl && this.selNode.settings.boltzServerUrl.trim() !== '') {
+        this.activeLink = this.links[1].link;
+      } else if (this.selNode.settings.enablePeerswap) {
         this.activeLink = this.links[2].link;
-        this.router.navigate(['./' + this.activeLink], { relativeTo: this.activatedRoute });
+      } else {
+        this.activeLink = this.links[this.links.length - 1].link;
       }
-    });
+    } else {
+      this.activeLink = this.links[this.links.length - 1].link;
+    }
   }
 
   ngOnDestroy() {

diff --git a/src/app/shared/models/navMenu.ts b/src/app/shared/models/navMenu.ts
@@ -64,11 +64,12 @@ export const MENU_DATA: MenuRootNode = {
         { id: 39, parentId: 3, name: 'Node/Fee Rates', iconType: 'FA', icon: faServer, link: '/cln/rates', userPersona: UserPersonaEnum.MERCHANT }
       ]
     },
-    // {
-    //   id: 4, parentId: 0, name: 'Services', iconType: 'FA', icon: faLayerGroup, link: '/services/peerswap', userPersona: UserPersonaEnum.ALL, children: [
-    //     { id: 41, parentId: 4, name: 'Peerswap', iconType: 'FA', icon: faHandshake, link: '/services/peerswap', userPersona: UserPersonaEnum.ALL },
-    //   ]
-    // },
+    {
+      id: 4, parentId: 0, name: 'Services', iconType: 'FA', icon: faLayerGroup, link: '/services/loop', userPersona: UserPersonaEnum.ALL, children: [
+        //{ id: 41, parentId: 4, name: 'Peerswap', iconType: 'FA', icon: faHandshake, link: '/services/peerswap', userPersona: UserPersonaEnum.ALL },
+        { id: 42, parentId: 4, name: 'Boltz', iconType: 'SVG', icon: 'boltzIconBlock', link: '/services/boltz', userPersona: UserPersonaEnum.ALL }
+      ]
+    },
     { id: 5, parentId: 0, name: 'Node Config', iconType: 'FA', icon: faTools, link: '/config', userPersona: UserPersonaEnum.ALL },
     { id: 6, parentId: 0, name: 'Help', iconType: 'FA', icon: faQuestion, link: '/help', userPersona: UserPersonaEnum.ALL }
   ],

diff --git a/src/app/shared/shared.module.ts b/src/app/shared/shared.module.ts
@@ -68,6 +68,7 @@ import { ServicesSettingsComponent } from './components/node-config/services-set
 import { LoopServiceSettingsComponent } from './components/node-config/services-settings/loop-service-settings/loop-service-settings.component';
 import { BoltzServiceSettingsComponent } from './components/node-config/services-settings/boltz-service-settings/boltz-service-settings.component';
 import { PeerswapServiceSettingsComponent } from './components/node-config/services-settings/peerswap-service-settings/peerswap-service-settings.component';
+import { NoServiceFoundComponent } from './components/node-config/services-settings/no-service-found/no-service-found.component';
 import { ExperimentalSettingsComponent } from './components/node-config/experimental-settings/experimental-settings.component';
 import { ErrorComponent } from './components/error/error.component';
 import { CurrencyUnitConverterComponent } from './components/currency-unit-converter/currency-unit-converter.component';
@@ -256,6 +257,7 @@ export const DEFAULT_DATE_FORMAT: MatDateFormats = {
     LoopServiceSettingsComponent,
     BoltzServiceSettingsComponent,
     PeerswapServiceSettingsComponent,
+    NoServiceFoundComponent,
     ExperimentalSettingsComponent,
     CurrencyUnitConverterComponent,
     HorizontalScrollerComponent,
@@ -296,6 +298,7 @@ export const DEFAULT_DATE_FORMAT: MatDateFormats = {
     LoopServiceSettingsComponent,
     BoltzServiceSettingsComponent,
     PeerswapServiceSettingsComponent,
+    NoServiceFoundComponent,
     ExperimentalSettingsComponent,
     CurrencyUnitConverterComponent,
     HorizontalScrollerComponent,

diff --git a/src/app/shared/theme/styles/root.scss b/src/app/shared/theme/styles/root.scss
@@ -1451,6 +1451,10 @@ mat-cell:last-of-type, .mdc-data-table__header-cell:last-of-type, mat-footer-cel
   padding: ($gap*1.25)  ($gap*1.25)  ($gap*1.25) $gap !important;
 }
 
+.mat-vertical-stepper-content {
+  margin: 0 $gap;  
+}
+
 .ellipsis-child {
   flex: 1;
   white-space: nowrap;