From 98a3fe9669fffd4513193242b98e1112f09a4d6a Mon Sep 17 00:00:00 2001 From: Ldoppea Date: Wed, 10 Apr 2024 16:47:12 +0200 Subject: [PATCH 1/8] feat: Add `Profile` migration Alert We will soon remove the concept of `Profiles` and replace it by Cozy's `Contacts` Because the user's vault is encrypted, we cannot do an automatic migration on server side Also we prefer no to do a migration on the client's side due to the sensible nature of the data Instead we want to warn the user that the `Profile` concept will be removed soon and that they need to migrate their data by themselves We give the user some delays, after which the remaining `Profiles` will be moved to the trash and so become readonly and will be ignored by autofill capabilities This commit adds the Alert that will be shown to the user. This app will keep displaying this Alert until all `Profiles` are removed If no `Profile` exist, then this Alert is not shown --- apps/browser/src/_locales/en/messages.json | 23 ++++++ apps/browser/src/_locales/fr/messages.json | 23 ++++++ .../profiles-migration.component.html | 14 ++++ .../profiles-migration.component.ts | 20 +++++ apps/browser/src/popup/app.module.ts | 2 + .../popup/scss/cozy-profiles-migration.scss | 75 +++++++++++++++++++ apps/browser/src/popup/scss/misc.scss | 13 ++++ apps/browser/src/popup/scss/popup.scss | 4 + .../vault/vault-filter.component.html | 6 ++ 9 files changed, 180 insertions(+) create mode 100644 apps/browser/src/cozy/components/profiles-migration/profiles-migration.component.html create mode 100644 apps/browser/src/cozy/components/profiles-migration/profiles-migration.component.ts create mode 100644 apps/browser/src/popup/scss/cozy-profiles-migration.scss diff --git a/apps/browser/src/_locales/en/messages.json b/apps/browser/src/_locales/en/messages.json index 2c107c1c2cb1..8da2f1e71347 100755 --- a/apps/browser/src/_locales/en/messages.json +++ b/apps/browser/src/_locales/en/messages.json @@ -2379,5 +2379,28 @@ }, "sharingNotAcceptedYetDesc2": { "message": "This security code will enable him to validate your identity and let you access shared items." + }, + "profileMigrationTitle": { + "message": "Important information" + }, + "profileMigrationContent": { + "message": "Your Cozy extension will evolve. Your profiles will be deleted after $DATE$. So you have $REMAINING$ to transform your $PROFILES_COUNT$ profiles into contacts and then continue to use the autofill feature.", + "placeholders": { + "date": { + "content": "$1", + "example": "January 1st, 1970" + }, + "remaining": { + "content": "$2", + "example": "15" + }, + "profiles_count": { + "content": "$3", + "example": "12" + } + } + }, + "profileMigrationAction": { + "message": "More details" } } diff --git a/apps/browser/src/_locales/fr/messages.json b/apps/browser/src/_locales/fr/messages.json index 8e211e4d8bea..530d07c01478 100755 --- a/apps/browser/src/_locales/fr/messages.json +++ b/apps/browser/src/_locales/fr/messages.json @@ -2427,5 +2427,28 @@ }, "sharingNotAcceptedYetDesc2": { "message": "Ce code de sécurité lui permettra de valider votre identité et ainsi d'accéder aux éléments partagés." + }, + "profileMigrationTitle": { + "message": "Information importante" + }, + "profileMigrationContent": { + "message": "Votre extension Cozy évolue. Les profils seront supprimé le $DATE$. Il vous reste donc $REMAINING$ pour transformer vos $PROFILES_COUNT$ profils en contact et continuer à utiliser la fonction de remplissage automatique.", + "placeholders": { + "date": { + "content": "$1", + "example": "1er janvier 1970" + }, + "remaining": { + "content": "$2", + "example": "15" + }, + "profiles_count": { + "content": "$3", + "example": "12" + } + } + }, + "profileMigrationAction": { + "message": "En savoir plus" } } diff --git a/apps/browser/src/cozy/components/profiles-migration/profiles-migration.component.html b/apps/browser/src/cozy/components/profiles-migration/profiles-migration.component.html new file mode 100644 index 000000000000..aa68f67c3959 --- /dev/null +++ b/apps/browser/src/cozy/components/profiles-migration/profiles-migration.component.html @@ -0,0 +1,14 @@ +
+
+
+
+
{{ "profileMigrationTitle" | i18n }}
+
{{ "profileMigrationContent" | i18n: deadline:remaining:profilesCount }}
+
+
+ +
+
+
diff --git a/apps/browser/src/cozy/components/profiles-migration/profiles-migration.component.ts b/apps/browser/src/cozy/components/profiles-migration/profiles-migration.component.ts new file mode 100644 index 000000000000..98e4122496f5 --- /dev/null +++ b/apps/browser/src/cozy/components/profiles-migration/profiles-migration.component.ts @@ -0,0 +1,20 @@ +import { Component, Input, OnInit } from "@angular/core"; + +@Component({ + selector: "app-profiles-migration", + templateUrl: "profiles-migration.component.html", +}) +export class ProfilesMigrationComponent implements OnInit { + @Input() profilesCount: number; + remaining: string; + deadline: string; + ready = false; + + async ngOnInit() { + this.remaining = "15 jours"; + this.deadline = "15/04/2024"; + this.ready = true; + } + + moreInfo() {} +} diff --git a/apps/browser/src/popup/app.module.ts b/apps/browser/src/popup/app.module.ts index c568f8a767c8..5715a7a9c5ed 100755 --- a/apps/browser/src/popup/app.module.ts +++ b/apps/browser/src/popup/app.module.ts @@ -83,6 +83,7 @@ import { IfFlagDirective } from "../cozy/components/flag-conditional/if-flag.dir import { AddGenericComponent } from "../cozy/components/add-generic/add-generic.component"; import { ViewExpirationDateComponent } from "../vault/popup/components/vault/view-expiration-date.component"; import { ContactAvatarComponent } from "../vault/popup/components/vault/contact-avatar.component"; +import { ProfilesMigrationComponent } from "../cozy/components/profiles-migration/profiles-migration.component"; /* eslint-enable */ /* end Cozy imports */ @@ -169,6 +170,7 @@ import { ContactAvatarComponent } from "../vault/popup/components/vault/contact- AddGenericComponent, ViewExpirationDateComponent, ContactAvatarComponent, + ProfilesMigrationComponent, /* end Cozy components */ ], providers: [CurrencyPipe, DatePipe], diff --git a/apps/browser/src/popup/scss/cozy-profiles-migration.scss b/apps/browser/src/popup/scss/cozy-profiles-migration.scss new file mode 100644 index 000000000000..c98f278675b9 --- /dev/null +++ b/apps/browser/src/popup/scss/cozy-profiles-migration.scss @@ -0,0 +1,75 @@ +.profileMigration { + @include themify($themes) { + background-color: themed("backgroundColorAlt"); + } + padding: 16px; + + .alert { + @include themify($themes) { + background-color: change-color(themed("warningColor"), $alpha: 0.12); + } + display: flex; + flex-wrap: wrap; + + padding: 8px 16px; + + border-radius: 8px; + + .alert-icon { + display: flex; + + height: 16px; + width: 16px; + + margin-right: 12px; + margin-top: 9px; + padding: 7px 0; + + font-size: 22px; + + @include themify($themes) { + background-color: themed("warningColor"); + color: themed("warningColor"); + } + } + + .alert-message { + display: flex; + flex-wrap: wrap; + flex: auto; + align-items: center; + + max-width: calc(100% - 28px); + + padding: 8px 0; + + .alert-title { + width: 100%; + + margin-bottom: 0.35em; + margin-top: -2px; + + font-weight: bold; + } + } + + .alert-action { + display: block; + + width: 100%; + + margin-left: auto; + margin-right: -6px; + padding-left: 0; + + text-align: right; + text-transform: uppercase; + + .btn.link { + @include themify($themes) { + color: themed("warningColor") !important; + } + } + } + } +} diff --git a/apps/browser/src/popup/scss/misc.scss b/apps/browser/src/popup/scss/misc.scss index ca20d95a03c7..a930991c34c8 100755 --- a/apps/browser/src/popup/scss/misc.scss +++ b/apps/browser/src/popup/scss/misc.scss @@ -324,6 +324,19 @@ This class is responsible of changing tabs colors : } } +.cozy-icon-info { + background-color: $gray-light; + color: $gray-light; + mask-image: url("cozy-ui/assets/icons/ui/info.svg"); + mask-position: center; + mask-repeat: no-repeat; + mask-size: contain; +} + +.cozy-icon-info::before { + content: "\f071"; // keep height +} + .bwi-lock-f { background-color: $gray-light; mask-image: url("cozy-ui/assets/icons/ui/stack.svg"); diff --git a/apps/browser/src/popup/scss/popup.scss b/apps/browser/src/popup/scss/popup.scss index b66a1018166b..21af2d1306e7 100644 --- a/apps/browser/src/popup/scss/popup.scss +++ b/apps/browser/src/popup/scss/popup.scss @@ -11,4 +11,8 @@ @import "plugins.scss"; @import "environment.scss"; @import "pages.scss"; +// Cozy Customization, Profile migration +//* +@import "cozy-profiles-migration.scss"; +//*/ @import "@angular/cdk/overlay-prebuilt.css"; diff --git a/apps/browser/src/vault/popup/components/vault/vault-filter.component.html b/apps/browser/src/vault/popup/components/vault/vault-filter.component.html index bf0d76b9c828..fac49efc7b5b 100644 --- a/apps/browser/src/vault/popup/components/vault/vault-filter.component.html +++ b/apps/browser/src/vault/popup/components/vault/vault-filter.component.html @@ -33,6 +33,12 @@

{{ "myVault" | i18n }}

+ + + -
+ + +
+

{{ "identities" | i18n }} + -

From 93d31bdf22eff5430b0376ab531466cdba5d82c9 Mon Sep 17 00:00:00 2001 From: Ldoppea Date: Wed, 10 Apr 2024 17:03:51 +0200 Subject: [PATCH 5/8] feat: Open "more details" link on `Profile` migration alert --- .../profiles-migration/profiles-migration.component.ts | 6 +++++- 1 file changed, 5 insertions(+), 1 deletion(-) diff --git a/apps/browser/src/cozy/components/profiles-migration/profiles-migration.component.ts b/apps/browser/src/cozy/components/profiles-migration/profiles-migration.component.ts index a5406b4696fe..1628b6bf07a2 100644 --- a/apps/browser/src/cozy/components/profiles-migration/profiles-migration.component.ts +++ b/apps/browser/src/cozy/components/profiles-migration/profiles-migration.component.ts @@ -71,5 +71,9 @@ export class ProfilesMigrationComponent implements OnInit { return true; } - moreInfo() {} + moreInfo() { + const infoUrl = + "https://support.cozy.io/394-comment-puis-je-parametrer-mon-gestionnaire-de-mot-de-passe/"; + window.open(infoUrl); + } } From cd3054340590b791efba011dc164089d012743f6 Mon Sep 17 00:00:00 2001 From: Ldoppea Date: Fri, 29 Mar 2024 20:17:32 +0100 Subject: [PATCH 6/8] feat: Prevent to restore `Profiles` In previous commits we did a method that automatically move `Profiles` into the user's trash This commit removes the `restore` button from trashed `Profiles` view --- .../src/vault/popup/components/vault/view.component.html | 5 ++++- 1 file changed, 4 insertions(+), 1 deletion(-) diff --git a/apps/browser/src/vault/popup/components/vault/view.component.html b/apps/browser/src/vault/popup/components/vault/view.component.html index b6a899d07e8c..fc1e37f85ebc 100644 --- a/apps/browser/src/vault/popup/components/vault/view.component.html +++ b/apps/browser/src/vault/popup/components/vault/view.component.html @@ -776,14 +776,17 @@

+ +