From 2dc3550cd0ef52c8035f7a51c63b09bd8b447b2b Mon Sep 17 00:00:00 2001
From: "marc.sirisak" <marc.sirisak@beta.gouv.fr>
Date: Thu, 9 Jan 2025 17:41:31 +0100
Subject: [PATCH] TCHAP: add PC button on login page

---
 res/css/views/sso/TchapSSO.pcss                 |  1 +
 res/themes/tchap-common/css/_tchap_custom.pcss  |  6 ++++++
 src/components/structures/auth/Login.tsx        | 17 ++++++++++++++---
 src/components/structures/auth/Registration.tsx |  4 ++--
 4 files changed, 23 insertions(+), 5 deletions(-)

diff --git a/res/css/views/sso/TchapSSO.pcss b/res/css/views/sso/TchapSSO.pcss
index 0089edb60d..e64fc5ba1f 100644
--- a/res/css/views/sso/TchapSSO.pcss
+++ b/res/css/views/sso/TchapSSO.pcss
@@ -30,6 +30,7 @@
         background-color: var(--accent);
         color: white !important;
         text-align: left;
+        font-weight: bold;
     }
     
     .tc_Button_iconPC {
diff --git a/res/themes/tchap-common/css/_tchap_custom.pcss b/res/themes/tchap-common/css/_tchap_custom.pcss
index 35b206fb90..bb1a8bcf43 100644
--- a/res/themes/tchap-common/css/_tchap_custom.pcss
+++ b/res/themes/tchap-common/css/_tchap_custom.pcss
@@ -119,4 +119,10 @@
     .lasuite-header__service-title {
         color: black;
     }
+}
+
+/* login with proconnect style */
+.mx_Login_submit {
+    border-radius: 0px !important;
+    height: 46px !important;
 }
\ No newline at end of file
diff --git a/src/components/structures/auth/Login.tsx b/src/components/structures/auth/Login.tsx
index 312d2cf2c7..2f0dbeec8d 100644
--- a/src/components/structures/auth/Login.tsx
+++ b/src/components/structures/auth/Login.tsx
@@ -34,6 +34,8 @@ import { Features } from "../../../settings/Settings";
 import { startOidcLogin } from "../../../utils/oidc/authorize";
 import TchapUtils from '~tchap-web/src/tchap/util/TchapUtils'; // :TCHAP: login
 import Tchapi18nUtils from '~tchap-web/src/tchap/i18n/Tchapi18nUtils'; // :TCHAP: login
+import TchapUIFeature from "~tchap-web/src/tchap/util/TchapUIFeature";
+import ProconnectButton from "~tchap-web/src/tchap/components/views/sso/ProconnectButton";
 
 interface IProps {
     serverConfig: ValidatedServerConfig;
@@ -130,8 +132,7 @@ export default class LoginComponent extends React.PureComponent<IProps, IState>
             // eslint-disable-next-line @typescript-eslint/naming-convention
             "m.login.cas": () => this.renderSsoStep("cas"),
             // eslint-disable-next-line @typescript-eslint/naming-convention
-            // :TCHAP: sso-agentconnect-flow
-            // "m.login.sso": () => this.renderSsoStep("sso"),
+            "m.login.sso": () => this.renderSsoStep("sso"),
             "oidcNativeFlow": () => this.renderOidcNativeStep(),
         };
     }
@@ -499,8 +500,8 @@ export default class LoginComponent extends React.PureComponent<IProps, IState>
     };
 
     private renderSsoStep = (loginType: "cas" | "sso"): JSX.Element => {
+        /** :TCHAP:
         const flow = this.state.flows?.find((flow) => flow.type === "m.login." + loginType) as SSOFlow;
-
         return (
             <SSOButtons
                 matrixClient={this.loginLogic.createTemporaryClient()}
@@ -512,6 +513,16 @@ export default class LoginComponent extends React.PureComponent<IProps, IState>
                 disabled={this.isBusy()}
             />
         );
+        */
+
+        if (TchapUIFeature.isSSOFlowActive()) {
+            return <div style={{marginBottom: "25px", position: "relative", top: "-15px"}}>
+                <p style={{textAlign: "center", fontWeight: "bold"}}>{_t("auth|proconnect|or")}</p>
+                <ProconnectButton />
+            </div>;
+        }
+        return <></>;
+        // end :TCHAP:
     };
 
     public render(): React.ReactNode {
diff --git a/src/components/structures/auth/Registration.tsx b/src/components/structures/auth/Registration.tsx
index 3b5105d061..ab37cb16d2 100644
--- a/src/components/structures/auth/Registration.tsx
+++ b/src/components/structures/auth/Registration.tsx
@@ -643,9 +643,9 @@ export default class Registration extends React.Component<IProps, IState> {
             //     );
             if (!this.props.mobileRegister && this.state.ssoFlow && TchapUIFeature.isSSOFlowActive()) {
                 ssoSection = <>
-                    <ProconnectButton/>
+                    <ProconnectButton />
                     <p style={{textAlign: "center", fontWeight: "bold"}}>{_t("auth|proconnect|or")}</p>
-                </>
+                </>;
             }
             // }
             // end :TCHAP: