inteligr8/alfresco-ng2-components
1
0
Fork 0
mirror of https://github.com/Alfresco/alfresco-ng2-components.git synced 2025-07-24 17:32:15 +00:00
Code Issues Packages Projects Releases Wiki Activity

ACS-8256: Move "menu buttons" to Insights where it belongs (#9849)

Browse Source
This commit is contained in:
Denys Vuika
2024-07-01 11:01:26 -04:00
committed by GitHub
parent 80ff96a317
commit 5fa3afe3a5
17 changed files with 41 additions and 223 deletions
Download Patch File Download Diff File Expand all files Collapse all files

20
lib/core/src/lib/buttons-menu/buttons-menu.component.html
View File

@@ -1,20 +0,0 @@
<div id="adf-buttons-menu" class="adf-buttons-menu" *ngIf="!isMenuEmpty">
<div *ngIf="isMobile()">
<button mat-icon-button [matMenuTriggerFor]="editReportMenu">
<mat-icon>more_vert</mat-icon>
</button>
<mat-menu #editReportMenu="matMenu" class="adf-buttons-menu-mobile">
<ng-content *ngTemplateOutlet="desktop">
</ng-content>
</mat-menu>
</div>
<div *ngIf="!isMobile()" class="adf-buttons-menu-desktop">
<ng-content *ngTemplateOutlet="desktop">
</ng-content>
</div>
</div>
<ng-template #desktop>
<ng-content></ng-content>
</ng-template>

29
lib/core/src/lib/buttons-menu/buttons-menu.component.scss
View File

@@ -1,29 +0,0 @@
.adf-buttons-menu {
margin-right: 10px;
& div {
display: flex;
}
&-mobile {
margin-right: 10px;
}
&-desktop {
display: flex;
button {
color: black;
padding: 0;
}
button > span {
display: none;
}
button > mat-icon.mat-icon.material-icons {
color: black;
margin: 0 10px;
}
}
}

117
lib/core/src/lib/buttons-menu/buttons-menu.component.spec.ts
View File

@@ -1,117 +0,0 @@
/*!
* @license
* Copyright © 2005-2024 Hyland Software, Inc. and its affiliates. All rights reserved.
*
* Licensed 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 { TestBed, ComponentFixture } from '@angular/core/testing';
import { MaterialModule } from '../material.module';
import { CoreTestingModule } from '../testing/core.testing.module';
import { CUSTOM_ELEMENTS_SCHEMA, Component } from '@angular/core';
@Component({
selector: 'adf-custom-container',
template: `
<adf-buttons-action-menu>
<button mat-menu-item (click)="assignValue()"><mat-icon>settings</mat-icon><span> Button </span></button>
</adf-buttons-action-menu>
`
})
export class CustomContainerComponent {
value: number;
assignValue() {
this.value = 1;
}
}
@Component({
selector: 'adf-custom-empty-container',
template: `<adf-buttons-action-menu></adf-buttons-action-menu>`
})
export class CustomEmptyContainerComponent {}
describe('ButtonsMenuComponent', () => {
describe('When Buttons are injected', () => {
let fixture: ComponentFixture<CustomContainerComponent>;
let component: CustomContainerComponent;
let element: HTMLElement;
beforeEach(() => {
TestBed.configureTestingModule({
imports: [CoreTestingModule, MaterialModule],
declarations: [CustomContainerComponent],
schemas: [CUSTOM_ELEMENTS_SCHEMA]
});
fixture = TestBed.createComponent(CustomContainerComponent);
element = fixture.debugElement.nativeElement;
component = fixture.componentInstance;
});
afterEach(() => {
fixture.destroy();
});
it('should render buttons menu when at least one button is declared', async () => {
fixture.detectChanges();
await fixture.whenStable();
const buttonsMenuElement = element.querySelector('#adf-buttons-menu');
expect(buttonsMenuElement).toBeDefined();
});
it('should trigger event when a specific button is clicked', async () => {
expect(component.value).toBeUndefined();
fixture.detectChanges();
await fixture.whenStable();
const button = element.querySelector('button');
button.click();
fixture.detectChanges();
await fixture.whenStable();
expect(component.value).toBe(1);
});
});
describe('When no buttons are injected', () => {
let fixture: ComponentFixture<CustomEmptyContainerComponent>;
let element: HTMLElement;
beforeEach(() => {
TestBed.configureTestingModule({
imports: [CoreTestingModule, MaterialModule],
declarations: [CustomEmptyContainerComponent],
schemas: [CUSTOM_ELEMENTS_SCHEMA]
});
fixture = TestBed.createComponent(CustomEmptyContainerComponent);
element = fixture.nativeElement;
});
afterEach(() => {
fixture.destroy();
TestBed.resetTestingModule();
});
it('should hide buttons menu if buttons input is empty', async () => {
fixture.detectChanges();
await fixture.whenStable();
const buttonsMenuElement = element.querySelector('#adf-buttons-menu');
expect(buttonsMenuElement).toBeNull();
});
});
});

119
lib/core/src/lib/buttons-menu/buttons-menu.component.stories.ts
View File

@@ -1,119 +0,0 @@
/*!
* @license
* Copyright © 2005-2024 Hyland Software, Inc. and its affiliates. All rights reserved.
*
* Licensed 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 { Meta, moduleMetadata, Story } from '@storybook/angular';
import { CoreStoryModule } from '../testing/core.story.module';
import { ButtonsMenuComponent } from './buttons-menu.component';
import { ButtonsMenuModule } from './buttons-menu.module';
export default {
component: ButtonsMenuComponent,
title: 'Core/Buttons Menu/Buttons Menu',
decorators: [
moduleMetadata({
imports: [CoreStoryModule, ButtonsMenuModule]
})
],
argTypes: {
mobile: {
type: { name: 'boolean' },
name: 'isMobile',
description:
'Determines whether it is displayed on a mobile device',
defaultValue: true,
control: {
disable: false
},
table: {
category: 'Component methods',
type: {
summary: '() => boolean'
}
}
},
isMenuEmpty: {
description: 'Determines whether it has anything to display',
table: {
category: 'Component properties',
type: {
summary: 'boolean'
}
}
}
}
} as Meta;
export const sixButtons: Story = args => ({
props: {
...args,
isMenuEmpty: false,
isMobile() {
return args.mobile;
}
},
template: `
<adf-buttons-action-menu>
<button mat-menu-item>
<mat-icon>settings</mat-icon><span> Settings </span>
</button>
<button mat-menu-item>
<mat-icon>home</mat-icon><span> Home </span>
</button>
<button mat-menu-item>
<mat-icon>search</mat-icon><span> Search </span>
</button>
<button mat-menu-item>
<mat-icon>done</mat-icon><span> Done </span>
</button>
<button mat-menu-item>
<mat-icon>delete</mat-icon><span> Delete </span>
</button>
<button mat-menu-item>
<mat-icon>block</mat-icon><span> Block </span>
</button>
</adf-buttons-action-menu>
`
});
export const oneButton: Story = args => ({
props: {
...args,
isMenuEmpty: false,
isMobile() {
return args.mobile;
}
},
template: `
<adf-buttons-action-menu>
<button mat-menu-item>
<mat-icon>settings</mat-icon><span> Settings </span>
</button>
</adf-buttons-action-menu>
`
});
export const noButtons: Story = args => ({
props: {
...args,
isMenuEmpty: true,
isMobile() {
return args.mobile;
}
},
template: `
<adf-buttons-action-menu></adf-buttons-action-menu>`
});

41
lib/core/src/lib/buttons-menu/buttons-menu.component.ts
View File

@@ -1,41 +0,0 @@
/*!
* @license
* Copyright © 2005-2024 Hyland Software, Inc. and its affiliates. All rights reserved.
*
* Licensed 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 { Component, ContentChildren, QueryList, AfterContentInit, ViewEncapsulation } from '@angular/core';
import { MatMenuItem } from '@angular/material/menu';
@Component({
selector: 'adf-buttons-action-menu',
templateUrl: './buttons-menu.component.html',
styleUrls: ['./buttons-menu.component.scss'],
encapsulation: ViewEncapsulation.None
})
export class ButtonsMenuComponent implements AfterContentInit {
@ContentChildren(MatMenuItem) buttons: QueryList<MatMenuItem>;
isMenuEmpty: boolean;
ngAfterContentInit() {
this.isMenuEmpty = this.buttons.length <= 0;
}
isMobile(): boolean {
return !!/Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent);
}
}

36
lib/core/src/lib/buttons-menu/buttons-menu.module.ts
View File

@@ -1,36 +0,0 @@
/*!
* @license
* Copyright © 2005-2024 Hyland Software, Inc. and its affiliates. All rights reserved.
*
* Licensed 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 { CommonModule } from '@angular/common';
import { NgModule } from '@angular/core';
import { TranslateModule } from '@ngx-translate/core';
import { MatIconModule } from '@angular/material/icon';
import { MatMenuModule } from '@angular/material/menu';
import { MatButtonModule } from '@angular/material/button';
import { ButtonsMenuComponent } from './buttons-menu.component';
@NgModule({
imports: [
CommonModule,
MatIconModule,
MatMenuModule,
TranslateModule
],
declarations: [ButtonsMenuComponent],
exports: [ButtonsMenuComponent, MatIconModule, MatMenuModule, MatButtonModule]
})
export class ButtonsMenuModule {}

18
lib/core/src/lib/buttons-menu/index.ts
View File

@@ -1,18 +0,0 @@
/*!
* @license
* Copyright © 2005-2024 Hyland Software, Inc. and its affiliates. All rights reserved.
*
* Licensed 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.
*/
export * from './public-api';

19
lib/core/src/lib/buttons-menu/public-api.ts
View File

@@ -1,19 +0,0 @@
/*!
* @license
* Copyright © 2005-2024 Hyland Software, Inc. and its affiliates. All rights reserved.
*
* Licensed 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.
*/
export * from './buttons-menu.component';
export * from './buttons-menu.module';

3
lib/core/src/lib/core.module.ts
View File

@@ -35,7 +35,6 @@ import { FormBaseModule } from './form/form-base.module';
import { SidenavLayoutModule } from './layout/layout.module';
import { CommentsModule } from './comments/comments.module';
import { CommentListModule } from './comments/comment-list/comment-list.module';
import { ButtonsMenuModule } from './buttons-menu/buttons-menu.module';
import { TemplateModule } from './templates/template.module';
import { ClipboardModule } from './clipboard/clipboard.module';
import { NotificationHistoryModule } from './notifications/notification-history.module';
@@ -95,7 +94,6 @@ import { DynamicChipListModule } from './dynamic-chip-list';
LanguageMenuModule,
InfoDrawerModule,
DataTableModule,
ButtonsMenuModule,
TemplateModule,
IconModule,
SortingPickerModule,
@@ -135,7 +133,6 @@ import { DynamicChipListModule } from './dynamic-chip-list';
InfoDrawerModule,
DataTableModule,
TranslateModule,
ButtonsMenuModule,
TemplateModule,
SortingPickerModule,
IconModule,

1
lib/core/src/public-api.ts
View File

@@ -32,7 +32,6 @@ export * from './lib/app-config/index';
export * from './lib/form/index';
export * from './lib/layout/index';
export * from './lib/comments/index';
export * from './lib/buttons-menu/index';
export * from './lib/sorting-picker/index';
export * from './lib/templates/index';
export * from './lib/pipes/index';