multi: migrate all consumer imports to usePlatform()

Move 35 component and hook files from importing platform-switched
hooks directly from barrel files to destructuring them from
usePlatform(), preparing for barrel file cleanup.

Author: kingsleyzissou

src/Components/Blueprints/BlueprintDiffModal.tsx

@@ -10,7 +10,7 @@ import {
   ModalVariant,
 } from '@patternfly/react-core';
 
-import { useGetBlueprintQuery } from '@/store/api/backend';
+import { usePlatform } from '@/context/platform';
 import { selectSelectedBlueprintId } from '@/store/slices/blueprint';
 
 import { BuildImagesButton } from './BuildImagesButton';
@@ -31,6 +31,9 @@ const BlueprintDiffModal = ({
   isOpen,
   onClose,
 }: blueprintDiffProps) => {
+  const {
+    queries: { useGetBlueprintQuery },
+  } = usePlatform();
   const selectedBlueprintId = useAppSelector(selectSelectedBlueprintId);
 
   const { data: baseBlueprint } = useGetBlueprintQuery(

src/Components/Blueprints/BlueprintsPagination.tsx

@@ -3,10 +3,8 @@ import React from 'react';
 import { Pagination, PaginationVariant } from '@patternfly/react-core';
 import { OnSetPage } from '@patternfly/react-core/dist/esm/components/Pagination/Pagination';
 
-import {
-  GetBlueprintsApiArg,
-  useGetBlueprintsQuery,
-} from '@/store/api/backend';
+import { usePlatform } from '@/context/platform';
+import { GetBlueprintsApiArg } from '@/store/api/backend';
 import {
   selectBlueprintSearchInput,
   selectLimit,
@@ -18,6 +16,9 @@ import {
 import { useAppDispatch, useAppSelector } from '../../store/hooks';
 
 const BlueprintsPagination = () => {
+  const {
+    queries: { useGetBlueprintsQuery },
+  } = usePlatform();
   const blueprintSearchInput = useAppSelector(selectBlueprintSearchInput);
   const blueprintsOffset = useAppSelector(selectOffset) || 0;
   const blueprintsLimit = useAppSelector(selectLimit) || 10;

src/Components/Blueprints/BlueprintsSideBar.tsx

@@ -18,12 +18,8 @@ import { PlusCircleIcon, SearchIcon } from '@patternfly/react-icons';
 import { SVGIconProps } from '@patternfly/react-icons/dist/esm/createIcon';
 import useChrome from '@redhat-cloud-services/frontend-components/useChrome';
 
-import {
-  BlueprintItem,
-  GetBlueprintsApiArg,
-  imageBuilderApi,
-  useGetBlueprintsQuery,
-} from '@/store/api/backend';
+import { usePlatform } from '@/context/platform';
+import { BlueprintItem, GetBlueprintsApiArg } from '@/store/api/backend';
 import {
   selectBlueprintSearchInput,
   selectLimit,
@@ -57,6 +53,9 @@ type emptyBlueprintStateProps = {
 };
 
 const BlueprintsSidebar = () => {
+  const {
+    queries: { useGetBlueprintsQuery },
+  } = usePlatform();
   const { analytics, auth } = useChrome();
   const { userData } = useGetUser(auth);
   const isOnPremise = useAppSelector(selectIsOnPremise);
@@ -181,6 +180,9 @@ const BlueprintsSidebar = () => {
 };
 
 const BlueprintSearch = ({ blueprintsTotal }: blueprintSearchProps) => {
+  const {
+    api: { backendApi },
+  } = usePlatform();
   const blueprintSearchInput = useAppSelector(selectBlueprintSearchInput);
   const dispatch = useAppDispatch();
   const [localSearchValue, setLocalSearchValue] = useState(
@@ -190,7 +192,7 @@ const BlueprintSearch = ({ blueprintsTotal }: blueprintSearchProps) => {
 
   useEffect(() => {
     dispatch(setBlueprintsOffset(0));
-    dispatch(imageBuilderApi.util.invalidateTags([{ type: 'Blueprints' }]));
+    dispatch(backendApi.util.invalidateTags([{ type: 'Blueprints' }]));
     dispatch(
       setBlueprintSearchInput(
         debouncedSearchValue.length > 0 ? debouncedSearchValue : undefined,

src/Components/Blueprints/BuildImagesButton.tsx

@@ -18,7 +18,8 @@ import { MenuToggleElement } from '@patternfly/react-core/dist/esm/components/Me
 import useChrome from '@redhat-cloud-services/frontend-components/useChrome';
 import { skipToken } from '@reduxjs/toolkit/query';
 
-import { ImageTypes, useGetBlueprintQuery } from '@/store/api/backend';
+import { usePlatform } from '@/context/platform';
+import { ImageTypes } from '@/store/api/backend';
 import { selectSelectedBlueprintId } from '@/store/slices/blueprint';
 import { selectIsOnPremise } from '@/store/slices/env';
 
@@ -35,6 +36,9 @@ type BuildImagesButtonPropTypes = {
 };
 
 export const BuildImagesButton = ({ children }: BuildImagesButtonPropTypes) => {
+  const {
+    queries: { useGetBlueprintQuery },
+  } = usePlatform();
   const selectedBlueprintId = useAppSelector(selectSelectedBlueprintId);
   const [deselectedTargets, setDeselectedTargets] = useState<ImageTypes[]>([]);
   const { trigger: buildBlueprint, isLoading: imageBuildLoading } =

src/Components/Blueprints/DeleteBlueprintModal.tsx

@@ -10,11 +10,8 @@ import {
 } from '@patternfly/react-core';
 import useChrome from '@redhat-cloud-services/frontend-components/useChrome';
 
-import {
-  backendApi,
-  GetBlueprintsApiArg,
-  useGetBlueprintsQuery,
-} from '@/store/api/backend';
+import { usePlatform } from '@/context/platform';
+import { GetBlueprintsApiArg } from '@/store/api/backend';
 import {
   selectBlueprintSearchInput,
   selectLimit,
@@ -43,6 +40,10 @@ interface DeleteBlueprintModalProps {
 export const DeleteBlueprintModal: React.FunctionComponent<
   DeleteBlueprintModalProps
 > = ({ setShowDeleteModal, isOpen }: DeleteBlueprintModalProps) => {
+  const {
+    queries: { useGetBlueprintsQuery },
+    api: { backendApi },
+  } = usePlatform();
   const selectedBlueprintId = useAppSelector(selectSelectedBlueprintId);
   const blueprintSearchInput = useAppSelector(selectBlueprintSearchInput);
   const blueprintsOffset = useAppSelector(selectOffset) || PAGINATION_OFFSET;

src/Components/CreateImageWizard/steps/ImageOutput/components/ImageSourceSelect.tsx

@@ -19,10 +19,8 @@ import {
 import { SyncAltIcon } from '@patternfly/react-icons';
 
 import { RHEL_10_IMAGE_MODE_IMAGE } from '@/constants';
-import {
-  BootcDistributionItem,
-  useGetDistributionsQuery,
-} from '@/store/api/backend';
+import { usePlatform } from '@/context/platform';
+import { BootcDistributionItem } from '@/store/api/backend';
 import { Distributions } from '@/store/api/backend/hosted';
 import { useAppDispatch, useAppSelector } from '@/store/hooks';
 import { selectIsOnPremise } from '@/store/slices/env';
@@ -63,6 +61,9 @@ const InfoMessageContent = ({ source }: { source: string }) => {
 };
 
 const ImageSourceSelect = () => {
+  const {
+    queries: { useGetDistributionsQuery },
+  } = usePlatform();
   const dispatch = useAppDispatch();
   const isOnPremise = useAppSelector(selectIsOnPremise);
   const arch = useAppSelector(selectArchitecture);

src/Components/CreateImageWizard/steps/ImageOutput/components/TargetEnvironment.tsx

@@ -11,14 +11,10 @@ import {
   Tooltip,
 } from '@patternfly/react-core';
 
+import { usePlatform } from '@/context/platform';
 import { useTargetEnvironmentCategories } from '@/Hooks';
 import { rhsmApi } from '@/store/api';
-import {
-  BootcDistributionItem,
-  ImageTypes,
-  useGetArchitecturesQuery,
-  useGetDistributionsQuery,
-} from '@/store/api/backend';
+import { BootcDistributionItem, ImageTypes } from '@/store/api/backend';
 import { useCustomizationRestrictions } from '@/store/api/distributions';
 import { useAppDispatch, useAppSelector } from '@/store/hooks';
 import {
@@ -67,6 +63,9 @@ const createLabelWithTooltip = (
 };
 
 const TargetEnvironment = () => {
+  const {
+    queries: { useGetArchitecturesQuery, useGetDistributionsQuery },
+  } = usePlatform();
   const arch = useAppSelector(selectArchitecture);
   const environments = useAppSelector(selectImageTypes);
   const distribution = useAppSelector(selectDistribution);

src/Components/CreateImageWizard/steps/ImageOutput/tests/ImageSourceSelect.test.tsx

@@ -27,12 +27,19 @@ import ImageSourceSelect from '../components/ImageSourceSelect';
 const mockRefetch = vi.fn();
 const mockUseGetDistributionsQuery = vi.fn();
 
-vi.mock('@/store/api/backend', async (importOriginal) => {
-  const actual = await importOriginal<typeof import('@/store/api/backend')>();
+vi.mock('@/context/platform', async (importOriginal) => {
+  const actual = await importOriginal<typeof import('@/context/platform')>();
+  const { mockPlatform } = await import('@/context/platform/tests/mocks');
   return {
     ...actual,
-    useGetDistributionsQuery: (...args: unknown[]) =>
-      mockUseGetDistributionsQuery(...args),
+    usePlatform: () => ({
+      ...mockPlatform,
+      queries: {
+        ...mockPlatform.queries,
+        useGetDistributionsQuery: (...args: unknown[]) =>
+          mockUseGetDistributionsQuery(...args),
+      },
+    }),
   };
 });
 

src/Components/CreateImageWizard/steps/Kernel/components/KernelArguments.tsx

@@ -5,7 +5,7 @@ import { FormGroup, HelperText, HelperTextItem } from '@patternfly/react-core';
 import LabelInput from '@/Components/CreateImageWizard/LabelInput';
 import { useKernelValidation } from '@/Components/CreateImageWizard/utilities/useValidation';
 import { isKernelArgumentValid } from '@/Components/CreateImageWizard/validators';
-import { useGetOscapCustomizationsQuery } from '@/store/api/backend';
+import { usePlatform } from '@/context/platform';
 import { useAppSelector } from '@/store/hooks';
 import {
   addKernelArg,
@@ -16,6 +16,9 @@ import {
 } from '@/store/slices/wizard';
 
 const KernelArguments = () => {
+  const {
+    queries: { useGetOscapCustomizationsQuery },
+  } = usePlatform();
   const kernelAppend = useAppSelector(selectKernel).append;
 
   const stepValidation = useKernelValidation();

src/Components/CreateImageWizard/steps/Locale/index.tsx

@@ -3,7 +3,7 @@ import React, { useMemo } from 'react';
 import { Content, Spinner, Title } from '@patternfly/react-core';
 
 import { CustomizationLabels } from '@/Components/sharedComponents/CustomizationLabels';
-import { useGetArchitecturesQuery } from '@/store/api/backend';
+import { usePlatform } from '@/context/platform';
 import { useSearchLanguagePacks } from '@/store/api/contentSources';
 import { useAppSelector } from '@/store/hooks';
 import {
@@ -17,6 +17,9 @@ import KeyboardDropDown from './components/KeyboardDropDown';
 import LanguagesDropDown from './components/LanguagesDropDown';
 
 const LocaleStep = () => {
+  const {
+    queries: { useGetArchitecturesQuery },
+  } = usePlatform();
   const distribution = useAppSelector(selectDistribution);
   const arch = useAppSelector(selectArchitecture);
   const candidateLangpacks = useAppSelector(selectLocaleLangpackCandidates);