Merge pull request #6838 from brionmario/code-cleanup-2024-extensions…

…-myaccount

[🧹 UNIFICATION CLEANUP] Refactor SaaS My Account settings related code

.changeset/funny-peas-run.md

@@ -0,0 +1,8 @@
+---
+"@wso2is/admin.applications.v1": minor
+"@wso2is/admin.extensions.v1": minor
+"@wso2is/admin.core.v1": minor
+"@wso2is/console": minor
+---
+
+Refactor SaaS My Account settings related code

apps/console/src/configs/routes.tsx

@@ -757,68 +757,6 @@ export const getAppViewRoutes = (): RouteInterface[] => {
             protected: true,
             showOnSidePanel: false
         },
-        {
-            category: "extensions:manage.sidePanel.categories.AccountManagement",
-            children: [
-                {
-                    component: lazy(() =>
-                        import("@wso2is/admin.extensions.v1/components/" + "my-account/pages/my-account-edit")
-                    ),
-                    exact: true,
-                    icon: {
-                        icon: getSidePanelIcons().childIcon
-                    },
-                    id: "my-account-settings",
-                    name: "My Account Settings",
-                    path: AppConstants.getPaths().get("MY_ACCOUNT_EDIT"),
-                    protected: true,
-                    showOnSidePanel: false
-                }
-            ],
-            component: lazy(() => import("@wso2is/admin.extensions.v1/components/my-account/pages/" +
-                "my-account")),
-            exact: true,
-            icon: {
-                icon: import("@wso2is/admin.extensions.v1/assets/images/icons/self-service-portal-icon.svg")
-            },
-            id: "myAccount",
-            name: "Self-Service Portal",
-            order: 16,
-            path: AppConstants.getPaths().get("MY_ACCOUNT"),
-            protected: true,
-            showOnSidePanel: false
-        },
-        {
-            category: "extensions:manage.sidePanel.categories.AccountManagement",
-            children: [
-                {
-                    component: lazy(() =>
-                        import("@wso2is/admin.extensions.v1/components/" + "my-account/pages/my-account-edit")
-                    ),
-                    exact: true,
-                    icon: {
-                        icon: getSidePanelIcons().childIcon
-                    },
-                    id: "my-account-settings",
-                    name: "My Account Settings",
-                    path: AppConstants.getPaths().get("MY_ACCOUNT_EDIT"),
-                    protected: true,
-                    showOnSidePanel: false
-                }
-            ],
-            component: lazy(() => import("@wso2is/admin.extensions.v1/components/my-account/pages/" +
-                "my-account")),
-            exact: true,
-            icon: {
-                icon: import("@wso2is/admin.extensions.v1/assets/images/icons/self-service-portal-icon.svg")
-            },
-            id: "myAccount",
-            name: "Self-Service Portal",
-            order: 17,
-            path: AppConstants.getPaths().get("MY_ACCOUNT"),
-            protected: true,
-            showOnSidePanel: false
-        },
         {
             category: "extensions:manage.sidePanel.categories.AccountManagement",
             children: [

apps/console/src/public/deployment.config.json

@@ -313,8 +313,7 @@
             "applications": {
                 "disabledFeatures": [
                     "applications.loginFlow.ai",
-                    "applications.loginFlow.legacyEditor",
-                    "applications.myaccount.saasMyaccountSettings"
+                    "applications.loginFlow.legacyEditor"
                 ],
                 "enabled": true,
                 "scopes": {

features/admin.applications.v1/components/edit-application.tsx

@@ -37,7 +37,6 @@ import {
 } from "@wso2is/admin.core.v1";
 import useUIConfig from "@wso2is/admin.core.v1/hooks/use-ui-configs";
 import { ApplicationTabIDs, applicationConfig } from "@wso2is/admin.extensions.v1";
-import { MyAccountOverview } from "@wso2is/admin.extensions.v1/configs/components/my-account-overview";
 import AILoginFlowProvider from "@wso2is/admin.login-flow.ai.v1/providers/ai-login-flow-provider";
 import { OrganizationType } from "@wso2is/admin.organizations.v1/constants";
 import { useGetCurrentOrganizationType } from "@wso2is/admin.organizations.v1/hooks/use-get-organization-type";
@@ -64,6 +63,7 @@ import { useDispatch, useSelector } from "react-redux";
 import { Dispatch } from "redux";
 import { CheckboxProps, Divider, Form, Grid, Menu, TabProps } from "semantic-ui-react";
 import { InboundProtocolsMeta } from "./meta";
+import MyAccountOverview from "./my-account/my-account-overview";
 import {
     AccessConfiguration,
     AdvancedSettings,

features/admin.extensions.v1/configs/components/my-account-overview.tsx → features/admin.applications.v1/components/my-account/my-account-overview.tsx

@@ -33,15 +33,20 @@ import React, { FunctionComponent, ReactElement } from "react";
 import { Trans, useTranslation } from "react-i18next";
 import { useSelector } from "react-redux";
 
-export const MyAccountOverview: FunctionComponent<IdentifiableComponentInterface> = (
-    props: IdentifiableComponentInterface
-): ReactElement => {
-    const {
-        ["data-componentid"]: componentId
-    } = props;
+export type MyAccountOverviewPropsInterface = IdentifiableComponentInterface;
 
-    const consumerAccountURL: string = useSelector((state: AppState) =>
-        state?.config?.deployment?.accountApp?.tenantQualifiedPath);
+/**
+ * Component to display in the General tab of the My Account application's edit page.
+ *
+ * @param props - Props injected to the component.
+ * @returns My Account general tab component.
+ */
+const MyAccountOverview: FunctionComponent<MyAccountOverviewPropsInterface> = ({
+    ["data-componentid"]: componentId = "my-account-overview"
+}: MyAccountOverviewPropsInterface): ReactElement => {
+    const consumerAccountURL: string = useSelector((state: AppState) => {
+        return state?.config?.deployment?.accountApp?.tenantQualifiedPath;
+    });
     const { t } = useTranslation();
     const { getLink } = useDocumentation();
 
@@ -107,9 +112,4 @@ export const MyAccountOverview: FunctionComponent<IdentifiableComponentInterface
     );
 };
 
-/**
- * Default proptypes for the my account overview component.
- */
-MyAccountOverview.defaultProps = {
-    "data-componentid": "my-account-overview"
-};
+export default MyAccountOverview;

features/admin.applications.v1/pages/applications.tsx

@@ -398,33 +398,22 @@ const ApplicationsPage: FunctionComponent<ApplicationsPageInterface> = (
      * Navigate to the my account edit page.
      */
     const navigateToMyAccountSettings = (): void => {
-        if (
-            applicationDisabledFeatures?.includes(
-                ApplicationManagementConstants.FEATURE_DICTIONARY.get("APPLICATION_MYACCOUNT_SAAS_SETTINGS")
-            )
-        ) {
-            if (strongAuth) {
-                history.push({
-                    pathname: AppConstants.getPaths().get("APPLICATION_EDIT").replace(
-                        ":id", myAccountApplicationData?.applications[0]?.id
-                    ),
-                    search: `?${ ApplicationManagementConstants.APP_STATE_STRONG_AUTH_PARAM_KEY }=${
-                        ApplicationManagementConstants.APP_STATE_STRONG_AUTH_PARAM_VALUE }`
-                });
-            } else {
-                history.push({
-                    pathname: AppConstants.getPaths().get("APPLICATION_EDIT").replace(
-                        ":id", myAccountApplicationData?.applications[0]?.id
-                    ),
-                    search: myAccountApplicationData?.applications[0]?.access === ApplicationAccessTypes.READ
-                        ? `?${ ApplicationManagementConstants.APP_READ_ONLY_STATE_URL_SEARCH_PARAM_KEY }=true`
-                        : ""
-                });
-            }
+        if (strongAuth) {
+            history.push({
+                pathname: AppConstants.getPaths().get("APPLICATION_EDIT").replace(
+                    ":id", myAccountApplicationData?.applications[0]?.id
+                ),
+                search: `?${ ApplicationManagementConstants.APP_STATE_STRONG_AUTH_PARAM_KEY }=${
+                    ApplicationManagementConstants.APP_STATE_STRONG_AUTH_PARAM_VALUE }`
+            });
         } else {
             history.push({
-                pathname: AppConstants.getPaths().get("MY_ACCOUNT_EDIT"),
-                state: ApplicationManagementConstants.APPLICATION_STATE
+                pathname: AppConstants.getPaths().get("APPLICATION_EDIT").replace(
+                    ":id", myAccountApplicationData?.applications[0]?.id
+                ),
+                search: myAccountApplicationData?.applications[0]?.access === ApplicationAccessTypes.READ
+                    ? `?${ ApplicationManagementConstants.APP_READ_ONLY_STATE_URL_SEARCH_PARAM_KEY }=true`
+                    : ""
             });
         }
     };

features/admin.core.v1/constants/app-constants.ts

@@ -373,8 +373,6 @@ export class AppConstants {
             [ "ADMINISTRATORS", `${AppConstants.getAdminViewBasePath()}/administrators` ],
             [ "ADMINISTRATOR_EDIT", `${AppConstants.getAdminViewBasePath()}/administrators/:id` ],
             [ "ADMINISTRATOR_SETTINGS", `${AppConstants.getAdminViewBasePath()}/administrator-settings-edit` ],
-            [ "MY_ACCOUNT", `${AppConstants.getAdminViewBasePath()}/my-account` ],
-            [ "MY_ACCOUNT_EDIT", `${AppConstants.getAdminViewBasePath()}/edit-my-account` ],
             [ "VALIDATION_CONFIG", `${AppConstants.getAdminViewBasePath()}/validation-configuration` ],
             [ "VALIDATION_CONFIG_EDIT", `${AppConstants.getAdminViewBasePath()}/edit-validation-configuration` ],
             [ "ACCOUNT_LOGIN", `${AppConstants.getAdminViewBasePath()}/account-login` ],