mirrors/Ride-The-Lightning-RTL
1
0
Fork 0
mirror of https://github.com/Ride-The-Lightning/RTL.git synced 2025-02-22 14:22:48 +01:00
Code Issues Projects Releases Wiki Activity

Issue #123 Invoices Pagination

Browse source 
Issue #123 Invoices Pagination
This commit is contained in:
ShahanaFarooqui 2019-05-07 21:30:48 -04:00
parent 2774185532
commit 0aa7ceb4c5
12 changed files with 78 additions and 30 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
angular/3rdpartylicenses.txt
View file

@ -109,6 +109,8 @@ THE SOFTWARE.
@angular/material/menu
@angular/material/paginator
@angular/material/progress-bar
@angular/material/progress-spinner

2
angular/index.html
View file

@ -8,5 +8,5 @@
<link rel="stylesheet" href="styles.c7b8be38c41a5a330ca0.css"></head>
<body>
<rtl-app></rtl-app>
<script type="text/javascript" src="runtime.26209474bfa8dc87a77c.js"></script><script type="text/javascript" src="polyfills.181b5a67c421a167a96a.js"></script><script type="text/javascript" src="main.11e4e75d1dc9ee4c1cca.js"></script></body>
<script type="text/javascript" src="runtime.26209474bfa8dc87a77c.js"></script><script type="text/javascript" src="polyfills.181b5a67c421a167a96a.js"></script><script type="text/javascript" src="main.0ea4778e50c6d2f27c62.js"></script></body>
</html>

1
angular/main.0ea4778e50c6d2f27c62.js Normal file
View file

File diff suppressed because one or more lines are too long

1
angular/main.11e4e75d1dc9ee4c1cca.js
View file

File diff suppressed because one or more lines are too long

3
controllers/invoices.js
View file

