OCPBUGS-36678: Add useQuickStartContext hook and expose it via dynamic plugin API

[vojtechszocs]

Problem

When working with React contexts in Console frontend and its dynamic plugins, the context object passed to React.useContext hook must be identical (i.e. === referentially equal) in order for the context value (hook result) to work properly across all plugins.

The exact use case here is importing QuickStartContext from @patternfly/quickstarts package.

From a plugin's perspective, unless @patternfly/quickstarts is marked as a shared module, that plugin will always use its own "copy" of @patternfly/quickstarts module(s) during its webpack build. This behavior is normal and expected; code not shared between the host application and its plugins can be loaded multiple times in possibly different versions.

The problem arises when some objects, like QuickStartContext mentioned above, must be referentially equal in order for plugin to properly interoperate with the host application.

❗ If a plugin uses @openshift-console/dynamic-plugin-sdk-webpack version that includes #13992 and that plugin also uses PatternFly 5 or higher, @patternfly/quickstarts will not be treated as a shared module. This is because Console provided PatternFly shared modules are limited to PF 4 implementation for backwards compatibility reasons. Plugins using PatternFly 5 or higher will share PF modules between themselves via dynamic modules #13521.

Solution

Add new React hook useQuickStartContext and expose it via @openshift-console/dynamic-plugin-sdk package.

// Plugin code, before:
import { QuickStartContext, QuickStartContextValues } from '@patternfly/quickstarts';
// ..
const { setActiveQuickStart } = useContext<QuickStartContextValues>(QuickStartContext);

// Plugin code, updated (*):
import { useQuickStartContext } from '@openshift-console/dynamic-plugin-sdk';
// ..
const { setActiveQuickStart } = useQuickStartContext();

(*) Requires that we publish a new version of @openshift-console/dynamic-plugin-sdk package with this change included.

Notes

Console already has withQuickStartContext React utility that injects quickStartContext prop into the wrapped component. The value of quickStartContext prop is the context value retrieved via React.useContext(QuickStartContext) which means the prop name is misleading and we should improve it at some point.

@rhamilto @TheRealJon The above mentioned withQuickStartContext utility seems to be unused in Console frontend and not exposed via dynamic plugin API. I'd suggest removing it, do you have any thoughts or objections?

[openshift-ci-robot]

@vojtechszocs: This pull request references Jira Issue OCPBUGS-36678, which is invalid:

• expected the bug to target the "4.17.0" version, but no target version was set

Comment /jira refresh to re-evaluate validity if changes to the Jira bug are made, or edit the title of this pull request to link to a different bug.

The bug has been updated to refer to the pull request using the external bug tracker.

Details

In response to this:

Problem

When working with React contexts in Console frontend and its dynamic plugins, the context object passed to React.useContext hook must be identical (i.e. === referentially equal) in order for the context value (hook result) to work properly across all plugins.

The exact use case here is importing QuickStartContext from @patternfly/quickstarts package.

From a plugin's perspective, unless @patternfly/quickstarts is marked as a shared module, that plugin will always use its own "copy" of @patternfly/quickstarts module(s) during its webpack build. This behavior is normal and expected; code not shared between the host application and its plugins can be loaded multiple times in possibly different versions.

The problem arises when some objects, like QuickStartContext mentioned above, must be referentially equal in order for plugin to properly interoperate with the host application.

❗ If a plugin uses @openshift-console/dynamic-plugin-sdk-webpack version that includes #13992 and that plugin also uses PatternFly 5 or higher, @patternfly/quickstarts will not be treated as a shared module. This is because Console provided PatternFly shared modules are limited to PF 4 implementation for backwards compatibility reasons. Plugins using PatternFly 5 or higher will share PF modules between themselves via dynamic modules #13521.

Solution

Add new React hook useQuickStartContext and expose it via @openshift-console/dynamic-plugin-sdk package.

// Plugin code, before:
import { QuickStartContext, QuickStartContextValues } from '@patternfly/quickstarts';
// ..
const { setActiveQuickStart } = useContext<QuickStartContextValues>(QuickStartContext);

// Plugin code, updated (*):
import { useQuickStartContext } from '@openshift-console/dynamic-plugin-sdk';
// ..
const { setActiveQuickStart } = useQuickStartContext();

(*) Requires that we publish a new version of @openshift-console/dynamic-plugin-sdk package with this change included.

Notes

Console already has withQuickStartContext React utility that injects quickStartContext prop into the wrapped component. The value of quickStartContext prop is the context value retrieved via React.useContext(QuickStartContext) which means the prop name is misleading and we should improve it at some point.

@rhamilto @TheRealJon The above mentioned withQuickStartContext utility seems to be unused in Console frontend and not exposed via dynamic plugin API. I'd suggest removing it, do you have any thoughts or objections?

Instructions for interacting with me using PR comments are available here. If you have questions or suggestions related to my behavior, please file an issue against the openshift-eng/jira-lifecycle-plugin repository.

[rhamilto]

