Merge pull request #1150 from tchapgouv/1140-help-access-verify-device

1140 help access verify device
tchapgouv · Oct 29, 2024 · 349eea5 · 349eea5
2 parents 5f1bcdc + cf4922f
commit 349eea5
Show file tree

Hide file tree

Showing 11 changed files with 62 additions and 13 deletions.
diff --git a/linked-dependencies/matrix-react-sdk/res/css/views/auth/_CompleteSecurityBody.pcss b/linked-dependencies/matrix-react-sdk/res/css/views/auth/_CompleteSecurityBody.pcss
@@ -8,12 +8,6 @@ Please see LICENSE files in the repository root for full details.
 */
 
 .mx_CompleteSecurityBody {
-    /* :TCHAP: cross-signing-ui
-    width: 600px;
-    */
-    width: 660px;
-    /* end :TCHAP: */
-
     color: $authpage-primary-color;
     background-color: $background;
     border-radius: 4px;

diff --git a/linked-dependencies/matrix-react-sdk/src/components/structures/auth/SetupEncryptionBody.tsx b/linked-dependencies/matrix-react-sdk/src/components/structures/auth/SetupEncryptionBody.tsx
@@ -23,6 +23,7 @@ import defaultDispatcher from "../../../dispatcher/dispatcher";
 import { Action } from "matrix-react-sdk/src/dispatcher/actions";
 import { UserTab } from "matrix-react-sdk/src/components/views/dialogs/UserTab";
 import { OpenToTabPayload } from "matrix-react-sdk/src/dispatcher/payloads/OpenToTabPayload";
+import TchapUrls from "../../../../../../src/tchap/util/TchapUrls"; // :TCHAP: help-access-verify-device
 
 function keyHasPassphrase(keyInfo: SecretStorageKeyDescription): boolean {
     return Boolean(keyInfo.passphrase && keyInfo.passphrase.salt && keyInfo.passphrase.iterations);
@@ -201,13 +202,34 @@ export default class SetupEncryptionBody extends React.Component<IProps, IState>
                     );
                 }
 
