Upstream/bitwarden-browser
1
0
Fork 0
mirror of https://github.com/bitwarden/browser.git synced 2024-11-29 12:55:21 +01:00
Code Issues Projects Releases Wiki Activity

[SG-901] Relocate Autofill on page load setting (#4629)

Browse Source 
* [SG-901] Relocate Autofill on page load setting
This commit is contained in:
André Bispo 2023-02-02 16:28:21 +00:00 committed by GitHub
parent 2b6b942f3e
commit e3e88167e5
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
6 changed files with 145 additions and 76 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
apps/browser/src/popup/app-routing.module.ts
View File

@ -32,6 +32,7 @@ import { SendAddEditComponent } from "./send/send-add-edit.component";
import { SendGroupingsComponent } from "./send/send-groupings.component"; import { SendGroupingsComponent } from "./send/send-groupings.component";
import { SendTypeComponent } from "./send/send-type.component"; import { SendTypeComponent } from "./send/send-type.component";
import { DebounceNavigationService } from "./services/debounceNavigationService"; import { DebounceNavigationService } from "./services/debounceNavigationService";
import { AutofillComponent } from "./settings/autofill.component";
import { ExcludedDomainsComponent } from "./settings/excluded-domains.component"; import { ExcludedDomainsComponent } from "./settings/excluded-domains.component";
import { ExportComponent } from "./settings/export.component"; import { ExportComponent } from "./settings/export.component";
import { FolderAddEditComponent } from "./settings/folder-add-edit.component"; import { FolderAddEditComponent } from "./settings/folder-add-edit.component";
@ -187,6 +188,12 @@ const routes: Routes = [
canActivate: [AuthGuard], canActivate: [AuthGuard],
data: { state: "export" }, data: { state: "export" },
}, },
{
path: "autofill",
component: AutofillComponent,
canActivate: [AuthGuard],
data: { state: "autofill" },
},
{ {
path: "folders", path: "folders",
component: FoldersComponent, component: FoldersComponent,

2
apps/browser/src/popup/app.module.ts
View File

@ -62,6 +62,7 @@ import { SendGroupingsComponent } from "./send/send-groupings.component";
import { SendTypeComponent } from "./send/send-type.component"; import { SendTypeComponent } from "./send/send-type.component";
import { ServicesModule } from "./services/services.module"; import { ServicesModule } from "./services/services.module";
import { AboutComponent } from "./settings/about.component"; import { AboutComponent } from "./settings/about.component";
import { AutofillComponent } from "./settings/autofill.component";
import { ExcludedDomainsComponent } from "./settings/excluded-domains.component"; import { ExcludedDomainsComponent } from "./settings/excluded-domains.component";
import { ExportComponent } from "./settings/export.component"; import { ExportComponent } from "./settings/export.component";
import { FolderAddEditComponent } from "./settings/folder-add-edit.component"; import { FolderAddEditComponent } from "./settings/folder-add-edit.component";
@ -147,6 +148,7 @@ import { TabsComponent } from "./tabs.component";
RemovePasswordComponent, RemovePasswordComponent,
VaultSelectComponent, VaultSelectComponent,
AboutComponent, AboutComponent,
AutofillComponent,
], ],
providers: [CurrencyPipe, DatePipe], providers: [CurrencyPipe, DatePipe],
bootstrap: [AppComponent], bootstrap: [AppComponent],

74
apps/browser/src/popup/settings/autofill.component.html Normal file
View File