@rhamilto @TheRealJon The above mentioned withQuickStartContext utility seems to be unused in Console frontend and not exposed via dynamic plugin API. I'd suggest removing it, do you have any thoughts or objections?

No objections if it unused, but we probably need to deprecate first.

[jhadvig]

/jira refresh

[openshift-ci-robot]

@jhadvig: This pull request references Jira Issue OCPBUGS-36678, which is valid. The bug has been moved to the POST state.

3 validation(s) were run on this bug

• bug is open, matching expected state (open)
• bug target version (4.17.0) matches configured target version for branch (4.17.0)
• bug is in the state ASSIGNED, which is one of the valid states (NEW, ASSIGNED, POST)

Requesting review from QA contact:
/cc @yapei

Details

In response to this:

/jira refresh

Instructions for interacting with me using PR comments are available here. If you have questions or suggestions related to my behavior, please file an issue against the openshift-eng/jira-lifecycle-plugin repository.

[rhamilto]

/lgtm

[vojtechszocs]

Forgot to add API docs change, I'll update the PR.

[rhamilto]

/lgtm
/label tide/merge-method-squash

[openshift-ci]

[APPROVALNOTIFIER] This PR is APPROVED

This pull-request has been approved by: rhamilto, vojtechszocs

The full list of commands accepted by this bot can be found here.

The pull request process is described here

Details

Needs approval from an approver in each of these files:

• frontend/OWNERS [rhamilto,vojtechszocs]

Approvers can indicate their approval by writing /approve in a comment
Approvers can cancel approval by writing /approve cancel in a comment

[vojtechszocs]

/retest

[rhamilto]

/label acknowledge-critical-fixes-only

[openshift-ci]

@vojtechszocs: all tests passed!

Full PR test history. Your PR dashboard.

Details

Instructions for interacting with me using PR comments are available here. If you have questions or suggestions related to my behavior, please file an issue against the kubernetes-sigs/prow repository. I understand the commands that are listed here.

[openshift-ci-robot]

@vojtechszocs: Jira Issue OCPBUGS-36678: All pull requests linked via external trackers have merged:

• openshift/console#14055

Jira Issue OCPBUGS-36678 has been moved to the MODIFIED state.

Details

In response to this:

Problem

When working with React contexts in Console frontend and its dynamic plugins, the context object passed to React.useContext hook must be identical (i.e. === referentially equal) in order for the context value (hook result) to work properly across all plugins.

The exact use case here is importing QuickStartContext from @patternfly/quickstarts package.

From a plugin's perspective, unless @patternfly/quickstarts is marked as a shared module, that plugin will always use its own "copy" of @patternfly/quickstarts module(s) during its webpack build. This behavior is normal and expected; code not shared between the host application and its plugins can be loaded multiple times in possibly different versions.

The problem arises when some objects, like QuickStartContext mentioned above, must be referentially equal in order for plugin to properly interoperate with the host application.

❗ If a plugin uses @openshift-console/dynamic-plugin-sdk-webpack version that includes #13992 and that plugin also uses PatternFly 5 or higher, @patternfly/quickstarts will not be treated as a shared module. This is because Console provided PatternFly shared modules are limited to PF 4 implementation for backwards compatibility reasons. Plugins using PatternFly 5 or higher will share PF modules between themselves via dynamic modules #13521.

Solution

Add new React hook useQuickStartContext and expose it via @openshift-console/dynamic-plugin-sdk package.

// Plugin code, before:
import { QuickStartContext, QuickStartContextValues } from '@patternfly/quickstarts';
// ..
const { setActiveQuickStart } = useContext<QuickStartContextValues>(QuickStartContext);

// Plugin code, updated (*):
import { useQuickStartContext } from '@openshift-console/dynamic-plugin-sdk';
// ..
const { setActiveQuickStart } = useQuickStartContext();

(*) Requires that we publish a new version of @openshift-console/dynamic-plugin-sdk package with this change included.

Notes

Console already has withQuickStartContext React utility that injects quickStartContext prop into the wrapped component. The value of quickStartContext prop is the context value retrieved via React.useContext(QuickStartContext) which means the prop name is misleading and we should improve it at some point.

@rhamilto @TheRealJon The above mentioned withQuickStartContext utility seems to be unused in Console frontend and not exposed via dynamic plugin API. I'd suggest removing it, do you have any thoughts or objections?

Instructions for interacting with me using PR comments are available here. If you have questions or suggestions related to my behavior, please file an issue against the openshift-eng/jira-lifecycle-plugin repository.

[openshift-bot]

[ART PR BUILD NOTIFIER]

This PR has been included in build openshift-enterprise-console-container-v4.17.0-202407160240.p0.g7ba2bdc.assembly.stream.el9 for distgit openshift-enterprise-console.
All builds following this will include this PR.

[vojtechszocs]

/cherry-pick release-4.16

[openshift-cherrypick-robot]

@vojtechszocs: new pull request created: #14070

Details

In response to this:

/cherry-pick release-4.16

Instructions for interacting with me using PR comments are available here. If you have questions or suggestions related to my behavior, please file an issue against the kubernetes-sigs/prow repository.