Skip to content

Commit eb4c2c7

Browse files
haniczhanicz
authored
KNOX-3224: Upgrade Token Management and Token Generation UI (#1118)
* KNOX-3224: Refactor token generation UI, upgrade node ,angular, bootstrap, jquery and other dependencies * KNOX-3224: Upgrade Token Management UI * KNOX-3224: Replaced old token-management prebuilt theme, Changed default show proxy information to true, Fixed invalid profiles call (duplicate '/' in URL) * KNOX-3224: Styled paginator on token management UI * KNOX-3224: Remove package-lock.json as well during clean * KNOX-3224: Green-palette style for Token Generation UI * KNOX-3224: Update token management and generation UIs to Angular v21 * KNOX-3224: Upgrade Homepage UI to angular v21 * KNOX-3224: On Token Management UI fixed a race condition that caused tokens to NOT load on page init.
1 parent 319f6ca commit eb4c2c7

File tree

69 files changed

+1571
-9730
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

69 files changed

+1571
-9730
lines changed

‎knox-homepage-ui/eslint.config.js‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -16,7 +16,7 @@ export default [
1616
languageOptions: {
1717
parser: tsParser,
1818
parserOptions: {
19-
project: ["./tsconfig.json"],
19+
project: ["home/tsconfig.json"],
2020
tsconfigRootDir: import.meta.dirname,
2121
},
2222
globals: {

‎knox-homepage-ui/home/app/apiservice-dialog/apiservice-dialog.component.html‎

Lines changed: 25 additions & 22 deletions
Original file line numberDiff line numberDiff line change
@@ -1,16 +1,16 @@
11
<!--
2-
Licensed to the Apache Software Foundation (ASF) under one or more
3-
contributor license agreements. See the NOTICE file distributed with
4-
this work for additional information regarding copyright ownership.
5-
The ASF licenses this file to You under the Apache License, Version 2.0
6-
(the "License"); you may not use this file except in compliance with
7-
the License. You may obtain a copy of the License at
8-
http://www.apache.org/licenses/LICENSE-2.0
9-
Unless required by applicable law or agreed to in writing, software
10-
distributed under the License is distributed on an "AS IS" BASIS,
11-
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
12-
See the License for the specific language governing permissions and
13-
limitations under the License.
2+
Licensed to the Apache Software Foundation (ASF) under one or more
3+
contributor license agreements. See the NOTICE file distributed with
4+
this work for additional information regarding copyright ownership.
5+
The ASF licenses this file to You under the Apache License, Version 2.0
6+
(the "License"); you may not use this file except in compliance with
7+
the License. You may obtain a copy of the License at
8+
http://www.apache.org/licenses/LICENSE-2.0
9+
Unless required by applicable law or agreed to in writing, software
10+
distributed under the License is distributed on an "AS IS" BASIS,
11+
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
12+
See the License for the specific language governing permissions and
13+
limitations under the License.
1414
-->
1515
<h3 mat-dialog-title class="dialog-title">
1616
{{ data?.shortDesc }}
@@ -22,7 +22,9 @@ <h3 mat-dialog-title class="dialog-title">
2222
<div class="info-label"><strong>Knox Service Name</strong></div>
2323
<div class="info-value">
2424
{{ data?.serviceName }}
25-
<span class="small" *ngIf="data?.version">(v{{ data?.version }})</span>
25+
@if (data?.version) {
26+
<span class="small">(v{{ data?.version }})</span>
27+
}
2628
</div>
2729
</div>
2830

@@ -34,16 +36,16 @@ <h3 mat-dialog-title class="dialog-title">
3436
<div class="info-row">
3537
<div class="info-label"><strong>Sample(s)</strong></div>
3638
<div class="info-value">
37-
<ng-container *ngIf="data.samples?.sample?.length > 0; else noSamples">
39+
@if (data.samples?.sample?.length > 0) {
3840
<div class="samples-container">
39-
<div *ngFor="let sample of data.samples.sample" class="sample-item">
40-
<div class="sample-desc"><strong>{{ sample.description }}</strong></div>
41-
<div class="sample-value">{{ sample.value }}</div>
42-
</div>
41+
@for (sample of data.samples.sample; track sample) {
42+
<div class="sample-item">
43+
<div class="sample-desc"><strong>{{ sample.description }}</strong></div>
44+
<div class="sample-value">{{ sample.value }}</div>
45+
</div>
46+
}
4347
</div>
44-
</ng-container>
45-
46-
<ng-template #noSamples>
48+
} @else {
4749
<div class="no-samples">
4850
<p><strong>No samples found in service metadata.</strong></p>
4951
<p>
@@ -53,7 +55,8 @@ <h3 mat-dialog-title class="dialog-title">
5355
</a>
5456
</p>
5557
</div>
56-
</ng-template>
58+
}
59+
5760
</div>
5861
</div>
5962
</div>

‎knox-homepage-ui/home/app/apiservice-dialog/apiservice-dialog.component.ts‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -20,11 +20,11 @@ import { MatButtonModule } from '@angular/material/button';
2020
import { MatGridListModule } from '@angular/material/grid-list';
2121
import { MatListModule } from '@angular/material/list';
2222
import { MAT_DIALOG_DATA, MatDialogRef } from '@angular/material/dialog';
23-
import { CommonModule } from '@angular/common';
23+
2424

2525
@Component({
2626
selector: 'app-apiservice-dialog',
27-
imports: [MatDialogModule, MatButtonModule, MatGridListModule, MatListModule, CommonModule],
27+
imports: [MatDialogModule, MatButtonModule, MatGridListModule, MatListModule],
2828
templateUrl: './apiservice-dialog.component.html',
2929
styleUrl: './apiservice-dialog.component.css'
3030
})

‎knox-homepage-ui/home/app/app.module.ts‎

Lines changed: 0 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -16,7 +16,6 @@
1616
*/
1717
import { NgModule } from '@angular/core';
1818
import { BrowserModule } from '@angular/platform-browser';
19-
import { HttpClientModule, HttpClientXsrfModule } from '@angular/common/http';
2019
import { MatGridListModule } from '@angular/material/grid-list';
2120
import { RouterModule } from '@angular/router';
2221

@@ -25,8 +24,6 @@ import { HomepageService } from './service/homepage.service';
2524
@NgModule({
2625
imports: [
2726
BrowserModule,
28-
HttpClientModule,
29-
HttpClientXsrfModule,
3027
MatGridListModule,
3128
RouterModule.forRoot([]),
3229
],

‎knox-homepage-ui/home/app/generalProxyInformation/general.proxy.information.component.html‎

Lines changed: 102 additions & 80 deletions
Original file line numberDiff line numberDiff line change
@@ -1,85 +1,107 @@
11
<!--
2-
Licensed to the Apache Software Foundation (ASF) under one or more
3-
contributor license agreements. See the NOTICE file distributed with
4-
this work for additional information regarding copyright ownership.
5-
The ASF licenses this file to You under the Apache License, Version 2.0
6-
(the "License"); you may not use this file except in compliance with
7-
the License. You may obtain a copy of the License at
8-
http://www.apache.org/licenses/LICENSE-2.0
9-
Unless required by applicable law or agreed to in writing, software
10-
distributed under the License is distributed on an "AS IS" BASIS,
11-
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
12-
See the License for the specific language governing permissions and
13-
limitations under the License.
2+
Licensed to the Apache Software Foundation (ASF) under one or more
3+
contributor license agreements. See the NOTICE file distributed with
4+
this work for additional information regarding copyright ownership.
5+
The ASF licenses this file to You under the Apache License, Version 2.0
6+
(the "License"); you may not use this file except in compliance with
7+
the License. You may obtain a copy of the License at
8+
http://www.apache.org/licenses/LICENSE-2.0
9+
Unless required by applicable law or agreed to in writing, software
10+
distributed under the License is distributed on an "AS IS" BASIS,
11+
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
12+
See the License for the specific language governing permissions and
13+
limitations under the License.
1414
-->
1515
<div>
16-
<h4 (click)="toggleBoolean('showGeneralProxyInformation')" class="d-flex align-items-center">
17-
<mat-icon *ngIf="this['showGeneralProxyInformation']">remove</mat-icon>
18-
<mat-icon *ngIf="!this['showGeneralProxyInformation']">add</mat-icon>
19-
General Proxy Information
20-
</h4>
16+
<h4 (click)="toggleBoolean('showGeneralProxyInformation')" class="d-flex align-items-center">
17+
@if (this['showGeneralProxyInformation']) {
18+
<mat-icon>remove</mat-icon>
19+
}
20+
@if (!this['showGeneralProxyInformation']) {
21+
<mat-icon>add</mat-icon>
22+
}
23+
General Proxy Information
24+
</h4>
2125
</div>
22-
<div class="table-responsive" *ngIf="this['showGeneralProxyInformation']">
26+
@if (this['showGeneralProxyInformation']) {
27+
<div class="table-responsive">
2328
<table class="table table-striped table-hover">
24-
<colgroup>
25-
<col width="30%">
26-
<col width="70%">
27-
</colgroup>
28-
<tbody>
29-
<tr *ngIf="this['showKnoxVersion']">
30-
<td>Knox Version</td>
31-
<td>{{ getVersion() }}</td>
32-
</tr>
33-
<tr *ngIf="this['showKnoxHostname']">
34-
<td>Hostname</td>
35-
<td>{{ getHostname() }}</td>
36-
</tr>
37-
<tr *ngIf="this['showPublicCerts']">
38-
<td>TLS Public Certificate</td>
39-
<td>
40-
<a href="{{ getMetadataAPIUrl('publicCert?type=pem') }}">PEM</a>
41-
&nbsp;&nbsp;|&nbsp;&nbsp;
42-
<a href="{{ getMetadataAPIUrl('publicCert?type=jks') }}">JKS</a>
43-
</td>
44-
</tr>
45-
<tr *ngIf="this['showAdminUI']">
46-
<td>Admin UI URL</td>
47-
<td><a href="{{ getAdminUiUrl() }}" target="_blank">{{ getAdminUiUrl() }}</a></td>
48-
</tr>
49-
<tr *ngIf="this['showAdminAPI']">
50-
<td>
51-
Admin API Details
52-
<span class="inline-glyph glyphicon glyphicon-info-sign btn btn-xs"
53-
title="{{ getAdminApiDescription() }}" data-toggle="tooltip"></span>
54-
</td>
55-
<td>
56-
<a href="{{ getAdminApiBookUrl() }}" target="_blank">{{ getAdminApiBookUrl() }}</a>
57-
</td>
58-
</tr>
59-
<tr *ngIf="this['showMetadataAPI']">
60-
<td>
61-
Metadata API
62-
</td>
63-
<td>
64-
<a href="{{ getMetadataAPIUrl('info') }}" target="_blank">General Proxy Information</a>
65-
&nbsp;&nbsp;|&nbsp;&nbsp;
66-
<a href="{{ getMetadataAPIUrl('topologies') }}" target="_blank">Topologies</a>
67-
</td>
68-
</tr>
69-
<tr *ngIf="this.isTokenManagementEnabled() && this['showTokens']">
70-
<td>
71-
Integration Tokens
72-
</td>
73-
<td>
74-
<a href="{{ getTokenManagementUrl() }}" target="_blank">Token Management</a>
75-
&nbsp;&nbsp;|&nbsp;&nbsp;
76-
<a href="{{ getTokenGenerationUrl() }}" target="_blank">Token Generation</a>
77-
</td>
78-
</tr>
79-
<tr *ngIf="this.isWebshellEnabled() && this['showWebShell']">
80-
<td>Web Shell</td>
81-
<td><a href="{{ getWebShellUrl() }}" target="_blank">{{ getWebShellUrl() }}</a></td>
82-
</tr>
83-
</tbody>
84-
</table>
85-
</div>
29+
<colgroup>
30+
<col width="30%">
31+
<col width="70%">
32+
</colgroup>
33+
<tbody>
34+
@if (this['showKnoxVersion']) {
35+
<tr>
36+
<td>Knox Version</td>
37+
<td>{{ getVersion() }}</td>
38+
</tr>
39+
}
40+
@if (this['showKnoxHostname']) {
41+
<tr>
42+
<td>Hostname</td>
43+
<td>{{ getHostname() }}</td>
44+
</tr>
45+
}
46+
@if (this['showPublicCerts']) {
47+
<tr>
48+
<td>TLS Public Certificate</td>
49+
<td>
50+
<a href="{{ getMetadataAPIUrl('publicCert?type=pem') }}">PEM</a>
51+
&nbsp;&nbsp;|&nbsp;&nbsp;
52+
<a href="{{ getMetadataAPIUrl('publicCert?type=jks') }}">JKS</a>
53+
</td>
54+
</tr>
55+
}
56+
@if (this['showAdminUI']) {
57+
<tr>
58+
<td>Admin UI URL</td>
59+
<td><a href="{{ getAdminUiUrl() }}" target="_blank">{{ getAdminUiUrl() }}</a></td>
60+
</tr>
61+
}
62+
@if (this['showAdminAPI']) {
63+
<tr>
64+
<td>
65+
Admin API Details
66+
<span class="inline-glyph glyphicon glyphicon-info-sign btn btn-xs"
67+
title="{{ getAdminApiDescription() }}" data-toggle="tooltip"></span>
68+
</td>
69+
<td>
70+
<a href="{{ getAdminApiBookUrl() }}" target="_blank">{{ getAdminApiBookUrl() }}</a>
71+
</td>
72+
</tr>
73+
}
74+
@if (this['showMetadataAPI']) {
75+
<tr>
76+
<td>
77+
Metadata API
78+
</td>
79+
<td>
80+
<a href="{{ getMetadataAPIUrl('info') }}" target="_blank">General Proxy Information</a>
81+
&nbsp;&nbsp;|&nbsp;&nbsp;
82+
<a href="{{ getMetadataAPIUrl('topologies') }}" target="_blank">Topologies</a>
83+
</td>
84+
</tr>
85+
}
86+
@if (this.isTokenManagementEnabled() && this['showTokens']) {
87+
<tr>
88+
<td>
89+
Integration Tokens
90+
</td>
91+
<td>
92+
<a href="{{ getTokenManagementUrl() }}" target="_blank">Token Management</a>
93+
&nbsp;&nbsp;|&nbsp;&nbsp;
94+
<a href="{{ getTokenGenerationUrl() }}" target="_blank">Token Generation</a>
95+
</td>
96+
</tr>
97+
}
98+
@if (this.isWebshellEnabled() && this['showWebShell']) {
99+
<tr>
100+
<td>Web Shell</td>
101+
<td><a href="{{ getWebShellUrl() }}" target="_blank">{{ getWebShellUrl() }}</a></td>
102+
</tr>
103+
}
104+
</tbody>
105+
</table>
106+
</div>
107+
}

‎knox-homepage-ui/home/app/generalProxyInformation/general.proxy.information.component.ts‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -18,14 +18,14 @@ import {Component, OnInit} from '@angular/core';
1818
import {ActivatedRoute} from '@angular/router';
1919
import {HomepageService} from '../service/homepage.service';
2020
import {GeneralProxyInformation} from '../model/general.proxy.information';
21-
import { CommonModule } from '@angular/common';
21+
2222
import { MatIconModule } from '@angular/material/icon';
2323

2424
@Component({
2525
selector: 'app-general-proxy-information',
2626
templateUrl: './general.proxy.information.component.html',
2727
providers: [HomepageService],
28-
imports: [CommonModule, MatIconModule]
28+
imports: [MatIconModule]
2929
})
3030

3131
export class GeneralProxyInformationComponent implements OnInit {
@@ -34,7 +34,7 @@ export class GeneralProxyInformationComponent implements OnInit {
3434
profile: JSON;
3535

3636
constructor(private homepageService: HomepageService, private route: ActivatedRoute) {
37-
this['showGeneralProxyInformation'] = false;
37+
this['showGeneralProxyInformation'] = true;
3838
this['showKnoxVersion'] = true;
3939
this['showKnoxHostname'] = true;
4040
this['showPublicCerts'] = true;

‎knox-homepage-ui/home/app/service/homepage.service.ts‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -65,7 +65,7 @@ export class HomepageService {
6565

6666
getProfile(profileName: string): Promise<JSON> {
6767
let headers = this.addJsonHeaders(new HttpHeaders());
68-
let url = `${this.apiUrl}/profiles/${profileName}`;
68+
let url = `${this.apiUrl}profiles/${profileName}`;
6969
return firstValueFrom(this.http.get(url, { headers }))
7070
.catch(err => this.handleError(err));
7171
}

‎knox-homepage-ui/home/app/sessionInformation/session.information.component.html‎

Lines changed: 15 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -1,17 +1,19 @@
11
<!--
2-
Licensed to the Apache Software Foundation (ASF) under one or more
3-
contributor license agreements. See the NOTICE file distributed with
4-
this work for additional information regarding copyright ownership.
5-
The ASF licenses this file to You under the Apache License, Version 2.0
6-
(the "License"); you may not use this file except in compliance with
7-
the License. You may obtain a copy of the License at
8-
http://www.apache.org/licenses/LICENSE-2.0
9-
Unless required by applicable law or agreed to in writing, software
10-
distributed under the License is distributed on an "AS IS" BASIS,
11-
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
12-
See the License for the specific language governing permissions and
13-
limitations under the License.
2+
Licensed to the Apache Software Foundation (ASF) under one or more
3+
contributor license agreements. See the NOTICE file distributed with
4+
this work for additional information regarding copyright ownership.
5+
The ASF licenses this file to You under the Apache License, Version 2.0
6+
(the "License"); you may not use this file except in compliance with
7+
the License. You may obtain a copy of the License at
8+
http://www.apache.org/licenses/LICENSE-2.0
9+
Unless required by applicable law or agreed to in writing, software
10+
distributed under the License is distributed on an "AS IS" BASIS,
11+
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
12+
See the License for the specific language governing permissions and
13+
limitations under the License.
1414
-->
1515
<div style="text-align: right; color: rgb(130, 180, 93);">Welcome {{ getUser() }}</div>
16-
<div *ngIf="logoutSupported" style="text-align: right;"><a class="btn btn-primary" (click)="logout()">logout</a></div>
16+
@if (logoutSupported) {
17+
<div style="text-align: right;"><a class="btn btn-primary" (click)="logout()">logout</a></div>
18+
}
1719
<div style="margin-left: 15%; text-align: center; color: rgb(130,180, 93); max-width: 70%; word-wrap: break-word;" [innerHTML]="getBannerText() | safeHtml"></div>

‎knox-homepage-ui/home/app/sessionInformation/session.information.component.ts‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -17,14 +17,14 @@
1717
import {Component, OnInit} from '@angular/core';
1818
import {HomepageService} from '../service/homepage.service';
1919
import {SessionInformation} from '../model/session.information';
20-
import { CommonModule } from '@angular/common';
20+
2121
import { SafeHtmlPipe } from '../util/safehtml';
2222

2323
@Component({
2424
selector: 'app-session-information',
2525
templateUrl: './session.information.component.html',
2626
providers: [HomepageService],
27-
imports: [CommonModule, SafeHtmlPipe]
27+
imports: [SafeHtmlPipe]
2828
})
2929

3030
export class SessionInformationComponent implements OnInit {

0 commit comments

Comments
 (0)