1
0
mirror of https://github.com/bitwarden/browser synced 2025-12-15 07:43:35 +00:00

[PM-13991] - Edit login - reorder website URIs (#13595)

* WIP - sortable website uri

* add specs

* fix type errors in tests
This commit is contained in:
Jordan Aasen
2025-03-10 12:57:02 -07:00
committed by GitHub
parent a877450e0a
commit 992be1d054
7 changed files with 282 additions and 34 deletions

View File

@@ -1,35 +1,50 @@
<ng-container [formGroup]="uriForm">
<bit-form-field [class.!tw-mb-1]="showMatchDetection">
<bit-label>{{ uriLabel }}</bit-label>
<input bitInput formControlName="uri" #uriInput />
<button
type="button"
bitIconButton="bwi-cog"
bitSuffix
[appA11yTitle]="toggleTitle"
(click)="toggleMatchDetection()"
data-testid="toggle-match-detection-button"
></button>
<button
type="button"
bitIconButton="bwi-minus-circle"
buttonType="danger"
bitSuffix
[appA11yTitle]="'deleteWebsite' | i18n"
*ngIf="canRemove"
(click)="removeUri()"
data-testid="remove-uri-button"
></button>
</bit-form-field>
<bit-form-field *ngIf="showMatchDetection" class="!tw-mb-5">
<bit-label>{{ "matchDetection" | i18n }}</bit-label>
<bit-select formControlName="matchDetection" #matchDetectionSelect>
<bit-option
*ngFor="let o of uriMatchOptions"
[label]="o.label"
[value]="o.value"
></bit-option>
</bit-select>
</bit-form-field>
<div class="tw-mb-4 pt-1">
<div class="tw-flex tw-pt-2" [class.!tw-mb-1]="showMatchDetection">
<bit-form-field disableMargin class="tw-flex-1 !tw-pt-0">
<bit-label>{{ uriLabel }}</bit-label>
<input bitInput formControlName="uri" #uriInput />
<button
type="button"
bitIconButton="bwi-cog"
bitSuffix
[appA11yTitle]="toggleTitle"
(click)="toggleMatchDetection()"
data-testid="toggle-match-detection-button"
></button>
<button
type="button"
bitIconButton="bwi-minus-circle"
buttonType="danger"
bitSuffix
[appA11yTitle]="'deleteWebsite' | i18n"
*ngIf="canRemove"
(click)="removeUri()"
data-testid="remove-uri-button"
></button>
</bit-form-field>
<div class="tw-flex tw-items-center tw-ml-1.5">
<button
type="button"
bitIconButton="bwi-hamburger"
class="!tw-py-0 !tw-px-1"
cdkDragHandle
[appA11yTitle]="'reorderToggleButton' | i18n: uriLabel"
(keydown)="handleKeydown($event)"
data-testid="reorder-toggle-button"
*ngIf="canReorder"
></button>
</div>
</div>
<bit-form-field *ngIf="showMatchDetection" class="!tw-mb-5">
<bit-label>{{ "matchDetection" | i18n }}</bit-label>
<bit-select formControlName="matchDetection" #matchDetectionSelect>
<bit-option
*ngFor="let o of uriMatchOptions"
[label]="o.label"
[value]="o.value"
></bit-option>
</bit-select>
</bit-form-field>
</div>
</ng-container>