feat: make this app compatible with rsbuild

.env

@@ -1,5 +1,4 @@
 NODE_ENV='production'
-NODE_PATH=./src
 BASE_URL=''
 LMS_BASE_URL=''
 LOGIN_URL=''

.eslintrc.js

@@ -14,15 +14,13 @@ const config = createConfig('eslint', {
     'no-promise-executor-return': 'off',
     'import/no-cycle': 'off',
   },
-});
-
-config.settings = {
-  "import/resolver": {
-    node: {
-      paths: ["src", "node_modules"],
-      extensions: [".js", ".jsx"],
+  settings: {
+    'import/resolver': {
+      webpack: {
+        config: 'webpack.prod.config.js',
+      },
     },
-  },
-};
+  }
+});
 
 module.exports = config;

jest.config.js

@@ -6,6 +6,9 @@ module.exports = createConfig('jest', {
     '<rootDir>/src/setupTest.js',
   ],
   modulePaths: ['<rootDir>/src/'],
+  moduleNameMapper: {
+    '@src/(.*)': '<rootDir>/src/$1',
+  },
   coveragePathIgnorePatterns: [
     'src/segment.js',
     'src/postcss.config.js',

package.json

@@ -83,6 +83,7 @@
     "@openedx/frontend-build": "^14.3.3",
     "@testing-library/jest-dom": "^6.0.0",
     "@testing-library/react": "12.1.5",
+    "eslint-import-resolver-webpack": "^0.13.9",
     "axios-mock-adapter": "^1.20.0",
     "fetch-mock": "^9.11.0",
     "husky": "^7.0.0",

src/App.jsx

@@ -6,11 +6,11 @@ import { BrowserRouter as Router } from 'react-router-dom';
 import FooterSlot from '@openedx/frontend-slot-footer';
 import { LearningHeader as Header } from '@edx/frontend-component-header';
 
-import { selectors } from 'data/redux';
+import { selectors } from '@src/data/redux';
 
-import DemoWarning from 'containers/DemoWarning';
-import NotificationsBanner from 'containers/NotificationsBanner';
-import ListView from 'containers/ListView';
+import DemoWarning from '@src/containers/DemoWarning';
+import NotificationsBanner from '@src/containers/NotificationsBanner';
+import ListView from '@src/containers/ListView';
 
 import './App.scss';
 import Head from './components/Head';

src/components/ConfirmModal.jsx

@@ -2,7 +2,7 @@ import React from 'react';
 import PropTypes from 'prop-types';
 
 import { AlertModal, ActionRow, Button } from '@openedx/paragon';
-import { nullMethod } from 'hooks';
+import { nullMethod } from '@src/hooks';
 
 export const ConfirmModal = ({
   title,

src/components/DemoAlert/index.test.jsx

@@ -1,7 +1,7 @@
 import React from 'react';
 import { shallow } from '@edx/react-unit-test-utils';
 
-import { formatMessage } from 'testUtils';
+import { formatMessage } from '@src/testUtils';
 import { DemoAlert } from '.';
 
 describe('DemoAlert component', () => {

src/components/FilePreview/BaseRenderers/pdfHooks.jsx

@@ -2,8 +2,8 @@ import { useState, useRef } from 'react';
 
 import 'react-pdf/dist/esm/Page/AnnotationLayer.css';
 
-import { ErrorStatuses } from 'data/constants/requests';
-import { StrictDict } from 'utils';
+import { ErrorStatuses } from '@src/data/constants/requests';
+import { StrictDict } from '@src/utils';
 import * as module from './pdfHooks';
 
 export const errors = StrictDict({

src/components/FilePreview/BaseRenderers/pdfHooks.test.js

@@ -1,8 +1,8 @@
 import React from 'react';
 
-import { MockUseState } from 'testUtils';
-import { keyStore } from 'utils';
-import { ErrorStatuses } from 'data/constants/requests';
+import { MockUseState } from '@src/testUtils';
+import { keyStore } from '@src/utils';
+import { ErrorStatuses } from '@src/data/constants/requests';
 
 import * as hooks from './pdfHooks';
 

src/components/FilePreview/BaseRenderers/textHooks.js

@@ -1,7 +1,7 @@
 import { useEffect, useState } from 'react';
 import { get } from 'axios';
 
-import { StrictDict } from 'utils';
+import { StrictDict } from '@src/utils';
 import * as module from './textHooks';
 
 export const state = StrictDict({

src/components/FilePreview/BaseRenderers/textHooks.test.js

@@ -2,8 +2,8 @@
 import { useEffect } from 'react';
 import * as axios from 'axios';
 
-import { keyStore } from 'utils';
-import { MockUseState } from 'testUtils';
+import { keyStore } from '@src/utils';
+import { MockUseState } from '@src/testUtils';
 import * as hooks from './textHooks';
 
 jest.mock('axios', () => ({

src/components/FilePreview/FileCard.jsx

@@ -2,7 +2,7 @@ import React from 'react';
 import PropTypes from 'prop-types';
 
 import { Card, Collapsible } from '@openedx/paragon';
-import FilePopoverContent from 'components/FilePopoverContent';
+import FilePopoverContent from '@src/components/FilePopoverContent';
 import FileInfo from './FileInfo';
 
 import './FileCard.scss';

src/components/FilePreview/FileCard.test.jsx

@@ -3,7 +3,7 @@ import { shallow } from '@edx/react-unit-test-utils';
 
 import { Collapsible } from '@openedx/paragon';
 
-import FilePopoverContent from 'components/FilePopoverContent';
+import FilePopoverContent from '@src/components/FilePopoverContent';
 import FileInfo from './FileInfo';
 import FileCard from './FileCard';
 

src/components/FilePreview/FileInfo.jsx

@@ -8,7 +8,7 @@ import {
 } from '@openedx/paragon';
 import { InfoOutline } from '@openedx/paragon/icons';
 import { FormattedMessage } from '@edx/frontend-platform/i18n';
-import { nullMethod } from 'hooks';
+import { nullMethod } from '@src/hooks';
 import messages from './messages';
 
 /**

src/components/FilePreview/FileRenderer.test.jsx

@@ -1,9 +1,9 @@
 import React from 'react';
 import { shallow } from '@edx/react-unit-test-utils';
 
-import { formatMessage } from 'testUtils';
-import { keyStore } from 'utils';
-import { ErrorStatuses } from 'data/constants/requests';
+import { formatMessage } from '@src/testUtils';
+import { keyStore } from '@src/utils';
+import { ErrorStatuses } from '@src/data/constants/requests';
 
 import { FileRenderer } from './FileRenderer';
 import * as hooks from './hooks';

src/components/FilePreview/hooks.js

@@ -1,14 +1,14 @@
 import React from 'react';
 
-import { StrictDict } from 'utils';
-import { ErrorStatuses } from 'data/constants/requests';
-import { FileTypes } from 'data/constants/files';
+import { StrictDict } from '@src/utils';
+import { ErrorStatuses } from '@src/data/constants/requests';
+import { FileTypes } from '@src/data/constants/files';
 
 import {
   PDFRenderer,
   ImageRenderer,
   TXTRenderer,
-} from 'components/FilePreview/BaseRenderers';
+} from '@src/components/FilePreview/BaseRenderers';
 
 import * as module from './hooks';
 import messages from './messages';

src/components/FilePreview/hooks.test.js

@@ -1,7 +1,7 @@
-import { MockUseState, formatMessage } from 'testUtils';
-import { keyStore } from 'utils';
+import { MockUseState, formatMessage } from '@src/testUtils';
+import { keyStore } from '@src/utils';
 
-import { ErrorStatuses } from 'data/constants/requests';
+import { ErrorStatuses } from '@src/data/constants/requests';
 
 import * as hooks from './hooks';
 

src/components/InfoPopover/index.jsx

@@ -10,7 +10,7 @@ import {
 import { InfoOutline } from '@openedx/paragon/icons';
 import { injectIntl, intlShape } from '@edx/frontend-platform/i18n';
 
-import { nullMethod } from 'hooks';
+import { nullMethod } from '@src/hooks';
 
 import messages from './messages';
 

src/components/InfoPopover/index.test.jsx

@@ -1,7 +1,7 @@
 import React from 'react';
 import { shallow } from '@edx/react-unit-test-utils';
 
-import { formatMessage } from 'testUtils';
+import { formatMessage } from '@src/testUtils';
 import { InfoPopover } from '.';
 
 describe('Info Popover Component', () => {

src/components/StatusBadge.jsx

@@ -4,9 +4,9 @@ import PropTypes from 'prop-types';
 import { Badge } from '@openedx/paragon';
 import { FormattedMessage } from '@edx/frontend-platform/i18n';
 
-import { StrictDict } from 'utils';
-import { gradingStatuses as statuses } from 'data/services/lms/constants';
-import messages from 'data/services/lms/messages';
+import { StrictDict } from '@src/utils';
+import { gradingStatuses as statuses } from '@src/data/services/lms/constants';
+import messages from '@src/data/services/lms/messages';
 
 export const buttonVariants = StrictDict({
   primary: 'primary',

src/components/StatusBadge.test.jsx

@@ -1,7 +1,7 @@
 import React from 'react';
 import { shallow } from '@edx/react-unit-test-utils';
 
-import { gradingStatuses } from 'data/services/lms/constants';
+import { gradingStatuses } from '@src/data/services/lms/constants';
 import { StatusBadge } from './StatusBadge';
 
 const className = 'test-className';

src/containers/CriterionContainer/CriterionFeedback.jsx

@@ -5,8 +5,8 @@ import { connect } from 'react-redux';
 import { Form } from '@openedx/paragon';
 import { injectIntl, intlShape } from '@edx/frontend-platform/i18n';
 
-import { feedbackRequirement } from 'data/services/lms/constants';
-import { actions, selectors } from 'data/redux';
+import { feedbackRequirement } from '@src/data/services/lms/constants';
+import { actions, selectors } from '@src/data/redux';
 import messages from './messages';
 
 /**