build: edx namespace packages upgrade & resolved respective eslint issue (#508)

* refactor: updated frontend-build, frontend-platform, header & footer packages

* fix: resolved eslint issues post frontend-build upgrade

* refactor: resolved eslint issues

* refactor: pinned frontend-build & changed suggested function definitions

src/discussions/common/ActionsDropdown.jsx

@@ -17,14 +17,14 @@ import { selectBlackoutDate } from '../data/selectors';
 import messages from '../messages';
 import { inBlackoutDateRange, useActions } from '../utils';
 
-function ActionsDropdown({
+const ActionsDropdown = ({
   actionHandlers,
   contentType,
   disabled,
   dropDownIconSize,
   iconSize,
   id,
-}) {
+}) => {
   const buttonRef = useRef();
   const intl = useIntl();
   const [isOpen, open, close] = useToggle(false);
@@ -109,7 +109,7 @@ function ActionsDropdown({
       </div>
     </>
   );
-}
+};
 
 ActionsDropdown.propTypes = {
   id: PropTypes.string.isRequired,

src/discussions/common/AuthorLabel.test.jsx

@@ -66,19 +66,20 @@ describe('Author label', () => {
     ['retired__user', null, false, ''],
     ['staff_user', 'Staff', true, 'text-staff-color'],
     ['learner_user', null, false, ''],
-  ])('for %s', (
-    author, authorLabel, linkToProfile, labelColor,
-  ) => {
-    it('it has author name text',
+  ])('for %s', (author, authorLabel, linkToProfile, labelColor) => {
+    it(
+      'it has author name text',
       async () => {
         renderComponent(author, authorLabel, linkToProfile, labelColor);
         const authorElement = container.querySelector('[role=heading]');
         const authorName = author.startsWith('retired__user') ? '[Deactivated]' : author;
 
         expect(authorElement).toHaveTextContent(authorName);
-      });
+      },
+    );
 
-    it(`it is "${!linkToProfile && 'not'}" clickable when linkToProfile is ${!!linkToProfile}`,
+    it(
+      `it is "${!linkToProfile && 'not'}" clickable when linkToProfile is ${!!linkToProfile}`,
       async () => {
         renderComponent(author, authorLabel, linkToProfile, labelColor);
 
@@ -87,9 +88,11 @@ describe('Author label', () => {
         } else {
           expect(screen.queryByTestId('learner-posts-link')).not.toBeInTheDocument();
         }
-      });
+      },
+    );
 
-    it(`it has "${!linkToProfile && 'not'}" label text and label color when linkToProfile is ${!!linkToProfile}`,
+    it(
+      `it has "${!linkToProfile && 'not'}" label text and label color when linkToProfile is ${!!linkToProfile}`,
       async () => {
         renderComponent(author, authorLabel, linkToProfile, labelColor);
         const authorElement = container.querySelector('[role=heading]');
@@ -104,6 +107,7 @@ describe('Author label', () => {
           expect(authorElement.parentNode.lastChild).not.toHaveTextContent(label, { exact: true });
           expect(authorElement.parentNode).not.toHaveClass(labelColor, { exact: true });
         }
-      });
+      },
+    );
   });
 });

src/discussions/common/Confirmation.jsx

@@ -6,7 +6,7 @@ import { ActionRow, Button, ModalDialog } from '@edx/paragon';
 
 import messages from '../messages';
 
-function Confirmation({
+const Confirmation = ({
   isOpen,
   title,
   description,
@@ -15,7 +15,7 @@ function Confirmation({
   closeButtonVaraint,
   confirmButtonVariant,
   confirmButtonText,
-}) {
+}) => {
   const intl = useIntl();
 
   return (
@@ -40,7 +40,7 @@ function Confirmation({
       </ModalDialog.Footer>
     </ModalDialog>
   );
-}
+};
 
 Confirmation.propTypes = {
   isOpen: PropTypes.bool.isRequired,

src/discussions/common/EndorsedAlertBanner.jsx

@@ -13,12 +13,12 @@ import { PostCommentsContext } from '../post-comments/postCommentsContext';
 import AuthorLabel from './AuthorLabel';
 import timeLocale from './time-locale';
 
-function EndorsedAlertBanner({
+const EndorsedAlertBanner = ({
   endorsed,
   endorsedAt,
   endorsedBy,
   endorsedByLabel,
-}) {
+}) => {
   timeago.register('time-locale', timeLocale);
 
   const intl = useIntl();
@@ -62,7 +62,7 @@ function EndorsedAlertBanner({
       </Alert>
     )
   );
-}
+};
 
 EndorsedAlertBanner.propTypes = {
   endorsed: PropTypes.bool.isRequired,

src/discussions/common/EndorsedAlertBanner.test.jsx

@@ -22,9 +22,7 @@ function buildTestContent(type, buildParams) {
   return camelCaseObject(Factory.build(type, { ...buildParamsSnakeCase }, null));
 }
 
-function renderComponent(
-  content, postType,
-) {
+const renderComponent = (content, postType) => {
   render(
     <IntlProvider locale="en">
       <AppProvider store={store}>
@@ -47,7 +45,7 @@ function renderComponent(
       </AppProvider>
     </IntlProvider>,
   );
-}
+};
 
 describe.each([
   {

src/discussions/common/HoverCard.jsx

@@ -43,8 +43,10 @@ const HoverCard = ({
         <div className="d-flex">
           <Button
             variant="tertiary"
-            className={classNames('px-2.5 py-2 border-0 font-style text-gray-700 font-size-12',
-              { 'w-100': enableInContextSidebar })}
+            className={classNames(
+              'px-2.5 py-2 border-0 font-style text-gray-700 font-size-12',
+              { 'w-100': enableInContextSidebar },
+            )}
             onClick={() => handleResponseCommentButton()}
             disabled={isClosed}
             style={{ lineHeight: '20px' }}
@@ -125,6 +127,7 @@ HoverCard.propTypes = {
   addResponseCommentButtonMessage: PropTypes.string.isRequired,
   onLike: PropTypes.func.isRequired,
   voted: PropTypes.bool.isRequired,
+  // eslint-disable-next-line react/forbid-prop-types
   endorseIcons: PropTypes.objectOf(PropTypes.any),
   onFollow: PropTypes.func,
   following: PropTypes.bool,

src/discussions/common/HoverCard.test.jsx

@@ -75,13 +75,15 @@ async function mockAxiosReturnPagedCommentsResponses() {
   };
 
   [1, 2].forEach(async (page) => {
-    axiosMock.onGet(commentsResponsesApiUrl, { params: { ...paramsTemplate, page } }).reply(200,
+    axiosMock.onGet(commentsResponsesApiUrl, { params: { ...paramsTemplate, page } }).reply(
+      200,
       Factory.build('commentsResult', null, {
         parentId,
         page,
         pageSize: 1,
         count: 2,
-      }));
+      }),
+    );
 
     await executeThunk(fetchCommentResponses(parentId), store.dispatch, store.getState);
   });