+                // :TCHAP:
+                const translationHelpLink =  (sub) => (
+                    <AccessibleButton kind="link_inline" onClick={() => {
+                        window.open(TchapUrls.helpVerifyDevicesPage,"_blank")
+                    }}>
+                        {sub}
+                    </AccessibleButton>
+                )
+                const tchapHelpButton = (
+                    <AccessibleButton kind="primary_outline" onClick={() => { window.open(TchapUrls.helpVerifyDevicesPage,"_blank") }}>
+                            {_t("common|help")}
+                    </AccessibleButton>
+                )
+                // end :TCHAP: 
                 return (
                     <div>
-                        <p>{_t("encryption|verification|verification_description")}</p>
-
+                        {/*:TCHAP: help-access-verify-device - <p>{_t("encryption|verification|verification_description")} */}
+                        <p>{_t("encryption|verification|verification_description")} {_t("encryption|verification|help_link",  {}, {
+                             a: translationHelpLink,
+                            })}
+                        </p>
+                        {/* end :TCHAP: */}
                         <div className="mx_CompleteSecurity_actionRow">
                             {verifyButton}
                             {useRecoveryKeyButton}
+                            {/* :TCHAP: help-access-verify-device */}
+                            {tchapHelpButton}
+                            {/* end :TCHAP: */}
                         </div>
                         <div className="mx_SetupEncryptionBody_reset">
                             {_t("encryption|reset_all_button", undefined, {

diff --git a/linked-dependencies/matrix-react-sdk/src/components/views/settings/Notifications.tsx b/linked-dependencies/matrix-react-sdk/src/components/views/settings/Notifications.tsx
@@ -53,6 +53,7 @@ import { doesRoomHaveUnreadMessages } from "../../../Unread";
 import SettingsFlag from "../elements/SettingsFlag";
 
 import TchapUIFeature from "../../../../../../src/tchap/util/TchapUIFeature"; // :tchap: tchap-features-from-config
+import TchapUrls from "../../../../../../src/tchap/util/TchapUrls"; //:TCHAP: email-notification-setting-caption
 
 // TODO: this "view" component still has far too much application logic in it,
 // which should be factored out to other files.
@@ -701,7 +702,7 @@ export default class Notifications extends React.PureComponent<IProps, IState> {
                         {},
                         {
                             a: (sub) => (
-                                <AccessibleButton kind="link_inline" onClick={() => {window.open("https://aide.tchap.beta.gouv.fr/fr/article/notification-par-email-draft-6k7k89/","_blank")}}>
+                                <AccessibleButton kind="link_inline" onClick={() => {window.open(TchapUrls.helpEmailNotification, "_blank")}}>
                                     {sub}
                                 </AccessibleButton>
                             ),

diff --git a/linked-dependencies/matrix-react-sdk/src/components/views/spaces/SpaceCreateMenu.tsx b/linked-dependencies/matrix-react-sdk/src/components/views/spaces/SpaceCreateMenu.tsx
@@ -43,6 +43,7 @@ import { KeyBindingAction } from "../../../accessibility/KeyboardShortcuts";
 import defaultDispatcher from "../../../dispatcher/dispatcher";
 import { Action } from "../../../dispatcher/actions";
 import { Filter } from "../dialogs/spotlight/Filter";
+import TchapUrls from "../../../../../../src/tchap/util/TchapUrls"; // :TCHAP: space-remove-public-and-subspace
 
 export const createSpace = async (
     client: MatrixClient,
@@ -348,7 +349,7 @@ const SpaceCreateMenu: React.FC<{
                 {_t("create_space|add_details_prompt")} {_t("create_space|add_details_prompt_2", {}, {
                     a: (sub) => (
                             <AccessibleButton kind="link_inline" onClick={() => {
-                                window.open("https://aide.tchap.beta.gouv.fr/fr/article/comment-creer-un-espace-sur-tchap-1wmlenx","_blank")
+                                window.open(TchapUrls.helpCreateSpace, "_blank")
                             }}>
                                 {sub}
                             </AccessibleButton>

diff --git a/linked-dependencies/matrix-react-sdk/src/hooks/useUserOnboardingTasks.ts b/linked-dependencies/matrix-react-sdk/src/hooks/useUserOnboardingTasks.ts
@@ -22,6 +22,7 @@ import { UseCase } from "../settings/enums/UseCase";
 import { useSettingValue } from "./useSettings";
 import { UserOnboardingContext } from "./useUserOnboardingContext";
 import { accessSecretStorage } from "../SecurityManager"; // :TCHAP: onboarding-add-secure-backup
+import TchapUrls from "../../../../src/tchap/util/TchapUrls"; // :TCHAP: onboarding-add-tchap-guide
 
 interface UserOnboardingTask {
     id: string;
@@ -153,7 +154,7 @@ const tasks: UserOnboardingTask[] = [
             label: _t("onboarding|check_user_guide_action"),
             onClick: (ev: ButtonEvent) => {
                 window.localStorage.setItem('tchap_user_guide_checked', 'true');
-                window.open("https://aide.tchap.beta.gouv.fr/fr/article/guide-de-prise-en-main-de-tchap-oswyn1/", "_blank");
+                window.open( TchapUrls.helpUserOnboarding, "_blank");
             },
         },
     }, /** end :TCHAP: onboarding-add-tchap-guide */

diff --git a/modules/tchap-translations/tchap_translations.json b/modules/tchap-translations/tchap_translations.json
@@ -893,5 +893,9 @@
     "settings|general|redlist": {
         "en": "Red List",
         "fr": "Liste rouge"
+    },
+    "encryption|verification|help_link": {
+        "en": "<a>Learn more and get help</a>",
+        "fr": "<a>En savoir plus et obtenir de l'aide </a>"
     }
 }
diff --git a/patches/subtree-modifications.json b/patches/subtree-modifications.json
@@ -100,5 +100,9 @@
         "files": [
             "src/components/views/settings/tabs/user/AccountUserSettingsTab.tsx"
         ]
+    },
+    "help-access-verify-device": {
+        "issue": "https://github.com/tchapgouv/tchap-web-v4/issues/1140",
+        "files": ["src/components/structures/auth/SetupEncryptionBody.tsx"]
     }
 }
diff --git a/res/themes/tchap-common/css/_tchap_custom.pcss b/res/themes/tchap-common/css/_tchap_custom.pcss
@@ -72,4 +72,9 @@
 .mx_AuthBody_text .mx_ErrorMessage {
     margin-top: 10px;
     font-weight: bold;
+}
+
+/* help-access-verify-device added help button, so need to have wider width to avoid double line text in other buttons */
+.mx_CompleteSecurityBody {
+    width: 726px;
 }
diff --git a/src/tchap/async-components/views/dialogs/security/TchapExportE2eKeysSuccessDialog.tsx b/src/tchap/async-components/views/dialogs/security/TchapExportE2eKeysSuccessDialog.tsx
@@ -22,6 +22,7 @@ import { _t } from "matrix-react-sdk/src/languageHandler";
 import { TchapAnchor } from "../../../../components/views/common/TchapAnchor";
 import KeySavedImage from "../../../../../../res/img/tchap/key-saved.svg";
 import "../../../../../../res/css/views/dialogs/_TchapExportE2eKeysSuccessDialog.pcss";
+import TchapUrls from "../../../../util/TchapUrls";
 
 interface IProps {
     allowLogout: boolean;
@@ -65,7 +66,7 @@ export default class TchapExportE2eKeysSuccessDialog extends React.Component<IPr
                             {
                                 a: (sub) => (
                                     <TchapAnchor
-                                        href="https://aide.tchap.beta.gouv.fr/fr/article/comment-importer-manuellement-mes-cles-tchap-cles-de-chiffrement-web-xh376r"
+                                        href={TchapUrls.helpManuallyImportKeys}
                                         openInNewTab
                                     >
                                         {sub}

diff --git a/src/tchap/components/views/common/QuickFaq.tsx b/src/tchap/components/views/common/QuickFaq.tsx
@@ -7,6 +7,7 @@ import classNames from 'classnames';
 import { _t } from '../../../../languageHandler';
 import "../../../../../res/css/common/_TchapLeftPanel.pcss";
 import IconizedContextMenu, { IconizedContextMenuOption, IconizedContextMenuOptionList } from 'matrix-react-sdk/src/components/views/context_menus/IconizedContextMenu';
+import TchapUrls from '../../../util/TchapUrls';
 
 const QuickFaqButton: React.FC<{
     isPanelCollapsed: boolean;
@@ -43,7 +44,7 @@ const QuickFaqButton: React.FC<{
                         iconClassName="mx_UserMenu_iconHome"
                         label={_t("quick_faq|guides")}
                         onClick={(e) => {
-                            window.open("https://aide.tchap.beta.gouv.fr/fr/article/guide-de-prise-en-main-de-tchap-oswyn1/", '_blank')
+                            window.open(TchapUrls.helpUserOnboarding, '_blank')
                         }}
                     />
                 </IconizedContextMenuOptionList>

diff --git a/src/tchap/util/TchapUrls.ts b/src/tchap/util/TchapUrls.ts
@@ -10,4 +10,19 @@ export default class TchapUrls {
 
     //tchap FAQ page on locked messages. Should redirect to the appropriate crisp page on https://aide.tchap.beta.gouv.fr
     public static lockedMessagesPage = "https://tchap.beta.gouv.fr/faq/messages-verrouilles";
+
+    // help page to verify decices, used 
+    public static helpVerifyDevicesPage = "https://aide.tchap.beta.gouv.fr/fr/article/comment-verifier-un-nouvel-appareil-sur-tchap-xm0b0y/";
+
+    // help page for notification by email
+    public static helpEmailNotification = "https://aide.tchap.beta.gouv.fr/fr/article/notification-par-email-draft-6k7k89/";
+
+    // help create space 
+    public static helpCreateSpace = "https://aide.tchap.beta.gouv.fr/fr/article/comment-creer-un-espace-sur-tchap-1wmlenx";
+
+    // help user onboarding
+    public static helpUserOnboarding = "https://aide.tchap.beta.gouv.fr/fr/article/guide-de-prise-en-main-de-tchap-oswyn1/";
+
+    // help manually import tchap keys
+    public static helpManuallyImportKeys= "https://aide.tchap.beta.gouv.fr/fr/article/comment-importer-manuellement-mes-cles-tchap-cles-de-chiffrement-web-xh376r"
 }