Use confirm button for profile social disconnect + regenerate API key

This commit is contained in:
shamoon 2024-02-06 21:33:12 -08:00
parent 995563e4ae
commit f6dd27aa7e
2 changed files with 19 additions and 10 deletions

View File

@ -41,9 +41,14 @@
} }
<span class="visually-hidden" i18n>Copy</span> <span class="visually-hidden" i18n>Copy</span>
</button> </button>
<button type="button" class="btn btn-outline-secondary" (click)="generateAuthToken()" i18n-title title="Regenerate auth token"> <pngx-confirm-button
<i-bs width="1.2em" height="1.2em" name="arrow-repeat"></i-bs> title="Regenerate auth token"
</button> i18n-title
buttonClasses=" btn-outline-secondary"
iconName="arrow-repeat"
[disabled]="!hasUsablePassword"
(confirm)="generateAuthToken()">
</pngx-confirm-button>
</div> </div>
<span class="badge copied-badge bg-primary small fade ms-4 position-absolute top-50 translate-middle-y pe-none z-3" [class.show]="copied" i18n>Copied!</span> <span class="badge copied-badge bg-primary small fade ms-4 position-absolute top-50 translate-middle-y pe-none z-3" [class.show]="copied" i18n>Copied!</span>
</div> </div>
@ -60,14 +65,16 @@
[disablePopover]="hasUsablePassword" [disablePopover]="hasUsablePassword"
triggers="mouseenter:mouseleave"> triggers="mouseenter:mouseleave">
{{account.name}} ({{account.provider}}) {{account.name}} ({{account.provider}})
<button <pngx-confirm-button
type="button" label="Disconnect"
class="btn btn-outline-danger btn-sm ms-2 align-baseline" i18n-label
title="Disconnect {{ account.name }} social account"
i18n-title
buttonClasses="btn-outline-danger btn-sm ms-2 align-baseline"
iconName="trash"
[disabled]="!hasUsablePassword" [disabled]="!hasUsablePassword"
(click)="disconnectSocialAccount(account.id)" (confirm)="disconnectSocialAccount(account.id)">
i18n-title title="Disconnect {{ account.name }} social account"> </pngx-confirm-button>
<ng-container i18n>Disconnect</ng-container>&nbsp;<i-bs name="trash"></i-bs>
</button>
</li> </li>
} }
</ul> </ul>

View File

@ -21,6 +21,7 @@ import { of, throwError } from 'rxjs'
import { ToastService } from 'src/app/services/toast.service' import { ToastService } from 'src/app/services/toast.service'
import { Clipboard } from '@angular/cdk/clipboard' import { Clipboard } from '@angular/cdk/clipboard'
import { NgxBootstrapIconsModule, allIcons } from 'ngx-bootstrap-icons' import { NgxBootstrapIconsModule, allIcons } from 'ngx-bootstrap-icons'
import { ConfirmButtonComponent } from '../confirm-button/confirm-button.component'
const socialAccount = { const socialAccount = {
id: 1, id: 1,
@ -52,6 +53,7 @@ describe('ProfileEditDialogComponent', () => {
ProfileEditDialogComponent, ProfileEditDialogComponent,
TextComponent, TextComponent,
PasswordComponent, PasswordComponent,
ConfirmButtonComponent,
], ],
providers: [NgbActiveModal], providers: [NgbActiveModal],
imports: [ imports: [