fix: defaultProps (#3469)

* remove defaultProps and disableEdit prop from resourcelist * Update src/shared/components/ResourcesList/ResourcesList.js Co-authored-by: Oliwia Gowor <[email protected]> --------- Co-authored-by: Oliwia Gowor <[email protected]>
kyma-project · Nov 13, 2024 · a565ab1 · a565ab1
1 parent c85f1bd
commit a565ab1
Show file tree

Hide file tree

Showing 11 changed files with 72 additions and 139 deletions.
diff --git a/src/components/Extensibility/ExtensibilityErrBoundary.js b/src/components/Extensibility/ExtensibilityErrBoundary.js
@@ -54,11 +54,10 @@ class ExtensibilityErrBoundaryComponent extends React.Component {
   }
 }
 
-ExtensibilityErrBoundaryComponent.defaultProps = {
-  displayButton: true,
-};
-
-export const ExtensibilityErrBoundary = ({ ...props }) => {
+export const ExtensibilityErrBoundary = ({
+  displayButton = true,
+  ...props
+}) => {
   const { t } = useTranslation();
 
   return <ExtensibilityErrBoundaryComponent {...props} t={t} />;

diff --git a/src/components/Extensibility/ExtensibilityList.js b/src/components/Extensibility/ExtensibilityList.js
@@ -35,9 +35,8 @@ export const ExtensibilityListCore = ({
   const { resource, description, features, filter: generalFilter } =
     resMetaData?.general ?? {};
 
-  const { disableCreate, disableEdit, disableDelete } = features?.actions ?? {
+  const { disableCreate, disableDelete } = features?.actions ?? {
     disableCreate: props.disableCreate,
-    disableEdit: props.disableEdit,
     disableDelete: props.disableDelete,
   };
 
@@ -120,7 +119,6 @@ export const ExtensibilityListCore = ({
       {...props}
       displayLabelForLabels
       disableCreate={disableCreate}
-      disableEdit={disableEdit}
       disableDelete={disableDelete}
       createResourceForm={ExtensibilityCreate}
       sortBy={defaultSortOptions =>

diff --git a/src/shared/components/DynamicPageComponent/DynamicPageComponent.js b/src/shared/components/DynamicPageComponent/DynamicPageComponent.js
@@ -75,7 +75,7 @@ const Column = ({ title, children, columnSpan, image, style = {} }) => {
 export const DynamicPageComponent = ({
   headerContent: customHeaderContent,
   title,
-  description,
+  description = '',
   actions,
   children,
   columnWrapperClassName,
@@ -405,7 +405,3 @@ DynamicPageComponent.propTypes = {
   title: PropTypes.string.isRequired,
   description: PropTypes.node,
 };
-
-DynamicPageComponent.defaultProps = {
-  description: '',
-};
diff --git a/src/shared/components/ErrorBoundary/ErrorBoundary.js b/src/shared/components/ErrorBoundary/ErrorBoundary.js
@@ -66,11 +66,7 @@ class ErrorBoundaryComponent extends React.Component {
   }
 }
 
-ErrorBoundaryComponent.defaultProps = {
-  displayButton: true,
-};
-
-export const ErrorBoundary = ({ ...props }) => {
+export const ErrorBoundary = ({ displayButton = true, ...props }) => {
   const { t } = useTranslation();
   return <ErrorBoundaryComponent {...props} t={t} />;
 };
diff --git a/src/shared/components/GenericList/GenericList.js b/src/shared/components/GenericList/GenericList.js
@@ -45,19 +45,19 @@ const defaultSearch = {
 };
 
 export const GenericList = ({
-  entries,
-  actions,
+  entries = [],
+  actions = [],
   extraHeaderContent,
   title,
   headerRenderer,
   rowRenderer,
   testid,
-  serverDataError,
-  serverDataLoading,
+  serverDataError = null,
+  serverDataLoading = false,
   pagination,
   sortBy,
-  notFoundMessage,
-  searchSettings,
+  notFoundMessage = 'components.generic-list.messages.not-found',
+  searchSettings = defaultSearch,
   disableMargin,
   emptyListProps = null,
   columnLayout = null,
@@ -486,12 +486,3 @@ GenericList.propTypes = {
   noHideFields: PropTypes.arrayOf(PropTypes.string),
   customRowClick: PropTypes.func,
 };
-
-GenericList.defaultProps = {
-  entries: [],
-  actions: [],
-  serverDataError: null,
-  serverDataLoading: false,
-  notFoundMessage: 'components.generic-list.messages.not-found',
-  searchSettings: defaultSearch,
-};
diff --git a/src/shared/components/Modal/Modal.js b/src/shared/components/Modal/Modal.js
@@ -25,32 +25,21 @@ Modal.propTypes = {
   headerActions: PropTypes.object,
 };
 
-Modal.defaultProps = {
-  title: 'components.modal.title',
-  confirmText: 'components.modal.confirm-text',
-  actions: null,
-  type: 'default',
-  disabledConfirm: false,
-  waiting: false,
-  openerDisabled: false,
-};
-
 export function Modal({
-  title,
-  actions,
+  title = 'components.modal.title',
+  actions = null,
   modalOpeningComponent,
-  openerDisabled,
+  openerDisabled = false,
   onShow,
   onHide,
   onConfirm,
-  confirmText,
+  confirmText = 'components.modal.confirm-text',
   cancelText,
-  type,
-  disabledConfirm,
-  waiting,
+  type = 'default',
+  disabledConfirm = false,
+  waiting = false,
   children,
   className,
-  disableAutoClose = true,
   headerActions,
 }) {
   const { t } = useTranslation();

diff --git a/src/shared/components/ModalWithForm/ModalWithForm.js b/src/shared/components/ModalWithForm/ModalWithForm.js
@@ -13,14 +13,14 @@ import { isResourceEditedState } from 'state/resourceEditedAtom';
 import { isFormOpenState } from 'state/formOpenAtom';
 
 export const ModalWithForm = ({
-  performRefetch,
+  performRefetch = () => {},
   title,
   button,
   renderForm,
   item,
   modalOpeningComponent,
   confirmText,
-  invalidPopupMessage,
+  invalidPopupMessage = '',
   className,
   getToggleFormFn,
   ...props
@@ -183,8 +183,3 @@ ModalWithForm.propTypes = {
   button: CustomPropTypes.button,
   className: PropTypes.string,
 };
-
-ModalWithForm.defaultProps = {
-  performRefetch: () => {},
-  invalidPopupMessage: '',
-};
diff --git a/src/shared/components/ResourceCreate/ResourceCreate.js b/src/shared/components/ResourceCreate/ResourceCreate.js
@@ -16,14 +16,14 @@ import { handleActionIfFormOpen } from '../UnsavedMessageBox/helpers';
 import './ResourceCreate.scss';
 
 export const ResourceCreate = ({
-  performRefetch,
+  performRefetch = () => {},
   title,
   renderForm,
   confirmText,
-  invalidPopupMessage,
-  isEdit,
-  readOnly,
-  disableEdit,
+  invalidPopupMessage = '',
+  isEdit = false,
+  readOnly = false,
+  disableEdit = false,
   layoutCloseCreateUrl,
   layoutNumber = 'MidColumn',
   onlyYaml = false,
@@ -233,11 +233,3 @@ ResourceCreate.propTypes = {
   disableEdit: PropTypes.bool,
   layoutCloseCreateUrl: PropTypes.string,
 };
-
-ResourceCreate.defaultProps = {
-  performRefetch: () => {},
-  invalidPopupMessage: '',
-  isEdit: false,
-  readOnly: false,
-  disableEdit: false,
-};
diff --git a/src/shared/components/ResourceDetails/ResourceDetails.js b/src/shared/components/ResourceDetails/ResourceDetails.js
@@ -70,19 +70,6 @@ ResourceDetails.propTypes = {
   isModule: PropTypes.bool,
 };
 
-ResourceDetails.defaultProps = {
-  customColumns: [],
-  customComponents: [],
-  customStatusComponents: [],
-  headerActions: null,
-  resourceHeaderActions: [],
-  readOnly: false,
-  disableEdit: false,
-  disableDelete: false,
-  showYamlTab: false,
-  layoutNumber: 'MidColumn',
-};
-
 export function ResourceDetails(props) {
   if (!props.resourceUrl) {
     return <></>; // wait for the context update
@@ -151,30 +138,30 @@ function Resource({
   hideLabels = false,
   hideAnnotations = false,
   hideLastUpdate = false,
-  layoutNumber,
+  layoutNumber = 'MidColumn',
   layoutCloseCreateUrl,
   children,
   createResourceForm: CreateResourceForm,
-  customColumns,
-  customComponents,
+  customColumns = [],
+  customComponents = [],
   customConditionsComponents,
   description,
   editActionLabel,
-  headerActions,
+  headerActions = null,
   namespace,
-  readOnly,
+  readOnly = false,
   resource,
-  resourceHeaderActions,
+  resourceHeaderActions = [],
   resourceType,
   resourceUrl,
   title,
   windowTitle,
   resourceTitle,
   resourceGraphConfig,
   resourceSchema,
-  disableEdit,
-  showYamlTab,
-  disableDelete,
+  disableEdit = false,
+  showYamlTab = false,
+  disableDelete = false,
   statusBadge,
   customStatusColumns,
   customHealthCards,

diff --git a/src/shared/components/ResourcesList/ResourcesList.js b/src/shared/components/ResourcesList/ResourcesList.js
@@ -67,33 +67,28 @@ ResourcesList.propTypes = {
   omitColumnsIds: PropTypes.arrayOf(PropTypes.string.isRequired),
   resourceUrlPrefix: PropTypes.string,
   disableCreate: PropTypes.bool,
-  disableEdit: PropTypes.bool,
   disableDelete: PropTypes.bool,
   disableMargin: PropTypes.bool,
   enableColumnLayout: PropTypes.bool,
   layoutNumber: PropTypes.string,
   handleRedirect: PropTypes.func,
+  filterFn: PropTypes.func,
 };
 
-ResourcesList.defaultProps = {
-  customHeaderActions: null,
-  customColumns: [],
-  createResourceForm: null,
-  showTitle: false,
-  listHeaderActions: null,
-  readOnly: false,
-  disableCreate: false,
-  disableEdit: false,
-  disableDelete: false,
-  disableMargin: false,
-  enableColumnLayout: false,
-  layoutNumber: 'StartColumn',
-  filterFn: () => true,
-};
-
-export function ResourcesList(props) {
-  const headerInjections = useGetInjections(props.resourceType, 'list-header');
-  if (!props.resourceUrl) {
+export function ResourcesList({
+  customHeaderActions = null,
+  resourceUrl,
+  resourceType,
+  resourceTitle,
+  isCompact,
+  description,
+  layoutNumber = 'StartColumn',
+  resources,
+  filterFn = () => true,
+  ...props
+}) {
+  const headerInjections = useGetInjections(resourceType, 'list-header');
+  if (!resourceUrl) {
     return <></>; // wait for the context update
   }
 
@@ -102,15 +97,15 @@ export function ResourcesList(props) {
       <BannerCarousel
         children={
           <Injections
-            destination={props.resourceType}
+            destination={resourceType}
             slot="banner"
-            root={props.resources}
+            root={resources}
           />
         }
       />
-      {props.resources ? (
+      {resources ? (
         <ResourceListRenderer
-          resources={(props.resources || []).filter(props.filterFn)}
+          resources={(resources || []).filter(filterFn)}
           {...props}
         />
       ) : (
@@ -122,24 +117,24 @@ export function ResourcesList(props) {
   const headerActions = headerInjections.length ? (
     <>
       <Injections
-        destination={props.resourceType}
+        destination={resourceType}
         slot="list-header"
-        root={props.resources}
+        root={resources}
       />
-      {props.customHeaderActions}
+      {customHeaderActions}
     </>
   ) : (
-    props.customHeaderActions
+    customHeaderActions
   );
 
   return (
     <>
-      {!props.isCompact ? (
+      {!isCompact ? (
         <DynamicPageComponent
-          layoutNumber={props.layoutNumber}
-          title={prettifyNamePlural(props.resourceTitle, props.resourceType)}
+          layoutNumber={layoutNumber}
+          title={prettifyNamePlural(resourceTitle, resourceType)}
           actions={headerActions}
-          description={props.description}
+          description={description}
           content={content}
         />
       ) : (
@@ -188,13 +183,13 @@ export function ResourceListRenderer({
   namespace,
   customColumns = [],
   columns,
-  createResourceForm: CreateResourceForm,
+  createResourceForm: CreateResourceForm = null,
   createActionLabel,
   hasDetailsView,
   title,
-  showTitle,
-  listHeaderActions,
-  readOnly,
+  showTitle = false,
+  listHeaderActions = null,
+  readOnly = false,
   customUrl,
   testid,
   omitColumnsIds = ['namespace'],
@@ -205,10 +200,10 @@ export function ResourceListRenderer({
   resources,
   resourceUrlPrefix,
   nameSelector = entry => entry?.metadata.name, // overriden for CRDGroupList
-  disableCreate,
-  disableDelete,
-  disableMargin,
-  enableColumnLayout,
+  disableCreate = false,
+  disableDelete = false,
+  disableMargin = false,
+  enableColumnLayout = false,
   columnLayout,
   customColumnLayout,
   layoutCloseCreateUrl,