Skip to content

Commit

Permalink
AAE-26215 Standalone app list (process cloud) (#10523)
Browse files Browse the repository at this point in the history
  • Loading branch information
DenysVuika authored Jan 3, 2025
1 parent 802756f commit 2bd7b3e
Show file tree
Hide file tree
Showing 17 changed files with 172 additions and 217 deletions.
39 changes: 22 additions & 17 deletions docs/process-services-cloud/components/app-list-cloud.component.md
Original file line number Diff line number Diff line change
Expand Up @@ -2,19 +2,19 @@
Title: App List Cloud Component
Added: v3.0.0
Status: Experimental
Last reviewed: 2019-01-08
Last reviewed: 2025-01-03
---

# [App List Cloud Component](../../../lib/process-services-cloud/src/lib/app/components/app-list-cloud.component.ts "Defined in app-list-cloud.component.ts")
# App List Cloud Component

`standalone`, `component`

Shows all deployed cloud application instances.

## Basic Usage

```html
<adf-cloud-app-list
[layoutType]="'GRID'">
</adf-cloud-app-list>
<adf-cloud-app-list [layoutType]="'GRID'" />
```

### [Transclusions](../../user-guide/transclusion.md)
Expand All @@ -23,11 +23,10 @@ You can show custom content when there are no apps available by supplying an
`<adf-custom-empty-content>` section:

```html
<adf-cloud-app-list
[layoutType]="'GRID'">
<adf-custom-empty-content>
No Apps present
</adf-custom-empty-content>
<adf-cloud-app-list [layoutType]="'GRID'">
<adf-custom-empty-content>
No Apps present
</adf-custom-empty-content>
</adf-cloud-app-list>
```

Expand All @@ -38,19 +37,25 @@ If you are generating a project for Activiti 7, you must add the list of apps yo
For example :

```json
"alfresco-deployed-apps" : [{"name": "simple-app"}]
{
"alfresco-deployed-apps": [
{
"name": "simple-app"
}
]
}
```

## Class members

### Properties

| Name | Type | Default value | Description |
| ---- | ---- | ------------- | ----------- |
| layoutType | `string` | LAYOUT_GRID | (**required**) Defines the layout of the apps. There are two possible values, "GRID" and "LIST". |
| Name | Type | Default value | Description |
|------------|----------|---------------|--------------------------------------------------------------------------------------------------|
| layoutType | `string` | LAYOUT_GRID | (**required**) Defines the layout of the apps. There are two possible values, "GRID" and "LIST". |

### Events

| Name | Type | Description |
| ---- | ---- | ----------- |
| appClick | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<`[`ApplicationInstanceModel`](../../../lib/process-services-cloud/src/lib/app/models/application-instance.model.ts)`>` | Emitted when an app entry is clicked. |
| Name | Type | Description |
|----------|------------------------------------------|---------------------------------------|
| appClick | `EventEmitter<ApplicationInstanceModel>` | Emitted when an app entry is clicked. |

This file was deleted.

10 changes: 3 additions & 7 deletions lib/process-services-cloud/src/lib/app/app-list-cloud.module.ts
Original file line number Diff line number Diff line change
Expand Up @@ -16,15 +16,11 @@
*/

import { NgModule } from '@angular/core';
import { MaterialModule } from '../material.module';
import { CommonModule } from '@angular/common';
import { AppDetailsCloudComponent } from './components/app-details-cloud.component';
import { AppListCloudComponent } from './components/app-list-cloud.component';
import { TEMPLATE_DIRECTIVES, CoreModule } from '@alfresco/adf-core';
import { AppDetailsCloudComponent } from './components/app-details-cloud/app-details-cloud.component';
import { AppListCloudComponent } from './components/app-list-cloud/app-list-cloud.component';

@NgModule({
imports: [CommonModule, ...TEMPLATE_DIRECTIVES, MaterialModule, CoreModule],
declarations: [AppListCloudComponent, AppDetailsCloudComponent],
imports: [AppListCloudComponent, AppDetailsCloudComponent],
exports: [AppListCloudComponent, AppDetailsCloudComponent]
})
export class AppListCloudModule {}

This file was deleted.

Original file line number Diff line number Diff line change
Expand Up @@ -22,16 +22,46 @@
}

$tile-themes: (
theme-1: (bg: #269abc, color: #168aac),
theme-2: (bg: #7da9b0, color: #6d99a0),
theme-3: (bg: #7689ab, color: #66799b),
theme-4: (bg: #c74e3e, color: #b73e2e),
theme-5: (bg: #fab96c, color: #eaa95c),
theme-6: (bg: #759d4c, color: #658d3c),
theme-7: (bg: #b1b489, color: #a1a479),
theme-8: (bg: #a17299, color: #916289),
theme-9: (bg: #696c67, color: #595c57),
theme-10: (bg: #cabb33, color: #baab23)
theme-1: (
bg: #269abc,
color: #168aac
),
theme-2: (
bg: #7da9b0,
color: #6d99a0
),
theme-3: (
bg: #7689ab,
color: #66799b
),
theme-4: (
bg: #c74e3e,
color: #b73e2e
),
theme-5: (
bg: #fab96c,
color: #eaa95c
),
theme-6: (
bg: #759d4c,
color: #658d3c
),
theme-7: (
bg: #b1b489,
color: #a1a479
),
theme-8: (
bg: #a17299,
color: #916289
),
theme-9: (
bg: #696c67,
color: #595c57
),
theme-10: (
bg: #cabb33,
color: #baab23
)
);

adf-cloud-app-details {
Expand Down Expand Up @@ -69,10 +99,7 @@ adf-cloud-app-details {
max-width: unset;

&:hover {
box-shadow:
0 8px 10px 1px rgba(0, 0, 0, 0.14),
0 3px 14px 2px rgba(0, 0, 0, 0.12),
0 5px 5px -3px rgba(0, 0, 0, 0.2);
box-shadow: 0 8px 10px 1px rgba(0, 0, 0, 0.14), 0 3px 14px 2px rgba(0, 0, 0, 0.12), 0 5px 5px -3px rgba(0, 0, 0, 0.2);
cursor: pointer;
transform: scale(1.015);
}
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -16,11 +16,10 @@
*/

import { ComponentFixture, TestBed } from '@angular/core/testing';
import { fakeApplicationInstance } from '../mock/app-model.mock';
import { fakeApplicationInstance } from '../../mock/app-model.mock';
import { AppDetailsCloudComponent } from './app-details-cloud.component';
import { ProcessServiceCloudTestingModule } from '../../testing/process-service-cloud.testing.module';
import { AppListCloudModule } from '../app-list-cloud.module';
import { DEFAULT_APP_INSTANCE_THEME } from '../models/application-instance.model';
import { ProcessServiceCloudTestingModule } from '../../../testing/process-service-cloud.testing.module';
import { DEFAULT_APP_INSTANCE_THEME } from '../../models/application-instance.model';

describe('AppDetailsCloudComponent', () => {
let component: AppDetailsCloudComponent;
Expand All @@ -29,7 +28,7 @@ describe('AppDetailsCloudComponent', () => {

beforeEach(() => {
TestBed.configureTestingModule({
imports: [ProcessServiceCloudTestingModule, AppListCloudModule]
imports: [ProcessServiceCloudTestingModule, AppDetailsCloudComponent]
});
fixture = TestBed.createComponent(AppDetailsCloudComponent);
component = fixture.componentInstance;
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -17,17 +17,16 @@

import { applicationConfig, Meta, moduleMetadata, StoryFn } from '@storybook/angular';
import { AppDetailsCloudComponent } from './app-details-cloud.component';
import { ProcessServicesCloudStoryModule } from '../../testing/process-services-cloud-story.module';
import { AppListCloudModule } from '../app-list-cloud.module';
import { fakeApplicationInstance } from '../mock/app-model.mock';
import { ProcessServicesCloudStoryModule } from '../../../testing/process-services-cloud-story.module';
import { fakeApplicationInstance } from '../../mock/app-model.mock';
import { importProvidersFrom } from '@angular/core';

export default {
component: AppDetailsCloudComponent,
title: 'Process Services Cloud/App List Cloud/App Details Cloud',
decorators: [
moduleMetadata({
imports: [AppListCloudModule]
imports: [AppDetailsCloudComponent]
}),
applicationConfig({
providers: [importProvidersFrom(ProcessServicesCloudStoryModule)]
Expand Down
Original file line number Diff line number Diff line change
@@ -0,0 +1,66 @@
/*!
* @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, Input, Output, EventEmitter, ViewEncapsulation } from '@angular/core';
import { ApplicationInstanceModel, DEFAULT_APP_INSTANCE_ICON, DEFAULT_APP_INSTANCE_THEME } from '../../models/application-instance.model';
import { CommonModule } from '@angular/common';
import { TranslateModule } from '@ngx-translate/core';
import { MatIconModule } from '@angular/material/icon';
import { MatCardModule } from '@angular/material/card';

@Component({
selector: 'adf-cloud-app-details',
standalone: true,
imports: [CommonModule, TranslateModule, MatIconModule, MatCardModule],
templateUrl: './app-details-cloud.component.html',
styleUrls: ['./app-details-cloud.component.scss'],
encapsulation: ViewEncapsulation.None
})
export class AppDetailsCloudComponent {
@Input()
applicationInstance: ApplicationInstanceModel;

@Output()
selectedApp = new EventEmitter<ApplicationInstanceModel>();

/**
* Pass the selected app as next
*
* @param app application model
*/
onSelectApp(app: ApplicationInstanceModel): void {
this.selectedApp.emit(app);
}

/**
* Get application instance theme
*
* @returns the name of the theme
*/
getTheme(): string {
return this.applicationInstance.theme || DEFAULT_APP_INSTANCE_THEME;
}

/**
* Get application instance icon
*
* @returns the name of the icon
*/
getIcon(): string {
return this.applicationInstance.icon || DEFAULT_APP_INSTANCE_ICON;
}
}
Loading

0 comments on commit 2bd7b3e

Please sign in to comment.