@ -0,0 +1,74 @@
<header>
<div class="left">
<button type="button" routerLink="/tabs/settings">
<span class="header-icon"><i class="bwi bwi-angle-left" aria-hidden="true"></i></span>
<span>{{ "back" | i18n }}</span>
</button>
</div>
<h1 class="center">
<span class="title">{{ "autofill" | i18n }}</span>
</h1>
<div class="right"></div>
</header>
<main tabindex="-1">
<div class="box">
<div class="box-content">
<div class="box-content-row box-content-row-checkbox" appBoxRow>
<label for="autofill">{{ "enableAutoFillOnPageLoad" | i18n }}</label>
<input
id="autofill"
type="checkbox"
aria-describedby="autofillHelp"
(change)="updateAutoFillOnPageLoad()"
[(ngModel)]="enableAutoFillOnPageLoad"
/>
</div>
</div>
<div id="autofillHelp" class="box-footer">
{{ "enableAutoFillOnPageLoadDesc" | i18n }}
<b>{{ "warning" | i18n }}</b
>: {{ "experimentalFeature" | i18n }}
</div>
</div>
<div class="box">
<div class="box-content">
<div class="box-content-row" appBoxRow>
<label for="defaultAutofill">{{ "defaultAutoFillOnPageLoad" | i18n }}</label>
<select
id="defaultAutofill"
name="DefaultAutofill"
aria-describedby="defaultAutofillHelp"
[(ngModel)]="autoFillOnPageLoadDefault"
(change)="updateAutoFillOnPageLoadDefault()"
[disabled]="!enableAutoFillOnPageLoad"
>
<option *ngFor="let o of autoFillOnPageLoadOptions" [ngValue]="o.value">
{{ o.name }}
</option>
</select>
</div>
</div>
<div id="defaultAutofillHelp" class="box-footer">
{{ "defaultAutoFillOnPageLoadDesc" | i18n }}
</div>
</div>
<div class="box">
<div class="box-content">
<div class="box-content-row" appBoxRow>
<label for="defaultUriMatch">{{ "defaultUriMatchDetection" | i18n }}</label>
<select
id="defaultUriMatch"
name="DefaultUriMatch"
aria-describedby="defaultUriMatchHelp"
[(ngModel)]="defaultUriMatch"
(change)="saveDefaultUriMatch()"
>
<option *ngFor="let o of uriMatchOptions" [ngValue]="o.value">{{ o.name }}</option>
</select>
</div>
</div>
<div id="defaultUriMatchHelp" class="box-footer">
{{ "defaultUriMatchDetectionDesc" | i18n }}
</div>
</div>
</main>

54
apps/browser/src/popup/settings/autofill.component.ts Normal file
View File

@ -0,0 +1,54 @@
import { Component, OnInit } from "@angular/core";
import { I18nService } from "@bitwarden/common/abstractions/i18n.service";
import { StateService } from "@bitwarden/common/abstractions/state.service";
import { UriMatchType } from "@bitwarden/common/enums/uriMatchType";
@Component({
selector: "app-autofill",
templateUrl: "autofill.component.html",
})
export class AutofillComponent implements OnInit {
enableAutoFillOnPageLoad = false;
autoFillOnPageLoadDefault = false;
autoFillOnPageLoadOptions: any[];
defaultUriMatch = UriMatchType.Domain;
uriMatchOptions: any[];
constructor(private stateService: StateService, i18nService: I18nService) {
this.autoFillOnPageLoadOptions = [
{ name: i18nService.t("autoFillOnPageLoadYes"), value: true },
{ name: i18nService.t("autoFillOnPageLoadNo"), value: false },
];
this.uriMatchOptions = [
{ name: i18nService.t("baseDomain"), value: UriMatchType.Domain },
{ name: i18nService.t("host"), value: UriMatchType.Host },
{ name: i18nService.t("startsWith"), value: UriMatchType.StartsWith },
{ name: i18nService.t("regEx"), value: UriMatchType.RegularExpression },
{ name: i18nService.t("exact"), value: UriMatchType.Exact },
{ name: i18nService.t("never"), value: UriMatchType.Never },
];
}
async ngOnInit() {
this.enableAutoFillOnPageLoad = await this.stateService.getEnableAutoFillOnPageLoad();
this.autoFillOnPageLoadDefault =
(await this.stateService.getAutoFillOnPageLoadDefault()) ?? true;
const defaultUriMatch = await this.stateService.getDefaultUriMatch();
this.defaultUriMatch = defaultUriMatch == null ? UriMatchType.Domain : defaultUriMatch;
}
async updateAutoFillOnPageLoad() {
await this.stateService.setEnableAutoFillOnPageLoad(this.enableAutoFillOnPageLoad);
}
async updateAutoFillOnPageLoadDefault() {
await this.stateService.setAutoFillOnPageLoadDefault(this.autoFillOnPageLoadDefault);
}
async saveDefaultUriMatch() {
await this.stateService.setDefaultUriMatch(this.defaultUriMatch);
}
}

