Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[WIP] Update React version to v19 #7280

Draft
wants to merge 1 commit into
base: master
Choose a base branch
from
+3,427 −2,392
Draft

[WIP] Update React version to v19 #7280

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
5 changes: 2 additions & 3 deletions apps/console/package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -118,12 +118,11 @@
"mustache": "^4.2.0",
"node-forge": "^0.10.0",
"rc-tree": "^4.0.0-beta.2",
"react": "^18.2.0",
"react-dom": "^18.2.0",
"react": "^19.0.0",
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The new update batching introduced with v18 caused some of the UIs in the Console to break (AFAIR, application protocols).

And we reverted to the legacy mode as a workaround: wso2/product-is#14912

Just FYI

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Thanks for the info. However, we won't be able to upgrade to v19 anytime soon, as most of our dependencies are not yet ready to support v19. We may hopefully be able to figure out a solution for this by the time we are about to upgrade :)

"react-dom": "^19.0.0",
"react-draggable": "^4.2.0",
"react-helmet": "^5.2.1",
"react-i18next": "^11.18.5",
"react-joyride": "^2.3.0",
"react-notification-system": "^0.4.0",
"react-redux": "^7.2.9",
"react-router-dom": "^4.3.1",
Expand Down
4 changes: 2 additions & 2 deletions apps/myaccount/package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -60,8 +60,8 @@
"path-browserify": "^1.0.1",
"postcss-loader": "^3.0.0",
"qrcode.react": "^1.0.0",
"react": "^18.2.0",
"react-dom": "^18.2.0",
"react": "^19.0.0",
"react-dom": "^19.0.0",
"react-helmet": "^5.2.1",
"react-i18next": "^11.18.5",
"react-notification-system": "^0.4.0",
Expand Down
4 changes: 2 additions & 2 deletions features/admin.actions.v1/package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -89,8 +89,8 @@
"typescript": "^4.6.4"
},
"peerDependencies": {
"react": "^18.2.0",
"react-dom": "^18.2.0",
"react": "^19.0.0",
"react-dom": "^19.0.0",
"react-router-dom": "^4.3.1"
},
"browserslist": [
Expand Down
4 changes: 2 additions & 2 deletions features/admin.administrators.v1/package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -75,8 +75,8 @@
"typescript": "^4.6.4"
},
"peerDependencies": {
"react": "^18.2.0",
"react-dom": "^18.2.0",
"react": "^19.0.0",
"react-dom": "^19.0.0",
"react-router-dom": "^4.3.1"
},
"browserslist": [
Expand Down
4 changes: 2 additions & 2 deletions features/admin.alternative-login-identifier.v1/package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -68,8 +68,8 @@
"typescript": "^4.6.4"
},
"peerDependencies": {
"react": "^18.2.0",
"react-dom": "^18.2.0",
"react": "^19.0.0",
"react-dom": "^19.0.0",
"react-router-dom": "^4.3.1"
},
"browserslist": [
Expand Down
4 changes: 2 additions & 2 deletions features/admin.api-resources.v1/package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -50,8 +50,8 @@
"typescript": "^4.6.4"
},
"peerDependencies": {
"react": "^18.2.0",
"react-dom": "^18.2.0",
"react": "^19.0.0",
"react-dom": "^19.0.0",
"react-router-dom": "^4.3.1"
},
"browserslist": [
Expand Down
4 changes: 2 additions & 2 deletions features/admin.api-resources.v2/package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -52,8 +52,8 @@
"typescript": "^4.6.4"
},
"peerDependencies": {
"react": "^18.2.0",
"react-dom": "^18.2.0",
"react": "^19.0.0",
"react-dom": "^19.0.0",
"react-router-dom": "^4.3.1"
},
"browserslist": [
Expand Down
2 changes: 1 addition & 1 deletion features/admin.application-roles.v1/package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -48,7 +48,7 @@
"typescript": "^4.6.4"
},
"peerDependencies": {
"react": "^18.2.0",
"react": "^19.0.0",
"react-dom": "^18.2.0"
},
"browserslist": [
Expand Down
4 changes: 2 additions & 2 deletions features/admin.application-templates.v1/package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -28,8 +28,8 @@
"typescript": "^4.6.4"
},
"peerDependencies": {
"react": "^18.2.0",
"react-dom": "^18.2.0",
"react": "^19.0.0",
"react-dom": "^19.0.0",
"react-router-dom": "^4.3.1"
},
"browserslist": [
Expand Down
184 changes: 2 additions & 182 deletions ...plications.v1/components/settings/sign-on-methods/script-based-flow/script-based-flow.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -39,7 +39,7 @@ import {
ELK_RISK_BASED_TEMPLATE_NAME
} from "@wso2is/admin.authentication-flow-builder.v1/constants/template-constants";
import useAuthenticationFlow from "@wso2is/admin.authentication-flow-builder.v1/hooks/use-authentication-flow";
import { AppState, AppUtils, EventPublisher, FeatureConfigInterface, getOperationIcons } from "@wso2is/admin.core.v1";
import { AppState, EventPublisher, FeatureConfigInterface, getOperationIcons } from "@wso2is/admin.core.v1";
import { FeatureStatusLabel } from "@wso2is/admin.feature-gate.v1/models/feature-status";
import { OrganizationType } from "@wso2is/admin.organizations.v1/constants";
import { OrganizationUtils } from "@wso2is/admin.organizations.v1/utils";
Expand All @@ -49,7 +49,7 @@ import { ADAPTIVE_SCRIPT_SECRETS } from "@wso2is/admin.secrets.v1/constants/secr
import { GetSecretListResponse, SecretModel } from "@wso2is/admin.secrets.v1/models/secret";
import { UIConstants } from "@wso2is/core/constants";
import { IdentityAppsApiException } from "@wso2is/core/exceptions";
import { AlertLevels, IdentifiableComponentInterface, StorageIdentityAppsSettingsInterface } from "@wso2is/core/models";
import { AlertLevels, IdentifiableComponentInterface } from "@wso2is/core/models";
import { addAlert } from "@wso2is/core/store";
import { StringUtils } from "@wso2is/core/utils";
import {
Expand All @@ -70,11 +70,7 @@ import {
import { AxiosError, AxiosResponse } from "axios";
import * as codemirror from "codemirror";
import beautify from "js-beautify";
import cloneDeep from "lodash-es/cloneDeep";
import get from "lodash-es/get";
import isEmpty from "lodash-es/isEmpty";
import kebabCase from "lodash-es/kebabCase";
import set from "lodash-es/set";
import React, {
ChangeEvent,
FunctionComponent,
Expand All @@ -85,7 +81,6 @@ import React, {
useState
} from "react";
import { Trans, useTranslation } from "react-i18next";
import Joyride, { CallBackProps, STATUS, Step } from "react-joyride";
import { useDispatch, useSelector } from "react-redux";
import { Dispatch } from "redux";
import { Checkbox, Icon, Input, Menu, Sidebar } from "semantic-ui-react";
Expand Down Expand Up @@ -628,142 +623,6 @@ export const ScriptBasedFlow: FunctionComponent<AdaptiveScriptsPropsInterface> =

};

/**
* Steps for the conditional authentication toggle tour.
*
*/
const conditionalAuthTourSteps: Array<Step> = [
{
content: (
<div className="tour-step">
<Heading bold as="h6">
{
t("applications:edit.sections.signOnMethod.sections." +
"authenticationFlow.sections.scriptBased.conditionalAuthTour.steps.0.heading")
}
</Heading>
<Text>
{
t("applications:edit.sections.signOnMethod.sections." +
"authenticationFlow.sections.scriptBased.conditionalAuthTour.steps.0.content.0")
}
</Text>
<Text>
<Trans
i18nKey={
"applications:edit.sections.signOnMethod.sections." +
"authenticationFlow.sections.scriptBased.conditionalAuthTour.steps.0.content.1"
}
>
Click on the <Code>Next</Code> button to learn about the process.
</Trans>
</Text>
</div>
),
disableBeacon: true,
placement: "top",
target: "[data-tourid=\"conditional-auth\"]"
},
{
content: (
<div className="tour-step">
<Heading bold as="h6">
{
t("applications:edit.sections.signOnMethod.sections." +
"authenticationFlow.sections.scriptBased.conditionalAuthTour.steps.1.heading")
}
</Heading>
<Text>
{
t("applications:edit.sections.signOnMethod.sections." +
"authenticationFlow.sections.scriptBased.conditionalAuthTour.steps.1.content.0")
}
</Text>
</div>
),
disableBeacon: true,
placement: "right",
target: "[data-tourid=\"add-authentication-options-button\"]"
},
{
content: (
<div className="tour-step">
<Heading bold as="h6">
{
t("applications:edit.sections.signOnMethod.sections." +
"authenticationFlow.sections.scriptBased.conditionalAuthTour.steps.2.heading")
}
</Heading>
<Text>
<Trans
i18nKey={
"applications:edit.sections.signOnMethod.sections." +
"authenticationFlow.sections.scriptBased.conditionalAuthTour.steps.2.content.0"
}
>
Click here if you need to add more steps to the flow.
Once you add a new step,<Code>executeStep(STEP_NUMBER);</Code> will appear on
the script editor.
</Trans>
</Text>
</div>
),
disableBeacon: true,
placement: "right",
target: "[data-tourid=\"add-new-step-button\"]"
}
];

/**
* Should the conditional auth tour open.
*
* @returns
*/
const shouldConditionalAuthTourOpen = (): boolean => {

if (!isConditionalAuthenticationEnabled) {
return false;
}

return getConditionalAuthTourViewedStatus() === false;
};

/**
* Renders the Conditional Auth tour.
*
* @returns
*/
const renderConditionalAuthTour = (): ReactElement => (
<Joyride
continuous
disableOverlay
showSkipButton
callback={ (data: CallBackProps) => {
// If the tour is `done` or `skipped`, set the viewed state in storage.
if ((data.status === STATUS.FINISHED) || (data.status === STATUS.SKIPPED)) {
persistConditionalAuthTourViewedStatus();
}
} }
run={ shouldConditionalAuthTourOpen() }
steps={ conditionalAuthTourSteps }
styles={ {
buttonClose: {
display: "none"
},
tooltipContent: {
paddingBottom: 1
}
} }
locale={ {
back: t("common:back"),
close: t("common:close"),
last: t("common:done"),
next: t("common:next"),
skip: t("common:skip")
} }
/>
);

/**
* This will be only called when user gives their consent for deletion.
* @see `SecretDeleteConfirmationModal`
Expand Down Expand Up @@ -985,44 +844,6 @@ export const ScriptBasedFlow: FunctionComponent<AdaptiveScriptsPropsInterface> =
);
};

/**
* Persist the Conditional Auth Tour seen status in Local Storage.
*
* @param status - Status to set.
*/
const persistConditionalAuthTourViewedStatus = (status: boolean = true): void => {

const userPreferences: StorageIdentityAppsSettingsInterface = AppUtils.getUserPreferences();

if (isEmpty(userPreferences)) {
return;
}

const newPref: StorageIdentityAppsSettingsInterface = cloneDeep(userPreferences);

set(newPref?.identityAppsSettings?.devPortal,
ApplicationManagementConstants.CONDITIONAL_AUTH_TOUR_STATUS_STORAGE_KEY, status);

AppUtils.setUserPreferences(newPref);
};

/**
* Check if the Conditional Auth Tour has already been seen by the user.
*
* @returns
*/
const getConditionalAuthTourViewedStatus = (): boolean => {

const userPreferences: StorageIdentityAppsSettingsInterface = AppUtils.getUserPreferences();

if (isEmpty(userPreferences)) {
return false;
}

return get(userPreferences?.identityAppsSettings?.devPortal,
ApplicationManagementConstants.CONDITIONAL_AUTH_TOUR_STATUS_STORAGE_KEY, false);
};

/**
* Renders API Documentation link.
*
Expand Down Expand Up @@ -1317,7 +1138,6 @@ export const ScriptBasedFlow: FunctionComponent<AdaptiveScriptsPropsInterface> =
</Text>
</div>
</div>
{ renderConditionalAuthTour() }
</>
) }
hideChevron={ true }
Expand Down
5 changes: 2 additions & 3 deletions features/admin.applications.v1/package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -55,7 +55,6 @@
"node-forge": "^0.10.0",
"react-helmet": "^5.2.1",
"react-i18next": "^11.18.5",
"react-joyride": "^2.3.0",
"react-redux": "^7.2.9",
"redux": "^4.0.4",
"semantic-ui-react": "^2.1.3",
Expand Down Expand Up @@ -87,8 +86,8 @@
"typescript": "^4.6.4"
},
"peerDependencies": {
"react": "^18.2.0",
"react-dom": "^18.2.0",
"react": "^19.0.0",
"react-dom": "^19.0.0",
"react-router-dom": "^4.3.1"
},
"browserslist": [
Expand Down
2 changes: 1 addition & 1 deletion features/admin.authentication-flow-builder.v1/package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -62,7 +62,7 @@
"typescript": "^4.6.4"
},
"peerDependencies": {
"react": "^18.2.0",
"react": "^19.0.0",
"react-dom": "^18.2.0"
},
"browserslist": [
Expand Down
4 changes: 2 additions & 2 deletions features/admin.authentication.v1/package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -41,8 +41,8 @@
},
"peerDependencies": {
"@asgardeo/auth-react": "^5.1.2",
"react": "^18.2.0",
"react-dom": "^18.2.0",
"react": "^19.0.0",
"react-dom": "^19.0.0",
"react-router-dom": "^4.3.1"
},
"browserslist": [
Expand Down
5 changes: 2 additions & 3 deletions features/admin.authorization.v1/package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -49,7 +49,6 @@
"react-draggable": "^4.2.0",
"react-helmet": "^5.2.1",
"react-i18next": "^11.18.5",
"react-joyride": "^2.3.0",
"react-notification-system": "^0.4.0",
"react-redux": "^7.2.9",
"reactflow": "^11.7.2",
Expand Down Expand Up @@ -131,8 +130,8 @@
"typescript": "^4.6.4"
},
"peerDependencies": {
"react": "^18.2.0",
"react-dom": "^18.2.0",
"react": "^19.0.0",
"react-dom": "^19.0.0",
"react-router-dom": "^4.3.1"
},
"browserslist": [
Expand Down
Loading
Loading