fix: replace FC components with arrow func declaration

src/authz-module/libraries-manager/components/AddNewTeamMemberModal/AddNewTeamMemberModal.tsx

@@ -1,4 +1,4 @@
-import { FC, useRef } from 'react';
+import { useRef } from 'react';
 import { useIntl } from '@edx/frontend-platform/i18n';
 import {
   ActionRow, Form, Hyperlink, Icon, IconButton, ModalDialog,
@@ -24,9 +24,9 @@ interface AddNewTeamMemberModalProps {
   handleChangeForm: (e: React.ChangeEvent<HTMLTextAreaElement | HTMLSelectElement>) => void;
 }
 
-const AddNewTeamMemberModal: FC<AddNewTeamMemberModalProps> = ({
+const AddNewTeamMemberModal = ({
   isOpen, isError, isLoading, formValues, close, onSave, handleChangeForm,
-}) => {
+}: AddNewTeamMemberModalProps) => {
   const intl = useIntl();
   const { roles } = useLibraryAuthZ();
   const [isOpenRolesPopUp, openRolesPopUp, closeRolesPopUp] = useToggle(false);

src/authz-module/libraries-manager/components/AddNewTeamMemberModal/AddNewTeamMemberTrigger.tsx

@@ -1,4 +1,4 @@
-import React, { FC, useState } from 'react';
+import React, { useState } from 'react';
 import { useIntl } from '@edx/frontend-platform/i18n';
 import { Button, useToggle } from '@openedx/paragon';
 import { Plus } from '@openedx/paragon/icons';
@@ -19,7 +19,7 @@ const DEFAULT_FORM_VALUES = {
   role: '',
 };
 
-const AddNewTeamMemberTrigger: FC<AddNewTeamMemberTriggerProps> = ({ libraryId }) => {
+const AddNewTeamMemberTrigger = ({ libraryId }: AddNewTeamMemberTriggerProps) => {
   const intl = useIntl();
   const [isOpen, open, close] = useToggle(false);
   const [formValues, setFormValues] = useState(DEFAULT_FORM_VALUES);

src/authz-module/libraries-manager/components/AssignNewRoleModal/AssignNewRoleModal.tsx

@@ -1,4 +1,3 @@
-import { FC } from 'react';
 import { useIntl } from '@edx/frontend-platform/i18n';
 import {
   ActionRow, Button, Form, ModalDialog,
@@ -16,9 +15,9 @@ interface AssignNewRoleModalProps {
   handleChangeSelectedRole: (e: React.ChangeEvent<HTMLTextAreaElement | HTMLSelectElement>) => void;
 }
 
-const AssignNewRoleModal: FC<AssignNewRoleModalProps> = ({
+const AssignNewRoleModal = ({
   isOpen, isLoading, selectedRole, roleOptions, close, onSave, handleChangeSelectedRole,
-}) => {
+}: AssignNewRoleModalProps) => {
   const intl = useIntl();
   return (
     <ModalDialog

src/authz-module/libraries-manager/components/AssignNewRoleModal/AssignNewRoleTrigger.tsx

@@ -1,4 +1,4 @@
-import { FC, useState } from 'react';
+import { useState } from 'react';
 import { useIntl } from '@edx/frontend-platform/i18n';
 import { Button, useToggle } from '@openedx/paragon';
 import { Plus } from '@openedx/paragon/icons';
@@ -17,11 +17,11 @@ interface AssignNewRoleTriggerProps {
   currentUserRoles: string[];
 }
 
-const AssignNewRoleTrigger: FC<AssignNewRoleTriggerProps> = ({
+const AssignNewRoleTrigger = ({
   username,
   libraryId,
   currentUserRoles,
-}) => {
+}: AssignNewRoleTriggerProps) => {
   const intl = useIntl();
   const [isOpen, open, close] = useToggle(false);
   const { roles } = useLibraryAuthZ();

src/authz-module/libraries-manager/components/ConfirmDeletionModal.tsx

@@ -1,4 +1,3 @@
-import { FC } from 'react';
 import {
   ActionRow, AlertModal, Icon, ModalDialog, Stack,
   StatefulButton,
@@ -21,9 +20,9 @@ interface ConfirmDeletionModalProps {
   }
 }
 
-const ConfirmDeletionModal: FC<ConfirmDeletionModalProps> = ({
+const ConfirmDeletionModal = ({
   isOpen, close, onSave, isDeleting, context,
-}) => {
+}: ConfirmDeletionModalProps) => {
   const intl = useIntl();
   return (
     <AlertModal

src/authz-module/libraries-manager/components/TeamTable/components/MultipleChoiceFilter.tsx

@@ -1,4 +1,3 @@
-import { FC } from 'react';
 import {
   Dropdown, Form, Icon, Stack,
 } from '@openedx/paragon';
@@ -11,9 +10,9 @@ interface MultipleChoiceFilterProps {
   setFilter: (value: string[]) => void;
 }
 
-const MultipleChoiceFilter: FC<MultipleChoiceFilterProps> = ({
+const MultipleChoiceFilter = ({
   Header, filterChoices, filterValue, setFilter,
-}) => {
+}: MultipleChoiceFilterProps) => {
   const checkedBoxes = filterValue || [];
 
   const changeCheckbox = (value) => {

src/authz-module/libraries-manager/components/TeamTable/components/SearchFilter.tsx

@@ -1,4 +1,3 @@
-import { FC } from 'react';
 import {
   Form,
   Icon,
@@ -11,9 +10,9 @@ interface SearchFilterProps {
   placeholder: string;
 }
 
-const SearchFilter: FC<SearchFilterProps> = ({
+const SearchFilter = ({
   filterValue, setFilter, placeholder,
-}) => (
+}: SearchFilterProps) => (
   <Form.Control
     className="mw-xs mr-0"
     trailingElement={<Icon src={Search} />}

src/authz-module/libraries-manager/context.tsx

@@ -33,7 +33,7 @@ type AuthZProviderProps = {
   children: ReactNode;
 };
 
-export const LibraryAuthZProvider: React.FC<AuthZProviderProps> = ({ children }:AuthZProviderProps) => {
+export const LibraryAuthZProvider = ({ children }: AuthZProviderProps) => {
   const { libraryId } = useParams<{ libraryId: string }>();
   const { authenticatedUser } = useContext(AppContext) as AppContextType;