Skip to content

Commit 8e5574b

Browse files
authored
Merge pull request #7 from sobolevskaia/feature/120-external-link-cell
feat: Create an external link template for a table column
2 parents f07b4ad + 75b72af commit 8e5574b

11 files changed

+121
-32
lines changed

Diff for: src/ng-generate/components/shared/generators/language/files/__name@dasherize__.translation.json.template

+1
Original file line numberDiff line numberDiff line change
@@ -162,6 +162,7 @@
162162
"restoreDefaults": "Restore Defaults",
163163
"columns": "Columns",
164164
"export": "Export",
165+
"noLink": "No link",
165166
"toolbar": {
166167
"sorted_tooltip": "Sort data by property",
167168
"sort_dir_tooltip": "Sort data direction",

Diff for: src/ng-generate/components/shared/methods/generation/extended-table.html.template

+16-8
Original file line numberDiff line numberDiff line change
@@ -43,6 +43,7 @@
4343
let datePipe = options.templateHelper.isDateTimeProperty(value.property) ? `| date: ${options.resolveDateTimeFormat(options, value.property)}` : '';
4444
let descriptionPipe = options.templateHelper.isEnumPropertyWithEntityValues(value.property) ? ` | showDescription:get${classify(value.property.name)}Value` : '';
4545
let cellContent = `!(${isEmptyValue}) ? (row.${cellPropertyPath}${descriptionPipe}${language}${datePipe}) : '-'`;
46+
let isLink = options.templateHelper.isLinkProperty(value.property)
4647
%>
4748

4849
<!-- <%= cellPropertyPath %> Column -->
@@ -67,14 +68,21 @@
6768
<% } %>
6869
>
6970

70-
<esmf-table-cell
71-
[value]="<%= cellContent %>"
72-
<% if(options.hasSearchBar) { %>
73-
[configs]="configs"
74-
[highlightString]="highlightString"
75-
<% } %>
76-
(copyToClipboardEvent)="copyToClipboard($event)"
77-
></esmf-table-cell>
71+
<% if (isLink) { %>
72+
<esmf-table-cell-link
73+
[value]="<%= cellContent %>"
74+
[tooltipMessage]="'noLink' | transloco "
75+
></esmf-table-cell-link>
76+
<% } else { %>
77+
<esmf-table-cell
78+
[value]="<%= cellContent %>"
79+
<% if(options.hasSearchBar) { %>
80+
[configs]="configs"
81+
[highlightString]="highlightString"
82+
<% } %>
83+
(copyToClipboardEvent)="copyToClipboard($event)"
84+
></esmf-table-cell>
85+
<% } %>
7886
</td>
7987
</ng-container>
8088
<% } %>
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
<!-- <%= options.generationDisclaimerText %> -->
2+
3+
<button
4+
[matTooltipDisabled]="!isDisabled()"
5+
[class.button-disabled]="isDisabled()"
6+
[matTooltip]="tooltipMessage()"
7+
(click)="openExternalLink()"
8+
matTooltipPosition="above"
9+
mat-icon-button
10+
aria-label="link row"
11+
>
12+
<mat-icon class="material-icons">open_in_new</mat-icon>
13+
</button>
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,16 @@
1+
/** <%= options.generationDisclaimerText %> **/
2+
3+
button {
4+
background-color: transparent;
5+
border: none;
6+
color: inherit;
7+
padding: 0;
8+
font: inherit;
9+
cursor: pointer;
10+
outline: inherit;
11+
}
12+
13+
.button-disabled {
14+
cursor: not-allowed;
15+
opacity: 0.4;
16+
}
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,28 @@
1+
/** <%= options.generationDisclaimerText %> **/
2+
3+
import {ChangeDetectionStrategy, Component, computed, input, Signal} from '@angular/core';
4+
import {MatTooltipModule} from '@angular/material/tooltip';
5+
import {MatIconModule} from '@angular/material/icon';
6+
7+
@Component({
8+
standalone: true,
9+
selector: '<%= dasherize(name) %>',
10+
templateUrl: './<%= dasherize(name) %>.component.html',
11+
styleUrls: ['./<%= dasherize(name) %>.component.<%= options.style %>'],
12+
changeDetection: ChangeDetectionStrategy.OnPush,
13+
imports: [MatTooltipModule, MatIconModule]
14+
})
15+
export class EsmfTableCellLinkComponent {
16+
value = input.required<string>();
17+
tooltipMessage = input.required<string>();
18+
19+
isDisabled: Signal<boolean> = computed(() => this.value() === '-');
20+
21+
openExternalLink() {
22+
if (this.isDisabled()){
23+
return;
24+
}
25+
26+
window.open(this.value(), '_blank');
27+
}
28+
}
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,32 @@
1+
/*
2+
* Copyright Robert Bosch Manufacturing Solutions GmbH, Germany. All rights reserved.
3+
*
4+
* See the AUTHORS file(s) distributed with this work for
5+
* additional information regarding authorship.
6+
*
7+
* This Source Code Form is subject to the terms of the Mozilla Public
8+
* License, v. 2.0. If a copy of the MPL was not distributed with this
9+
* file, You can obtain one at https://mozilla.org/MPL/2.0/.
10+
*
11+
* SPDX-License-Identifier: MPL-2.0
12+
*/
13+
14+
import {apply, applyTemplates, MergeStrategy, mergeWith, move, Rule, SchematicContext, Tree, url} from '@angular-devkit/schematics';
15+
import {strings} from '@angular-devkit/core';
16+
17+
export function generateTableCellLinkComponent(options: any): Rule {
18+
return (tree: Tree, _context: SchematicContext) => {
19+
return mergeWith(
20+
apply(url('./generators/components/table-cell-link/files'), [
21+
applyTemplates({
22+
classify: strings.classify,
23+
dasherize: strings.dasherize,
24+
options: options,
25+
name: 'esmf-table-cell-link',
26+
}),
27+
move('src/app/shared/components/table-cell-link'),
28+
]),
29+
options.overwrite ? MergeStrategy.Overwrite : MergeStrategy.Error,
30+
);
31+
};
32+
}

