More webapp changes+fixes
This commit is contained in:
@@ -0,0 +1,191 @@
|
||||
<div class="page-content">
|
||||
@if (loading()) {
|
||||
<div class="loading-container">
|
||||
<nz-spin nzSimple nzSize="large"></nz-spin>
|
||||
</div>
|
||||
} @else if (key()) {
|
||||
<div class="detail-header">
|
||||
<button nz-button (click)="goBack()">
|
||||
<span nz-icon nzType="arrow-left" nzTheme="outline"></span>
|
||||
Back to Keys
|
||||
</button>
|
||||
<div class="header-actions">
|
||||
<button nz-button (click)="openEditModal()">
|
||||
<span nz-icon nzType="edit"></span>
|
||||
Edit
|
||||
</button>
|
||||
@if (!isCurrentKey()) {
|
||||
<button
|
||||
nz-button
|
||||
nzDanger
|
||||
nz-popconfirm
|
||||
nzPopconfirmTitle="Are you sure you want to delete this key?"
|
||||
(nzOnConfirm)="deleteKey()"
|
||||
>
|
||||
<span nz-icon nzType="delete"></span>
|
||||
Delete
|
||||
</button>
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<nz-card>
|
||||
<div class="key-header">
|
||||
<h2 class="key-title">{{ key()!.name }}</h2>
|
||||
@if (isCurrentKey()) {
|
||||
<nz-tag nzColor="cyan">Current</nz-tag>
|
||||
}
|
||||
</div>
|
||||
|
||||
<scn-metadata-grid>
|
||||
<scn-metadata-value label="Key ID">
|
||||
<span class="mono">{{ key()!.keytoken_id }}</span>
|
||||
</scn-metadata-value>
|
||||
<scn-metadata-value label="Permissions">
|
||||
<div class="permissions">
|
||||
@for (perm of getPermissions(); track perm) {
|
||||
<nz-tag
|
||||
[nzColor]="getPermissionColor(perm)"
|
||||
nz-tooltip
|
||||
[nzTooltipTitle]="getPermissionLabel(perm)"
|
||||
>
|
||||
{{ perm }}
|
||||
</nz-tag>
|
||||
}
|
||||
</div>
|
||||
</scn-metadata-value>
|
||||
<scn-metadata-value label="Channel Access">
|
||||
@if (key()!.all_channels) {
|
||||
<nz-tag nzColor="default">All Channels</nz-tag>
|
||||
} @else if (key()!.channels && key()!.channels.length > 0) {
|
||||
<div class="channel-list">
|
||||
@for (channelId of key()!.channels; track channelId) {
|
||||
<nz-tag nzColor="orange" nz-tooltip [nzTooltipTitle]="channelId">
|
||||
{{ getChannelDisplayName(channelId) }}
|
||||
</nz-tag>
|
||||
}
|
||||
</div>
|
||||
} @else {
|
||||
<span class="text-muted">No channels</span>
|
||||
}
|
||||
</scn-metadata-value>
|
||||
<scn-metadata-value label="Messages Sent">
|
||||
{{ key()!.messages_sent }}
|
||||
</scn-metadata-value>
|
||||
<scn-metadata-value label="Created">
|
||||
<div class="timestamp-absolute">{{ key()!.timestamp_created | date:'yyyy-MM-dd HH:mm:ss' }}</div>
|
||||
<div class="timestamp-relative">{{ key()!.timestamp_created | relativeTime }}</div>
|
||||
</scn-metadata-value>
|
||||
<scn-metadata-value label="Last Used">
|
||||
@if (key()!.timestamp_lastused) {
|
||||
<div class="timestamp-absolute">{{ key()!.timestamp_lastused | date:'yyyy-MM-dd HH:mm:ss' }}</div>
|
||||
<div class="timestamp-relative">{{ key()!.timestamp_lastused | relativeTime }}</div>
|
||||
} @else {
|
||||
<span class="text-muted">Never</span>
|
||||
}
|
||||
</scn-metadata-value>
|
||||
<scn-metadata-value label="Owner">
|
||||
@if (resolvedOwner()) {
|
||||
<div class="owner-name">{{ resolvedOwner()!.displayName }}</div>
|
||||
<div class="owner-id mono">{{ key()!.owner_user_id }}</div>
|
||||
} @else {
|
||||
<span class="mono">{{ key()!.owner_user_id }}</span>
|
||||
}
|
||||
</scn-metadata-value>
|
||||
</scn-metadata-grid>
|
||||
</nz-card>
|
||||
} @else {
|
||||
<nz-card>
|
||||
<div class="not-found">
|
||||
<p>Key not found</p>
|
||||
<button nz-button nzType="primary" (click)="goBack()">
|
||||
Back to Keys
|
||||
</button>
|
||||
</div>
|
||||
</nz-card>
|
||||
}
|
||||
</div>
|
||||
|
||||
<!-- Edit Modal -->
|
||||
<nz-modal
|
||||
[(nzVisible)]="showEditModal"
|
||||
nzTitle="Edit Key"
|
||||
(nzOnCancel)="closeEditModal()"
|
||||
[nzFooter]="editModalFooter"
|
||||
nzWidth="500px"
|
||||
>
|
||||
<ng-container *nzModalContent>
|
||||
<nz-form-item>
|
||||
<nz-form-label>Name</nz-form-label>
|
||||
<nz-form-control>
|
||||
<input
|
||||
type="text"
|
||||
nz-input
|
||||
placeholder="Enter a name for this key"
|
||||
[(ngModel)]="editKeyName"
|
||||
/>
|
||||
</nz-form-control>
|
||||
</nz-form-item>
|
||||
|
||||
<nz-form-item>
|
||||
<nz-form-label>Permissions</nz-form-label>
|
||||
<nz-form-control>
|
||||
<div class="permission-checkboxes">
|
||||
@for (opt of permissionOptions; track opt.value) {
|
||||
<label
|
||||
nz-checkbox
|
||||
[nzChecked]="isEditPermissionChecked(opt.value)"
|
||||
[nzDisabled]="opt.value !== 'A' && isEditPermissionChecked('A')"
|
||||
(nzCheckedChange)="onEditPermissionChange(opt.value, $event)"
|
||||
>
|
||||
<nz-tag [nzColor]="getPermissionColor(opt.value)">{{ opt.value }}</nz-tag>
|
||||
<span class="perm-label">{{ opt.label }}</span>
|
||||
<span class="perm-desc">- {{ opt.description }}</span>
|
||||
</label>
|
||||
}
|
||||
</div>
|
||||
</nz-form-control>
|
||||
</nz-form-item>
|
||||
|
||||
<nz-form-item>
|
||||
<label nz-checkbox [(ngModel)]="editKeyAllChannels">
|
||||
Access to all channels
|
||||
</label>
|
||||
</nz-form-item>
|
||||
|
||||
@if (!editKeyAllChannels) {
|
||||
<nz-form-item class="mb-0">
|
||||
<nz-form-label>Channels</nz-form-label>
|
||||
<nz-form-control>
|
||||
<nz-select
|
||||
[(ngModel)]="editKeyChannels"
|
||||
nzMode="multiple"
|
||||
nzPlaceHolder="Select channels"
|
||||
nzShowSearch
|
||||
style="width: 100%"
|
||||
>
|
||||
@for (channel of availableChannels(); track channel.channel_id) {
|
||||
<nz-option
|
||||
[nzValue]="channel.channel_id"
|
||||
[nzLabel]="getChannelLabel(channel)"
|
||||
></nz-option>
|
||||
}
|
||||
</nz-select>
|
||||
</nz-form-control>
|
||||
</nz-form-item>
|
||||
}
|
||||
</ng-container>
|
||||
</nz-modal>
|
||||
|
||||
<ng-template #editModalFooter>
|
||||
<button nz-button (click)="closeEditModal()">Cancel</button>
|
||||
<button
|
||||
nz-button
|
||||
nzType="primary"
|
||||
[nzLoading]="updating()"
|
||||
[disabled]="!editKeyName.trim() || editKeyPermissions.length === 0"
|
||||
(click)="updateKey()"
|
||||
>
|
||||
Save
|
||||
</button>
|
||||
</ng-template>
|
||||
@@ -0,0 +1,98 @@
|
||||
.loading-container {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
min-height: 300px;
|
||||
}
|
||||
|
||||
.header-actions {
|
||||
display: flex;
|
||||
gap: 8px;
|
||||
}
|
||||
|
||||
.key-header {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 12px;
|
||||
margin-bottom: 16px;
|
||||
}
|
||||
|
||||
.key-title {
|
||||
margin: 0;
|
||||
font-size: 20px;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
.permissions {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
gap: 4px;
|
||||
}
|
||||
|
||||
.channel-list {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
gap: 4px;
|
||||
}
|
||||
|
||||
.text-muted {
|
||||
color: #999;
|
||||
}
|
||||
|
||||
.owner-name {
|
||||
font-weight: 500;
|
||||
color: #333;
|
||||
}
|
||||
|
||||
.owner-id {
|
||||
font-size: 11px;
|
||||
color: #999;
|
||||
margin-top: 2px;
|
||||
}
|
||||
|
||||
.not-found {
|
||||
text-align: center;
|
||||
padding: 48px;
|
||||
|
||||
p {
|
||||
color: #999;
|
||||
margin-bottom: 16px;
|
||||
}
|
||||
}
|
||||
|
||||
.permission-checkboxes {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 8px;
|
||||
|
||||
label {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-left: 0;
|
||||
}
|
||||
|
||||
nz-tag {
|
||||
width: 32px;
|
||||
text-align: center;
|
||||
margin-right: 8px;
|
||||
}
|
||||
|
||||
.perm-label {
|
||||
min-width: 100px;
|
||||
}
|
||||
|
||||
.perm-desc {
|
||||
color: #999;
|
||||
font-size: 12px;
|
||||
}
|
||||
}
|
||||
|
||||
.timestamp-absolute {
|
||||
font-size: 13px;
|
||||
color: #333;
|
||||
}
|
||||
|
||||
.timestamp-relative {
|
||||
font-size: 12px;
|
||||
color: #999;
|
||||
}
|
||||
259
webapp/src/app/features/keys/key-detail/key-detail.component.ts
Normal file
259
webapp/src/app/features/keys/key-detail/key-detail.component.ts
Normal file
@@ -0,0 +1,259 @@
|
||||
import { Component, inject, signal, OnInit } from '@angular/core';
|
||||
import { CommonModule, DatePipe } from '@angular/common';
|
||||
import { ActivatedRoute, Router } from '@angular/router';
|
||||
import { FormsModule } from '@angular/forms';
|
||||
import { NzCardModule } from 'ng-zorro-antd/card';
|
||||
import { NzButtonModule } from 'ng-zorro-antd/button';
|
||||
import { NzIconModule } from 'ng-zorro-antd/icon';
|
||||
import { NzTagModule } from 'ng-zorro-antd/tag';
|
||||
import { NzSpinModule } from 'ng-zorro-antd/spin';
|
||||
import { NzPopconfirmModule } from 'ng-zorro-antd/popconfirm';
|
||||
import { NzModalModule } from 'ng-zorro-antd/modal';
|
||||
import { NzFormModule } from 'ng-zorro-antd/form';
|
||||
import { NzInputModule } from 'ng-zorro-antd/input';
|
||||
import { NzCheckboxModule } from 'ng-zorro-antd/checkbox';
|
||||
import { NzSelectModule } from 'ng-zorro-antd/select';
|
||||
import { NzToolTipModule } from 'ng-zorro-antd/tooltip';
|
||||
import { ApiService } from '../../../core/services/api.service';
|
||||
import { AuthService } from '../../../core/services/auth.service';
|
||||
import { NotificationService } from '../../../core/services/notification.service';
|
||||
import { ChannelCacheService, ResolvedChannel } from '../../../core/services/channel-cache.service';
|
||||
import { UserCacheService, ResolvedUser } from '../../../core/services/user-cache.service';
|
||||
import { KeyToken, parsePermissions, TokenPermission, ChannelWithSubscription } from '../../../core/models';
|
||||
import { RelativeTimePipe } from '../../../shared/pipes/relative-time.pipe';
|
||||
import { MetadataGridComponent, MetadataValueComponent } from '../../../shared/components/metadata-grid';
|
||||
|
||||
interface PermissionOption {
|
||||
value: TokenPermission;
|
||||
label: string;
|
||||
description: string;
|
||||
}
|
||||
|
||||
@Component({
|
||||
selector: 'app-key-detail',
|
||||
standalone: true,
|
||||
imports: [
|
||||
CommonModule,
|
||||
DatePipe,
|
||||
FormsModule,
|
||||
NzCardModule,
|
||||
NzButtonModule,
|
||||
NzIconModule,
|
||||
NzTagModule,
|
||||
NzSpinModule,
|
||||
NzPopconfirmModule,
|
||||
NzModalModule,
|
||||
NzFormModule,
|
||||
NzInputModule,
|
||||
NzCheckboxModule,
|
||||
NzSelectModule,
|
||||
NzToolTipModule,
|
||||
RelativeTimePipe,
|
||||
MetadataGridComponent,
|
||||
MetadataValueComponent,
|
||||
],
|
||||
templateUrl: './key-detail.component.html',
|
||||
styleUrl: './key-detail.component.scss'
|
||||
})
|
||||
export class KeyDetailComponent implements OnInit {
|
||||
private route = inject(ActivatedRoute);
|
||||
private router = inject(Router);
|
||||
private apiService = inject(ApiService);
|
||||
private authService = inject(AuthService);
|
||||
private notification = inject(NotificationService);
|
||||
private channelCacheService = inject(ChannelCacheService);
|
||||
private userCacheService = inject(UserCacheService);
|
||||
|
||||
key = signal<KeyToken | null>(null);
|
||||
currentKeyId = signal<string | null>(null);
|
||||
loading = signal(true);
|
||||
channelNames = signal<Map<string, ResolvedChannel>>(new Map());
|
||||
availableChannels = signal<ChannelWithSubscription[]>([]);
|
||||
resolvedOwner = signal<ResolvedUser | null>(null);
|
||||
|
||||
// Edit modal
|
||||
showEditModal = signal(false);
|
||||
editKeyName = '';
|
||||
editKeyPermissions: TokenPermission[] = [];
|
||||
editKeyAllChannels = true;
|
||||
editKeyChannels: string[] = [];
|
||||
updating = signal(false);
|
||||
|
||||
permissionOptions: PermissionOption[] = [
|
||||
{ value: 'A', label: 'Admin', description: 'Full access to all operations' },
|
||||
{ value: 'CR', label: 'Channel Read', description: 'Read messages from channels' },
|
||||
{ value: 'CS', label: 'Channel Send', description: 'Send messages to channels' },
|
||||
{ value: 'UR', label: 'User Read', description: 'Read user information' },
|
||||
];
|
||||
|
||||
ngOnInit(): void {
|
||||
const keyId = this.route.snapshot.paramMap.get('id');
|
||||
if (keyId) {
|
||||
this.loadKey(keyId);
|
||||
this.loadCurrentKey();
|
||||
this.loadAvailableChannels();
|
||||
}
|
||||
}
|
||||
|
||||
loadKey(keyId: string): void {
|
||||
const userId = this.authService.getUserId();
|
||||
if (!userId) return;
|
||||
|
||||
this.loading.set(true);
|
||||
this.apiService.getKey(userId, keyId).subscribe({
|
||||
next: (key) => {
|
||||
this.key.set(key);
|
||||
this.loading.set(false);
|
||||
this.resolveChannelNames(key);
|
||||
this.resolveOwner(key.owner_user_id);
|
||||
},
|
||||
error: () => {
|
||||
this.loading.set(false);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
private resolveOwner(ownerId: string): void {
|
||||
this.userCacheService.resolveUser(ownerId).subscribe(resolved => {
|
||||
this.resolvedOwner.set(resolved);
|
||||
});
|
||||
}
|
||||
|
||||
loadCurrentKey(): void {
|
||||
const userId = this.authService.getUserId();
|
||||
if (!userId) return;
|
||||
|
||||
this.apiService.getCurrentKey(userId).subscribe({
|
||||
next: (key) => {
|
||||
this.currentKeyId.set(key.keytoken_id);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
loadAvailableChannels(): void {
|
||||
this.channelCacheService.getAllChannels().subscribe(channels => {
|
||||
this.availableChannels.set(channels);
|
||||
});
|
||||
}
|
||||
|
||||
private resolveChannelNames(key: KeyToken): void {
|
||||
if (!key.all_channels && key.channels && key.channels.length > 0) {
|
||||
this.channelCacheService.resolveChannels(key.channels).subscribe(resolved => {
|
||||
this.channelNames.set(resolved);
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
goBack(): void {
|
||||
this.router.navigate(['/keys']);
|
||||
}
|
||||
|
||||
isCurrentKey(): boolean {
|
||||
const key = this.key();
|
||||
return key?.keytoken_id === this.currentKeyId();
|
||||
}
|
||||
|
||||
getPermissions(): TokenPermission[] {
|
||||
const key = this.key();
|
||||
return key ? parsePermissions(key.permissions) : [];
|
||||
}
|
||||
|
||||
getPermissionColor(perm: TokenPermission): string {
|
||||
switch (perm) {
|
||||
case 'A': return 'red';
|
||||
case 'CR': return 'blue';
|
||||
case 'CS': return 'green';
|
||||
case 'UR': return 'purple';
|
||||
default: return 'default';
|
||||
}
|
||||
}
|
||||
|
||||
getPermissionLabel(perm: TokenPermission): string {
|
||||
const option = this.permissionOptions.find(o => o.value === perm);
|
||||
return option?.label || perm;
|
||||
}
|
||||
|
||||
getChannelDisplayName(channelId: string): string {
|
||||
const resolved = this.channelNames().get(channelId);
|
||||
return resolved?.displayName || channelId;
|
||||
}
|
||||
|
||||
getChannelLabel(channel: ChannelWithSubscription): string {
|
||||
return channel.display_name || channel.internal_name;
|
||||
}
|
||||
|
||||
// Edit modal
|
||||
openEditModal(): void {
|
||||
const key = this.key();
|
||||
if (!key) return;
|
||||
|
||||
this.editKeyName = key.name;
|
||||
this.editKeyPermissions = parsePermissions(key.permissions);
|
||||
this.editKeyAllChannels = key.all_channels;
|
||||
this.editKeyChannels = key.channels ? [...key.channels] : [];
|
||||
this.showEditModal.set(true);
|
||||
}
|
||||
|
||||
closeEditModal(): void {
|
||||
this.showEditModal.set(false);
|
||||
}
|
||||
|
||||
updateKey(): void {
|
||||
const userId = this.authService.getUserId();
|
||||
const key = this.key();
|
||||
if (!userId || !key || !this.editKeyName.trim() || this.editKeyPermissions.length === 0) return;
|
||||
|
||||
this.updating.set(true);
|
||||
this.apiService.updateKey(userId, key.keytoken_id, {
|
||||
name: this.editKeyName.trim(),
|
||||
permissions: this.editKeyPermissions.join(';'),
|
||||
all_channels: this.editKeyAllChannels,
|
||||
channels: this.editKeyAllChannels ? undefined : this.editKeyChannels
|
||||
}).subscribe({
|
||||
next: (updated) => {
|
||||
this.key.set(updated);
|
||||
this.notification.success('Key updated');
|
||||
this.updating.set(false);
|
||||
this.closeEditModal();
|
||||
this.resolveChannelNames(updated);
|
||||
},
|
||||
error: () => {
|
||||
this.updating.set(false);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
onEditPermissionChange(perm: TokenPermission, checked: boolean): void {
|
||||
if (checked) {
|
||||
if (perm === 'A') {
|
||||
this.editKeyPermissions = ['A'];
|
||||
} else if (!this.editKeyPermissions.includes(perm)) {
|
||||
this.editKeyPermissions = [...this.editKeyPermissions, perm];
|
||||
}
|
||||
} else {
|
||||
this.editKeyPermissions = this.editKeyPermissions.filter(p => p !== perm);
|
||||
}
|
||||
}
|
||||
|
||||
isEditPermissionChecked(perm: TokenPermission): boolean {
|
||||
return this.editKeyPermissions.includes(perm);
|
||||
}
|
||||
|
||||
deleteKey(): void {
|
||||
const key = this.key();
|
||||
const userId = this.authService.getUserId();
|
||||
if (!key || !userId) return;
|
||||
|
||||
if (this.isCurrentKey()) {
|
||||
this.notification.warning('Cannot delete the key you are currently using');
|
||||
return;
|
||||
}
|
||||
|
||||
this.apiService.deleteKey(userId, key.keytoken_id).subscribe({
|
||||
next: () => {
|
||||
this.notification.success('Key deleted');
|
||||
this.router.navigate(['/keys']);
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
@@ -25,16 +25,16 @@
|
||||
<ng-template #noResultTpl></ng-template>
|
||||
<thead>
|
||||
<tr>
|
||||
<th nzWidth="25%">Name</th>
|
||||
<th nzWidth="25%">Permissions</th>
|
||||
<th nzWidth="15%">Messages Sent</th>
|
||||
<th nzWidth="20%">Last Used</th>
|
||||
<th nzWidth="15%">Actions</th>
|
||||
<th>Name</th>
|
||||
<th>Permissions</th>
|
||||
<th nzWidth="0">Messages Sent</th>
|
||||
<th nzWidth="0">Last Used</th>
|
||||
<th nzWidth="0">Actions</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
@for (key of keys(); track key.keytoken_id) {
|
||||
<tr>
|
||||
<tr class="clickable-row" (click)="viewKey(key)">
|
||||
<td>
|
||||
<div class="key-name">
|
||||
{{ key.name }}
|
||||
@@ -71,14 +71,13 @@
|
||||
<td>{{ key.messages_sent }}</td>
|
||||
<td>
|
||||
@if (key.timestamp_lastused) {
|
||||
<span nz-tooltip [nzTooltipTitle]="key.timestamp_lastused">
|
||||
{{ key.timestamp_lastused | relativeTime }}
|
||||
</span>
|
||||
<div class="timestamp-absolute">{{ key.timestamp_lastused | date:'yyyy-MM-dd HH:mm:ss' }}</div>
|
||||
<div class="timestamp-relative">{{ key.timestamp_lastused | relativeTime }}</div>
|
||||
} @else {
|
||||
<span class="text-muted">Never</span>
|
||||
}
|
||||
</td>
|
||||
<td>
|
||||
<td (click)="$event.stopPropagation()">
|
||||
<div class="action-buttons">
|
||||
<button
|
||||
nz-button
|
||||
|
||||
@@ -83,3 +83,21 @@
|
||||
font-size: 12px;
|
||||
}
|
||||
}
|
||||
|
||||
.clickable-row {
|
||||
cursor: pointer;
|
||||
|
||||
&:hover {
|
||||
background-color: #fafafa;
|
||||
}
|
||||
}
|
||||
|
||||
.timestamp-absolute {
|
||||
font-size: 13px;
|
||||
color: #333;
|
||||
}
|
||||
|
||||
.timestamp-relative {
|
||||
font-size: 12px;
|
||||
color: #999;
|
||||
}
|
||||
|
||||
@@ -1,5 +1,6 @@
|
||||
import { Component, inject, signal, OnInit } from '@angular/core';
|
||||
import { CommonModule } from '@angular/common';
|
||||
import { CommonModule, DatePipe } from '@angular/common';
|
||||
import { Router } from '@angular/router';
|
||||
import { FormsModule } from '@angular/forms';
|
||||
import { NzTableModule } from 'ng-zorro-antd/table';
|
||||
import { NzButtonModule } from 'ng-zorro-antd/button';
|
||||
@@ -34,6 +35,7 @@ interface PermissionOption {
|
||||
standalone: true,
|
||||
imports: [
|
||||
CommonModule,
|
||||
DatePipe,
|
||||
FormsModule,
|
||||
NzTableModule,
|
||||
NzButtonModule,
|
||||
@@ -56,6 +58,7 @@ interface PermissionOption {
|
||||
styleUrl: './key-list.component.scss'
|
||||
})
|
||||
export class KeyListComponent implements OnInit {
|
||||
private router = inject(Router);
|
||||
private apiService = inject(ApiService);
|
||||
private authService = inject(AuthService);
|
||||
private notification = inject(NotificationService);
|
||||
@@ -162,6 +165,10 @@ export class KeyListComponent implements OnInit {
|
||||
return key.keytoken_id === this.currentKeyId();
|
||||
}
|
||||
|
||||
viewKey(key: KeyToken): void {
|
||||
this.router.navigate(['/keys', key.keytoken_id]);
|
||||
}
|
||||
|
||||
deleteKey(key: KeyToken): void {
|
||||
if (this.isCurrentKey(key)) {
|
||||
this.notification.warning('Cannot delete the key you are currently using');
|
||||
|
||||
Reference in New Issue
Block a user