vaultwarden
/
bitwarden-estensione-browser
mirror of https://github.com/bitwarden/browser
1
0
Fork 0
Code Issues 1 Releases Wiki Activity

[PM-8386] - Add section header to import page (#10153) 

* first pass section header in import data component

* change layout

* fix desktop bg

* revert chnage to default config

* update translation key

* revert change to background color
This commit is contained in:
Jordan Aasen 2024-07-24 07:27:28 -07:00 committed by GitHub
parent 4c26ab5a9e
commit fc55082148
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
5 changed files with 431 additions and 391 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
apps/browser/src/_locales/en/messages.json
View File

@ -3136,8 +3136,8 @@
"invalidFilePassword": { "invalidFilePassword": {
"message": "Invalid file password, please use the password you entered when you created the export file." "message": "Invalid file password, please use the password you entered when you created the export file."
}, },
"importDestination": { "destination": {
"message": "Import destination" "message": "Destination"
}, },
"learnAboutImportOptions": { "learnAboutImportOptions": {
"message": "Learn about your import options" "message": "Learn about your import options"
@ -3693,6 +3693,9 @@
"loading": { "loading": {
"message": "Loading" "message": "Loading"
}, },
"data": {
"message": "Data"
},
"assign": { "assign": {
"message": "Assign" "message": "Assign"
}, },

9
apps/desktop/src/locales/en/messages.json
View File

@ -1380,7 +1380,7 @@
}, },
"exportPasswordDescription": { "exportPasswordDescription": {
"message": "This password will be used to export and import this file" "message": "This password will be used to export and import this file"
}, },
"accountRestrictedOptionDescription": { "accountRestrictedOptionDescription": {
"message": "Use your account encryption key, derived from your account's username and Master Password, to encrypt the export and restrict import to only the current Bitwarden account." "message": "Use your account encryption key, derived from your account's username and Master Password, to encrypt the export and restrict import to only the current Bitwarden account."
}, },
@ -2817,8 +2817,8 @@
"invalidFilePassword": { "invalidFilePassword": {
"message": "Invalid file password, please use the password you entered when you created the export file." "message": "Invalid file password, please use the password you entered when you created the export file."
}, },
"importDestination": { "destination": {
"message": "Import destination" "message": "Destination"
}, },
"learnAboutImportOptions": { "learnAboutImportOptions": {
"message": "Learn about your import options" "message": "Learn about your import options"
@ -3013,5 +3013,8 @@
"example": "Work" "example": "Work"
} }
} }
},
"data": {
"message": "Data"
} }
} }

7
apps/web/src/locales/en/messages.json
View File

@ -1506,8 +1506,8 @@
"importEncKeyError": { "importEncKeyError": {
"message": "Error decrypting the exported file. Your encryption key does not match the encryption key used export the data." "message": "Error decrypting the exported file. Your encryption key does not match the encryption key used export the data."
}, },
"importDestination": { "destination": {
"message": "Import destination" "message": "Destination"
}, },
"learnAboutImportOptions": { "learnAboutImportOptions": {
"message": "Learn about your import options" "message": "Learn about your import options"
@ -8622,6 +8622,9 @@
} }
} }
}, },
"data": {
"message": "Data"
},
"purchasedSeatsRemoved": { "purchasedSeatsRemoved": {
"message": "purchased seats removed" "message": "purchased seats removed"
} }

791
libs/importer/src/components/import.component.html
View File

