Skip to content

Commit

Permalink
[AMBARI-24551] [Log Search UI] get rid of redundant requests after un…
Browse files Browse the repository at this point in the history
…doing or redoing several history steps - working history manager
  • Loading branch information
tobias-istvan committed Nov 8, 2018
1 parent c7418eb commit a7c227f
Show file tree
Hide file tree
Showing 23 changed files with 862 additions and 218 deletions.
Expand Up @@ -17,7 +17,7 @@
*/

export interface FilterUrlParamChange {
previousPath: string | null;
previousPath?: string | null;
currentPath: string;
time?: Date;
}
Expand Up @@ -24,76 +24,6 @@
/deep/ .stop-icon {
color: @exclude-color;
}
&.history-menu {
/deep/ ul {
li:not(.selection-all) {
margin: 0;
overflow: hidden;
position: relative;
transition: background-color 300ms ease-in, opacity 300ms ease-in, height 100ms 400ms ease-in;
&:before {
border-left: 1px solid darken(@unknown-color, 25%);
bottom: 0;
content: "";
display: block;
left: 12px;
position: absolute;
top: 0;
}
&:after {
background: #fff;
border: 1px solid darken(@unknown-color, 25%);
border-radius: 100%;
content: "";
height: 12px;
left: 7px;
position: absolute;
top: 6px;
transition: background-color 300ms;
width: 12px;
}

.list-item-label.label-container {
border-radius: 3px;
display: flex;
margin: 0 3px 0 25px;
padding: 3px 25px 3px 1em;
.item-label-text {
flex-grow: 1;
padding-right: 1em;
}
/deep/ history-item-controls {
float: none;
justify-self: right;
}
}

&.active > a, &:hover {
color: #262626;
text-decoration: none;
background-color: transparent;
.list-item-label.label-container {
background-color: #f5f5f5;
}
}
}
li:not(.selection-all):first-child {
&:before {
top: 50%;
}
}
li:not(.selection-all):last-child {
&:before {
bottom: 50%;
}
}
li:not(.selection-all):hover {
&:after {
background: @unknown-color;
}
}
}
}
}
/deep/ .modal-body {
min-height: 25vh;
Expand Down
Expand Up @@ -18,18 +18,18 @@

import { Component, OnInit, OnDestroy } from '@angular/core';
import { FormGroup } from '@angular/forms';
import { ActivatedRoute, Router } from '@angular/router';
import { ActivatedRoute } from '@angular/router';

import { Observable } from 'rxjs/Observable';
import { BehaviorSubject } from 'rxjs/BehaviorSubject';
import { Subscription } from 'rxjs/Subscription';

import { LogsContainerService } from '@app/services/logs-container.service';
import { UserSettingsService } from '@app/services/user-settings.service';
import { ListItem } from '@app/classes/list-item';
import { ClustersService } from '@app/services/storage/clusters.service';
import { UtilsService } from '@app/services/utils.service';
import { NavigationService } from '@app/modules/shared/services/navigation.service';
import { Subject } from 'rxjs/Subject';

@Component({
selector: 'action-menu',
Expand Down Expand Up @@ -60,29 +60,26 @@ export class ActionMenuComponent implements OnInit, OnDestroy {

selectedClusterName$: BehaviorSubject<string> = new BehaviorSubject('');

subscriptions: Subscription[] = [];
destroyed$ = new Subject();

constructor(
private logsContainerService: LogsContainerService,
private settings: UserSettingsService,
private route: ActivatedRoute,
private router: Router,
private clustersService: ClustersService,
private utilsService: UtilsService,
private navigationService: NavigationService
) {
}

ngOnInit() {
this.subscriptions.push(
this.selectedClusterName$.subscribe(
(clusterName: string) => this.setModalSubmitDisabled(!(!!clusterName))
)
this.selectedClusterName$.takeUntil(this.destroyed$).subscribe(
(clusterName: string) => this.setModalSubmitDisabled(!(!!clusterName))
);
}

ngOnDestroy() {
this.subscriptions.forEach((subscription: Subscription) => subscription.unsubscribe());
this.destroyed$.next(true);
}

get captureSeconds(): number {
Expand Down
@@ -1,13 +1,13 @@
<menu-button label="{{'topMenu.undo' | translate}}" [subItems]="activeUndoHistoryItems$ | async" iconClass="fa fa-arrow-left"
<menu-button label="{{'topMenu.undo' | translate}}" [subItems]="activeUndoHistoryListItems$ | async" iconClass="fa fa-arrow-left"
class="history-menu" [class.disabled]="!(hasActiveUndoHistoryItems$ | async)" [isDisabled]="!(hasActiveUndoHistoryItems$ | async)"
listClass="history-dropdown" (buttonClick)="undo()" (selectItem)="undo($event)">
listClass="history-dropdown" (buttonClick)="undo()" (selectItem)="onListItemClick($event)">
</menu-button>

<menu-button label="{{'topMenu.redo' | translate}}" [subItems]="activeRedoHistoryItems$ | async" iconClass="fa fa-arrow-right"
<menu-button label="{{'topMenu.redo' | translate}}" [subItems]="activeRedoHistoryListItems$ | async" iconClass="fa fa-arrow-right"
class="history-menu" [class.disabled]="!(hasActiveRedoHistoryItems$ | async)" [isDisabled]="!(hasActiveRedoHistoryItems$ | async)"
listClass="history-dropdown" (buttonClick)="redo()" (selectItem)="redo($event)">
listClass="history-dropdown" (buttonClick)="redo()" (selectItem)="onListItemClick($event)">
</menu-button>

<menu-button label="{{'topMenu.history' | translate}}" [subItems]="activeHistoryItems$ | async" iconClass="fa fa-history"
<menu-button label="{{'topMenu.history' | translate}}" [subItems]="activeHistoryListItems$ | async" iconClass="fa fa-history"
class="history-menu" [class.disabled]="!(hasActiveHistoryItems$ | async)" [isDisabled]="!(hasActiveHistoryItems$ | async)"
listClass="history-dropdown" [isRightAlign]="true" (selectItem)="navigateToFilterUrlParamChangeItem($event)"></menu-button>
listClass="history-dropdown" [isRightAlign]="true" (selectItem)="onListItemClick($event)"></menu-button>
@@ -0,0 +1,105 @@
/**
* Licensed to the Apache Software Foundation (ASF) under one
* or more contributor license agreements. See the NOTICE file
* distributed with this work for additional information
* regarding copyright ownership. The ASF licenses this file
* to you under the Apache License, Version 2.0 (the
* "License"); you may not use this file except in compliance
* with the License. You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/

@import '../../modules/shared/variables';

@current-history-item-hover-color: @unknown-color;
@current-history-item-highlight-color: @form-success-color;

:host {
/deep/ menu-button .item-label-text:first-letter {
text-transform: uppercase;
}

.history-menu {
/deep/ ul {
li:not(.selection-all) {
margin: 0;
overflow: hidden;
position: relative;
transition: background-color 300ms ease-in, opacity 300ms ease-in, height 100ms 400ms ease-in;
&:before {
border-left: 1px solid darken(@unknown-color, 25%);
bottom: 0;
content: "";
display: block;
left: 12px;
position: absolute;
top: 0;
}
&:after {
background: #fff;
border: 1px solid darken(@unknown-color, 25%);
border-radius: 100%;
content: "";
height: 12px;
left: 7px;
position: absolute;
top: 6px;
transition: background-color 300ms;
width: 12px;
}

.list-item-label.label-container {
border-radius: 3px;
display: flex;
margin: 0 3px 0 25px;
padding: 3px 25px 3px 1em;
.item-label-text {
flex-grow: 1;
padding-right: 1em;
}
/deep/ history-item-controls {
float: none;
justify-self: right;
}
}

&.active > a, &:hover {
color: #262626;
text-decoration: none;
background-color: transparent;
.list-item-label.label-container {
background-color: #f5f5f5;
}
}
}
li:not(.selection-all):first-child {
&:before {
top: 50%;
}
}
li:not(.selection-all):last-child {
&:before {
bottom: 50%;
}
}
li:not(.selection-all):hover {
&:after {
background: @current-history-item-hover-color;
}
}
li:not(.selection-all).active {
&:after {
background: @current-history-item-highlight-color;
}
}
}
}

}

0 comments on commit a7c227f

Please sign in to comment.