CONSOLE-4407: Fix scrollbar flickering issue

- Remove `Alt+F1` a11y help shortcut hint since the shortcut no longer exists in monaco
- Fix long time bug where the commands in the command palette are bolded and underlined

Author: logonoff

dynamic-demo-plugin/package.json

@@ -15,13 +15,11 @@
   },
   "devDependencies": {
     "@openshift-console/dynamic-plugin-sdk": "file:../frontend/packages/console-dynamic-plugin-sdk/dist/core",
-    "@openshift-console/dynamic-plugin-sdk-internal": "file:../frontend/packages/console-dynamic-plugin-sdk/dist/internal",
     "@openshift-console/dynamic-plugin-sdk-webpack": "file:../frontend/packages/console-dynamic-plugin-sdk/dist/webpack",
     "@openshift-console/plugin-shared": "file:../frontend/packages/console-plugin-shared/dist",
     "@patternfly/react-core": "^6.2.0-prerelease.15",
     "@patternfly/react-icons": "^6.2.0-prerelease.2",
     "@patternfly/react-table": "^6.2.0-prerelease.16",
-    "@patternfly/react-topology": "6.1.0",
     "@types/react": "16.8.13",
     "@types/react-measure": "^2.0.6",
     "@types/react-router": "^5.1.20",

dynamic-demo-plugin/src/components/ExampleNamespacedPage.tsx

@@ -27,8 +27,8 @@ const NamespacePageContent = ({ namespace }: { namespace?: string }) => {
               grow={{ default: 'grow' }}
               direction={{ default: 'column' }}
             >
-              <h1>{t('Currently selected namespace')}</h1>
-              <h2>{namespace}</h2>
+              <Title headingLevel='h1'>{t('Currently selected namespace')}</Title>
+              <Title headingLevel='h2'>{namespace}</Title>
             </Flex>
           </CardBody>
         </Card>

dynamic-demo-plugin/src/components/Nav.tsx

@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { HorizontalNav } from '@openshift-console/dynamic-plugin-sdk';
 import { useTranslation } from 'react-i18next';
-import { PageSection } from '@patternfly/react-core';
+import { PageSection, Title } from '@patternfly/react-core';
 
 type Hero = {
   customData: {
@@ -13,15 +13,15 @@ const Thor: React.FC<Hero> = ( {customData} ) => {
   const { t } = useTranslation();
 
   return <PageSection>
-    <h1>{t('plugin__console-demo-plugin~Hello {{planet}}! I am Thor!',  { planet: customData.planet })}</h1>
+    <Title headingLevel='h1'>{t('plugin__console-demo-plugin~Hello {{planet}}! I am Thor!',  { planet: customData.planet })}</Title>
   </PageSection>
 };
 
 const Loki: React.FC<Hero> = ( {customData} ) => {
   const { t } = useTranslation();
 
   return <PageSection>
-    <h1>{t('plugin__console-demo-plugin~Hello {{planet}}! I am Loki!', { planet: customData.planet })}</h1>
+    <Title headingLevel='h1'>{t('plugin__console-demo-plugin~Hello {{planet}}! I am Loki!', { planet: customData.planet })}</Title>
     </PageSection>
 };
 

dynamic-demo-plugin/yarn.lock

@@ -1,5 +1,6 @@
 /* eslint-disable tsdoc/syntax */ // This file is written in JavaScript, so we use JSDoc here. TSDoc rules don't apply
 // @ts-check
+const { getActivePluginsModuleData } = require('@console/plugin-sdk/src/codegen/active-plugins');
 
 /**
  * Get the current Console active plugins virtual module information.
@@ -8,17 +9,17 @@
  *
  *
  * @param {object} options
- * @param {() => import('./packages/console-plugin-sdk/src/codegen/active-plugins').ActivePluginsModuleData} options.getModuleData
+ * @param {import('@console/plugin-sdk/src/codegen/plugin-resolver').PluginPackage[]} options.pluginPackages
  * @param {import('webpack').LoaderContext<any>} loaderContext
  *
  * @returns {{code: string}} Generated module source code.
  */
-const getActivePlugins = ({ getModuleData }, loaderContext) => {
+const getActivePlugins = ({ pluginPackages }, loaderContext) => {
   const {
     code,
     diagnostics: { errors, warnings },
     fileDependencies,
-  } = getModuleData();
+  } = getActivePluginsModuleData(pluginPackages);
   // eslint-disable-next-line no-console
   console.log(
     `Console active plugins virtual module code generated with ${errors.length} errors and ${warnings.length} warnings`,

frontend/get-active-plugins.js

@@ -133,7 +133,7 @@
   },
   "dependencies": {
     "@patternfly-5/patternfly": "npm:@patternfly/patternfly@5.4.2",
-    "@patternfly/patternfly": "^6.2.0-prerelease.2",
+    "@patternfly/patternfly": "^6.2.0-prerelease.3",
     "@patternfly/quickstarts": "^6.2.0-prerelease.4",
     "@patternfly/react-catalog-view-extension": "^6.1.0-prerelease.3",
     "@patternfly/react-charts": "^8.2.0-prerelease.13",
@@ -198,7 +198,7 @@
     "react-linkify": "^0.2.2",
     "react-measure": "^2.2.6",
     "react-modal": "^3.12.1",
-    "react-redux": "7.2.2",
+    "react-redux": "7.2.9",
     "react-router": "5.3.x",
     "react-router-dom": "5.3.x",
     "react-router-dom-v5-compat": "^6.11.2",
@@ -253,7 +253,6 @@
     "@types/react-helmet": "5.x",
     "@types/react-jsonschema-form": "^1.3.8",
     "@types/react-measure": "^2.0.6",
-    "@types/react-redux": "6.0.2",
     "@types/react-router": "^5.1.20",
     "@types/react-router-dom": "5.3.x",
     "@types/react-transition-group": "2.x",
@@ -342,7 +341,8 @@
     "@patternfly/react-icons": "^6.2.0-prerelease.2",
     "@patternfly/react-styles": "^6.2.0-prerelease.2",
     "@patternfly/react-table": "^6.2.0-prerelease.16",
-    "@patternfly/react-tokens": "^6.2.0-prerelease.2"
+    "@patternfly/react-tokens": "^6.2.0-prerelease.2",
+    "async": "^3.2.5"
   },
   "lint-staged": {
     "*.{js,jsx,ts,tsx,json,gql,graphql}": "eslint --color --fix"

frontend/package.json

@@ -465,6 +465,12 @@
       ]
     }
   },
+  {
+    "type": "console.flag/hookProvider",
+    "properties": {
+      "handler": { "$codeRef": "userPreferences.usePerspectivesAvailable" }
+    }
+  },
   {
     "type": "console.user-preference/group",
     "properties": {
@@ -527,6 +533,9 @@
         "component": { "$codeRef": "userPreferences.PreferredPerspectiveSelect" }
       },
       "insertAfter": "console.theme"
+    },
+    "flags": {
+      "required": ["FLAG_PERSPECTIVES_AVAILABLE"]
     }
   },
   {
@@ -646,7 +655,7 @@
       "perspective": "admin",
       "id": "home",
       "name": "%console-app~Home%",
-      "dataAttributes": { "data-quickstart-id": "qs-nav-home" }
+      "dataAttributes": { "data-quickstart-id": "qs-nav-home", "data-tour-id": "tour-home-nav" }
     }
   },
   {
@@ -665,7 +674,10 @@
       "perspective": "admin",
       "id": "workloads",
       "name": "%console-app~Workloads%",
-      "dataAttributes": { "data-quickstart-id": "qs-nav-workloads" },
+      "dataAttributes": {
+        "data-quickstart-id": "qs-nav-workloads",
+        "data-tour-id": "tour-workloads-nav"
+      },
       "insertAfter": "operators"
     }
   },