Diff for: src/ng-generate/components/table/generators/components/table-cell/files/__name@dasherize__.component.html.template

+1-12
Original file line numberDiff line numberDiff line change
@@ -1,15 +1,4 @@
1-
<!--
2-
* Copyright (c) 2024 Robert Bosch Manufacturing Solutions GmbH
3-
*
4-
* See the AUTHORS file(s) distributed with this work for
5-
* additional information regarding authorship.
6-
*
7-
* This Source Code Form is subject to the terms of the Mozilla Public
8-
* License, v. 2.0. If a copy of the MPL was not distributed with this
9-
* file, You can obtain one at https://mozilla.org/MPL/2.0/.
10-
*
11-
* SPDX-License-Identifier: MPL-2.0
12-
-->
1+
<!-- <%= options.generationDisclaimerText %> -->
132

143
<span
154
[tableCellTooltip]="value"

Diff for: src/ng-generate/components/table/generators/components/table/files/__name@dasherize__.component.html.template

+1-12
Original file line numberDiff line numberDiff line change
@@ -1,15 +1,4 @@
1-
<!--
2-
* Copyright (c) 2024 Robert Bosch Manufacturing Solutions GmbH
3-
*
4-
* See the AUTHORS file(s) distributed with this work for
5-
* additional information regarding authorship.
6-
*
7-
* This Source Code Form is subject to the terms of the Mozilla Public
8-
* License, v. 2.0. If a copy of the MPL was not distributed with this
9-
* file, You can obtain one at https://mozilla.org/MPL/2.0/.
10-
*
11-
* SPDX-License-Identifier: MPL-2.0
12-
-->
1+
<!-- <%= options.generationDisclaimerText %> -->
132

143
<div class="js-sdk-component-container">
154
<% if (options.addCommandBar) { %>

Diff for: src/ng-generate/components/table/index.ts

+2
Original file line numberDiff line numberDiff line change
@@ -41,6 +41,7 @@ import {generateExportTableDialog} from './generators/components/export-dialog/i
4141
import {generatePaginatorSelectConfigProvider} from '../shared/generators';
4242
import {generateTableCellTooltipDirective} from './generators/directives/table-cell-tooltip';
4343
import {generateTableCellComponent} from './generators/components/table-cell';
44+
import {generateTableCellLinkComponent} from './generators/components/table-cell-link/index';
4445

4546
export default function (tableSchema: TableSchema): Rule {
4647
return (tree: Tree, context: SchematicContext) => {
@@ -70,6 +71,7 @@ function tableSpecificGeneration(): Array<Rule> {
7071
return [
7172
generateTableComponent(options),
7273
generateTableCellComponent(options),
74+
generateTableCellLinkComponent(options),
7375
generateDataSource(options),
7476
generateStorageService(options),
7577
generateColumnMenu(options),

Diff for: src/utils/modules.ts

+1
Original file line numberDiff line numberDiff line change
@@ -84,6 +84,7 @@ export const tableModules = (options: Schema) => [
8484
{name: 'DragDropModule', fromLib: '@angular/cdk/drag-drop'},
8585
{name: 'NgTemplateOutlet', fromLib: '@angular/common'},
8686
{name: 'DatePipe', fromLib: '@angular/common'},
87+
{name: 'EsmfTableCellLinkComponent', fromLib: '../../table-cell-link/esmf-table-cell-link.component'},
8788
{
8889
name: 'MatCheckboxModule',
8990
fromLib: '@angular/material/checkbox',

Diff for: src/utils/template-helper.ts

+10
Original file line numberDiff line numberDiff line change
@@ -226,6 +226,16 @@ export class TemplateHelper {
226226
return property.characteristic.name === 'MultiLanguageText';
227227
}
228228

229+
/**
230+
* Returns true if the given property is a link property.
231+
*
232+
* @param {Property} property The property to check.
233+
* @returns {boolean} True if the property is a link property.
234+
*/
235+
isLinkProperty(property: Property): boolean{
236+
return property.characteristic.name === 'ResourcePath'
237+
}
238+
229239
/**
230240
* Gets all enum properties.
231241
*

0 commit comments

Comments
 (0)