@ -2,396 +2,419 @@
{{ "personalOwnershipPolicyInEffectImports" | i18n }} {{ "personalOwnershipPolicyInEffectImports" | i18n }}
</bit-callout> </bit-callout>
<form [formGroup]="formGroup" [bitSubmit]="submit" id="import_form_importForm"> <form [formGroup]="formGroup" [bitSubmit]="submit" id="import_form_importForm">
<bit-form-field [hidden]="isFromAC"> <bit-section>
<bit-label <bit-section-header>
>{{ "importDestination" | i18n }} <h2 class="tw-font-bold" bitTypography="h6">{{ "destination" | i18n }}</h2>
<a </bit-section-header>
target="_blank" <bit-card>
rel="noreferrer" <bit-form-field [hidden]="isFromAC">
appA11yTitle="{{ 'learnAboutImportOptions' | i18n }}" <bit-label>{{ "vault" | i18n }}</bit-label>
href="https://bitwarden.com/help/import-data/" <bit-select formControlName="vaultSelector">
> <bit-option
<i class="bwi bwi-question-circle" aria-hidden="true"></i> *ngIf="!importBlockedByPolicy"
</a> [label]="'myVault' | i18n"
</bit-label> value="myVault"
<bit-select formControlName="vaultSelector"> icon="bwi-user"
<bit-option />
*ngIf="!importBlockedByPolicy" <bit-option
[label]="'myVault' | i18n" *ngFor="let o of organizations$ | async"
value="myVault" [value]="o.id"
icon="bwi-user" [label]="o.name"
/> icon="bwi-business"
<bit-option />
*ngFor="let o of organizations$ | async" </bit-select>
[value]="o.id" </bit-form-field>
[label]="o.name" <bit-form-field disableMargin>
icon="bwi-business" <bit-label>{{ organizationId ? ("collection" | i18n) : ("folder" | i18n) }}</bit-label>
/> <bit-select formControlName="targetSelector">
</bit-select> <ng-container *ngIf="!organizationId">
</bit-form-field> <bit-option [value]="null" label="-- {{ 'selectImportFolder' | i18n }} --" />
<bit-option
*ngFor="let f of folders$ | async"
[value]="f"
[label]="f.name"
icon="bwi-folder"
/>
</ng-container>
<ng-container *ngIf="organizationId">
<bit-option [value]="null" label="-- {{ 'selectImportCollection' | i18n }} --" />
<bit-option
*ngFor="let c of collections$ | async"
[value]="c"
[label]="c.name"
icon="bwi-collection"
/>
</ng-container>
</bit-select>
<bit-hint>{{
"importTargetHint"
| i18n
: (organizationId ? ("collection" | i18n | lowercase) : ("folder" | i18n | lowercase))
}}</bit-hint>
</bit-form-field>
</bit-card>
</bit-section>
<bit-form-field> <bit-section>
<bit-label>{{ organizationId ? ("collection" | i18n) : ("folder" | i18n) }}</bit-label> <bit-section-header>
<bit-select formControlName="targetSelector"> <h2 class="tw-font-bold" bitTypography="h6">{{ "data" | i18n }}</h2>
<ng-container *ngIf="!organizationId"> </bit-section-header>
<bit-option [value]="null" label="-- {{ 'selectImportFolder' | i18n }} --" /> <bit-card>
<bit-option <bit-form-field class="tw-w-1/2">
*ngFor="let f of folders$ | async" <bit-label>{{ "fileFormat" | i18n }}</bit-label>
[value]="f" <bit-select formControlName="format">
[label]="f.name" <bit-option value="" label="-- {{ 'select' | i18n }} --" />
icon="bwi-folder" <bit-option
/> class="tw-font-bold tw-text-muted tw-text-xs"
</ng-container> value="-"
<ng-container *ngIf="organizationId"> label="{{ 'commonImportFormats' | i18n }}"
<bit-option [value]="null" label="-- {{ 'selectImportCollection' | i18n }} --" /> disabled
<bit-option />
*ngFor="let c of collections$ | async" <bit-option *ngFor="let o of featuredImportOptions" [value]="o.id" [label]="o.name" />
[value]="c" <ng-container *ngIf="importOptions && importOptions.length">
[label]="c.name" <bit-option value="-" label="--------------------------------------" disabled />
icon="bwi-collection" <bit-option *ngFor="let o of importOptions" [value]="o.id" [label]="o.name" />
/> </ng-container>
</ng-container> </bit-select>
</bit-select> </bit-form-field>
<bit-hint>{{ <bit-callout type="info" title="{{ getFormatInstructionTitle() }}" *ngIf="format">
"importTargetHint" <ng-container *ngIf="format === 'bitwardencsv' || format === 'bitwardenjson'">
| i18n: (organizationId ? ("collection" | i18n | lowercase) : ("folder" | i18n | lowercase)) See detailed instructions on our help site at
}}</bit-hint> <a target="_blank" rel="noreferrer" href="https://bitwarden.com/help/export-your-data/">
</bit-form-field> https://bitwarden.com/help/export-your-data/</a
>
<bit-form-field class="tw-w-1/2"> </ng-container>
<bit-label>{{ "fileFormat" | i18n }}</bit-label> <ng-container *ngIf="format === 'lastpasscsv'">
<bit-select formControlName="format"> <p bitTypography="body1">
<bit-option value="" label="-- {{ 'select' | i18n }} --" /> {{ "seeDetailedInstructions" | i18n }}
<bit-option <a
class="tw-font-bold tw-text-muted tw-text-xs" target="_blank"
value="-" rel="noreferrer"
label="{{ 'commonImportFormats' | i18n }}" href="https://bitwarden.com/help/import-from-lastpass/"
disabled >
/> https://bitwarden.com/help/import-from-lastpass/</a
<bit-option *ngFor="let o of featuredImportOptions" [value]="o.id" [label]="o.name" /> >
<ng-container *ngIf="importOptions && importOptions.length"> </p>
<bit-option value="-" label="--------------------------------------" disabled /> <bit-radio-group *ngIf="showLastPassToggle" formControlName="lastPassType">
<bit-option *ngFor="let o of importOptions" [value]="o.id" [label]="o.name" /> <bit-radio-button
</ng-container> class="tw-block"
</bit-select> id="import_bit-radio-button_lp-direct"
</bit-form-field> value="direct"
<bit-callout type="info" title="{{ getFormatInstructionTitle() }}" *ngIf="format"> >
<ng-container *ngIf="format === 'bitwardencsv' || format === 'bitwardenjson'"> <bit-label>{{ "importDirectlyFromLastPass" | i18n }}</bit-label>
See detailed instructions on our help site at </bit-radio-button>
<a target="_blank" rel="noreferrer" href="https://bitwarden.com/help/export-your-data/"> <bit-radio-button class="tw-block" id="import_bit-radio-button_lp-csv" value="csv">
https://bitwarden.com/help/export-your-data/</a <bit-label>{{ "importFromCSV" | i18n }}</bit-label>
> </bit-radio-button>
</ng-container> </bit-radio-group>
<ng-container *ngIf="format === 'lastpasscsv'"> </ng-container>
<p bitTypography="body1"> <ng-container *ngIf="format === 'keepassxcsv'">
{{ "seeDetailedInstructions" | i18n }} Using the KeePassX desktop application, navigate to "Database" &rarr; "Export to CSV file"
<a target="_blank" rel="noreferrer" href="https://bitwarden.com/help/import-from-lastpass/"> and save the CSV file.
https://bitwarden.com/help/import-from-lastpass/</a </ng-container>
> <ng-container *ngIf="format === 'aviracsv'">
</p> In the Avira web vault, go to "Settings" &rarr; "My Data" &rarr; "Export data" and save
<bit-radio-group *ngIf="showLastPassToggle" formControlName="lastPassType"> the CSV file.
<bit-radio-button class="tw-block" id="import_bit-radio-button_lp-direct" value="direct"> </ng-container>
<bit-label>{{ "importDirectlyFromLastPass" | i18n }}</bit-label> <ng-container *ngIf="format === 'blurcsv'">
</bit-radio-button> In the Blur web vault, click your username at the top and go to "Settings" &rarr; "Export
<bit-radio-button class="tw-block" id="import_bit-radio-button_lp-csv" value="csv"> Data", then click "Export CSV" for your "Accounts".
<bit-label>{{ "importFromCSV" | i18n }}</bit-label> </ng-container>
</bit-radio-button> <ng-container *ngIf="format === 'safeincloudxml'">
</bit-radio-group> Using the SaveInCloud desktop application, navigate to "File" &rarr; "Export" &rarr; "As
</ng-container> XML" and save the XML file.
<ng-container *ngIf="format === 'keepassxcsv'"> </ng-container>
Using the KeePassX desktop application, navigate to "Database" &rarr; "Export to CSV file" and <ng-container *ngIf="format === 'padlockcsv'">
save the CSV file. Using the Padlock desktop application, click the hamburger icon in the top left corner and
</ng-container> navigate to "Settings" &rarr; "Export" button and save the file "As CSV".
<ng-container *ngIf="format === 'aviracsv'"> </ng-container>
In the Avira web vault, go to "Settings" &rarr; "My Data" &rarr; "Export data" and save the <ng-container *ngIf="format === 'keepass2xml'">
CSV file. Using the KeePass 2 desktop application, navigate to "File" &rarr; "Export" and select the
</ng-container> "KeePass XML (2.x)" option.
<ng-container *ngIf="format === 'blurcsv'"> </ng-container>
In the Blur web vault, click your username at the top and go to "Settings" &rarr; "Export <ng-container *ngIf="format === 'upmcsv'">
Data", then click "Export CSV" for your "Accounts". Using the Universal Password Manager desktop application, navigate to "Database" &rarr;
</ng-container> "Export" and save the CSV file.
<ng-container *ngIf="format === 'safeincloudxml'"> </ng-container>
Using the SaveInCloud desktop application, navigate to "File" &rarr; "Export" &rarr; "As XML" <ng-container *ngIf="format === 'saferpasscsv'">
and save the XML file. Using the SaferPass browser extension, click the hamburger icon in the top left corner and
</ng-container> navigate to "Settings". Click the "Export accounts" button to save the CSV file.
<ng-container *ngIf="format === 'padlockcsv'"> </ng-container>
Using the Padlock desktop application, click the hamburger icon in the top left corner and <ng-container *ngIf="format === 'meldiumcsv'">
navigate to "Settings" &rarr; "Export" button and save the file "As CSV". Using the Meldium web vault, navigate to "Settings". Locate the "Export data" function and
</ng-container> click "Show me my data" to save the CSV file.
<ng-container *ngIf="format === 'keepass2xml'"> </ng-container>
Using the KeePass 2 desktop application, navigate to "File" &rarr; "Export" and select the <ng-container *ngIf="format === 'keepercsv'">
"KeePass XML (2.x)" option. Log into the Keeper web vault (keepersecurity.com/vault). Click on your "account email"
</ng-container> (top right) and select "Settings". Go to "Export" and find the "Export to .csv File"
<ng-container *ngIf="format === 'upmcsv'"> option. Click "Export" to save the CSV file.
Using the Universal Password Manager desktop application, navigate to "Database" &rarr; </ng-container>
"Export" and save the CSV file. <!--
</ng-container>
<ng-container *ngIf="format === 'saferpasscsv'">
Using the SaferPass browser extension, click the hamburger icon in the top left corner and
navigate to "Settings". Click the "Export accounts" button to save the CSV file.
</ng-container>
<ng-container *ngIf="format === 'meldiumcsv'">
Using the Meldium web vault, navigate to "Settings". Locate the "Export data" function and
click "Show me my data" to save the CSV file.
</ng-container>
<ng-container *ngIf="format === 'keepercsv'">
Log into the Keeper web vault (keepersecurity.com/vault). Click on your "account email" (top
right) and select "Settings". Go to "Export" and find the "Export to .csv File" option. Click
"Export" to save the CSV file.
</ng-container>
<!--
<ng-container *ngIf="format === 'keeperjson'"> <ng-container *ngIf="format === 'keeperjson'">
Log into the Keeper web vault (keepersecurity.com/vault). Click on your "account email" (top Log into the Keeper web vault (keepersecurity.com/vault). Click on your "account email" (top
right) and select "Settings". Go to "Export" and find the "Export to .json File" option. Click right) and select "Settings". Go to "Export" and find the "Export to .json File" option. Click
"Export" to save the JSON file. "Export" to save the JSON file.
</ng-container> </ng-container>
--> -->
<ng-container <ng-container
*ngIf="format === 'chromecsv' || format === 'operacsv' || format === 'vivaldicsv'" *ngIf="format === 'chromecsv' || format === 'operacsv' || format === 'vivaldicsv'"
> >
<span *ngIf="format !== 'chromecsv'"> <span *ngIf="format !== 'chromecsv'">
The process is exactly the same as importing from Google Chrome. The process is exactly the same as importing from Google Chrome.
</span> </span>
See detailed instructions on our help site at See detailed instructions on our help site at
<a target="_blank" rel="noreferrer" href="https://bitwarden.com/help/import-from-chrome/"> <a target="_blank" rel="noreferrer" href="https://bitwarden.com/help/import-from-chrome/">
https://bitwarden.com/help/import-from-chrome/</a https://bitwarden.com/help/import-from-chrome/</a
> >
</ng-container> </ng-container>
<ng-container *ngIf="format === 'firefoxcsv'"> <ng-container *ngIf="format === 'firefoxcsv'">
See detailed instructions on our help site at See detailed instructions on our help site at
<a target="_blank" rel="noreferrer" href="https://bitwarden.com/help/import-from-firefox/"> <a
https://bitwarden.com/help/import-from-firefox/</a target="_blank"
>. rel="noreferrer"
</ng-container> href="https://bitwarden.com/help/import-from-firefox/"
<ng-container *ngIf="format === 'safaricsv'"> >
See detailed instructions on our help site at https://bitwarden.com/help/import-from-firefox/</a
<a target="_blank" rel="noreferrer" href="https://bitwarden.com/help/import-from-safari/"> >.
https://bitwarden.com/help/import-from-safari/</a </ng-container>
>. <ng-container *ngIf="format === 'safaricsv'">
</ng-container> See detailed instructions on our help site at
<ng-container <a target="_blank" rel="noreferrer" href="https://bitwarden.com/help/import-from-safari/">
*ngIf=" https://bitwarden.com/help/import-from-safari/</a
format === '1password1pux' || >.
format === '1password1pif' || </ng-container>
format === '1passwordwincsv' || <ng-container
format === '1passwordmaccsv' *ngIf="
" format === '1password1pux' ||
> format === '1password1pif' ||
See detailed instructions on our help site at format === '1passwordwincsv' ||
<a target="_blank" rel="noreferrer" href="https://bitwarden.com/help/import-from-1password/"> format === '1passwordmaccsv'
https://bitwarden.com/help/import-from-1password/</a "
>. >
</ng-container> See detailed instructions on our help site at
<ng-container *ngIf="format === 'passworddragonxml'"> <a
Using the Password Dragon desktop application, navigate to "File" &rarr; "Export" &rarr; "To target="_blank"
XML". In the dialog that pops up select "All Rows" and check all fields. Click the "Export" rel="noreferrer"
button and save the XML file. href="https://bitwarden.com/help/import-from-1password/"
</ng-container> >
<ng-container *ngIf="format === 'enpasscsv'"> https://bitwarden.com/help/import-from-1password/</a
Using the Enpass desktop application, navigate to "File" &rarr; "Export" &rarr; "As CSV". >.
Select "OK" to the warning alert and save the CSV file. Note that the importer only supports </ng-container>
files exported while Enpass is set to the English language, so adjust your settings <ng-container *ngIf="format === 'passworddragonxml'">
accordingly. Using the Password Dragon desktop application, navigate to "File" &rarr; "Export" &rarr;
</ng-container> "To XML". In the dialog that pops up select "All Rows" and check all fields. Click the
<ng-container *ngIf="format === 'enpassjson'"> "Export" button and save the XML file.
Using the Enpass 6 desktop application, click the menu button and navigate to "File" &rarr; </ng-container>
"Export". Select the ".json" file format option and save the JSON file. <ng-container *ngIf="format === 'enpasscsv'">
</ng-container> Using the Enpass desktop application, navigate to "File" &rarr; "Export" &rarr; "As CSV".
<ng-container *ngIf="format === 'pwsafexml'"> Select "OK" to the warning alert and save the CSV file. Note that the importer only
Using the Password Safe desktop application, navigate to "File" &rarr; "Export To" &rarr; "XML supports files exported while Enpass is set to the English language, so adjust your
format..." and save the XML file. settings accordingly.
</ng-container> </ng-container>
<ng-container *ngIf="format === 'dashlanecsv'"> <ng-container *ngIf="format === 'enpassjson'">
Log in to Dashlane, click on "My Account" &rarr; "Settings" &rarr; "Export file" and select Using the Enpass 6 desktop application, click the menu button and navigate to "File"
"Export as a CSV file". This will download a zip archive containing various CSV files. Unzip &rarr; "Export". Select the ".json" file format option and save the JSON file.
the archive and import each CSV file individually. </ng-container>
</ng-container> <ng-container *ngIf="format === 'pwsafexml'">
<ng-container *ngIf="format === 'dashlanejson'"> Using the Password Safe desktop application, navigate to "File" &rarr; "Export To" &rarr;
Dashlane no longer supports the JSON format. Only use this if you have an existing JSON for "XML format..." and save the XML file.
import. Use the CSV importer when creating new exports. </ng-container>
</ng-container> <ng-container *ngIf="format === 'dashlanecsv'">
<ng-container *ngIf="format === 'msecurecsv'"> Log in to Dashlane, click on "My Account" &rarr; "Settings" &rarr; "Export file" and
Using the mSecure desktop application, navigate to "File" &rarr; "Export" &rarr; "CSV File..." select "Export as a CSV file". This will download a zip archive containing various CSV
and save the CSV file. files. Unzip the archive and import each CSV file individually.
</ng-container> </ng-container>
<ng-container *ngIf="format === 'stickypasswordxml'"> <ng-container *ngIf="format === 'dashlanejson'">
Using the Sticky Password desktop application, navigate to "Menu" (top right) &rarr; "Export" Dashlane no longer supports the JSON format. Only use this if you have an existing JSON
&rarr; "Export all". Select the unencrypted format XML option and save the XML file. for import. Use the CSV importer when creating new exports.
</ng-container> </ng-container>
<ng-container *ngIf="format === 'truekeycsv'"> <ng-container *ngIf="format === 'msecurecsv'">
Using the True Key desktop application, click the gear icon (top right) and then navigate to Using the mSecure desktop application, navigate to "File" &rarr; "Export" &rarr; "CSV
"App Settings". Click the "Export" button, enter your password and save the CSV file. File..." and save the CSV file.
</ng-container> </ng-container>
<ng-container *ngIf="format === 'clipperzhtml'"> <ng-container *ngIf="format === 'stickypasswordxml'">
Log into the Clipperz web application (clipperz.is/app). Click the hamburger menu icon in the Using the Sticky Password desktop application, navigate to "Menu" (top right) &rarr;
top right to expand the navigation bar. Navigate to "Data" &rarr; "Export". Click the "Export" &rarr; "Export all". Select the unencrypted format XML option and save the XML
"download HTML+JSON" button to save the HTML file. file.
</ng-container> </ng-container>
<ng-container *ngIf="format === 'roboformcsv'"> <ng-container *ngIf="format === 'truekeycsv'">
Using the RoboForm Editor desktop application, navigate to "RoboForm" (top left) &rarr; Using the True Key desktop application, click the gear icon (top right) and then navigate
"Options" &rarr; "Account &amp; Data" and click the "Export" button. Select all of your data, to "App Settings". Click the "Export" button, enter your password and save the CSV file.
change the "Format" to "CSV file" and then click the "Export" button to save the CSV file. </ng-container>
Note: RoboForm only allows you to export Logins. Other items will not be exported. <ng-container *ngIf="format === 'clipperzhtml'">
</ng-container> Log into the Clipperz web application (clipperz.is/app). Click the hamburger menu icon in
<ng-container *ngIf="format === 'passboltcsv'"> the top right to expand the navigation bar. Navigate to "Data" &rarr; "Export". Click the
Log into the Passbolt web vault and navigate to the "Passwords" listing. Select all of the "download HTML+JSON" button to save the HTML file.
passwords you would like to export and click the "Export" button at the top of the listing. </ng-container>
Choose the "csv (lastpass)" export format and click the "Export" button. <ng-container *ngIf="format === 'roboformcsv'">
</ng-container> Using the RoboForm Editor desktop application, navigate to "RoboForm" (top left) &rarr;
<ng-container *ngIf="format === 'ascendocsv'"> "Options" &rarr; "Account &amp; Data" and click the "Export" button. Select all of your
Using the Ascendo DataVault desktop application, navigate to "Tools" &rarr; "Export". In the data, change the "Format" to "CSV file" and then click the "Export" button to save the CSV
dialog that pops up, select the "All Items (DVX, CSV)" option. Click the "Ok" button to save file. Note: RoboForm only allows you to export Logins. Other items will not be exported.
the CSV file. </ng-container>
</ng-container> <ng-container *ngIf="format === 'passboltcsv'">
<ng-container *ngIf="format === 'passwordbossjson'"> Log into the Passbolt web vault and navigate to the "Passwords" listing. Select all of the
Using the Password Boss desktop application, navigate to "File" &rarr; "Export data" &rarr; passwords you would like to export and click the "Export" button at the top of the
"Password Boss JSON - not encrypted" and save the JSON file. listing. Choose the "csv (lastpass)" export format and click the "Export" button.
</ng-container> </ng-container>
<ng-container *ngIf="format === 'zohovaultcsv'"> <ng-container *ngIf="format === 'ascendocsv'">
Log into the Zoho web vault (vault.zoho.com). Navigate to "Tools" &rarr; "Export Secrets". Using the Ascendo DataVault desktop application, navigate to "Tools" &rarr; "Export". In
Select "All Secrets" and click the "Zoho Vault Format CSV" button. Highlight and copy the data the dialog that pops up, select the "All Items (DVX, CSV)" option. Click the "Ok" button
from the textarea. Open a text editor like Notepad and paste the data. Save the data from the to save the CSV file.
text editor as </ng-container>
<code>zoho_export.csv</code>. <ng-container *ngIf="format === 'passwordbossjson'">
</ng-container> Using the Password Boss desktop application, navigate to "File" &rarr; "Export data"
<ng-container *ngIf="format === 'splashidcsv'"> &rarr; "Password Boss JSON - not encrypted" and save the JSON file.
Using the SplashID Safe desktop application, click on the SplashID blue lock logo in the top </ng-container>
right corner. Navigate to "Export" &rarr; "Export as CSV" and save the CSV file. <ng-container *ngIf="format === 'zohovaultcsv'">
</ng-container> Log into the Zoho web vault (vault.zoho.com). Navigate to "Tools" &rarr; "Export Secrets".
<ng-container *ngIf="format === 'passkeepcsv'"> Select "All Secrets" and click the "Zoho Vault Format CSV" button. Highlight and copy the
Using the PassKeep mobile app, navigate to "Backup/Restore". Locate the "CSV Backup/Restore" data from the textarea. Open a text editor like Notepad and paste the data. Save the data
section and click "Backup to CSV" to save the CSV file. from the text editor as
</ng-container> <code>zoho_export.csv</code>.
<ng-container *ngIf="format === 'gnomejson'"> </ng-container>
Make sure you have python-keyring and python-gnomekeyring installed. Save the <ng-container *ngIf="format === 'splashidcsv'">
<a target="_blank" rel="noreferrer" href="https://bit.ly/2GpOMTg" Using the SplashID Safe desktop application, click on the SplashID blue lock logo in the
>GNOME Keyring Import/Export</a top right corner. Navigate to "Export" &rarr; "Export as CSV" and save the CSV file.
> </ng-container>
python script to your desktop as <code>pw_helper.py</code>. Open terminal and run <ng-container *ngIf="format === 'passkeepcsv'">
<code>chmod +rx Desktop/pw_helper.py</code> and then Using the PassKeep mobile app, navigate to "Backup/Restore". Locate the "CSV
<code>python Desktop/pw_helper.py export Desktop/my_passwords.json</code>. Then upload the Backup/Restore" section and click "Backup to CSV" to save the CSV file.
resulting <code>my_passwords.json</code> file here to Bitwarden. </ng-container>
</ng-container> <ng-container *ngIf="format === 'gnomejson'">
<ng-container *ngIf="format === 'passwordagentcsv'"> Make sure you have python-keyring and python-gnomekeyring installed. Save the
Using the Password Agent desktop application navigate to "File" &rarr; "Export", select the <a target="_blank" rel="noreferrer" href="https://bit.ly/2GpOMTg"
"Fields to export" button and check all of the fields, change the "Output format" to "CSV", >GNOME Keyring Import/Export</a
and then click the "Start" button to save the CSV file. >
</ng-container> python script to your desktop as <code>pw_helper.py</code>. Open terminal and run
<ng-container *ngIf="format === 'passpackcsv'"> <code>chmod +rx Desktop/pw_helper.py</code> and then
Log into the Passpack website vault and navigate to "Settings" &rarr; "Export", then click the <code>python Desktop/pw_helper.py export Desktop/my_passwords.json</code>. Then upload the
"Download" button to save the CSV file. resulting <code>my_passwords.json</code> file here to Bitwarden.
</ng-container> </ng-container>
<ng-container *ngIf="format === 'passmanjson'"> <ng-container *ngIf="format === 'passwordagentcsv'">
Open your Passman vault and click on "Settings" in the bottom left corner. In the "Settings" Using the Password Agent desktop application navigate to "File" &rarr; "Export", select
window switch to the "Export credentials" tab and choose "JSON" as the export type. Enter your the "Fields to export" button and check all of the fields, change the "Output format" to
vault's passphrase and click the "Export" button to save the JSON file. "CSV", and then click the "Start" button to save the CSV file.
</ng-container> </ng-container>
<ng-container *ngIf="format === 'avastcsv'"> <ng-container *ngIf="format === 'passpackcsv'">
Open the Avast Passwords desktop application and navigate to "Settings" &rarr; "Import/export Log into the Passpack website vault and navigate to "Settings" &rarr; "Export", then click
data". Select the "Export" button for the "Export to CSV file" option to save the CSV file. the "Download" button to save the CSV file.
</ng-container> </ng-container>
<ng-container *ngIf="format === 'avastjson'"> <ng-container *ngIf="format === 'passmanjson'">
Open the Avast Passwords desktop application and navigate to "Settings" &rarr; "Import/export Open your Passman vault and click on "Settings" in the bottom left corner. In the
data". Select the "Export" button for the "Export to JSON file" option to save the JSON file. "Settings" window switch to the "Export credentials" tab and choose "JSON" as the export
</ng-container> type. Enter your vault's passphrase and click the "Export" button to save the JSON file.
<ng-container *ngIf="format === 'fsecurefsk'"> </ng-container>
Open the F-Secure KEY desktop application and navigate to "Settings" &rarr; "Export <ng-container *ngIf="format === 'avastcsv'">
Passwords". Select the "Export" button, enter your master password, and save the FSK file. Open the Avast Passwords desktop application and navigate to "Settings" &rarr;
</ng-container> "Import/export data". Select the "Export" button for the "Export to CSV file" option to
<ng-container *ngIf="format === 'kasperskytxt'"> save the CSV file.
Open the Kaspersky Password Manager desktop application and navigate to "Settings" &rarr; </ng-container>
"Import/Export". Locate the "Export to text file" section and select the "Export" button to <ng-container *ngIf="format === 'avastjson'">
save the TXT file. Open the Avast Passwords desktop application and navigate to "Settings" &rarr;
</ng-container> "Import/export data". Select the "Export" button for the "Export to JSON file" option to
<ng-container *ngIf="format === 'remembearcsv'"> save the JSON file.
Open the RememBear desktop application and navigate to "Settings" &rarr; "Account" &rarr; </ng-container>
"Export". Enter your master password and select the "Export Anyway" button to save the CSV <ng-container *ngIf="format === 'fsecurefsk'">
file. Open the F-Secure KEY desktop application and navigate to "Settings" &rarr; "Export
</ng-container> Passwords". Select the "Export" button, enter your master password, and save the FSK file.
<ng-container *ngIf="format === 'passwordwallettxt'"> </ng-container>
Open the PasswordWallet desktop application and navigate to "File" &rarr; "Export" &rarr; <ng-container *ngIf="format === 'kasperskytxt'">
"Visible entries to text file". Enter your password and select the "Ok" button to save the TXT Open the Kaspersky Password Manager desktop application and navigate to "Settings" &rarr;
file. "Import/Export". Locate the "Export to text file" section and select the "Export" button
</ng-container> to save the TXT file.
<ng-container *ngIf="format === 'mykicsv'"> </ng-container>
Open the Myki desktop browser extension and navigate to "Advanced" &rarr; "Export Accounts" <ng-container *ngIf="format === 'remembearcsv'">
and then scan the QR code with your mobile device. Various CSV files will then be saved to Open the RememBear desktop application and navigate to "Settings" &rarr; "Account" &rarr;
your computer's downloads folder. "Export". Enter your master password and select the "Export Anyway" button to save the CSV
</ng-container> file.
<ng-container *ngIf="format === 'securesafecsv'"> </ng-container>
Export your SecureSafe password safe to a CSV file with a comma delimiter. <ng-container *ngIf="format === 'passwordwallettxt'">
</ng-container> Open the PasswordWallet desktop application and navigate to "File" &rarr; "Export" &rarr;
<ng-container *ngIf="format === 'logmeoncecsv'"> "Visible entries to text file". Enter your password and select the "Ok" button to save the
Open the LogMeOnce browser extension, then navigate to "Open Menu" &rarr; "Export To" and TXT file.
select "CSV File" to save the CSV file. </ng-container>
</ng-container> <ng-container *ngIf="format === 'mykicsv'">
<ng-container *ngIf="format === 'blackberrycsv'"> Open the Myki desktop browser extension and navigate to "Advanced" &rarr; "Export
Open the BlackBerry Password Keeper application, then navigate to "Settings" &rarr; Accounts" and then scan the QR code with your mobile device. Various CSV files will then
"Import/Export". Select "Export Passwords" and follow the instructions on screen to save the be saved to your computer's downloads folder.
unencrypted CSV file. </ng-container>
</ng-container> <ng-container *ngIf="format === 'securesafecsv'">
<ng-container *ngIf="format === 'buttercupcsv'"> Export your SecureSafe password safe to a CSV file with a comma delimiter.
Open the Buttercup desktop application and unlock your vault. Right click on your vault's icon </ng-container>
and select "Export" to save the CSV file. <ng-container *ngIf="format === 'logmeoncecsv'">
</ng-container> Open the LogMeOnce browser extension, then navigate to "Open Menu" &rarr; "Export To" and
<ng-container *ngIf="format === 'codebookcsv'"> select "CSV File" to save the CSV file.
Open the Codebook desktop application and log in. Navigate to "File" &rarr; "Export all", then </ng-container>
click "Yes" on the dialog and save the CSV file. <ng-container *ngIf="format === 'blackberrycsv'">
</ng-container> Open the BlackBerry Password Keeper application, then navigate to "Settings" &rarr;
<ng-container *ngIf="format === 'encryptrcsv'"> "Import/Export". Select "Export Passwords" and follow the instructions on screen to save
Open the newest version of the Encryptr desktop application and allow all of your data to the unencrypted CSV file.
sync. Once syncing of your data is complete, the download icon in the top right corner will </ng-container>
turn pink. Click the download icon and save the CSV file. <ng-container *ngIf="format === 'buttercupcsv'">
</ng-container> Open the Buttercup desktop application and unlock your vault. Right click on your vault's
<ng-container *ngIf="format === 'yoticsv'"> icon and select "Export" to save the CSV file.
From the Yoti browser extension, click on "Settings", then "Export Saved Logins" and save the </ng-container>
CSV file. <ng-container *ngIf="format === 'codebookcsv'">
</ng-container> Open the Codebook desktop application and log in. Navigate to "File" &rarr; "Export all",
<ng-container *ngIf="format === 'psonojson'"> then click "Yes" on the dialog and save the CSV file.
Log in to the Psono web vault, click on the "Signed in as"-dropdown, select "Others". Go to </ng-container>
the "Export"-tab and select the json type export and then click on Export. <ng-container *ngIf="format === 'encryptrcsv'">
</ng-container> Open the newest version of the Encryptr desktop application and allow all of your data to
<ng-container *ngIf="format === 'passkyjson'"> sync. Once syncing of your data is complete, the download icon in the top right corner
Log in to "https://vault.passky.org" &rarr; "Import & Export" &rarr; "Export" in the Passky will turn pink. Click the download icon and save the CSV file.
section. ("Backup" is unsupported as it is encrypted). </ng-container>
</ng-container> <ng-container *ngIf="format === 'yoticsv'">
<ng-container *ngIf="format === 'protonpass'"> From the Yoti browser extension, click on "Settings", then "Export Saved Logins" and save
In the ProtonPass browser extension, go to Settings > Export. Export without PGP encryption the CSV file.
and save the zip file. </ng-container>
</ng-container> <ng-container *ngIf="format === 'psonojson'">
</bit-callout> Log in to the Psono web vault, click on the "Signed in as"-dropdown, select "Others". Go
<import-lastpass to the "Export"-tab and select the json type export and then click on Export.
*ngIf="showLastPassOptions" </ng-container>
[formGroup]="formGroup" <ng-container *ngIf="format === 'passkyjson'">
(csvDataLoaded)="this.formGroup.controls.fileContents.setValue($event)" Log in to "https://vault.passky.org" &rarr; "Import & Export" &rarr; "Export" in the
></import-lastpass> Passky section. ("Backup" is unsupported as it is encrypted).
<div [hidden]="showLastPassOptions"> </ng-container>
<bit-form-field> <ng-container *ngIf="format === 'protonpass'">
<bit-label>{{ "selectImportFile" | i18n }}</bit-label> In the ProtonPass browser extension, go to Settings > Export. Export without PGP
<div class="file-selector"> encryption and save the zip file.
<button bitButton type="button" buttonType="secondary" (click)="fileSelector.click()"> </ng-container>
{{ "chooseFile" | i18n }} </bit-callout>
</button> <import-lastpass
{{ this.fileSelected ? this.fileSelected.name : ("noFileChosen" | i18n) }} *ngIf="showLastPassOptions"
[formGroup]="formGroup"
(csvDataLoaded)="this.formGroup.controls.fileContents.setValue($event)"
></import-lastpass>
<div [hidden]="showLastPassOptions">
<bit-form-field>
<bit-label>{{ "selectImportFile" | i18n }}</bit-label>
<div class="file-selector">
<button bitButton type="button" buttonType="secondary" (click)="fileSelector.click()">
{{ "chooseFile" | i18n }}
</button>
{{ this.fileSelected ? this.fileSelected.name : ("noFileChosen" | i18n) }}
</div>
<input
bitInput
#fileSelector
type="file"
id="import_input_file"
formControlName="file"
(change)="setSelectedFile($event)"
hidden
class="tw-hidden"
/>
</bit-form-field>
<bit-form-field disableMargin>
<bit-label>{{ "orCopyPasteFileContents" | i18n }}</bit-label>
<textarea
id="import_textarea_fileContents"
bitInput
formControlName="fileContents"
></textarea>
</bit-form-field>
</div> </div>
<input </bit-card>
bitInput </bit-section>
#fileSelector
type="file"
id="import_input_file"
formControlName="file"
(change)="setSelectedFile($event)"
hidden
class="tw-hidden"
/>
</bit-form-field>
<bit-form-field>
<bit-label>{{ "orCopyPasteFileContents" | i18n }}</bit-label>
<textarea
id="import_textarea_fileContents"
bitInput
formControlName="fileContents"
></textarea>
</bit-form-field>
</div>
</form> </form>

8
libs/importer/src/components/import.component.ts
View File

@ -43,10 +43,14 @@ import {
BitSubmitDirective, BitSubmitDirective,
ButtonModule, ButtonModule,
CalloutModule, CalloutModule,
CardComponent,
ContainerComponent,
DialogService, DialogService,
FormFieldModule, FormFieldModule,
IconButtonModule, IconButtonModule,
RadioButtonModule, RadioButtonModule,
SectionComponent,
SectionHeaderComponent,
SelectModule, SelectModule,
ToastService, ToastService,
} from "@bitwarden/components"; } from "@bitwarden/components";
@ -104,6 +108,10 @@ const safeProviders: SafeProvider[] = [
ReactiveFormsModule, ReactiveFormsModule,
ImportLastPassComponent, ImportLastPassComponent,
RadioButtonModule, RadioButtonModule,
CardComponent,
ContainerComponent,
SectionHeaderComponent,
SectionComponent,
], ],
providers: safeProviders, providers: safeProviders,
}) })