@ -26,7 +26,8 @@ exports.getInvoice = (req, res, next) => {
exports.listInvoices = (req, res, next) => {
options = common.getOptions();
options.url = common.getSelLNDServerUrl() + '/invoices';
options.url = common.getSelLNDServerUrl() + '/invoices?num_max_invoices=' + req.query.num_max_invoices + '&index_offset=' + req.query.index_offset +
'&reversed=' + req.query.reversed;
request(options).then((body) => {
const body_str = (undefined === body) ? '' : JSON.stringify(body);
const search_idx = (undefined === body) ? -1 : body_str.search('Not Found');

2
src/app/app.component.ts
View file

@ -121,7 +121,7 @@ export class AppComponent implements OnInit, AfterViewInit, OnDestroy {
this.store.dispatch(new RTLActions.FetchNetwork());
this.store.dispatch(new RTLActions.FetchChannels({routeParam: 'all', channelStatus: ''}));
this.store.dispatch(new RTLActions.FetchChannels({routeParam: 'pending', channelStatus: ''}));
this.store.dispatch(new RTLActions.FetchInvoices());
this.store.dispatch(new RTLActions.FetchInvoices({num_max_invoices: 25, reversed: true}));
this.store.dispatch(new RTLActions.FetchPayments());
}

1
src/app/pages/invoices/invoices.component.html
View file

@ -70,6 +70,7 @@
<tr mat-header-row *matHeaderRowDef="displayedColumns; sticky: flgSticky;"></tr>
<tr mat-row *matRowDef="let row; columns: displayedColumns;" [@newlyAddedRowAnimation]="(row.memo === newlyAddedInvoiceMemo && row.value === newlyAddedInvoiceValue && flgAnimate) ? 'added' : 'notAdded'" (click)="onInvoiceClick(row, $event)"></tr>
</table>
<mat-paginator [length]="totalInvoices" [pageSize]="25" [pageSizeOptions]="pageSizeOptions" (page)="onPageChange($event)"></mat-paginator>
</div>
</mat-card-content>
</mat-card>

25
src/app/pages/invoices/invoices.component.ts
View file

@ -34,6 +34,10 @@ export class InvoicesComponent implements OnInit, OnDestroy {
public information: GetInfo = {};
public flgLoading: Array<Boolean | 'error'> = [true];
public flgSticky = false;
public totalInvoices = 100;
public pageSizeOptions = [5, 10, 25, 100];
private firstOffset = -1;
private lastOffset = -1;
private unSubs: Array<Subject<void>> = [new Subject(), new Subject(), new Subject(), new Subject(), new Subject()];
constructor(private logger: LoggerService, private store: Store<fromRTLReducer.State>, private actions$: Actions) {
@ -69,10 +73,13 @@ export class InvoicesComponent implements OnInit, OnDestroy {
});
this.selNode = rtlStore.selNode;
this.information = rtlStore.information;
this.totalInvoices = rtlStore.totalInvoices;
this.firstOffset = +rtlStore.invoices.first_index_offset;
this.lastOffset = +rtlStore.invoices.last_index_offset;
this.logger.info(rtlStore);
this.loadInvoicesTable(rtlStore.invoices);
this.loadInvoicesTable(rtlStore.invoices.invoices);
if (this.flgLoading[0] !== 'error') {
this.flgLoading[0] = (undefined !== rtlStore.invoices[0]) ? false : true;
this.flgLoading[0] = (undefined !== rtlStore.invoices.invoices[0]) ? false : true;
}
});
@ -134,6 +141,20 @@ export class InvoicesComponent implements OnInit, OnDestroy {
this.invoices.filter = selFilter;
}
onPageChange(event: any) {
let reversed = true;
let index_offset = this.firstOffset;
if (event.pageIndex < event.previousPageIndex) {
reversed = false;
index_offset = this.lastOffset;
}
if (event.pageIndex === event.previousPageIndex) {
reversed = true;
index_offset = 0;
}
this.store.dispatch(new RTLActions.FetchInvoices({num_max_invoices: event.pageSize, index_offset: index_offset, reversed: reversed}));
}
ngOnDestroy() {
this.unSubs.forEach(completeSub => {
completeSub.next();

5
src/app/shared/shared.module.ts
View file

@ -5,7 +5,8 @@ import { FlexLayoutModule } from '@angular/flex-layout';
import {
MatButtonModule, MatButtonToggleModule, MatCardModule, MatCheckboxModule, MatDialogModule, MatExpansionModule, MatGridListModule, MatDatepickerModule,
MatIconModule, MatInputModule, MatListModule, MatMenuModule, MatProgressBarModule, MatProgressSpinnerModule, MatRadioModule, MatTreeModule, MatNativeDateModule,
MatSelectModule, MatSidenavModule, MatSlideToggleModule, MatSortModule, MatTableModule, MatToolbarModule, MatTooltipModule, MAT_DIALOG_DEFAULT_OPTIONS, MatBadgeModule
MatSelectModule, MatSidenavModule, MatSlideToggleModule, MatSortModule, MatTableModule, MatToolbarModule, MatTooltipModule, MAT_DIALOG_DEFAULT_OPTIONS, MatBadgeModule,
MatPaginatorModule
} from '@angular/material';
import { QRCodeModule } from 'angularx-qrcode';
import { AlertMessageComponent } from './components/alert-message/alert-message.component';
@ -48,6 +49,7 @@ import { RemoveLeadingZerosPipe } from './pipes/remove-leading-zero.pipe';
MatToolbarModule,
MatTooltipModule,
MatBadgeModule,
MatPaginatorModule,
QRCodeModule
],
exports: [
@ -77,6 +79,7 @@ import { RemoveLeadingZerosPipe } from './pipes/remove-leading-zero.pipe';
MatToolbarModule,
MatTooltipModule,
MatBadgeModule,
MatPaginatorModule,
AlertMessageComponent,
ConfirmationMessageComponent,
SpinnerDialogComponent,

13
src/app/shared/store/rtl.actions.ts
View file

@ -2,7 +2,7 @@ import { Action } from '@ngrx/store';
import { RTLConfiguration, Settings, Node } from '../models/RTLconfig';
import { ErrorPayload } from '../models/errorPayload';
import {
GetInfo, Peer, Balance, NetworkInfo, Fees, Channel, Invoice, Payment, GraphNode, AddressType,
GetInfo, Peer, Balance, NetworkInfo, Fees, Channel, Invoice, ListInvoices, Payment, GraphNode, AddressType,
PayRequest, ChannelsTransaction, PendingChannels, ClosedChannel, Transaction, SwitchReq, SwitchRes
} from '../models/lndModels';
import { MatDialogConfig } from '@angular/material';
@ -48,6 +48,7 @@ export const CLOSE_CHANNEL = 'CLOSE_CHANNEL';
export const REMOVE_CHANNEL = 'REMOVE_CHANNEL';
export const FETCH_INVOICES = 'FETCH_INVOICES';
export const SET_INVOICES = 'SET_INVOICES';
export const SET_TOTAL_INVOICES = 'SET_TOTAL_INVOICES';
export const FETCH_TRANSACTIONS = 'FETCH_TRANSACTIONS';
export const SET_TRANSACTIONS = 'SET_TRANSACTIONS';
export const FETCH_PAYMENTS = 'FETCH_PAYMENTS';
@ -255,11 +256,17 @@ export class RemoveChannel implements Action {
export class FetchInvoices implements Action {
readonly type = FETCH_INVOICES;
constructor(public payload: {num_max_invoices?: number, index_offset?: number, reversed?: boolean}) {}
}
export class SetInvoices implements Action {
readonly type = SET_INVOICES;
constructor(public payload: Invoice[]) {}
constructor(public payload: ListInvoices) {}
}
export class SetTotalInvoices implements Action {
readonly type = SET_TOTAL_INVOICES;
constructor(public payload: number) {}
}
export class FetchTransactions implements Action {
@ -402,7 +409,7 @@ export type RTLActions =
FetchChannels | SetChannels | SetPendingChannels | SetClosedChannels | UpdateChannels |
SaveNewChannel | CloseChannel | RemoveChannel |
FetchTransactions | SetTransactions |
FetchInvoices | SetInvoices |
FetchInvoices | SetInvoices | SetTotalInvoices |
FetchPayments | SetPayments | SendPayment |
DecodePayment | SetDecodedPayment |
FetchGraphNode | SetGraphNode |

38
src/app/shared/store/rtl.effects.ts
View file

@ -11,7 +11,7 @@ import { MatDialog } from '@angular/material';
import { environment } from '../../../environments/environment';
import { LoggerService } from '../services/logger.service';
import { Settings } from '../models/RTLconfig';
import { GetInfo, Fees, Balance, NetworkInfo, Payment, Invoice, GraphNode, Transaction, SwitchReq } from '../models/lndModels';
import { GetInfo, Fees, Balance, NetworkInfo, Payment, Invoice, GraphNode, Transaction, SwitchReq, ListInvoices } from '../models/lndModels';
import { SpinnerDialogComponent } from '../components/spinner-dialog/spinner-dialog.component';
import { AlertMessageComponent } from '../components/alert-message/alert-message.component';
@ -497,21 +497,27 @@ export class RTLEffects implements OnDestroy {
ofType(RTLActions.FETCH_INVOICES),
mergeMap((action: RTLActions.FetchInvoices) => {
this.store.dispatch(new RTLActions.ClearEffectError('FetchInvoices'));
return this.httpClient.get<Invoice[]>(environment.INVOICES_API);
}),
map((res: any) => {
this.logger.info(res);
return {
type: RTLActions.SET_INVOICES,
payload: (undefined !== res && undefined !== res.invoices && res.invoices.length > 0) ? res.invoices : []
};
}),
catchError((err: any) => {
this.logger.error(err);
this.store.dispatch(new RTLActions.EffectError({ action: 'FetchInvoices', code: err.status, message: err.error.error }));
return of();
}
));
const num_max_invoices = (action.payload.num_max_invoices) ? action.payload.num_max_invoices : 100;
const index_offset = (action.payload.index_offset) ? action.payload.index_offset : 0;
const reversed = (action.payload.reversed) ? action.payload.reversed : false;
return this.httpClient.get<ListInvoices>(environment.INVOICES_API + '?num_max_invoices=' + num_max_invoices + '&index_offset=' + index_offset + '&reversed=' + reversed)
.pipe(map((res: ListInvoices) => {
this.logger.info(res);
if (action.payload.reversed && !action.payload.index_offset) {
this.store.dispatch(new RTLActions.SetTotalInvoices(+res.last_index_offset));
}
return {
type: RTLActions.SET_INVOICES,
payload: res
};
}),
catchError((err: any) => {
this.logger.error(err);
this.store.dispatch(new RTLActions.EffectError({ action: 'FetchInvoices', code: err.status, message: err.error.error }));
return of();
}
));
}));
@Effect()
transactionsFetch = this.actions$.pipe(

15
src/app/shared/store/rtl.reducers.ts
View file

@ -3,7 +3,7 @@ import * as RTLActions from './rtl.actions';
import { ErrorPayload } from '../models/errorPayload';
import { RTLConfiguration, Node } from '../models/RTLconfig';
import {
GetInfo, GetInfoChain, Peer, AddressType, Fees, NetworkInfo, Balance, Channel, Payment, Invoice, PendingChannels, ClosedChannel, Transaction, SwitchRes
GetInfo, GetInfoChain, Peer, AddressType, Fees, NetworkInfo, Balance, Channel, Payment, ListInvoices, PendingChannels, ClosedChannel, Transaction, SwitchRes
} from '../models/lndModels';
export interface State {
@ -24,9 +24,10 @@ export interface State {
numberOfPendingChannels: number;
totalLocalBalance: number;
totalRemoteBalance: number;
totalInvoices: number;
transactions: Transaction[];
payments: Payment[];
invoices: Invoice[];
invoices: ListInvoices;
forwardingHistory: SwitchRes;
addressTypes: AddressType[];
}
@ -56,9 +57,10 @@ const initialState: State = {
numberOfPendingChannels: -1,
totalLocalBalance: -1,
totalRemoteBalance: -1,
totalInvoices: -1,
transactions: [],
payments: [],
invoices: [],
invoices: {invoices: []},
forwardingHistory: {},
addressTypes: [
{ addressId: '0', addressTp: 'p2wkh', addressDetails: 'Pay to witness key hash'},
@ -147,7 +149,7 @@ export function RTLRootReducer(state = initialState, action: RTLActions.RTLActio
case RTLActions.ADD_INVOICE:
return {
...state,
invoices: [action.payload, ...state.invoices]
invoices: action.payload
};
case RTLActions.SET_FEES:
return {
@ -240,6 +242,11 @@ export function RTLRootReducer(state = initialState, action: RTLActions.RTLActio
...state,
invoices: action.payload
};
case RTLActions.SET_TOTAL_INVOICES:
return {
...state,
totalInvoices: action.payload
};
case RTLActions.SET_TRANSACTIONS:
return {
...state,