You cannot select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
RTL/src/app/shared/components/node-config/experimental-settings/experimental-settings.compo...

110 lines
8.6 KiB
HTML

<div fxLayout="column" fxFlex="100" [perfectScrollbar]>
<div class="alert alert-info mt-1">
<fa-icon class="mr-1 alert-icon" [icon]="faInfoCircle"></fa-icon>
<span>Experimental features should be enabled with caution. Many such features may be implementation specific and not ratified for the BOLT spec. Enabling these may still result in a broken experience. Referencing relevant feature documentation is highly advised before enabling.</span>
</div>
<form #form="ngForm" fxLayout="column" fxLayoutAlign="start stretch" class="page-sub-title-container mt-1">
<div fxLayout="row">
<fa-icon class="page-title-img mr-1" [icon]="faCode"></fa-icon>
<span class="page-title">Features</span>
</div>
<mat-accordion>
<mat-expansion-panel *ngFor="let feature of features; index as i" class="flat-expansion-panel my-1" [expanded]="false" (opened)="onPanelExpanded(i)">
<mat-expansion-panel-header>
<mat-panel-title fxFlex="100" fxLayoutAlign="space-between center">
<h4 class="font-bold-500">{{feature.name}}</h4>
<h4 class="font-bold-500">
<span *ngIf="feature.enabled" class="dot green"></span>
<span *ngIf="!feature.enabled" class="dot yellow"></span>
{{feature.enabled ? 'Enabled' : 'Disabled'}}
</h4>
</mat-panel-title>
</mat-expansion-panel-header>
<div fxLayout="column" fxFlex="100" fxLayoutAlign="start stretch">
<form *ngIf="i === 0" #form="ngForm" fxLayout="column" fxFlex="100" fxLayoutAlign="start stretch" class="page-sub-title-container">
<div fxFlex="100" class="alert alert-info">
<fa-icon class="mr-1 alert-icon" [icon]="faInfoCircle"></fa-icon>
<span>Please ensure that <strong>experimental-offers</strong> flag is set to true in the Core Lightning config before enabling it in RTL. Click <strong><a href="http://bolt12.org" target="_blank">here</a></strong> to learn more about Core Lightning offers.</span>
</div>
<h4 class="mt-2">Description</h4>
<span>Offers is a draft specification (also referred as BOLT12) for Lightning nodes and wallets, with experimental support in Core Lightning.</span>
<h4 class="mt-2">Links</h4>
<span><a href="https://github.com/lightningnetwork/lightning-rfc/pull/798 " target="blank">Core lightning Bolt12</a></span>
<mat-divider class="my-2" [inset]="true"></mat-divider>
<div class="alert alert-warn">
<fa-icon class="mr-1 alert-icon" [icon]="faExclamationTriangle"></fa-icon>
<span>Do not get an Offer tattoo until spec is fully ratified!</span>
</div>
<mat-slide-toggle autoFocus class="my-1" tabindex="1" color="primary" name="enableOfr" [(ngModel)]="enableOffers" (change)="onUpdateFeature()">Enable Offers {{enableOffers ? '(You can find Offers under Lightning -> Transactions -> Offers)' : ''}}</mat-slide-toggle>
</form>
<form *ngIf="i === 1" #form="ngForm" fxLayout="column" fxFlex="100" fxLayoutAlign="start stretch" class="page-sub-title-container">
<div *ngIf="!features[1].enabled">
<div fxFlex="100" fxLayout="row" class="alert alert-warn">
<fa-icon class="mr-1 alert-icon" [icon]="faExclamationTriangle"></fa-icon>
<span>Please ensure that <strong>experimental-dual-fund</strong> flag is set to true in the Core Lightning config before enabling it in RTL. Click <strong><a href="https://medium.com/blockstream/setting-up-liquidity-ads-in-c-lightning-54e4c59c091d" target="_blank">here</a></strong> to learn more about Core Lightning Liquidity Ads.</span>
</div>
</div>
<div *ngIf="features[1].enabled" fxLayout="column">
<div fxFlex="100" fxLayout="row" class="alert alert-warn mb-2">
<fa-icon class="mr-1 alert-icon" [icon]="faExclamationTriangle"></fa-icon>
<span>These config changes should be configured permanently via the config file on your CLN node otherwise the policy would need to be configured again, if your node restarts.</span>
</div>
<div fxLayout="column" fxLayout.gt-sm="row" fxFlex="100" fxLayoutAlign.gt-sm="space-between center" fxLayoutAlign="start stretch">
<mat-form-field fxLayout="column" fxFlex="49" fxLayoutAlign="start end">
<mat-label>Policy</mat-label>
<mat-select autofocus tabindex="1" name="policy" [(ngModel)]="selPolicyType" (selectionChange)="policyMod=null">
<mat-option *ngFor="let policyType of policyTypes" [value]="policyType">
{{policyType.id | titlecase}}
</mat-option>
</mat-select>
</mat-form-field>
<mat-form-field fxLayout="column" fxFlex="49">
<mat-label>{{selPolicyType.placeholder}}</mat-label>
<input #plcMod="ngModel" matInput type="number" tabindex="2" required name="plcMod" [step]="selPolicyType.id === 'fixed' ? 1000 : 10" [min]="selPolicyType.min" [max]="selPolicyType.max" [(ngModel)]="policyMod">
<mat-hint>{{selPolicyType.placeholder}} should be between {{selPolicyType.min}} and {{selPolicyType.max}}</mat-hint>
<mat-error *ngIf="!policyMod">{{selPolicyType.placeholder}} is required.</mat-error>
<mat-error *ngIf="policyMod < selPolicyType.min">{{selPolicyType.placeholder}} must be greater than or equal to {{selPolicyType.min}}.</mat-error>
<mat-error *ngIf="policyMod > selPolicyType.max">{{selPolicyType.placeholder}} must be less than or equal to {{selPolicyType.max}}.</mat-error>
</mat-form-field>
</div>
<div fxLayout="column" fxLayout.gt-sm="row" fxFlex="100" fxLayoutAlign.gt-sm="space-between center" fxLayoutAlign="start stretch">
<mat-form-field fxLayout="column" fxFlex="49">
<mat-label>Lease Base Fee (Sats)</mat-label>
<input matInput type="number" step="100" min="0" tabindex="3" required name="lease_fee_base_sat" [(ngModel)]="lease_fee_base_sat">
<mat-error *ngIf="!lease_fee_base_sat">Lease base fee is required.</mat-error>
</mat-form-field>
<mat-form-field fxLayout="column" fxFlex="49">
<mat-label>Lease Base Basis (bps)</mat-label>
<input matInput type="number" step="1" min="0" tabindex="4" required name="lease_fee_basis" [(ngModel)]="lease_fee_basis">
<mat-error *ngIf="!lease_fee_basis">Lease base basis is required.</mat-error>
</mat-form-field>
</div>
<div fxLayout="column" fxLayout.gt-sm="row" fxFlex="100" fxLayoutAlign.gt-sm="space-between center" fxLayoutAlign="start stretch">
<mat-form-field fxLayout="column" fxFlex="49">
<mat-label>Max Channel Routing Base Fee (Sats)</mat-label>
<input matInput type="number" step="100" min="0" tabindex="5" required name="channelFeeMaxBaseSat" [(ngModel)]="channelFeeMaxBaseSat">
<mat-error *ngIf="!channelFeeMaxBaseSat">Max channel routing base fee is required.</mat-error>
</mat-form-field>
<mat-form-field fxLayout="column" fxFlex="49">
<mat-label>Max Channel Routing Fee Rate (ppm)</mat-label>
<input matInput type="number" step="1000" min="0" tabindex="6" required name="channelFeeMaxProportional" [(ngModel)]="channelFeeMaxProportional">
<mat-error *ngIf="!channelFeeMaxProportional">Max channel routing fee rate is required.</mat-error>
</mat-form-field>
</div>
<h4 *ngIf="flgUpdateCalled" fxLayoutAlign="start stretch" class="font-bold-500 mt-2">
<span fxFlex="100" class="alert" [ngClass]="{'alert-danger': !!updateMsg.error, 'alert-info': !!updateMsg.data}">
{{(updateMsg.error && updateMsg.error !== '') ? (('Error: ' + updateMsg.error) || 'Unknown Error') : (updateMsg.data && updateMsg.data !== '') ? updateMsg.data : 'Successfully Updated the Funding Policy!'}}
</span>
</h4>
<div fxLayout="row" class="my-1">
<button class="mr-1" mat-stroked-button color="primary" tabindex="7" (click)="onResetPolicy()">Reset</button>
<button mat-flat-button color="primary" tabindex="8" (click)="onUpdateFundingPolicy()">Update</button>
</div>
</div>
</form>
</div>
</mat-expansion-panel>
</mat-accordion>
</form>
</div>