ESLint: Add prefer-const rule

Require const declarations for variables that are never reassigned after
being declared. If a variable is never reassigned, using the const
declaration is better. const declaration tells readers, “this variable
is never reassigned,” reducing cognitive load and improving
maintainability.

.eslintrc.yml

@@ -26,3 +26,6 @@ rules:
       position: before
     pathGroupsExcludedImportTypes:
     - react
+  prefer-const:
+  - error
+  - destructuring: any

src/Components/CreateImageWizard/CreateImageWizard.js

@@ -41,7 +41,7 @@ const handleKeyDown = (e, handleClose) => {
 };
 
 const onSave = (values) => {
-  let customizations = {
+  const customizations = {
     packages: values['selected-packages']?.map((p) => p.name),
   };
 
@@ -69,7 +69,7 @@ const onSave = (values) => {
 
   if (values['file-system-config-radio'] === 'manual') {
     customizations.filesystem = [];
-    for (let fsc of values['file-system-configuration']) {
+    for (const fsc of values['file-system-configuration']) {
       customizations.filesystem.push({
         mountpoint: fsc.mountpoint,
         min_size: fsc.size * fsc.unit,
@@ -77,9 +77,9 @@ const onSave = (values) => {
     }
   }
 
-  let requests = [];
+  const requests = [];
   if (values['target-environment']?.aws) {
-    let request = {
+    const request = {
       distribution: values.release,
       image_name: values?.['image-name'],
       image_requests: [
@@ -116,7 +116,7 @@ const onSave = (values) => {
         break;
     }
 
-    let request = {
+    const request = {
       distribution: values.release,
       image_name: values?.['image-name'],
       image_requests: [
@@ -138,7 +138,7 @@ const onSave = (values) => {
   }
 
   if (values['target-environment']?.azure) {
-    let request = {
+    const request = {
       distribution: values.release,
       image_name: values?.['image-name'],
       image_requests: [
@@ -161,7 +161,7 @@ const onSave = (values) => {
   }
 
   if (values['target-environment']?.vsphere) {
-    let request = {
+    const request = {
       distribution: values.release,
       image_name: values?.['image-name'],
       image_requests: [
@@ -180,7 +180,7 @@ const onSave = (values) => {
   }
 
   if (values['target-environment']?.['guest-image']) {
-    let request = {
+    const request = {
       distribution: values.release,
       image_name: values?.['image-name'],
       image_requests: [
@@ -199,7 +199,7 @@ const onSave = (values) => {
   }
 
   if (values['target-environment']?.['image-installer']) {
-    let request = {
+    const request = {
       distribution: values.release,
       image_name: values?.['image-name'],
       image_requests: [
@@ -247,8 +247,9 @@ const getPackageDescription = async (release, arch, repoUrls, packageName) => {
     pack = data.find((pack) => packageName === pack.name);
   } else {
     const args = [release, arch, packageName];
-    let { data, meta } = await api.getPackages(...args);
-
+    const response = await api.getPackages(...args);
+    let { data } = response;
+    const { meta } = response;
     // the package should be found in the 0 index
     // if not then fetch all package matches and search for the package
     if (data[0]?.name === packageName) {
@@ -271,7 +272,7 @@ const requestToState = (composeRequest) => {
   if (composeRequest) {
     const imageRequest = composeRequest.image_requests[0];
     const uploadRequest = imageRequest.upload_request;
-    let formState = {};
+    const formState = {};
 
     formState['image-name'] = composeRequest.image_name;
 
@@ -332,7 +333,7 @@ const requestToState = (composeRequest) => {
 
     // customizations
     // packages
-    let packs = [];
+    const packs = [];
 
     const distro = composeRequest?.distribution;
     const distroRepoUrls = getDistroRepoUrls(distro);
@@ -378,8 +379,8 @@ const requestToState = (composeRequest) => {
     const fs = composeRequest?.customizations?.filesystem;
     if (fs) {
       formState['file-system-config-radio'] = 'manual';
-      let fileSystemConfiguration = [];
-      for (let fsc of fs) {
+      const fileSystemConfiguration = [];
+      for (const fsc of fs) {
         const [size, unit] = parseSizeUnit(fsc.min_size);
         fileSystemConfiguration.push({
           mountpoint: fsc.mountpoint,

src/Components/CreateImageWizard/formComponents/FileSystemConfiguration.js

@@ -33,7 +33,7 @@ import SizeUnit from './SizeUnit';
 
 import { UNIT_GIB } from '../../../constants';
 
-let initialRow = {
+const initialRow = {
   id: uuidv4(),
   mountpoint: '/',
   fstype: 'xfs',
@@ -112,12 +112,12 @@ const FileSystemConfiguration = ({ ...props }) => {
   };
 
   const removeRow = (id) => {
-    let removeIndex = rows.map((e) => e.id).indexOf(id);
-    let newRows = [...rows];
+    const removeIndex = rows.map((e) => e.id).indexOf(id);
+    const newRows = [...rows];
     newRows.splice(removeIndex, 1);
 
-    let removeOrderIndex = itemOrder.indexOf(id);
-    let newOrder = [...itemOrder];
+    const removeOrderIndex = itemOrder.indexOf(id);
+    const newOrder = [...itemOrder];
     newOrder.splice(removeOrderIndex, 1);
 
     setRows(newRows);
@@ -216,10 +216,10 @@ const FileSystemConfiguration = ({ ...props }) => {
   };
 
   const setMountpoint = (id, mp) => {
-    let newRows = [...rows];
+    const newRows = [...rows];
     for (let i = 0; i < newRows.length; i++) {
       if (newRows[i].id === id) {
-        let newRow = { ...newRows[i] };
+        const newRow = { ...newRows[i] };
         newRow.mountpoint = mp;
         newRows.splice(i, 1, newRow);
         break;
@@ -230,10 +230,10 @@ const FileSystemConfiguration = ({ ...props }) => {
   };
 
   const setSize = (id, s, u) => {
-    let newRows = [...rows];
+    const newRows = [...rows];
     for (let i = 0; i < newRows.length; i++) {
       if (newRows[i].id === id) {
-        let newRow = { ...newRows[i] };
+        const newRow = { ...newRows[i] };
         newRow.size = s;
         newRow.unit = u;
         newRows.splice(i, 1, newRow);

src/Components/CreateImageWizard/formComponents/MountPoint.js

@@ -31,7 +31,7 @@ const MountPoint = ({ ...props }) => {
 
   // split
   useEffect(() => {
-    for (let p of validPrefixes) {
+    for (const p of validPrefixes) {
       if (props.mountpoint.startsWith(p)) {
         setPrefix(p);
         setSuffix(props.mountpoint.substring(p.length));

src/Components/CreateImageWizard/formComponents/Packages.js

@@ -44,7 +44,9 @@ export const RedHatPackages = ({ defaultArch }) => {
         getState()?.values?.architecture || defaultArch,
         packagesSearchName,
       ];
-      let { data, meta } = await api.getPackages(...args);
+      const response = await api.getPackages(...args);
+      let { data } = response;
+      const { meta } = response;
       if (data?.length === meta.count) {
         return data;
       } else if (data) {

src/Components/CreateImageWizard/validators/fileSystemConfigurationValidator.js

@@ -3,7 +3,7 @@ const FileSystemConfigurationValidator = () => (fsc) => {
     return undefined;
   }
 
-  let mpFreqs = {};
+  const mpFreqs = {};
   for (const fs of fsc) {
     const mp = fs.mountpoint;
     if (mp in mpFreqs) {
@@ -13,14 +13,14 @@ const FileSystemConfigurationValidator = () => (fsc) => {
     }
   }
 
-  let duplicates = [];
+  const duplicates = [];
   for (const [k, v] of Object.entries(mpFreqs)) {
     if (v > 1) {
       duplicates.push(k);
     }
   }
 
-  let root = mpFreqs['/'] >= 1;
+  const root = mpFreqs['/'] >= 1;
   return duplicates.length === 0 && root
     ? undefined
     : {

src/Components/CreateImageWizard/validators/targetEnvironmentValidator.js

@@ -7,7 +7,7 @@ const TargetEnvironmentValidator = () => (targets) => {
   // be set to true. This reduces the value to
   // a single boolean which is a flag for whether
   // at least one target has been selected or not
-  let valid = Object.values(targets).reduce(
+  const valid = Object.values(targets).reduce(
     (prev, curr) => curr || prev,
     false
   );

src/Components/ImagesTable/RegionsPopover.js

@@ -16,7 +16,7 @@ export const selectRegions = createSelector(
         compose.share_with_accounts[0] === image.share_with_accounts[0]
     );
 
-    let regions = {};
+    const regions = {};
     filteredImages.forEach((image) => {
       if (image.region && image.status === 'success') {
         if (regions[image.region]) {
@@ -58,7 +58,7 @@ export const RegionsPopover = ({ composeId }) => {
   const regions = useSelector((state) => selectRegions(state, composeId));
 
   const listItems = useMemo(() => {
-    let listItems = [];
+    const listItems = [];
     for (const [key, value] of Object.entries(regions).sort()) {
       listItems.push(
         <li key={key}>

src/Components/ShareImageModal/RegionsSelect.js

@@ -26,7 +26,7 @@ import { resolveRelPath } from '../../Utilities/path';
 export const selectRegionsToDisable = createSelector(
   [selectComposeById, selectClonesById],
   (compose, clones) => {
-    let regions = new Set();
+    const regions = new Set();
     regions.add(compose.region);
     clones.map((clone) => {
       clone.region &&

src/api.js

@@ -5,7 +5,7 @@ import { CONTENT_SOURCES, IMAGE_BUILDER_API, RHSM_API } from './constants';
 const postHeaders = { headers: { 'Content-Type': 'application/json' } };
 
 async function composeImage(body) {
-  let path = '/compose';
+  const path = '/compose';
   const request = await axios.post(
     IMAGE_BUILDER_API.concat(path),
     body,
@@ -19,13 +19,13 @@ async function getComposes(limit, offset) {
     limit,
     offset,
   });
-  let path = '/composes?' + params.toString();
+  const path = '/composes?' + params.toString();
   const request = await axios.get(IMAGE_BUILDER_API.concat(path));
   return request.data;
 }
 
 async function getComposeStatus(id) {
-  let path = '/composes/' + id;
+  const path = '/composes/' + id;
   const request = await axios.get(IMAGE_BUILDER_API.concat(path));
   return request.data;
 }
@@ -37,7 +37,7 @@ async function getPackages(distribution, architecture, search, limit) {
     search,
   });
   limit && params.append('limit', limit);
-  let path = '/packages?' + params.toString();
+  const path = '/packages?' + params.toString();
   const request = await axios.get(IMAGE_BUILDER_API.concat(path));
   return request.data;
 }
@@ -72,7 +72,7 @@ async function getPackagesContentSources(repoUrls, search) {
 }
 
 async function getVersion() {
-  let path = '/version';
+  const path = '/version';
   const request = await axios.get(IMAGE_BUILDER_API.concat(path));
   return request.data;
 }

src/store/repositoriesSlice.js

@@ -10,7 +10,9 @@ const initialState = {
 };
 
 export const fetchRepositories = () => async (dispatch) => {
-  let { data, meta } = await api.getRepositories();
+  const response = await api.getRepositories();
+  let { data } = response;
+  const { meta } = response;
   if (data.length < meta.count) {
     ({ data } = await api.getRepositories(meta.count));
   }

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

@@ -725,7 +725,7 @@ describe('Step Packages', () => {
     screen.getByRole('button', { name: /Next/ }).click();
 
     // await screen.findByTestId('chosen-packages-count');
-    let chosen = await screen.findByTestId('chosen-packages-count');
+    const chosen = await screen.findByTestId('chosen-packages-count');
     expect(chosen).toHaveTextContent('2');
   });
 
@@ -1213,7 +1213,7 @@ describe('Click through all steps', () => {
     expect(within(revtbody).getAllByRole('row')).toHaveLength(3);
 
     // mock the backend API
-    let ids = [];
+    const ids = [];
     const customizations = {
       payload_repositories: [
         {

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

@@ -1518,7 +1518,7 @@ describe('Click through all steps', () => {
     expect(within(revtbody).getAllByRole('row')).toHaveLength(3);
 
     // mock the backend API
-    let ids = [];
+    const ids = [];
     const composeImage = jest
       .spyOn(api, 'composeImage')
       .mockImplementation((body) => {

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

@@ -15,7 +15,7 @@ import { timestampToDisplayString } from '../../../Utilities/time.js';
 import { renderWithProvider, renderWithReduxRouter } from '../../testUtils';
 
 const currentDate = new Date();
-let currentDateInString = currentDate.toString();
+const currentDateInString = currentDate.toString();
 
 const mockComposes = {
   meta: {
@@ -484,7 +484,7 @@ describe('Images Table', () => {
       expect(row.cells[2]).toHaveTextContent('Apr 27, 2021');
 
       // render the expected <ImageBuildStatus /> and compare the text content
-      let testElement = document.createElement('testElement');
+      const testElement = document.createElement('testElement');
       // render(<Target composeId={compose.id} />, { container: testElement });
       renderWithProvider(<Target composeId={compose.id} />, testElement, state);
       expect(row.cells[4]).toHaveTextContent(testElement.textContent);
@@ -664,7 +664,7 @@ describe('Clones table', () => {
     const state = view.store.getState();
 
     // get rows
-    let { getAllByRole } = within(table);
+    const { getAllByRole } = within(table);
     const rows = getAllByRole('row');
 
     // first row is header so look at index 1
@@ -711,7 +711,7 @@ describe('Clones table', () => {
       ],
     };
 
-    for (let [index, row] of cloneRows.entries()) {
+    for (const [index, row] of cloneRows.entries()) {
       // render UUIDs in correct order
       expect(row.cells[0]).toHaveTextContent(clonesTableData.uuid[index]);
 
@@ -727,7 +727,7 @@ describe('Clones table', () => {
       // region cell
       expect(row.cells[3]).toHaveTextContent(clonesTableData.region[index]);
 
-      let testElement = document.createElement('testElement');
+      const testElement = document.createElement('testElement');
       const imageId = clonesTableData.uuid[index];
 
       // status cell