ESLint: Use --fix with updated rules to order imports

This applies the updated sorting rules to the files by running `npm run lint:js:fix`

config/dev.webpack.config.js

@@ -1,7 +1,8 @@
 const { resolve } = require('path');
-const { DefinePlugin } = require('webpack');
-const { GitRevisionPlugin } = require('git-revision-webpack-plugin');
+
 const config = require('@redhat-cloud-services/frontend-components-config');
+const { GitRevisionPlugin } = require('git-revision-webpack-plugin');
+const { DefinePlugin } = require('webpack');
 
 const webpackProxy = {
   useProxy: true,

config/prod.webpack.config.js

@@ -1,7 +1,8 @@
 const { resolve } = require('path');
-const { DefinePlugin } = require('webpack');
-const { GitRevisionPlugin } = require('git-revision-webpack-plugin');
+
 const config = require('@redhat-cloud-services/frontend-components-config');
+const { GitRevisionPlugin } = require('git-revision-webpack-plugin');
+const { DefinePlugin } = require('webpack');
 const { config: webpackConfig, plugins } = config({
   rootFolder: resolve(__dirname, '../'),
   modules: ['image_builder'],

src/App.js

@@ -1,8 +1,9 @@
 import React, { useEffect } from 'react';
+
+import NotificationsPortal from '@redhat-cloud-services/frontend-components-notifications/NotificationPortal';
 import { useStore } from 'react-redux';
 import { useNavigate } from 'react-router-dom';
 import '@patternfly/patternfly/patternfly-addons.css';
-import NotificationsPortal from '@redhat-cloud-services/frontend-components-notifications/NotificationPortal';
 
 import { Router } from './Router';
 import { resolveRelPath } from './Utilities/path';

src/AppEntry.js

@@ -1,10 +1,11 @@
 import React from 'react';
-import { BrowserRouter as Router } from 'react-router-dom';
-import { Provider } from 'react-redux';
 
-import { getBaseName } from './Utilities/path';
+import { Provider } from 'react-redux';
+import { BrowserRouter as Router } from 'react-router-dom';
+
 import App from './App';
 import { store } from './store';
+import { getBaseName } from './Utilities/path';
 
 const ImageBuilder = () => (
   <Provider store={store}>

src/Components/CreateImageWizard/CreateImageWizard.js

@@ -1,8 +1,10 @@
 import React from 'react';
-import { useLocation, useNavigate } from 'react-router-dom';
+
 import componentTypes from '@data-driven-forms/react-form-renderer/component-types';
 import { addNotification } from '@redhat-cloud-services/frontend-components-notifications/redux';
 import { useDispatch } from 'react-redux';
+import { useLocation, useNavigate } from 'react-router-dom';
+
 import ImageCreator from './ImageCreator';
 import {
   awsTarget,
@@ -19,13 +21,14 @@ import {
   fileSystemConfigurationValidator,
   targetEnvironmentValidator,
 } from './validators';
-import { composeAdded } from '../../store/composesSlice';
-import DocumentationButton from '../sharedComponents/DocumentationButton';
+
 import './CreateImageWizard.scss';
 import api from '../../api';
 import { UNIT_GIB, UNIT_KIB, UNIT_MIB } from '../../constants';
+import { composeAdded } from '../../store/composesSlice';
 import isRhel from '../../Utilities/isRhel';
 import { resolveRelPath } from '../../Utilities/path';
+import DocumentationButton from '../sharedComponents/DocumentationButton';
 
 const handleKeyDown = (e, handleClose) => {
   if (e.key === 'Escape') {

src/Components/CreateImageWizard/ImageCreator.js

@@ -1,20 +1,22 @@
 import React from 'react';
-import FormRenderer from '@data-driven-forms/react-form-renderer/form-renderer';
-import Pf4FormTemplate from '@data-driven-forms/pf4-component-mapper/form-template';
+
 import { componentMapper } from '@data-driven-forms/pf4-component-mapper';
+import Pf4FormTemplate from '@data-driven-forms/pf4-component-mapper/form-template';
+import Select from '@data-driven-forms/pf4-component-mapper/select';
+import FormRenderer from '@data-driven-forms/react-form-renderer/form-renderer';
 import { Spinner } from '@patternfly/react-core';
 import PropTypes from 'prop-types';
-import Select from '@data-driven-forms/pf4-component-mapper/select';
-import Review from './formComponents/ReviewStep';
-import TargetEnvironment from './formComponents/TargetEnvironment';
+
+import ActivationKeys from './formComponents/ActivationKeys';
+import AzureAuthButton from './formComponents/AzureAuthButton';
+import CentOSAcknowledgement from './formComponents/CentOSAcknowledgement';
+import FileSystemConfigToggle from './formComponents/FileSystemConfigToggle';
+import FileSystemConfiguration from './formComponents/FileSystemConfiguration';
+import ImageOutputReleaseSelect from './formComponents/ImageOutputReleaseSelect';
 import Packages from './formComponents/Packages';
 import RadioWithPopover from './formComponents/RadioWithPopover';
-import AzureAuthButton from './formComponents/AzureAuthButton';
-import ActivationKeys from './formComponents/ActivationKeys';
-import FileSystemConfiguration from './formComponents/FileSystemConfiguration';
-import FileSystemConfigToggle from './formComponents/FileSystemConfigToggle';
-import ImageOutputReleaseSelect from './formComponents/ImageOutputReleaseSelect';
-import CentOSAcknowledgement from './formComponents/CentOSAcknowledgement';
+import Review from './formComponents/ReviewStep';
+import TargetEnvironment from './formComponents/TargetEnvironment';
 
 const ImageCreator = ({
   schema,

src/Components/CreateImageWizard/formComponents/ActivationKeyInformation.js

@@ -1,4 +1,6 @@
 import React, { useEffect, useState } from 'react';
+
+import { useFormApi } from '@data-driven-forms/react-form-renderer';
 import {
   Text,
   TextContent,
@@ -8,7 +10,6 @@ import {
   TextListVariants,
   TextVariants,
 } from '@patternfly/react-core';
-import { useFormApi } from '@data-driven-forms/react-form-renderer';
 import { Button, Popover } from '@patternfly/react-core';
 import { HelpIcon } from '@patternfly/react-icons';
 import {
@@ -19,6 +20,7 @@ import {
   Thead,
   Tr,
 } from '@patternfly/react-table';
+
 import api from '../../../api';
 
 const ActivationKeyInformation = () => {

src/Components/CreateImageWizard/formComponents/ActivationKeys.js

@@ -1,5 +1,7 @@
 import React, { useEffect, useState } from 'react';
-import PropTypes from 'prop-types';
+
+import useFieldApi from '@data-driven-forms/react-form-renderer/use-field-api';
+import useFormApi from '@data-driven-forms/react-form-renderer/use-form-api';
 import {
   FormGroup,
   Select,
@@ -7,8 +9,8 @@ import {
   SelectVariant,
   Spinner,
 } from '@patternfly/react-core';
-import useFormApi from '@data-driven-forms/react-form-renderer/use-form-api';
-import useFieldApi from '@data-driven-forms/react-form-renderer/use-field-api';
+import PropTypes from 'prop-types';
+
 import api from '../../../api';
 
 const ActivationKeys = ({ label, isRequired, ...props }) => {

src/Components/CreateImageWizard/formComponents/AzureAuthButton.js

@@ -1,6 +1,7 @@
 import React from 'react';
-import { Button, FormGroup } from '@patternfly/react-core';
+
 import useFormApi from '@data-driven-forms/react-form-renderer/use-form-api';
+import { Button, FormGroup } from '@patternfly/react-core';
 
 const AzureAuthButton = () => {
   const { getState } = useFormApi();

src/Components/CreateImageWizard/formComponents/CentOSAcknowledgement.js

@@ -1,4 +1,5 @@
 import React from 'react';
+
 import { Alert, Button } from '@patternfly/react-core';
 import { ExternalLinkAltIcon } from '@patternfly/react-icons';
 

src/Components/CreateImageWizard/formComponents/CustomButtons.js

@@ -1,7 +1,8 @@
 import React, { useContext, useState } from 'react';
-import { Button } from '@patternfly/react-core';
+
 import { FormSpy } from '@data-driven-forms/react-form-renderer';
 import WizardContext from '@data-driven-forms/react-form-renderer/wizard-context';
+import { Button } from '@patternfly/react-core';
 import PropTypes from 'prop-types';
 
 const CustomButtons = ({

src/Components/CreateImageWizard/formComponents/FileSystemConfigButtons.js

@@ -1,7 +1,8 @@
 import React, { useContext, useEffect, useState } from 'react';
+
 import { useFormApi } from '@data-driven-forms/react-form-renderer';
-import { Button } from '@patternfly/react-core';
 import WizardContext from '@data-driven-forms/react-form-renderer/wizard-context';
+import { Button } from '@patternfly/react-core';
 import PropTypes from 'prop-types';
 
 // FileSystemconfigButtons are defined separately to display errors inside of the button footer

src/Components/CreateImageWizard/formComponents/FileSystemConfigToggle.js

@@ -1,8 +1,8 @@
 import React, { useEffect, useState } from 'react';
-import { ToggleGroup, ToggleGroupItem } from '@patternfly/react-core';
 
-import useFormApi from '@data-driven-forms/react-form-renderer/use-form-api';
 import useFieldApi from '@data-driven-forms/react-form-renderer/use-field-api';
+import useFormApi from '@data-driven-forms/react-form-renderer/use-form-api';
+import { ToggleGroup, ToggleGroupItem } from '@patternfly/react-core';
 
 const FileSystemConfigToggle = ({ ...props }) => {
   const { change, getState } = useFormApi();

src/Components/CreateImageWizard/formComponents/FileSystemConfiguration.js

@@ -1,9 +1,8 @@
 import React, { useEffect, useRef, useState } from 'react';
-import {
-  HelpIcon,
-  MinusCircleIcon,
-  PlusCircleIcon,
-} from '@patternfly/react-icons';
+
+import { FormSpy } from '@data-driven-forms/react-form-renderer';
+import useFieldApi from '@data-driven-forms/react-form-renderer/use-field-api';
+import useFormApi from '@data-driven-forms/react-form-renderer/use-form-api';
 import {
   Alert,
   Button,
@@ -12,6 +11,12 @@ import {
   TextContent,
   TextVariants,
 } from '@patternfly/react-core';
+import {
+  HelpIcon,
+  MinusCircleIcon,
+  PlusCircleIcon,
+} from '@patternfly/react-icons';
+import styles from '@patternfly/react-styles/css/components/Table/table';
 import {
   TableComposable,
   Tbody,
@@ -20,14 +25,11 @@ import {
   Thead,
   Tr,
 } from '@patternfly/react-table';
-import styles from '@patternfly/react-styles/css/components/Table/table';
-import useFormApi from '@data-driven-forms/react-form-renderer/use-form-api';
-import useFieldApi from '@data-driven-forms/react-form-renderer/use-field-api';
 import { v4 as uuidv4 } from 'uuid';
 
-import { FormSpy } from '@data-driven-forms/react-form-renderer';
 import MountPoint from './MountPoint';
 import SizeUnit from './SizeUnit';
+
 import { UNIT_GIB } from '../../../constants';
 
 let initialRow = {

src/Components/CreateImageWizard/formComponents/ImageOutputReleaseSelect.js

@@ -1,13 +1,15 @@
 import React, { useState } from 'react';
-import PropTypes from 'prop-types';
+
+import useFieldApi from '@data-driven-forms/react-form-renderer/use-field-api';
+import useFormApi from '@data-driven-forms/react-form-renderer/use-form-api';
 import {
   FormGroup,
   Select,
   SelectOption,
   SelectVariant,
 } from '@patternfly/react-core';
-import useFormApi from '@data-driven-forms/react-form-renderer/use-form-api';
-import useFieldApi from '@data-driven-forms/react-form-renderer/use-field-api';
+import PropTypes from 'prop-types';
+
 import { RELEASES } from '../../../constants';
 import isRhel from '../../../Utilities/isRhel';
 

src/Components/CreateImageWizard/formComponents/MountPoint.js

@@ -1,12 +1,14 @@
-import path from 'path';
 import React, { useEffect, useState } from 'react';
-import PropTypes from 'prop-types';
+
+import path from 'path';
+
 import {
   Select,
   SelectOption,
   SelectVariant,
   TextInput,
 } from '@patternfly/react-core';
+import PropTypes from 'prop-types';
 
 const MountPoint = ({ ...props }) => {
   // check '/' last!

src/Components/CreateImageWizard/formComponents/Packages.js

@@ -1,7 +1,7 @@
 import React, { useCallback, useEffect, useRef, useState } from 'react';
-import useFormApi from '@data-driven-forms/react-form-renderer/use-form-api';
+
 import useFieldApi from '@data-driven-forms/react-form-renderer/use-field-api';
-import PropTypes from 'prop-types';
+import useFormApi from '@data-driven-forms/react-form-renderer/use-form-api';
 import {
   DualListSelector,
   DualListSelectorControl,
@@ -18,6 +18,8 @@ import {
   AngleLeftIcon,
   AngleRightIcon,
 } from '@patternfly/react-icons';
+import PropTypes from 'prop-types';
+
 import api from '../../../api';
 
 // the fields isHidden and isSelected should not be included in the package list sent for image creation

src/Components/CreateImageWizard/formComponents/RadioWithPopover.js

@@ -1,4 +1,5 @@
 import React, { useRef } from 'react';
+
 import Radio from '@data-driven-forms/pf4-component-mapper/radio';
 import PropTypes from 'prop-types';
 

src/Components/CreateImageWizard/formComponents/ReviewStep.js

@@ -1,5 +1,6 @@
 import React, { useEffect, useState } from 'react';
-import PropTypes from 'prop-types';
+
+import useFormApi from '@data-driven-forms/react-form-renderer/use-form-api';
 import {
   Button,
   DescriptionList,
@@ -21,6 +22,7 @@ import {
   TextListVariants,
   TextVariants,
 } from '@patternfly/react-core';
+import { HelpIcon } from '@patternfly/react-icons';
 import {
   TableComposable,
   Tbody,
@@ -29,12 +31,13 @@ import {
   Thead,
   Tr,
 } from '@patternfly/react-table';
-import { HelpIcon } from '@patternfly/react-icons';
-import useFormApi from '@data-driven-forms/react-form-renderer/use-form-api';
+import PropTypes from 'prop-types';
+
 import ActivationKeyInformation from './ActivationKeyInformation';
-import { googleAccType } from '../steps/googleCloud';
+
 import { RELEASES, UNIT_GIB, UNIT_MIB } from '../../../constants';
 import isRhel from '../../../Utilities/isRhel';
+import { googleAccType } from '../steps/googleCloud';
 
 const FSReviewTable = ({ ...props }) => {
   return (

src/Components/CreateImageWizard/formComponents/SizeUnit.js

@@ -1,11 +1,12 @@
 import React, { useEffect, useState } from 'react';
-import PropTypes from 'prop-types';
+
 import {
   Select,
   SelectOption,
   SelectVariant,
   TextInput,
 } from '@patternfly/react-core';
+import PropTypes from 'prop-types';
 
 import { UNIT_GIB, UNIT_KIB, UNIT_MIB } from '../../../constants';
 

src/Components/CreateImageWizard/formComponents/TargetEnvironment.js

@@ -1,7 +1,7 @@
 import React, { useEffect, useState } from 'react';
-import PropTypes from 'prop-types';
-import useFormApi from '@data-driven-forms/react-form-renderer/use-form-api';
+
 import useFieldApi from '@data-driven-forms/react-form-renderer/use-field-api';
+import useFormApi from '@data-driven-forms/react-form-renderer/use-form-api';
 import {
   Checkbox,
   FormGroup,
@@ -9,6 +9,7 @@ import {
   TextVariants,
   Tile,
 } from '@patternfly/react-core';
+import PropTypes from 'prop-types';
 
 const TargetEnvironment = ({ label, isRequired, ...props }) => {
   const { getState, change } = useFormApi();

src/Components/CreateImageWizard/steps/aws.js

@@ -1,9 +1,12 @@
 import React from 'react';
+
 import componentTypes from '@data-driven-forms/react-form-renderer/component-types';
 import validatorTypes from '@data-driven-forms/react-form-renderer/validator-types';
 import { HelperText, HelperTextItem, Title } from '@patternfly/react-core';
+
 import nextStepMapper from './imageOutputStepMapper';
 import StepTemplate from './stepTemplate';
+
 import { DEFAULT_AWS_REGION } from '../../../constants';
 import CustomButtons from '../formComponents/CustomButtons';
 

src/Components/CreateImageWizard/steps/fileSystemConfiguration.js

@@ -1,8 +1,11 @@
 import React from 'react';
+
 import componentTypes from '@data-driven-forms/react-form-renderer/component-types';
 import validatorTypes from '@data-driven-forms/react-form-renderer/validator-types';
 import { Text } from '@patternfly/react-core';
+
 import StepTemplate from './stepTemplate';
+
 import FileSystemConfigButtons from '../formComponents/FileSystemConfigButtons';
 
 export default {

src/Components/CreateImageWizard/steps/googleCloud.js

@@ -1,7 +1,7 @@
 import React from 'react';
+
 import componentTypes from '@data-driven-forms/react-form-renderer/component-types';
 import validatorTypes from '@data-driven-forms/react-form-renderer/validator-types';
-import { HelpIcon } from '@patternfly/react-icons';
 import {
   Button,
   Popover,
@@ -11,9 +11,12 @@ import {
   TextListItem,
   Title,
 } from '@patternfly/react-core';
+import { HelpIcon } from '@patternfly/react-icons';
 import PropTypes from 'prop-types';
+
 import nextStepMapper from './imageOutputStepMapper';
 import StepTemplate from './stepTemplate';
+
 import CustomButtons from '../formComponents/CustomButtons';
 
 export const googleAccType = {

src/Components/CreateImageWizard/steps/imageName.js

@@ -1,7 +1,10 @@
 import React from 'react';
+
 import componentTypes from '@data-driven-forms/react-form-renderer/component-types';
 import validatorTypes from '@data-driven-forms/react-form-renderer/validator-types';
+
 import StepTemplate from './stepTemplate';
+
 import CustomButtons from '../formComponents/CustomButtons';
 
 export default {

src/Components/CreateImageWizard/steps/imageOutput.js

@@ -1,9 +1,12 @@
 import React from 'react';
+
 import componentTypes from '@data-driven-forms/react-form-renderer/component-types';
 import validatorTypes from '@data-driven-forms/react-form-renderer/validator-types';
 import { Text } from '@patternfly/react-core';
+
 import nextStepMapper from './imageOutputStepMapper';
 import StepTemplate from './stepTemplate';
+
 import { RHEL_9 } from '../../../constants.js';
 import DocumentationButton from '../../sharedComponents/DocumentationButton';
 import CustomButtons from '../formComponents/CustomButtons';

src/Components/CreateImageWizard/steps/msAzure.js

@@ -1,10 +1,13 @@
 import React from 'react';
+
 import componentTypes from '@data-driven-forms/react-form-renderer/component-types';
 import validatorTypes from '@data-driven-forms/react-form-renderer/validator-types';
 import { Button, Text, TextContent, Title } from '@patternfly/react-core';
 import { ExternalLinkAltIcon } from '@patternfly/react-icons';
+
 import nextStepMapper from './imageOutputStepMapper';
 import StepTemplate from './stepTemplate';
+
 import CustomButtons from '../formComponents/CustomButtons';
 
 export default {

src/Components/CreateImageWizard/steps/packages.js

@@ -1,7 +1,10 @@
 import React from 'react';
+
 import componentTypes from '@data-driven-forms/react-form-renderer/component-types';
 import { Text } from '@patternfly/react-core';
+
 import StepTemplate from './stepTemplate';
+
 import CustomButtons from '../formComponents/CustomButtons';
 
 export default {

src/Components/CreateImageWizard/steps/registration.js

@@ -1,4 +1,5 @@
 import React from 'react';
+
 import componentTypes from '@data-driven-forms/react-form-renderer/component-types';
 import validatorTypes from '@data-driven-forms/react-form-renderer/validator-types';
 import {
@@ -9,7 +10,9 @@ import {
   TextVariants,
 } from '@patternfly/react-core';
 import { ExternalLinkAltIcon, HelpIcon } from '@patternfly/react-icons';
+
 import StepTemplate from './stepTemplate';
+
 import CustomButtons from '../formComponents/CustomButtons';
 
 const PopoverActivation = () => {

src/Components/CreateImageWizard/steps/review.js

@@ -1,4 +1,5 @@
 import StepTemplate from './stepTemplate';
+
 import CustomButtons from '../formComponents/CustomButtons';
 
 export default {

src/Components/CreateImageWizard/steps/stepTemplate.js

@@ -1,6 +1,7 @@
 import React from 'react';
-import PropTypes from 'prop-types';
+
 import { Title } from '@patternfly/react-core';
+import PropTypes from 'prop-types';
 
 const StepTemplate = ({
   id,

src/Components/ImagesTable/ClonesTable.js

@@ -1,5 +1,5 @@
 import React from 'react';
-import PropTypes from 'prop-types';
+
 import {
   TableComposable,
   Tbody,
@@ -8,9 +8,12 @@ import {
   Thead,
   Tr,
 } from '@patternfly/react-table';
+import PropTypes from 'prop-types';
 import { useSelector } from 'react-redux';
+
 import { ImageBuildStatus } from './ImageBuildStatus';
 import ImageLink from './ImageLink';
+
 import {
   selectClonesById,
   selectComposeById,

src/Components/ImagesTable/ImageBuildErrorDetails.js

@@ -1,6 +1,7 @@
 import React from 'react';
-import PropTypes from 'prop-types';
+
 import { Alert } from '@patternfly/react-core';
+import PropTypes from 'prop-types';
 
 const useGetErrorReason = (err) => {
   if (!err?.reason) {

src/Components/ImagesTable/ImageBuildStatus.js

@@ -1,5 +1,4 @@
 import React from 'react';
-import PropTypes from 'prop-types';
 
 import { Flex } from '@patternfly/react-core';
 import {
@@ -10,15 +9,16 @@ import {
   OffIcon,
   PendingIcon,
 } from '@patternfly/react-icons';
-
+import PropTypes from 'prop-types';
 import './ImageBuildStatus.scss';
 import { useSelector } from 'react-redux';
+
+import { AWS_S3_EXPIRATION_TIME_IN_HOURS } from '../../constants';
 import {
   selectImageById,
   selectImageStatusesById,
 } from '../../store/composesSlice';
 import { hoursToExpiration } from '../../Utilities/time';
-import { AWS_S3_EXPIRATION_TIME_IN_HOURS } from '../../constants';
 
 export const ImageBuildStatus = ({ imageId }) => {
   const image = useSelector((state) => selectImageById(state, imageId));

src/Components/ImagesTable/ImageLink.js

@@ -1,9 +1,12 @@
 import React, { Suspense, useState } from 'react';
-import PropTypes from 'prop-types';
+
 import { Button } from '@patternfly/react-core';
 import { useLoadModule, useScalprum } from '@scalprum/react-core';
+import PropTypes from 'prop-types';
 import { useSelector } from 'react-redux';
+
 import ImageLinkDirect from './ImageLinkDirect';
+
 import { selectImageById } from '../../store/composesSlice';
 import { selectComposeById } from '../../store/composesSlice';
 

src/Components/ImagesTable/ImageLinkDirect.js

@@ -1,7 +1,4 @@
 import React from 'react';
-import PropTypes from 'prop-types';
-import { useNavigate } from 'react-router-dom';
-import { useSelector } from 'react-redux';
 
 import {
   Button,
@@ -11,7 +8,12 @@ import {
   TextVariants,
 } from '@patternfly/react-core';
 import { ExternalLinkAltIcon } from '@patternfly/react-icons';
+import PropTypes from 'prop-types';
+import { useSelector } from 'react-redux';
+import { useNavigate } from 'react-router-dom';
+
 import { RegionsPopover } from './RegionsPopover';
+
 import { selectImageById } from '../../store/composesSlice';
 import { resolveRelPath } from '../../Utilities/path';
 

src/Components/ImagesTable/ImagesTable.js

@@ -1,17 +1,5 @@
-import PropTypes from 'prop-types';
 import React, { useEffect, useState } from 'react';
-import { useDispatch, useSelector } from 'react-redux';
-import { Link, useNavigate } from 'react-router-dom';
-import {
-  ActionsColumn,
-  ExpandableRowContent,
-  TableComposable,
-  Tbody,
-  Td,
-  Th,
-  Thead,
-  Tr,
-} from '@patternfly/react-table';
+
 import {
   EmptyState,
   EmptyStateBody,
@@ -26,21 +14,36 @@ import {
   ToolbarItem,
 } from '@patternfly/react-core';
 import { PlusCircleIcon } from '@patternfly/react-icons';
+import {
+  ActionsColumn,
+  ExpandableRowContent,
+  TableComposable,
+  Tbody,
+  Td,
+  Th,
+  Thead,
+  Tr,
+} from '@patternfly/react-table';
+import PropTypes from 'prop-types';
+import { useDispatch, useSelector } from 'react-redux';
+import { Link, useNavigate } from 'react-router-dom';
+
 import './ImagesTable.scss';
+import ClonesTable from './ClonesTable';
+import ErrorDetails from './ImageBuildErrorDetails';
 import { ImageBuildStatus } from './ImageBuildStatus';
+import ImageLink from './ImageLink';
 import Release from './Release';
 import Target from './Target';
-import ImageLink from './ImageLink';
-import ErrorDetails from './ImageBuildErrorDetails';
-import ClonesTable from './ClonesTable';
-import DocumentationButton from '../sharedComponents/DocumentationButton';
+
+import { AWS_S3_EXPIRATION_TIME_IN_HOURS } from '../../constants';
 import { fetchComposes, fetchComposeStatus } from '../../store/actions/actions';
 import { resolveRelPath } from '../../Utilities/path';
 import {
   hoursToExpiration,
   timestampToDisplayString,
 } from '../../Utilities/time';
-import { AWS_S3_EXPIRATION_TIME_IN_HOURS } from '../../constants';
+import DocumentationButton from '../sharedComponents/DocumentationButton';
 
 const ImagesTable = () => {
   const [page, setPage] = useState(1);

src/Components/ImagesTable/RegionsPopover.js

@@ -1,8 +1,10 @@
 import React, { useMemo } from 'react';
-import PropTypes from 'prop-types';
+
 import { Button, Popover } from '@patternfly/react-core';
-import { useSelector } from 'react-redux';
 import { createSelector } from '@reduxjs/toolkit';
+import PropTypes from 'prop-types';
+import { useSelector } from 'react-redux';
+
 import { selectComposeById, selectImagesById } from '../../store/composesSlice';
 
 export const selectRegions = createSelector(

src/Components/ImagesTable/Target.js

@@ -1,6 +1,8 @@
 import React from 'react';
+
 import PropTypes from 'prop-types';
 import { useSelector } from 'react-redux';
+
 import { selectComposeById } from '../../store/composesSlice';
 
 const Target = ({ composeId }) => {

src/Components/LandingPage/LandingPage.js

@@ -2,15 +2,14 @@
 
 import React, { Component } from 'react';
 
+import { Button, Popover, Text, TextContent } from '@patternfly/react-core';
+import { GithubIcon, HelpIcon } from '@patternfly/react-icons';
 // eslint-disable-next-line rulesdir/disallow-fec-relative-imports
 import {
   PageHeader,
   PageHeaderTitle,
 } from '@redhat-cloud-services/frontend-components';
 
-import { Button, Popover, Text, TextContent } from '@patternfly/react-core';
-import { GithubIcon, HelpIcon } from '@patternfly/react-icons';
-
 import ImagesTable from '../ImagesTable/ImagesTable';
 import './LandingPage.scss';
 import DocumentationButton from '../sharedComponents/DocumentationButton';

src/Components/ShareImageModal/RegionsSelect.js

@@ -1,6 +1,5 @@
 import React, { useState } from 'react';
-import PropTypes from 'prop-types';
-import { addNotification } from '@redhat-cloud-services/frontend-components-notifications/redux';
+
 import {
   ActionGroup,
   Button,
@@ -12,13 +11,16 @@ import {
   SelectVariant,
 } from '@patternfly/react-core';
 import { ExclamationCircleIcon, HelpIcon } from '@patternfly/react-icons';
+import { addNotification } from '@redhat-cloud-services/frontend-components-notifications/redux';
+import { createSelector } from '@reduxjs/toolkit';
+import PropTypes from 'prop-types';
 import { useDispatch, useSelector } from 'react-redux';
 import { useNavigate } from 'react-router-dom';
-import { createSelector } from '@reduxjs/toolkit';
-import { AWS_REGIONS } from '../../constants';
-import { selectClonesById, selectComposeById } from '../../store/composesSlice';
+
 import api from '../../api';
+import { AWS_REGIONS } from '../../constants';
 import { cloneAdded } from '../../store/clonesSlice';
+import { selectClonesById, selectComposeById } from '../../store/composesSlice';
 import { resolveRelPath } from '../../Utilities/path';
 
 export const selectRegionsToDisable = createSelector(

src/Components/ShareImageModal/ShareImageModal.js

@@ -1,7 +1,10 @@
 import React, { useState } from 'react';
+
 import { Modal } from '@patternfly/react-core';
 import { useLocation, useNavigate } from 'react-router-dom';
+
 import RegionsSelect from './RegionsSelect';
+
 import { resolveRelPath } from '../../Utilities/path';
 
 const ShareToRegionsModal = () => {

src/Components/sharedComponents/DocumentationButton.js

@@ -1,4 +1,5 @@
 import React from 'react';
+
 import { Button } from '@patternfly/react-core';
 import { ExternalLinkAltIcon } from '@patternfly/react-icons';
 

src/Router.js

@@ -1,7 +1,8 @@
 import React, { lazy } from 'react';
-import { Route, Routes } from 'react-router-dom';
-import ShareImageModal from './Components/ShareImageModal/ShareImageModal';
 
+import { Route, Routes } from 'react-router-dom';
+
+import ShareImageModal from './Components/ShareImageModal/ShareImageModal';
 import { resolveRelPath } from './Utilities/path';
 
 const LandingPage = lazy(() => import('./Components/LandingPage/LandingPage'));

src/api.js

@@ -1,4 +1,5 @@
 import axios from 'axios';
+
 import { CONTENT_SOURCES, IMAGE_BUILDER_API, RHSM_API } from './constants';
 import { repos } from './repos';
 

src/bootstrap.js

@@ -1,5 +1,7 @@
 import React from 'react';
+
 import ReactDOM from 'react-dom';
+
 import ImageBuilder from './AppEntry';
 
 ReactDOM.render(<ImageBuilder />, document.getElementById('root'));

src/store/actions/actions.js

@@ -1,10 +1,10 @@
+import api from '../../api';
 import { cloneAdded, cloneUpdatedStatus } from '../clonesSlice';
 import {
   composeAdded,
   composesUpdatedCount,
   composeUpdatedStatus,
 } from '../composesSlice';
-import api from '../../api';
 
 export const fetchComposeStatus = (id) => async (dispatch) => {
   const request = await api.getComposeStatus(id);

src/store/index.js

@@ -1,6 +1,7 @@
+import { notificationsReducer } from '@redhat-cloud-services/frontend-components-notifications/redux';
 import { configureStore } from '@reduxjs/toolkit';
 import promiseMiddleware from 'redux-promise-middleware';
-import { notificationsReducer } from '@redhat-cloud-services/frontend-components-notifications/redux';
+
 import clonesSlice from './clonesSlice';
 import composesSlice from './composesSlice';
 

src/test/Components/CreateImageWizard/CreateImageWizard.test.js

@@ -1,6 +1,7 @@
 import '@testing-library/jest-dom';
 
 import React from 'react';
+
 import {
   act,
   screen,
@@ -9,10 +10,11 @@ import {
   within,
 } from '@testing-library/react';
 import userEvent from '@testing-library/user-event';
-import { renderWithReduxRouter } from '../../testUtils';
-import CreateImageWizard from '../../../Components/CreateImageWizard/CreateImageWizard';
+
 import api from '../../../api.js';
+import CreateImageWizard from '../../../Components/CreateImageWizard/CreateImageWizard';
 import { RHEL_8 } from '../../../constants.js';
+import { renderWithReduxRouter } from '../../testUtils';
 
 let history = undefined;
 let store = undefined;

src/test/Components/ImagesTable/ImagesTable.test.js

@@ -1,16 +1,18 @@
 import React from 'react';
+
 import { screen, within } from '@testing-library/react';
 import userEvent from '@testing-library/user-event';
 import { BrowserRouter } from 'react-router-dom';
+
 import api from '../../../api.js';
-import { renderWithProvider, renderWithReduxRouter } from '../../testUtils';
-import ImagesTable from '../../../Components/ImagesTable/ImagesTable';
 import { ImageBuildStatus } from '../../../Components/ImagesTable/ImageBuildStatus';
 import ImageLink from '../../../Components/ImagesTable/ImageLink';
+import ImagesTable from '../../../Components/ImagesTable/ImagesTable';
 import Target from '../../../Components/ImagesTable/Target';
 import '@testing-library/jest-dom';
-import { timestampToDisplayString } from '../../../Utilities/time.js';
 import { RHEL_8 } from '../../../constants.js';
+import { timestampToDisplayString } from '../../../Utilities/time.js';
+import { renderWithProvider, renderWithReduxRouter } from '../../testUtils';
 
 const currentDate = new Date();
 let currentDateInString = currentDate.toString();

src/test/Components/LandingPage/LandingPage.test.js

@@ -1,8 +1,10 @@
 import React from 'react';
+
 import { screen } from '@testing-library/react';
-import { renderWithReduxRouter } from '../../testUtils';
-import LandingPage from '../../../Components/LandingPage/LandingPage';
+
 import api from '../../../api.js';
+import LandingPage from '../../../Components/LandingPage/LandingPage';
+import { renderWithReduxRouter } from '../../testUtils';
 
 jest.mock('../../../store/actions/actions', () => {
   return {

src/test/Components/ShareImageModal/ShareImageModal.test.js

@@ -1,11 +1,13 @@
 import React from 'react';
+
 import '@testing-library/jest-dom';
 import { act, screen, waitFor } from '@testing-library/react';
 import userEvent from '@testing-library/user-event';
-import { renderWithReduxRouter } from '../../testUtils';
-import ShareImageModal from '../../../Components/ShareImageModal/ShareImageModal';
+
 import api from '../../../api.js';
+import ShareImageModal from '../../../Components/ShareImageModal/ShareImageModal';
 import { RHEL_8 } from '../../../constants.js';
+import { renderWithReduxRouter } from '../../testUtils';
 
 const mockComposes = {
   count: 1,

src/test/redux/reducers.test.js

@@ -1,5 +1,5 @@
-import composesSlice from '../../store/composesSlice';
 import { RHEL_8 } from '../../constants.js';
+import composesSlice from '../../store/composesSlice';
 
 const compose = {
   id: '77e4c693-0497-4b85-936d-b2a3ad69571b',

src/test/testUtils.js

@@ -1,9 +1,11 @@
 import React from 'react';
-import { Router } from 'react-router-dom';
+
 import { configureStore } from '@reduxjs/toolkit';
-import { Provider } from 'react-redux';
 import { render } from '@testing-library/react';
 import { createMemoryHistory } from 'history';
+import { Provider } from 'react-redux';
+import { Router } from 'react-router-dom';
+
 import { middleware, reducer } from '../store';
 
 export const renderWithReduxRouter = (