@@ -736,9 +748,6 @@
       "dataAttributes": {
         "data-quickstart-id": "qs-nav-monitoring"
       }
-    },
-    "flags": {
-      "required": ["PROMETHEUS", "MONITORING", "CAN_GET_NS"]
     }
   },
   {

frontend/packages/console-app/console-extensions.json

@@ -271,6 +271,17 @@
   "Access review rules": "Access review rules",
   "Incompatible file type": "Incompatible file type",
   "{{fileName}} cannot be uploaded. Only {{fileExtensions}} files are supported currently. Try another file.": "{{fileName}} cannot be uploaded. Only {{fileExtensions}} files are supported currently. Try another file.",
+  "Access our new quick starts where you can learn more about creating or deploying an application using OpenShift Developer Console. You can also restart this tour anytime here.": "Access our new quick starts where you can learn more about creating or deploying an application using OpenShift Developer Console. You can also restart this tour anytime here.",
+  "Set your individual console preferences including default views, language, import settings, and more.": "Set your individual console preferences including default views, language, import settings, and more.",
+  "Stay up-to-date with everything OpenShift on our <2>blog</2> or continue to learn more in our <6>documentation</6>.": "Stay up-to-date with everything OpenShift on our <2>blog</2> or continue to learn more in our <6>documentation</6>.",
+  "Welcome to the new OpenShift experience!": "Welcome to the new OpenShift experience!",
+  "Our new update with OpenShift 4.19 gives a more modern look to help enhance your experience and streamline your workflow, such as improved navigation and infrastructure. Want us to show you around?": "Our new update with OpenShift 4.19 gives a more modern look to help enhance your experience and streamline your workflow, such as improved navigation and infrastructure. Want us to show you around?",
+  "Here is where you can view all of your OpenShift enviroments, including your projects and inventory. You can also access APIs and software catalogs.": "Here is where you can view all of your OpenShift enviroments, including your projects and inventory. You can also access APIs and software catalogs.",
+  "Software Catalog": "Software Catalog",
+  "Add shared applications, services, event sources, or source-to-image builders to your project. Cluster administrators can customize the content made available in the catalog.": "Add shared applications, services, event sources, or source-to-image builders to your project. Cluster administrators can customize the content made available in the catalog.",
+  "Help": "Help",
+  "User Preferences": "User Preferences",
+  "You’re ready to go!": "You’re ready to go!",
   "Red Hat OpenShift Lightspeed": "Red Hat OpenShift Lightspeed",
   "Meet OpenShift Lightspeed": "Meet OpenShift Lightspeed",
   "Unlock possibilities and enhance productivity with the AI-powered assistant's expert guidance in your OpenShift web console.": "Unlock possibilities and enhance productivity with the AI-powered assistant's expert guidance in your OpenShift web console.",
@@ -596,7 +607,6 @@
   "Select a perspective": "Select a perspective",
   "Select an option": "Select an option",
   "User Preferences {{activeTab}}": "User Preferences {{activeTab}}",
-  "User Preferences": "User Preferences",
   "Set your individual preferences for the console experience. Any changes will be autosaved.": "Set your individual preferences for the console experience. Any changes will be autosaved.",
   "Only {{volumeMode}} volume mode is available for {{storageClass}} with {{accessMode}} access mode": "Only {{volumeMode}} volume mode is available for {{storageClass}} with {{accessMode}} access mode",
   "VolumeSnapshotClass with same provisioner as claim": "VolumeSnapshotClass with same provisioner as claim",

frontend/packages/console-app/locales/en/console-app.json

@@ -17,7 +17,6 @@
     "@console/knative-plugin": "0.0.0-fixed",
     "@console/local-storage-operator-plugin": "0.0.0-fixed",
     "@console/metal3-plugin": "0.0.0-fixed",
-    "@console/network-attachment-definition-plugin": "0.0.0-fixed",
     "@console/operator-lifecycle-manager": "0.0.0-fixed",
     "@console/operator-lifecycle-manager-v1": "0.0.0-fixed",
     "@console/patternfly": "0.0.0-fixed",
@@ -49,7 +48,6 @@
       "nodeStatus": "src/components/nodes/status",
       "nodeActions": "src/components/nodes/menu-actions.tsx",
       "oauthConfigDetailsPage": "src/components/oauth-config/OAuthConfigDetailsPage.tsx",
-      "multiNetworkFlag": "src/components/network-policies/multi-network-policy/multiNetworkFlag.ts",
       "consolePluginDescriptionDetail": "src/components/console-operator/ConsolePluginDescriptionDetail.tsx",
       "consolePluginVersionDetail": "src/components/console-operator/ConsolePluginVersionDetail.tsx",
       "consolePluginStatusDetail": "src/components/console-operator/ConsolePluginStatusDetail.tsx",

frontend/packages/console-app/package.json

@@ -1,21 +1,20 @@
 import * as React from 'react';
 import { AlertVariant } from '@patternfly/react-core';
+import { Map } from 'immutable';
 import { useTranslation } from 'react-i18next';
-// eslint-disable-next-line @typescript-eslint/ban-ts-comment
-// @ts-ignore: FIXME out-of-sync @types/react-redux version as new types cause many build errors
 import { useDispatch, useSelector } from 'react-redux';
 import {
   AdmissionWebhookWarning,
-  CoreState,
   getAdmissionWebhookWarnings,
   removeAdmissionWebhookWarning,
+  SDKStoreState,
 } from '@console/dynamic-plugin-sdk/src';
 import { documentationURLs, getDocumentationURL } from '@console/internal/components/utils';
 import { useToast } from '@console/shared/src';
 
 type UseAdmissionWebhookWarnings = () => Map<string, AdmissionWebhookWarning>;
 const useAdmissionWebhookWarnings: UseAdmissionWebhookWarnings = () =>
-  useSelector<CoreState, Map<string, AdmissionWebhookWarning>>(getAdmissionWebhookWarnings);
+  useSelector<SDKStoreState, Map<string, AdmissionWebhookWarning>>(getAdmissionWebhookWarnings);
 
 export const AdmissionWebhookWarningNotifications = () => {
   const { t } = useTranslation();