Skip to content

Minds Frontend
Minds Frontend
Commit 650bfe02 authored by Olivia Madrid's avatar Olivia Madrid
Browse files
Options
  • Download

(feat): wallet v2 layout and early fake-data

parent d0dc2a2e
epic/wallet-80
1 merge request!675Wallet upgrade
Pipeline #99148258 failed with stages
in 10 minutes and 16 seconds
Expand all Hide whitespace changes
Inline Side-by-side
Showing with 723 additions and 385 deletions
src/app/common/common.module.ts
View file @ 650bfe02
......@@ -128,6 +128,7 @@ import { FormToastComponent } from './components/form-toast/form-toast.component
import { SsoService } from './services/sso.service';
import { TopTabsComponent } from './layout/top-tabs/top-tabs.component';
import { ShadowboxHeaderTabsComponent } from './components/shadowbox-header-tabs/shadowbox-header-tabs.component';
import { TimespanFilterComponent } from './components/timespan-filter/timespan-filter.component';
PlotlyModule.plotlyjs = PlotlyJS;
......@@ -245,6 +246,7 @@ PlotlyModule.plotlyjs = PlotlyJS;
ShadowboxSubmitButtonComponent,
TopTabsComponent,
ShadowboxHeaderTabsComponent,
TimespanFilterComponent,
],
exports: [
MINDS_PIPES,
......@@ -345,6 +347,8 @@ PlotlyModule.plotlyjs = PlotlyJS;
FormToastComponent,
ShadowboxSubmitButtonComponent,
ShadowboxHeaderTabsComponent,
TopTabsComponent,
TimespanFilterComponent,
],
providers: [
SiteService,
......
src/app/common/components/shadowbox-header-tabs/shadowbox-header-tabs.component.html
View file @ 650bfe02
......@@ -13,15 +13,18 @@
<div
class="m-shadowboxHeaderTab__value"
*ngIf="tab.value || tab.value === 0"
[ngSwitch]="tab?.unit"
>
<ng-container *ngIf="tab.unit === 'number'">
<ng-template ngSwitchCase="number">
{{ tab.value | number }}
</ng-container>
<ng-container *ngIf="tab.unit === 'usd'">
</ng-template>
<ng-template ngSwitchCase="usd">
<span>$</span>{{ tab.value / 100 | number: '1.2-2' }}
</ng-container>
</ng-template>
<ng-template ngSwitchDefault>
{{ tab.value | number: '1.0-3' }}
</ng-template>
</div>
<div
*ngIf="tab.delta || tab.delta === 0"
class="m-shadowboxHeaderTab__delta"
......
src/app/common/components/shadowbox-header-tabs/shadowbox-header-tabs.component.scss
View file @ 650bfe02
......@@ -2,6 +2,7 @@
cursor: pointer;
flex: 0 0 auto;
width: 160px;
min-height: 124px;
padding: 24px 20px 20px 20px;
font-size: 14px;
box-sizing: border-box;
......
src/app/common/components/timespan-filter/timespan-filter.component.html 0 → 100644
View file @ 650bfe02
<div class="m-timespanFilter__container" *ngIf="timespans">
<div
class="m-timespanFilter__option"
[ngClass]="{ selected: timespan.selected }"
*ngFor="let timespan of timespans"
(click)="changeTimespan(timespan.id)"
>
{{ timespan.label }}
</div>
</div>
src/app/common/components/timespan-filter/timespan-filter.component.scss 0 → 100644
View file @ 650bfe02
m-timespanFilter {
.m-timespanFilter__container {
display: flex;
flex-flow: row nowrap;
border-radius: 5px;
@include m-theme() {
border: 1px solid themed($m-grey-50);
}
}
.m-timespanFilter__option {
&:not(:last-child) {
@include m-theme() {
border-right: 1px solid themed($m-grey-50);
}
}
}
}
src/app/common/components/timespan-filter/timespan-filter.component.ts 0 → 100644
View file @ 650bfe02
import { Component, Input, Output, EventEmitter } from '@angular/core';
import { Timespan } from '../../../interfaces/dashboard';
@Component({
selector: 'm-timespanFilter',
templateUrl: './timespan-filter.component.html',
})
export class TimespanFilterComponent {
@Input() timespans: Timespan[];
@Output() timespanChanged: EventEmitter<any> = new EventEmitter();
constructor() {}
changeTimespan(timespanId) {
this.timespanChanged.emit({ timespanId: timespanId });
}
}
src/app/common/layout/top-tabs/top-tabs.component.html
View file @ 650bfe02
<p>
top-tabs works!
</p>
<div class="m-topTabs__wrapper" *ngIf="tabs">
<div class="m-topTabs__tabsContainer">
<div
class="m-topTabs__tab"
[ngClass]="{ active: tab.id === activeTabId }"
*ngFor="let tab of tabs"
(click)="changeTab(tab.id)"
>
{{ tab.label }}
</div>
</div>
<div class="m-topTabs__viewsContainer">
<ng-content select="[topTab]"></ng-content>
</div>
</div>
src/app/common/layout/top-tabs/top-tabs.component.scss
View file @ 650bfe02
m-topTabs {
.m-topTabs__tabsContainer {
box-sizing: border-box;
display: flex;
flex-flow: row nowrap;
@include m-theme() {
border-bottom: 1px solid themed($m-grey-100);
}
}
.m-topTabs__tab {
cursor: pointer;
padding: 13px 20px;
margin: 0 13px;
box-sizing: border-box;
font-size: 15px;
font-weight: 300;
line-height: 20px;
@include m-theme() {
color: themed($m-grey-300);
border-bottom: 3px solid themed($m-white);
}
&.active {
@include m-theme() {
color: themed($m-grey-800);
border-bottom: 3px solid themed($m-blue);
}
}
&:hover {
@include m-theme() {
color: themed($m-grey-800);
}
}
}
}
src/app/common/layout/top-tabs/top-tabs.component.ts
View file @ 650bfe02
import { Component, OnInit } from '@angular/core';
import { Component, OnInit, Input, Output, EventEmitter } from '@angular/core';
import { TopTab } from '../../../interfaces/dashboard';
@Component({
selector: 'm-topTabs',
templateUrl: './top-tabs.component.html',
})
export class TopTabsComponent implements OnInit {
@Input() tabs: TopTab[];
@Input() activeTabId: string;
@Output() tabChanged: EventEmitter<any> = new EventEmitter();
constructor() {}
ngOnInit() {}
changeTab(tabId) {
this.activeTabId = tabId;
this.tabChanged.emit({ tabId: tabId });
}
}
src/app/interfaces/dashboard.ts
View file @ 650bfe02
......@@ -79,7 +79,7 @@ export interface Timespan {
id: string;
label: string;
interval: string;
comparison_interval: number;
comparison_interval?: number;
from_ts_ms: number;
from_ts_iso: string;
selected: boolean;
......
src/app/modules/analytics/v2/dashboard.service.ts
View file @ 650bfe02
......@@ -79,7 +79,6 @@ export class AnalyticsDashboardService {
}),
tap(() => this.loading$.next(true)),
switchMap(([category, timespan, metric, filter]) => {
// console.log(category, timespan, metric, filter);
try {
const response = this.getDashboardResponse(
category,
......@@ -101,17 +100,16 @@ export class AnalyticsDashboardService {
const dashboard = response.dashboard;
this.ready$.next(true);
// TODOOJM uncomment me
this.updateState({
..._state,
// category: dashboard.category,
// description: dashboard.description,
// timespan: dashboard.timespan,
// timespans: dashboard.timespans,
// filter: dashboard.filter,
// filters: dashboard.filters,
// metric: dashboard.metric,
// metrics: dashboard.metrics,
category: dashboard.category,
description: dashboard.description,
timespan: dashboard.timespan,
timespans: dashboard.timespans,
filter: dashboard.filter,
filters: dashboard.filters,
metric: dashboard.metric,
metrics: dashboard.metrics,
});
this.loading$.next(false);
});
......@@ -142,14 +140,13 @@ export class AnalyticsDashboardService {
// return channelSearch;
// }
// TODOOJM uncomment me
updateCategory(category: string) {
// this.updateState({
// ..._state,
// category,
// description: null,
// metrics: [],
// });
this.updateState({
..._state,
category,
description: null,
metrics: [],
});
}
updateTimespan(timespan: string) {
this.updateState({
......@@ -182,7 +179,7 @@ export class AnalyticsDashboardService {
this.updateState({ ..._state, filter });
}
// // ------- Private Methods ------------------------
// ------- Private Methods ------------------------
/** Update internal state cache and emit from store... */
private updateState(state: UserState) {
......
src/app/modules/wallet/v2/chart/chart.component.html
View file @ 650bfe02
<p>
wallet-chart works!
</p>
<m-timespanFilter
[timespans]="timespans"
(timespanChanged)="updateTimespan($event)"
></m-timespanFilter>
<m-chartV2
*ngIf="selectedCurrency && selectedTimespan"
[rawData]="selectedCurrency"
[interval]="selectedTimespan.interval"
></m-chartV2>
src/app/modules/wallet/v2/chart/chart.component.ts
View file @ 650bfe02
import { Component, OnInit } from '@angular/core';
import { Component, OnInit, Input } from '@angular/core';
import { WalletDashboardService } from '../dashboard.service';
import { Timespan } from '../../../../interfaces/dashboard';
@Component({
selector: 'm-walletChart',
templateUrl: './chart.component.html',
})
export class WalletChartComponent implements OnInit {
constructor() {}
@Input() activeCurrencyId;
timespans: Timespan[];
data;
ngOnInit() {}
constructor(protected walletService: WalletDashboardService) {}
ngOnInit() {
this.walletService.getTimespans();
this.data = this.walletService
.getCurrencies()
.find(currency => currency.id === this.activeCurrencyId);
}
updateTimespan($event) {
// $event.timespanId
}
}
src/app/modules/wallet/v2/dashboard.component.html
View file @ 650bfe02
<m-pageLayout [menu]="menu">
<div class="m-walletDashboard" m-pageLayout__main *ngIf="settings">
<!-- *ngIf="ready$ | async" -->
<!-- <m-dashboardLayout>
<div class="m-walletDashboard" m-pageLayout__main *ngIf="currencies">
<m-dashboardLayout>
<ng-container m-dashboardLayout__header>
<div>
<h3>
......@@ -12,34 +10,55 @@
</ng-container>
<ng-container m-dashboardLayout__body>
<m-shadowboxLayout>
<m-shadowboxHeader__tabs
class="m-shadowboxLayout__header"
[tabs]="currencies"
[activeTabId]="activeCurrencyId"
(tabChanged)="updateCurrency($event)"
></m-shadowboxHeader__tabs>
<m-walletBalance class="m-shadowboxLayout__body"> -->
<!-- *ngIf="description$ | async as description" -->
<!-- </m-walletBalance>
<div
class="m-shadowboxLayout__body"
[ngClass]="{ isTable: isTable, isMobile: isMobile }"
>
<m-walletChart>
</m-walletChart>
<m-walletTransactions></m-walletTransactions>
<div class="m-shadowboxLayout__body">
<m-walletBalance class="m-shadowboxLayout__body"></m-walletBalance>
<m-topTabs
[tabs]="topTabOptions"
[activeTabId]="activeTabId"
(tabChanged)="updateActiveTabId($event)"
>
<!-- <div class="m-walletDashboard__spinnerContainer" *ngIf="loading">
<div class="mdl-spinner mdl-js-spinner is-active" [mdl]></div>
</div> -->
<m-walletChart
topTab
[activeCurrencyId]="activeCurrencyId"
*ngIf="activeTabId === 'overview'"
></m-walletChart>
<m-walletTransactionsTable
topTab
*ngIf="activeTabId === 'transactions'"
></m-walletTransactionsTable>
<ng-container *ngIf="activeTabId === 'settings'">
<m-walletSettings--tokens
topTab
*ngIf="activeCurrencyId === 'tokens'"
></m-walletSettings--tokens>
<m-walletSettings--usd
topTab
*ngIf="activeCurrencyId === 'usd'"
></m-walletSettings--usd>
<m-walletSettings--eth
topTab
*ngIf="activeCurrencyId === 'eth'"
></m-walletSettings--eth>
<m-walletSettings--btc
topTab
*ngIf="activeCurrencyId === 'btc'"
></m-walletSettings--btc>
</ng-container>
</m-topTabs>
</div>
</m-shadowboxLayout>
</ng-container>
</m-dashboardLayout> -->
</m-dashboardLayout>
</div>
</m-pageLayout>
<!-- <div class="m-analytics__spinnerContainer" *ngIf="loading$ | async">
<div class="mdl-spinner mdl-js-spinner is-active" [mdl]></div>
</div> -->
<!-- <m-dropdownSelector
[filter]="timespanFilter"
[showLabel]="false"
></m-dropdownSelector> -->
src/app/modules/wallet/v2/dashboard.component.scss
View file @ 650bfe02
m-walletDashboard {
.m-shadowboxHeaderTab {
line-height: 21px;
.m-shadowboxHeaderTab__label {
font-size: 18px;
@include m-theme() {
color: themed($m-grey-800);
}
}
.m-shadowboxHeaderTab__value {
font-weight: 300;
font-size: 16px;
@include m-theme() {
color: themed($m-grey-300);
}
}
}
}
src/app/modules/wallet/v2/dashboard.component.ts
View file @ 650bfe02
// TODOOJM rename all the toptab stuff to 'view'
import {
Component,
OnInit,
......@@ -12,6 +14,7 @@ import { ActivatedRoute, Router, ParamMap } from '@angular/router';
import { MindsTitle } from '../../../services/ux/title';
import sidebarMenu from './sidebar-menu.default';
import { Menu } from '../../../common/components/sidebar-menu/sidebar-menu.component';
import { ShadowboxHeaderTab, TopTab } from '../../../interfaces/dashboard';
@Component({
selector: 'm-walletDashboard',
......@@ -22,7 +25,37 @@ export class WalletDashboardComponent implements OnInit, OnDestroy {
menu: Menu = sidebarMenu;
paramsSubscription: Subscription;
// dashboard
currencies: ShadowboxHeaderTab[];
activeCurrencyId;
activeTabId;
topTabOptions;
chartData;
topTabs = [
{
id: 'tokens',
tabs: [
{ id: 'overview', label: 'Overview' },
{ id: 'transactions', label: 'Transactions' },
{ id: 'settings', label: 'Settings' },
],
},
{
id: 'usd',
tabs: [
{ id: 'transactions', label: 'Transactions' },
{ id: 'settings', label: 'Settings' },
],
},
{
id: 'eth',
tabs: [{ id: 'settings', label: 'Settings' }],
},
{
id: 'btc',
tabs: [{ id: 'settings', label: 'Settings' }],
},
];
constructor(
protected walletService: WalletDashboardService,
......@@ -40,28 +73,54 @@ export class WalletDashboardComponent implements OnInit, OnDestroy {
}
this.title.setTitle('Wallet');
this.currencies = this.walletService.getCurrencies();
this.route.paramMap.subscribe((params: ParamMap) => {
const currency = params.get('currency');
// this.updateCurrency(currency);
});
this.activeCurrencyId = params.get('currency');
this.topTabOptions = this.topTabs.find(
currencyTabsObj => currencyTabsObj.id === this.activeCurrencyId
).tabs;
this.paramsSubscription = this.route.queryParams.subscribe(params => {
// TODO: handleUrl
if (params['timespan']) {
// this.updateTimespan(params['timespan']);
if (params.get('topTab')) {
this.activeTabId = params.get('topTab');
} else {
this.activeTabId = this.topTabOptions[0];
console.log('bork');
this.rerouteTopTab(this.activeTabId);
}
if (this.activeTabId === 'overview') {
this.chartData = this.currencies.find(
currency => currency.id === this.activeCurrencyId
);
}
this.detectChanges();
});
}
ngOnDestroy() {
if (this.paramsSubscription) {
this.paramsSubscription.unsubscribe();
}
// No need for this with route params
// if (this.paramsSubscription) {
// this.paramsSubscription.unsubscribe();
// }
}
updateCurrency($event) {
// this.walletService.updazteCurrency($event.tabId);
}
updateCurrency(currencyId) {
// this.walletService.updateCurrency(currencyId);
updateActiveTabId($event) {
this.activeTabId = $event.tabId;
this.rerouteTopTab(this.activeCurrencyId);
}
rerouteTopTab(topTabId) {
console.log('bork1', this.activeCurrencyId);
this.router.navigate(['/v2wallet', this.activeCurrencyId, topTabId]);
console.log('bork2');
this.detectChanges();
}
detectChanges() {
......
src/app/modules/wallet/v2/fake-data.ts
View file @ 650bfe02
const fakeData: Array<any> = [
{
// CHART TESTS
loading: false,
category: 'wallet',
timespan: '30d',
timespans: [
{
id: '30d',
label: 'Last 30 days',
interval: 'day',
comparison_interval: 30,
from_ts_ms: 1567296000000,
from_ts_iso: '2019-09-01T00:00:00+00:00',
selected: true,
},
{
id: '12m',
label: 'Last 12 months',
interval: 'month',
comparison_interval: 365,
from_ts_ms: 1538352000000,
from_ts_iso: '2018-10-01T00:00:00+00:00',
selected: false,
},
],
filter: [],
filters: [],
metric: 'tokens',
metrics: [
{
id: 'tokens',
label: 'Tokens',
const fakeData = {
timespan: '7d',
timespans: [
{
// Assume today is Nov 17th
id: '7d',
label: '7D',
interval: 'day',
from_ts_ms: 1572566400000,
from_ts_iso: '2019-11-01T00:00:00+00:00',
selected: true,
},
{
id: '30d',
label: '30D',
interval: 'day',
from_ts_ms: 1571270400000,
from_ts_iso: '2019-10-17T00:00:00+00:00',
selected: false,
},
{
id: '12m',
label: '12M',
interval: 'month',
from_ts_ms: 1542412800000,
from_ts_iso: '2018-11-17T00:00:00+00:00',
selected: false,
},
],
currency: 'tokens',
currencies: [
{
id: 'tokens',
label: 'Tokens',
unit: 'tokens',
value: 2167.457,
// value_offchain: 2166.255,
// value_onchain: 1.202,
// top_tabs: [
// { id: 'overview', label: 'Overview' },
// { id: 'transactions', label: 'Transactions' },
// { id: 'settings', label: 'Settings' },
// ],
visualisation: {
type: 'chart',
unit: 'tokens',
value: 1.450289,
visualisation: {
type: 'chart',
segments: [
{
buckets: [
{
key: 1567296000000,
date: '2019-09-01T00:00:00+00:00',
value: 11,
},
{
key: 1567382400000,
date: '2019-09-02T00:00:00+00:00',
value: 12,
},
{
key: 1567468800000,
date: '2019-09-03T00:00:00+00:00',
value: 13,
},
{
key: 1567555200000,
date: '2019-09-04T00:00:00+00:00',
value: 9,
},
{
key: 1567641600000,
date: '2019-09-05T00:00:00+00:00',
value: 1,
},
{
key: 1567296000000,
date: '2019-09-06T00:00:00+00:00',
value: 11,
},
{
key: 1567382400000,
date: '2019-09-07T00:00:00+00:00',
value: 12,
},
{
key: 1567468800000,
date: '2019-09-08T00:00:00+00:00',
value: 13,
},
{
key: 1567555200000,
date: '2019-09-09T00:00:00+00:00',
value: 9,
},
{
key: 1567641600000,
date: '2019-09-10T00:00:00+00:00',
value: 7,
},
{
key: 1567555200000,
date: '2019-09-11T00:00:00+00:00',
value: 9,
},
{
key: 1567641600000,
date: '2019-09-12T00:00:00+00:00',
value: 10.2,
},
],
},
],
},
},
{
id: 'active_users',
label: 'Active Users B',
permissions: ['admin', 'user'],
summary: {
current_value: 120962,
comparison_value: 120962,
comparison_interval: 28,
comparison_positive_inclination: true,
},
unit: 'number',
description:
'At vero eos et accusamus et iusto odio dignissimos ducimus qui blanditiis praesentiuti atque corrupti quos dolores',
visualisation: null,
},
{
id: 'signups',
label: 'Signups',
permissions: ['admin', 'user'],
summary: {
current_value: 53060,
comparison_value: 60577,
comparison_interval: 28,
comparison_positive_inclination: true,
},
unit: 'number',
description:
'At vero eos et accusamus et iusto odio dignissimos ducimus qui blanditiis praesentiuti atque corrupti quos dolores',
visualisation: null,
},
{
id: 'views',
label: 'Pageviews USD',
permissions: ['admin', 'user'],
summary: {
current_value: 83898,
comparison_value: 0,
comparison_interval: 28,
comparison_positive_inclination: true,
},
unit: 'usd',
visualisation: null,
segments: [
{
buckets: [
{
key: 1567296000000,
date: '2019-09-01T00:00:00+00:00',
value: 11,
},
{
key: 1567382400000,
date: '2019-09-02T00:00:00+00:00',
value: 12,
},
{
key: 1567468800000,
date: '2019-09-03T00:00:00+00:00',
value: 13,
},
{
key: 1567555200000,
date: '2019-09-04T00:00:00+00:00',
value: 9,
},
{
key: 1567641600000,
date: '2019-09-05T00:00:00+00:00',
value: 1,
},
{
key: 1567296000000,
date: '2019-09-06T00:00:00+00:00',
value: 11,
},
{
key: 1567382400000,
date: '2019-09-07T00:00:00+00:00',
value: 12,
},
{
key: 1567468800000,
date: '2019-09-08T00:00:00+00:00',
value: 13,
},
{
key: 1567555200000,
date: '2019-09-09T00:00:00+00:00',
value: 9,
},
{
key: 1567641600000,
date: '2019-09-10T00:00:00+00:00',
value: 7,
},
{
key: 1567555200000,
date: '2019-09-11T00:00:00+00:00',
value: 9,
},
{
key: 1567641600000,
date: '2019-09-12T00:00:00+00:00',
value: 10.2,
},
],
},
],
},
],
},
];
},
{
id: 'usd',
label: 'USD',
unit: 'usd',
value: 13577, // this is usd in CENTS
visualisation: null,
// top_tabs: [
// { id: 'transactions', label: 'Transactions' },
// { id: 'settings', label: 'Settings' },
// ],
},
{
id: 'eth',
label: 'Ether',
unit: 'eth',
value: 15.3570957,
visualisation: null,
// top_tabs: [{ id: 'settings', label: 'Settings' }],
},
{
id: 'btc',
label: 'Bitcoin',
unit: 'btc',
visualisation: null,
// top_tabs: [{ id: 'settings', label: 'Settings' }],
},
],
};
export default fakeData;
src/app/modules/wallet/v2/settings-btc/settings-btc.component.html 0 → 100644
View file @ 650bfe02
<p>
settings-btc works!
</p>
src/app/modules/wallet/v2/transactions/transactions.component.ts → src/app/modules/wallet/v2/settings-btc/settings-btc.component.ts
View file @ 650bfe02
import { Component, OnInit } from '@angular/core';
@Component({
selector: 'm-walletTransactions',
templateUrl: './transactions.component.html',
selector: 'm-walletSettings--btc',
templateUrl: './settings-btc.component.html',
})
export class WalletTransactionsComponent implements OnInit {
export class WalletSettingsBTCComponent implements OnInit {
constructor() {}
ngOnInit() {}
......
src/app/modules/wallet/v2/settings-btc/wallet-settings-btc.component.spec.ts 0 → 100644
View file @ 650bfe02
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
import { WalletSettingsBTCComponent } from './settings-btc.component';
describe('WalletSettingsBTCComponent', () => {
let component: WalletSettingsBTCComponent;
let fixture: ComponentFixture<WalletSettingsBTCComponent>;
beforeEach(async(() => {
TestBed.configureTestingModule({
declarations: [WalletSettingsBTCComponent],
}).compileComponents();
}));
beforeEach(() => {
fixture = TestBed.createComponent(WalletSettingsBTCComponent);
component = fixture.componentInstance;
fixture.detectChanges();
});
it('should create', () => {
expect(component).toBeTruthy();
});
});
src/app/modules/wallet/v2/settings-eth/settings-eth.component.html 0 → 100644
View file @ 650bfe02
<p>
wallet-settings-eth works!
</p>
src/app/modules/wallet/v2/settings-eth/settings-eth.component.ts 0 → 100644
View file @ 650bfe02
import { Component, OnInit } from '@angular/core';
@Component({
selector: 'm-walletSettings--eth',
templateUrl: './settings-eth.component.html',
})
export class WalletSettingsETHComponent implements OnInit {
constructor() {}
ngOnInit() {}
}
src/app/modules/wallet/v2/settings-eth/wallet-settings-eth.component.spec.ts 0 → 100644
View file @ 650bfe02
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
import { WalletSettingsETHComponent } from './settings-eth.component';
describe('WalletSettingsETHComponent', () => {
let component: WalletSettingsETHComponent;
let fixture: ComponentFixture<WalletSettingsETHComponent>;
beforeEach(async(() => {
TestBed.configureTestingModule({
declarations: [WalletSettingsETHComponent],
}).compileComponents();
}));
beforeEach(() => {
fixture = TestBed.createComponent(WalletSettingsETHComponent);
component = fixture.componentInstance;
fixture.detectChanges();
});
it('should create', () => {
expect(component).toBeTruthy();
});
});
src/app/modules/wallet/v2/settings-tokens/settings-tokens.component.html 0 → 100644
View file @ 650bfe02
<p>
settings--tokens works!
</p>
src/app/modules/wallet/v2/settings-tokens/settings-tokens.component.ts 0 → 100644
View file @ 650bfe02
import { Component, OnInit } from '@angular/core';
@Component({
selector: 'm-walletSettings--tokens',
templateUrl: './settings-tokens.component.html',
})
export class WalletSettingsTokensComponent implements OnInit {
constructor() {}
ngOnInit() {}
}
src/app/modules/wallet/v2/settings-usd/settings-usd.component.html 0 → 100644
View file @ 650bfe02
<p>
settings--usd works!
</p>
src/app/modules/wallet/v2/settings-usd/settings-usd.component.ts 0 → 100644
View file @ 650bfe02
import { Component, OnInit } from '@angular/core';
@Component({
selector: 'm-walletSettings--usd',
templateUrl: './settings-usd.component.html',
})
export class WalletSettingsUSDComponent implements OnInit {
constructor() {}
ngOnInit() {}
}
src/app/modules/wallet/v2/transactions-table/transactions-table.component.ts 0 → 100644
View file @ 650bfe02
import { Component, OnInit } from '@angular/core';
@Component({
selector: 'm-walletTransactionsTable',
templateUrl: './transactions-table.component.html',
})
export class WalletTransactionsTableComponent implements OnInit {
constructor() {}
ngOnInit() {}
}
src/app/modules/wallet/wallet.module.ts
View file @ 650bfe02
......@@ -52,9 +52,14 @@ import { WalletUSDBalanceComponent } from './usd/balance.component';
import { WalletDashboardComponent } from './v2/dashboard.component';
import { WalletBalanceComponent } from './v2/balance/balance.component';
import { WalletChartComponent } from './v2/chart/chart.component';
import { WalletTransactionsTableComponent } from './v2/transactions-table/transactions-table.component';
import { WalletActionButtonComponent } from './v2/action-button/action-button.component';
import { WalletRewardsPopupComponent } from './v2/rewards-popup/rewards-popup.component';
import { WalletDashboardService } from './v2/dashboard.service';
import { WalletSettingsTokensComponent } from './v2/settings-tokens/settings-tokens.component';
import { WalletSettingsUSDComponent } from './v2/settings-usd/settings-usd.component';
import { WalletSettingsETHComponent } from './v2/settings-eth/settings-eth.component';
import { WalletSettingsBTCComponent } from './v2/settings-btc/settings-btc.component';
const walletRoutes: Routes = [
{
......@@ -106,10 +111,11 @@ const walletRoutes: Routes = [
],
},
{
path: 'v2wallet', // TODOOJM: choose actual path. maybe replace /wallet
redirectTo: 'v2wallet/tokens',
path: 'v2wallet', // TODOOJM: choose actual path. also allow **
redirectTo: 'v2wallet/tokens/overview',
pathMatch: 'full',
},
{ path: 'v2wallet/:currency/:topTab', component: WalletDashboardComponent },
{ path: 'v2wallet/:currency', component: WalletDashboardComponent },
];
......@@ -170,6 +176,11 @@ const walletRoutes: Routes = [
WalletChartComponent,
WalletActionButtonComponent,
WalletRewardsPopupComponent,
WalletTransactionsTableComponent,
WalletSettingsTokensComponent,
WalletSettingsUSDComponent,
WalletSettingsETHComponent,
WalletSettingsBTCComponent,
],
exports: [
WalletComponent,
......
Please register or to comment