76
apps/browser/src/popup/settings/options.component.html
View File

@ -26,25 +26,6 @@
</h2> </h2>
</div> </div>
<ng-container *ngIf="showGeneral"> <ng-container *ngIf="showGeneral">
<div class="box">
<div class="box-content">
<div class="box-content-row" appBoxRow>
<label for="defaultUriMatch">{{ "defaultUriMatchDetection" | i18n }}</label>
<select
id="defaultUriMatch"
name="DefaultUriMatch"
aria-describedby="defaultUriMatchHelp"
[(ngModel)]="defaultUriMatch"
(change)="saveDefaultUriMatch()"
>
<option *ngFor="let o of uriMatchOptions" [ngValue]="o.value">{{ o.name }}</option>
</select>
</div>
</div>
<div id="defaultUriMatchHelp" class="box-footer">
{{ "defaultUriMatchDetectionDesc" | i18n }}
</div>
</div>
<div class="box" *ngIf="showClearClipboard"> <div class="box" *ngIf="showClearClipboard">
<div class="box-content"> <div class="box-content">
<div class="box-content-row" appBoxRow> <div class="box-content-row" appBoxRow>
@ -228,61 +209,4 @@
<div id="themeHelp" class="box-footer">{{ "themeDesc" | i18n }}</div> <div id="themeHelp" class="box-footer">{{ "themeDesc" | i18n }}</div>
</div> </div>
</ng-container> </ng-container>
<div class="box box-section-divider">
<h2>
<button
type="button"
class="box-header-expandable"
(click)="showAutofill = !showAutofill"
[attr.aria-expanded]="showAutofill"
>
<i *ngIf="!showAutofill" class="bwi bwi-angle-right bwi-sm icon" aria-hidden="true"></i>
<i *ngIf="showAutofill" class="bwi bwi-angle-down bwi-sm icon" aria-hidden="true"></i>
Autofill
</button>
</h2>
</div>
<ng-container *ngIf="showAutofill">
<div class="box">
<div class="box-content">
<div class="box-content-row box-content-row-checkbox" appBoxRow>
<label for="autofill">{{ "enableAutoFillOnPageLoad" | i18n }}</label>
<input
id="autofill"
type="checkbox"
aria-describedby="autofillHelp"
(change)="updateAutoFillOnPageLoad()"
[(ngModel)]="enableAutoFillOnPageLoad"
/>
</div>
</div>
<div id="autofillHelp" class="box-footer">
{{ "enableAutoFillOnPageLoadDesc" | i18n }}
<b>{{ "warning" | i18n }}</b
>: {{ "experimentalFeature" | i18n }}
</div>
</div>
<div class="box">
<div class="box-content">
<div class="box-content-row" appBoxRow>
<label for="defaultAutofill">{{ "defaultAutoFillOnPageLoad" | i18n }}</label>
<select
id="defaultAutofill"
name="DefaultAutofill"
aria-describedby="defaultAutofillHelp"
[(ngModel)]="autoFillOnPageLoadDefault"
(change)="updateAutoFillOnPageLoadDefault()"
[disabled]="!enableAutoFillOnPageLoad"
>
<option *ngFor="let o of autoFillOnPageLoadOptions" [ngValue]="o.value">
{{ o.name }}
</option>
</select>
</div>
</div>
<div id="defaultAutofillHelp" class="box-footer">
{{ "defaultAutoFillOnPageLoadDesc" | i18n }}
</div>
</div>
</ng-container>
</main> </main>

8
apps/browser/src/popup/settings/settings.component.html
View File

@ -11,6 +11,14 @@
<div class="box list"> <div class="box list">
<h2 class="box-header">{{ "manage" | i18n }}</h2> <h2 class="box-header">{{ "manage" | i18n }}</h2>
<div class="box-content single-line"> <div class="box-content single-line">
<button
type="button"
class="box-content-row box-content-row-flex text-default"
routerLink="/autofill"
>
<div class="row-main">{{ "autofill" | i18n }}</div>
<i class="bwi bwi-angle-right bwi-lg row-sub-icon" aria-hidden="true"></i>
</button>
<button <button
type="button" type="button"
class="box-content-row box-content-row-flex text-default" class="box-content-row box-content-row-flex text-default"