Merge pull request #7758 from DonOmalVindula/fix/29339

Add documentation link to account disable connector and fix loading states
wso2 · Feb 28, 2025 · 9b605e1 · 9b605e1
2 parents 1f32f65 + 94f0ac3
commit 9b605e1
Show file tree

Hide file tree

Showing 4 changed files with 70 additions and 25 deletions.
diff --git a/.changeset/calm-humans-rule.md b/.changeset/calm-humans-rule.md
@@ -0,0 +1,6 @@
+---
+"@wso2is/admin.server-configurations.v1": patch
+"@wso2is/admin.extensions.v1": patch
+---
+
+Add documentation link to account disable connector
diff --git a/features/admin.extensions.v1/configs/documentation.ts b/features/admin.extensions.v1/configs/documentation.ts
@@ -388,6 +388,9 @@ export const getDocumentationLinksExtension = () : DocumentationLinksExtensionIn
             }
         },
         manage: {
+            accountDisable: {
+                learnMore: undefined
+            },
             accountRecovery: {
                 passwordRecovery: {
                     learnMore: undefined

diff --git a/features/admin.extensions.v1/configs/models/documentation.ts b/features/admin.extensions.v1/configs/models/documentation.ts
@@ -565,6 +565,13 @@ interface MultiTenancyDocumentationLinksInterface {
     };
 }
 
+/**
+ * Interface for the account disable section documentation structure.
+ */
+interface AccountDisableDocumentationLinksInterface {
+    learnMore: string;
+}
+
 /**
  * Interface for the console documentation structure.
  */
@@ -622,6 +629,10 @@ export interface DocumentationLinksExtensionInterface {
      * Documentation links for manage section elements.
      */
     manage: {
+        /**
+         * Documentation links for account disable elements.
+         */
+        accountDisable: AccountDisableDocumentationLinksInterface;
         /**
          * Documentation links for account recovery elements.
          */

diff --git a/features/admin.server-configurations.v1/pages/account-disable-page.tsx b/features/admin.server-configurations.v1/pages/account-disable-page.tsx
@@ -21,7 +21,14 @@ import { AppConstants } from "@wso2is/admin.core.v1/constants/app-constants";
 import { history } from "@wso2is/admin.core.v1/helpers/history";
 import { AlertLevels, IdentifiableComponentInterface } from "@wso2is/core/models";
 import { addAlert } from "@wso2is/core/store";
-import { EmphasizedSegment, Hint, PageLayout } from "@wso2is/react-components";
+import {
+    ContentLoader,
+    DocumentationLink,
+    EmphasizedSegment,
+    Hint,
+    PageLayout,
+    useDocumentation
+} from "@wso2is/react-components";
 import { AxiosError } from "axios";
 import React, { FC, FormEvent, ReactElement, useEffect, useState } from "react";
 import { useTranslation } from "react-i18next";
@@ -53,6 +60,7 @@ export const AccountDisablePage: FC<AccountDisablePageInterface> = (
 
     const { t } = useTranslation();
     const dispatch: Dispatch = useDispatch();
+    const { getLink } = useDocumentation();
 
     const {
         data: accountDisableConnectorData,
@@ -189,8 +197,17 @@ export const AccountDisablePage: FC<AccountDisablePageInterface> = (
                 "accountDisableHandler.friendlyName") }
             pageTitle={ t("governanceConnectors:connectorCategories.accountManagement.connectors." +
                 "accountDisableHandler.friendlyName") }
-            description={ t("governanceConnectors:connectorCategories.accountManagement.connectors." +
-                "accountDisableHandler.description") }
+            description={
+                (<>
+                    { t("governanceConnectors:connectorCategories.accountManagement.connectors." +
+                        "accountDisableHandler.description") }
+                    <DocumentationLink
+                        link={ getLink("manage.accountDisable.learnMore") }
+                    >
+                        { t("common:learnMore") }
+                    </DocumentationLink>
+                </>)
+            }
             data-componentid={ `${ componentId }-page-layout` }
             backButton={ {
                 "data-testid": `${ componentId }-page-back-button`,
@@ -204,28 +221,36 @@ export const AccountDisablePage: FC<AccountDisablePageInterface> = (
         >
             <Grid className={ "mt-5" }>
                 <EmphasizedSegment className="form-wrapper" padded={ "very" }>
-                    <Checkbox
-                        ariaLabel={ t("governanceConnectors:connectorCategories." +
-                            "accountManagement.connectors.accountDisableHandler.properties." +
-                            "accountDisableHandlerEnable.label") }
-                        name="accountDisable"
-                        label={ t("governanceConnectors:connectorCategories." +
-                            "accountManagement.connectors.accountDisableHandler.properties." +
-                            "accountDisableHandlerEnable.label") }
-                        width={ 16 }
-                        data-componentid={
-                            `${componentId}-toggle` }
-                        toggle
-                        onChange={ (event: FormEvent<HTMLInputElement>, data: CheckboxProps) => {
-                            handleCheckboxToggle(data);
-                        } }
-                        checked={ isAccountDisableEnabled }
-                    />
-                    <Hint>
-                        { t("governanceConnectors:connectorCategories." +
-                            "accountManagement.connectors.accountDisableHandler.properties." +
-                            "accountDisableHandlerEnable.hint") }
-                    </Hint>
+                    {
+                        accountDisableFetchRequestLoading
+                            ? <ContentLoader />
+                            : (
+                                <>
+                                    <Checkbox
+                                        ariaLabel={ t("governanceConnectors:connectorCategories." +
+                                            "accountManagement.connectors.accountDisableHandler.properties." +
+                                            "accountDisableHandlerEnable.label") }
+                                        name="accountDisable"
+                                        label={ t("governanceConnectors:connectorCategories." +
+                                            "accountManagement.connectors.accountDisableHandler.properties." +
+                                            "accountDisableHandlerEnable.label") }
+                                        width={ 16 }
+                                        data-componentid={
+                                            `${componentId}-toggle` }
+                                        toggle
+                                        onChange={ (event: FormEvent<HTMLInputElement>, data: CheckboxProps) => {
+                                            handleCheckboxToggle(data);
+                                        } }
+                                        checked={ isAccountDisableEnabled }
+                                    />
+                                    <Hint>
+                                        { t("governanceConnectors:connectorCategories." +
+                                            "accountManagement.connectors.accountDisableHandler.properties." +
+                                            "accountDisableHandlerEnable.hint") }
+                                    </Hint>
+                                </>
+                            )
+                    }
                 </EmphasizedSegment>
             </Grid>
         </PageLayout>