Skip to content
This repository has been archived by the owner on Mar 25, 2023. It is now read-only.

Commit

Permalink
feat(vm-logs): newest first (#1346)
Browse files Browse the repository at this point in the history 
* vm logs mock

* vm logs

* feat(vm-logs): show vm logs

* vm logs

* add tests

* fix action name

* fix selector name

* fix monospace text in column header

* feat(vm-logs): replace show logs icon button with text button

* feat(vm-logs): keyword filtering

* feat(vm-logs): save vm log keywords in query params

* feat(vm-logs): filter by dates

* feat(vm-logs): filter by dates

* v1.10.1

* fix tests

* fix version

* fix package.json

* sort by timestamp

* fix timestamp

* feat(vm-logs): filter vms by account

* refactor date picker label

* refactor labels

* refactor labels

* fix IE

* feat(vm-logs): newest first sorting

* add types

* add types

* fix newest first

* fix typings

* fix typings

* fix typings
  • Loading branch information
Vladimir Shakhov authored Oct 19, 2018
1 parent 25cdf54 commit 2fa5125
Show file tree
Hide file tree
Showing 12 changed files with 182 additions and 138 deletions.
10 changes: 10 additions & 0 deletions src/app/vm-logs/containers/vm-logs-filter.container.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -33,6 +33,7 @@ const FILTER_KEY = 'logsFilters';
[startTime]="startTime$ | async"
[endDate]="endDate$ | async | dateObjectToDate"
[endTime]="endTime$ | async"
[newestFirst]="newestFirst$ | async"
[firstDayOfWeek]="firstDayOfWeek$ | async"
(onAccountsChange)="onAccountsChange($event)"
(onVmChange)="onVmChange($event)"
Expand All @@ -43,6 +44,7 @@ const FILTER_KEY = 'logsFilters';
(onStartTimeChange)="onStartTimeChange($event)"
(onEndDateChange)="onEndDateChange($event)"
(onEndTimeChange)="onEndTimeChange($event)"
(onNewestFirstChange)="onNewestFirstChange($event)"
></cs-vm-logs-filter>`
})
export class VmLogsFilterContainerComponent extends WithUnsubscribe() implements OnInit, AfterViewInit {
Expand All @@ -58,13 +60,15 @@ export class VmLogsFilterContainerComponent extends WithUnsubscribe() implements
readonly endDate$ = this.store.pipe(select(fromVmLogs.filterEndDate));
readonly endTime$ = this.store.pipe(select(fromVmLogs.filterEndTime));
readonly firstDayOfWeek$ = this.store.pipe(select(UserTagsSelectors.getFirstDayOfWeek));
readonly newestFirst$ = this.store.pipe(select(fromVmLogs.filterNewestFirst));

private filterService = new FilterService(
{
vm: { type: 'string' },
keywords: { type: 'array', defaultOption: [] },
startDate: { type: 'string' },
endDate: { type: 'string' },
newestFirst: { type: 'boolean' }
},
this.router,
this.sessionStorage,
Expand Down Expand Up @@ -120,12 +124,17 @@ export class VmLogsFilterContainerComponent extends WithUnsubscribe() implements
this.store.dispatch(new vmLogActions.VmLogsUpdateEndTime(time));
}

public onNewestFirstChange() {
this.store.dispatch(new vmLogActions.VmLogsToggleNewestFirst());
}

private initFilters(): void {
const params = this.filterService.getParams();

this.store.dispatch(new vmLogActions.VmLogsFilterUpdate({
selectedVmId: params['vm'],
keywords: (params['keywords'] || []).map(text => ({ text })),
newestFirst: params['newestFirst'],
selectedAccountIds: params['accounts'] || [],
...(params['startDate'] ? { startDate: moment(params['startDate']).toObject() } : null),
...(params['endDate'] ? { endDate: moment(params['endDate']).toObject() } : null)
Expand All @@ -145,6 +154,7 @@ export class VmLogsFilterContainerComponent extends WithUnsubscribe() implements
vm: filters.selectedVmId,
keywords: filters.keywords.map(keyword => keyword.text),
accounts: filters.selectedAccountIds,
newestFirst: filters.newestFirst,
startDate: moment(filters.startDate).toISOString(),
endDate: moment(filters.endDate).toISOString(),
});
Expand Down
83 changes: 46 additions & 37 deletions src/app/vm-logs/redux/vm-logs.actions.ts
View file
Original file line number Diff line number Diff line change
@@ -1,94 +1,103 @@
import { Action } from '@ngrx/store';
import { VmLog } from '../models/vm-log.model';

export const LOAD_VM_LOGS_REQUEST = '[VM Logs] LOAD_VM_LOGS_REQUEST';
export const LOAD_VM_LOGS_RESPONSE = '[VM Logs] LOAD_VM_LOGS_RESPONSE';
export const VM_LOGS_FILTER_UPDATE = '[VM Logs] VM_LOGS_FILTER_UPDATE';
export const VM_LOGS_ADD_KEYWORD = '[VM Logs] VM_LOGS_ADD_KEYWORD';
export const VM_LOGS_REMOVE_KEYWORD = '[VM Logs] VM_LOGS_REMOVE_KEYWORD';
export const VM_LOGS_UPDATE_START_DATE = '[VM Logs] VM_LOGS_UPDATE_START_DATE';
export const VM_LOGS_UPDATE_START_TIME = '[VM Logs] VM_LOGS_UPDATE_START_TIME';
export const VM_LOGS_UPDATE_END_DATE = '[VM Logs] VM_LOGS_UPDATE_END_DATE';
export const VM_LOGS_UPDATE_END_TIME = '[VM Logs] VM_LOGS_UPDATE_END_TIME';
export const VM_LOGS_UPDATE_ACCOUNT_IDS = '[VM Logs] VM_LOGS_UPDATE_ACCOUNT_IDS';
import { Keyword } from '../models/keyword.model';
import { Time } from '../../shared/components/time-picker/time-picker.component';
import { VmLogsFilters } from './vm-logs.reducers';

export enum VmLogsActionTypes {
LOAD_VM_LOGS_REQUEST = '[VM Logs] LOAD_VM_LOGS_REQUEST',
LOAD_VM_LOGS_RESPONSE = '[VM Logs] LOAD_VM_LOGS_RESPONSE',
VM_LOGS_FILTER_UPDATE = '[VM Logs] VM_LOGS_FILTER_UPDATE',
VM_LOGS_ADD_KEYWORD = '[VM Logs] VM_LOGS_ADD_KEYWORD',
VM_LOGS_REMOVE_KEYWORD = '[VM Logs] VM_LOGS_REMOVE_KEYWORD',
VM_LOGS_UPDATE_START_DATE = '[VM Logs] VM_LOGS_UPDATE_START_DATE',
VM_LOGS_UPDATE_START_TIME = '[VM Logs] VM_LOGS_UPDATE_START_TIME',
VM_LOGS_UPDATE_END_DATE = '[VM Logs] VM_LOGS_UPDATE_END_DATE',
VM_LOGS_UPDATE_END_TIME = '[VM Logs] VM_LOGS_UPDATE_END_TIME',
VM_LOGS_UPDATE_ACCOUNT_IDS = '[VM Logs] VM_LOGS_UPDATE_ACCOUNT_IDS',
VM_LOGS_TOGGLE_NEWEST_FIRST = '[VM Logs] VM_LOGS_TOGGLE_NEWEST_FIRST'
}

export class LoadVmLogsRequest implements Action {
type = LOAD_VM_LOGS_REQUEST;

constructor(public payload?: any) {
}

readonly type = VmLogsActionTypes.LOAD_VM_LOGS_REQUEST;
}

export class LoadVmLogsResponse implements Action {
type = LOAD_VM_LOGS_RESPONSE;
readonly type = VmLogsActionTypes.LOAD_VM_LOGS_RESPONSE;

constructor(public payload: Array<VmLog> | any) {
constructor(readonly payload: Array<VmLog>) {
}

}

export class VmLogsFilterUpdate implements Action {
type = VM_LOGS_FILTER_UPDATE;
readonly type = VmLogsActionTypes.VM_LOGS_FILTER_UPDATE;

constructor(public payload: any) {
constructor(readonly payload: Partial<VmLogsFilters>) {
}

}

export class VmLogsAddKeyword implements Action {
type = VM_LOGS_ADD_KEYWORD;
readonly type = VmLogsActionTypes.VM_LOGS_ADD_KEYWORD;

constructor(public payload: any) {
constructor(readonly payload: Keyword) {
}
}

export class VmLogsRemoveKeyword implements Action {
type = VM_LOGS_REMOVE_KEYWORD;
readonly type = VmLogsActionTypes.VM_LOGS_REMOVE_KEYWORD;

constructor(public payload: any) {
constructor(readonly payload: Keyword) {
}
}

export class VmLogsUpdateStartDate implements Action {
type = VM_LOGS_UPDATE_START_DATE;
readonly type = VmLogsActionTypes.VM_LOGS_UPDATE_START_DATE;

constructor(public payload: any) {
constructor(readonly payload: Date) {
}
}

export class VmLogsUpdateStartTime implements Action {
type = VM_LOGS_UPDATE_START_TIME;
readonly type = VmLogsActionTypes.VM_LOGS_UPDATE_START_TIME;

constructor(public payload: any) {
constructor(readonly payload: Time) {
}
}

export class VmLogsUpdateEndDate implements Action {
type = VM_LOGS_UPDATE_END_DATE;
readonly type = VmLogsActionTypes.VM_LOGS_UPDATE_END_DATE;

constructor(public payload: any) {
constructor(readonly payload: Date) {
}
}

export class VmLogsUpdateEndTime implements Action {
type = VM_LOGS_UPDATE_END_TIME;
readonly type = VmLogsActionTypes.VM_LOGS_UPDATE_END_TIME;

constructor(public payload: any) {
constructor(readonly payload: Time) {
}
}

export class VmLogsUpdateAccountIds implements Action {
type = VM_LOGS_UPDATE_ACCOUNT_IDS;
readonly type = VmLogsActionTypes.VM_LOGS_UPDATE_ACCOUNT_IDS;

constructor(public payload: any) {
constructor(readonly payload: Array<string>) {
}
}

export class VmLogsToggleNewestFirst implements Action {
readonly type = VmLogsActionTypes.VM_LOGS_TOGGLE_NEWEST_FIRST;
}

export type Actions =
LoadVmLogsResponse
| LoadVmLogsRequest
| VmLogsFilterUpdate
| VmLogsAddKeyword
| VmLogsUpdateStartDate
| VmLogsUpdateStartTime
| VmLogsUpdateEndDate
| VmLogsUpdateEndTime
| VmLogsRemoveKeyword
| VmLogsUpdateAccountIds;
| VmLogsUpdateAccountIds
| VmLogsToggleNewestFirst;
2 changes: 1 addition & 1 deletion src/app/vm-logs/redux/vm-logs.effects.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -14,7 +14,7 @@ import { State } from '../../reducers';
export class VmLogsEffects {
@Effect()
loadVmLogs$: Observable<Action> = this.actions$.pipe(
ofType(vmLogsActions.LOAD_VM_LOGS_REQUEST),
ofType(vmLogsActions.VmLogsActionTypes.LOAD_VM_LOGS_REQUEST),
withLatestFrom(this.store.pipe(select(fromVmLogs.loadVmLogsRequestParams))),
switchMap(([action, loadVmLogsRequestParams]) => {
return this.vmLogsService.getList(loadVmLogsRequestParams).pipe(
Expand Down
75 changes: 54 additions & 21 deletions src/app/vm-logs/redux/vm-logs.reducers.spec.ts
View file
Original file line number Diff line number Diff line change
@@ -1,10 +1,4 @@
import {
LOAD_VM_LOGS_REQUEST,
LOAD_VM_LOGS_RESPONSE,
VM_LOGS_ADD_KEYWORD,
VM_LOGS_FILTER_UPDATE,
VM_LOGS_REMOVE_KEYWORD
} from './vm-logs.actions';
import { VmLogsActionTypes } from './vm-logs.actions';
import * as fromVmLogs from './vm-logs.reducers';
import { initialState } from './vm-logs.reducers';
import moment = require('moment');
Expand All @@ -18,7 +12,7 @@ describe('VM logs reducer', () => {
});

it('should set loading', () => {
const state = fromVmLogs.reducer(undefined, { type: LOAD_VM_LOGS_REQUEST });
const state = fromVmLogs.reducer(undefined, { type: VmLogsActionTypes.LOAD_VM_LOGS_REQUEST });
expect(state).toEqual({
...initialState,
loading: true,
Expand All @@ -40,7 +34,7 @@ describe('VM logs reducer', () => {
];

const state = fromVmLogs.reducer(undefined, {
type: LOAD_VM_LOGS_RESPONSE,
type: VmLogsActionTypes.LOAD_VM_LOGS_RESPONSE,
payload: logs
});

Expand All @@ -54,7 +48,7 @@ describe('VM logs reducer', () => {
it('should update vm id', () => {
const selectedVmId = 'test-id';
const state = fromVmLogs.reducer(undefined, {
type: VM_LOGS_FILTER_UPDATE,
type: VmLogsActionTypes.VM_LOGS_FILTER_UPDATE,
payload: {
selectedVmId,
}
Expand All @@ -75,7 +69,7 @@ describe('VM logs reducer', () => {
};

const state = fromVmLogs.reducer(undefined, {
type: VM_LOGS_ADD_KEYWORD,
type: VmLogsActionTypes.VM_LOGS_ADD_KEYWORD,
payload: keyword
});

Expand All @@ -100,13 +94,43 @@ describe('VM logs reducer', () => {
keywords: [keyword]
}
}, {
type: VM_LOGS_REMOVE_KEYWORD,
type: VmLogsActionTypes.VM_LOGS_REMOVE_KEYWORD,
payload: keyword
});

expect(state).toEqual(initialState);
});

it('should toggle newest first', () => {
const toggledState = fromVmLogs.reducer(undefined, {
type: VmLogsActionTypes.VM_LOGS_TOGGLE_NEWEST_FIRST
});

expect(toggledState).toEqual({
...initialState,
filters: {
...initialState.filters,
newestFirst: true,
}
});

const toggledTwiceState = fromVmLogs.reducer(toggledState, {
type: VmLogsActionTypes.VM_LOGS_TOGGLE_NEWEST_FIRST
});

expect(toggledTwiceState).toEqual(initialState);
});

const defaultId = 'test-id';
const defaultDate = '1970-01-01T00:00:00.000';
const defaultSort = 'timestamp';
const defaultRequestParams = {
id: defaultId,
startDate: defaultDate,
endDate: defaultDate,
sort: defaultSort
};

it('should select load logs request params without keywords', () => {
const id = 'test-id';
const keywords = [];
Expand All @@ -116,12 +140,7 @@ describe('VM logs reducer', () => {
keywords
);

expect(params).toEqual({
id,
startDate: '1970-01-01T00:00:00.000',
endDate: '1970-01-01T00:00:00.000',
sort: '-timestamp'
})
expect(params).toEqual(defaultRequestParams);
});

it('should select load logs request params with keywords', () => {
Expand All @@ -137,10 +156,24 @@ describe('VM logs reducer', () => {
);

expect(params).toEqual({
id,
...defaultRequestParams,
keywords: 'test-keyword1,test-keyword2',
startDate: '1970-01-01T00:00:00.000',
endDate: '1970-01-01T00:00:00.000',
});
});

it('should set sort: -timestamp if newest first = true', () => {
const id = 'test-id';

const params = fromVmLogs.loadVmLogsRequestParams.projector(
id,
[],
date,
date,
true
);

expect(params).toEqual({
...defaultRequestParams,
sort: '-timestamp'
});
});
Expand Down
Loading

0 comments on commit 2fa5125

Please sign in to comment.