feat: /decaporg/issues/7365 react 19 support finalize

Author: hip3r

packages/decap-cms-backend-aws-cognito-github-proxy/src/AuthenticationPage.js

@@ -19,6 +19,9 @@ export default class GenericPKCEAuthenticationPage extends React.Component {
   state = {};
 
   componentDidMount() {
+    // Manually validate PropTypes - React 19 breaking change
+    PropTypes.checkPropTypes(GenericPKCEAuthenticationPage.propTypes, this.props, 'prop', 'GenericPKCEAuthenticationPage');
+
     const {
       base_url = '',
       app_id = '',

packages/decap-cms-backend-azure/src/AuthenticationPage.js

@@ -23,6 +23,9 @@ export default class AzureAuthenticationPage extends React.Component {
   state = {};
 
   componentDidMount() {
+    // Manually validate PropTypes - React 19 breaking change
+    PropTypes.checkPropTypes(AzureAuthenticationPage.propTypes, this.props, 'prop', 'AzureAuthenticationPage');
+
     this.auth = new ImplicitAuthenticator({
       base_url: `https://login.microsoftonline.com/${this.props.config.backend.tenant_id}`,
       auth_endpoint: 'oauth2/authorize',

packages/decap-cms-backend-bitbucket/src/AuthenticationPage.js

@@ -23,6 +23,9 @@ export default class BitbucketAuthenticationPage extends React.Component {
   state = {};
 
   componentDidMount() {
+    // Manually validate PropTypes - React 19 breaking change
+    PropTypes.checkPropTypes(BitbucketAuthenticationPage.propTypes, this.props, 'prop', 'BitbucketAuthenticationPage');
+
     const { auth_type: authType = '' } = this.props.config.backend;
 
     if (authType === 'implicit') {

packages/decap-cms-backend-git-gateway/src/AuthenticationPage.js

@@ -68,12 +68,23 @@ if (window.netlifyIdentity) {
 export default class GitGatewayAuthenticationPage extends React.Component {
   static authClient;
 
+  static propTypes = {
+    onLogin: PropTypes.func.isRequired,
+    inProgress: PropTypes.bool.isRequired,
+    error: PropTypes.node,
+    config: PropTypes.object.isRequired,
+    t: PropTypes.func.isRequired,
+  };
+
   constructor(props) {
     super(props);
     component = this;
   }
 
   componentDidMount() {
+    // Manually validate PropTypes - React 19 breaking change
+    PropTypes.checkPropTypes(GitGatewayAuthenticationPage.propTypes, this.props, 'prop', 'GitGatewayAuthenticationPage');
+
     if (!this.loggedIn && window.netlifyIdentity && window.netlifyIdentity.currentUser()) {
       this.props.onLogin(window.netlifyIdentity.currentUser());
       window.netlifyIdentity.close();
@@ -111,14 +122,6 @@ export default class GitGatewayAuthenticationPage extends React.Component {
     }
   };
 
-  static propTypes = {
-    onLogin: PropTypes.func.isRequired,
-    inProgress: PropTypes.bool.isRequired,
-    error: PropTypes.node,
-    config: PropTypes.object.isRequired,
-    t: PropTypes.func.isRequired,
-  };
-
   state = { email: '', password: '', errors: {} };
 
   handleChange = (name, e) => {

packages/decap-cms-backend-gitea/src/AuthenticationPage.js

@@ -19,6 +19,9 @@ export default class GiteaAuthenticationPage extends React.Component {
   state = {};
 
   componentDidMount() {
+    // Manually validate PropTypes - React 19 breaking change
+    PropTypes.checkPropTypes(GiteaAuthenticationPage.propTypes, this.props, 'prop', 'GiteaAuthenticationPage');
+
     const { base_url = 'https://try.gitea.io', app_id = '' } = this.props.config.backend;
     this.auth = new PkceAuthenticator({
       base_url,

packages/decap-cms-backend-github/src/AuthenticationPage.js

@@ -35,6 +35,11 @@ export default class GitHubAuthenticationPage extends React.Component {
 
   state = {};
 
+  componentDidMount() {
+    // Manually validate PropTypes - React 19 breaking change
+    PropTypes.checkPropTypes(GitHubAuthenticationPage.propTypes, this.props, 'prop', 'GitHubAuthenticationPage');
+  };
+
   getPermissionToFork = () => {
     return new Promise((resolve, reject) => {
       this.setState({

packages/decap-cms-backend-gitlab/src/AuthenticationPage.js

@@ -54,6 +54,9 @@ export default class GitLabAuthenticationPage extends React.Component {
   state = {};
 
   componentDidMount() {
+    // Manually validate PropTypes - React 19 breaking change
+    PropTypes.checkPropTypes(GitLabAuthenticationPage.propTypes, this.props, 'prop', 'GitLabAuthenticationPage');
+
     const {
       auth_type: authType = '',
       base_url = 'https://gitlab.com',

packages/decap-cms-backend-proxy/src/AuthenticationPage.js

@@ -36,6 +36,11 @@ export default class AuthenticationPage extends React.Component {
     t: PropTypes.func.isRequired,
   };
 
+  componentDidMount() {
+    // Manually validate PropTypes - React 19 breaking change
+    PropTypes.checkPropTypes(AuthenticationPage.propTypes, this.props, 'prop', 'AuthenticationPage');
+  };
+
   handleLogin = e => {
     e.preventDefault();
     this.props.onLogin(this.state);

packages/decap-cms-backend-test/src/AuthenticationPage.js

@@ -42,6 +42,9 @@ export default class AuthenticationPage extends React.Component {
   };
 
   componentDidMount() {
+    // Manually validate PropTypes - React 19 breaking change
+    PropTypes.checkPropTypes(AuthenticationPage.propTypes, this.props, 'prop', 'AuthenticationPage');
+
     /**
      * Allow login screen to be skipped for demo purposes.
      */

packages/decap-cms-core/src/components/App/App.js

@@ -86,6 +86,11 @@ class App extends React.Component {
     t: PropTypes.func.isRequired,
   };
 
+  componentDidMount() {
+    // Manually validate PropTypes - React 19 breaking change
+    PropTypes.checkPropTypes(App.propTypes, this.props, 'prop', 'App');
+  };
+
   configError(config) {
     const t = this.props.t;
     return (

packages/decap-cms-core/src/components/App/Header.js

@@ -131,6 +131,9 @@ class Header extends React.Component {
   intervalId;
 
   componentDidMount() {
+    // Manually validate PropTypes - React 19 breaking change
+    PropTypes.checkPropTypes(Header.propTypes, this.props, 'prop', 'Header');
+
     this.intervalId = setInterval(() => {
       this.props.checkBackendStatus();
     }, 5 * 60 * 1000);

packages/decap-cms-core/src/components/Collection/Collection.js

@@ -55,6 +55,11 @@ export class Collection extends React.Component {
     onSortClick: PropTypes.func.isRequired,
   };
 
+  componentDidMount() {
+    // Manually validate PropTypes - React 19 breaking change
+    PropTypes.checkPropTypes(Collection.propTypes, this.props, 'prop', 'Collection');
+  };
+
   renderEntriesCollection = () => {
     const { collection, filterTerm, viewStyle } = this.props;
     return (

packages/decap-cms-core/src/components/Collection/CollectionSearch.js

@@ -102,6 +102,11 @@ class CollectionSearch extends React.Component {
     selectedCollectionIdx: this.getSelectedSelectionBasedOnProps(),
   };
 
+  componentDidMount() {
+    // Manually validate PropTypes - React 19 breaking change
+    PropTypes.checkPropTypes(CollectionSearch.propTypes, this.props, 'prop', 'CollectionSearch');
+  };
+
   componentDidUpdate(prevProps) {
     if (prevProps.collection !== this.props.collection) {
       const selectedCollectionIdx = this.getSelectedSelectionBasedOnProps();

packages/decap-cms-core/src/components/Collection/Entries/EntriesCollection.js

@@ -73,6 +73,9 @@ export class EntriesCollection extends React.Component {
   };
 
   componentDidMount() {
+    // Manually validate PropTypes - React 19 breaking change
+    PropTypes.checkPropTypes(EntriesCollection.propTypes, this.props, 'prop', 'EntriesCollection');
+
     const { collection, entriesLoaded, loadEntries } = this.props;
     if (collection && !entriesLoaded) {
       loadEntries(collection);

packages/decap-cms-core/src/components/Collection/Entries/EntriesSearch.js

@@ -25,6 +25,9 @@ class EntriesSearch extends React.Component {
   };
 
   componentDidMount() {
+    // Manually validate PropTypes - React 19 breaking change
+    PropTypes.checkPropTypes(EntriesSearch.propTypes, this.props, 'prop', 'EntriesSearch');
+
     const { searchTerm, searchEntries, collectionNames } = this.props;
     searchEntries(searchTerm, collectionNames);
   }

packages/decap-cms-core/src/components/Collection/Entries/EntryListing.js

@@ -27,6 +27,11 @@ export default class EntryListing extends React.Component {
     page: PropTypes.number,
   };
 
+  componentDidMount() {
+    // Manually validate PropTypes - React 19 breaking change
+    PropTypes.checkPropTypes(EntryListing.propTypes, this.props, 'prop', 'EntryListing');
+  };
+
   hasMore = () => {
     const hasMore = this.props.cursor?.actions?.has('append_next');
     return hasMore;

packages/decap-cms-core/src/components/Collection/NestedCollection.js

@@ -263,6 +263,11 @@ export class NestedCollection extends React.Component {
     };
   }
 
+  componentDidMount() {
+    // Manually validate PropTypes - React 19 breaking change
+    PropTypes.checkPropTypes(NestedCollection.propTypes, this.props, 'prop', 'NestedCollection');
+  };
+
   componentDidUpdate(prevProps) {
     const { collection, entries, filterTerm } = this.props;
     if (

packages/decap-cms-core/src/components/Collection/Sidebar.js

@@ -77,6 +77,11 @@ export class Sidebar extends React.Component {
     t: PropTypes.func.isRequired,
   };
 
+  componentDidMount() {
+    // Manually validate PropTypes - React 19 breaking change
+    PropTypes.checkPropTypes(Sidebar.propTypes, this.props, 'prop', 'Sidebar');
+  };
+
   renderLink = (collection, filterTerm) => {
     const collectionName = collection.get('name');
     if (collection.has('nested')) {

packages/decap-cms-core/src/components/Editor/Editor.js

@@ -82,6 +82,9 @@ export class Editor extends React.Component {
   };
 
   componentDidMount() {
+    // Manually validate PropTypes - React 19 breaking change
+    PropTypes.checkPropTypes(Editor.propTypes, this.props, 'prop', 'Editor');
+
     const {
       newEntry,
       collection,
@@ -94,9 +97,6 @@ export class Editor extends React.Component {
       t,
     } = this.props;
 
-    // Manually validate PropTypes - React 19 breaking change
-    PropTypes.checkPropTypes(Editor.propTypes, this.props, 'prop', 'Editor');
-
     retrieveLocalBackup(collection, slug);
 
     if (newEntry) {

packages/decap-cms-core/src/components/Editor/EditorControlPane/EditorControl.js

@@ -170,6 +170,11 @@ class EditorControl extends React.Component {
 
   uniqueFieldId = uniqueId(`${this.props.field.get('name')}-field-`);
 
+  componentDidMount() {
+    // Manually validate PropTypes - React 19 breaking change
+    PropTypes.checkPropTypes(EditorControl.propTypes, this.props, 'prop', 'EditorControl');
+  };
+
   isAncestorOfFieldError = () => {
     const { fieldsErrors } = this.props;
 

packages/decap-cms-core/src/components/Editor/EditorControlPane/Widget.js

@@ -75,6 +75,11 @@ export default class Widget extends Component {
     isParentListCollapsed: PropTypes.bool,
   };
 
+  componentDidMount() {
+    // Manually validate PropTypes - React 19 breaking change
+    PropTypes.checkPropTypes(Widget.propTypes, this.props, 'prop', 'Widget');
+  };
+
   shouldComponentUpdate(nextProps) {
     /**
      * Avoid unnecessary rerenders while loading assets.

packages/decap-cms-core/src/components/Editor/EditorToolbar.js

@@ -280,6 +280,9 @@ export class EditorToolbar extends React.Component {
   };
 
   componentDidMount() {
+    // Manually validate PropTypes - React 19 breaking change
+    PropTypes.checkPropTypes(EditorToolbar.propTypes, this.props, 'prop', 'EditorToolbar');
+
     const { isNewEntry, loadDeployPreview } = this.props;
     if (!isNewEntry) {
       loadDeployPreview({ maxAttempts: 3 });

packages/decap-cms-core/src/components/MediaLibrary/MediaLibrary.js

@@ -77,6 +77,9 @@ class MediaLibrary extends React.Component {
   };
 
   componentDidMount() {
+    // Manually validate PropTypes - React 19 breaking change
+    PropTypes.checkPropTypes(MediaLibrary.propTypes, this.props, 'prop', 'MediaLibrary');
+
     this.props.loadMedia();
   }
 

packages/decap-cms-core/src/components/UI/ErrorBoundary.js

@@ -150,6 +150,11 @@ export class ErrorBoundary extends React.Component {
     };
   }
 
+  componentDidMount() {
+    // Manually validate PropTypes - React 19 breaking change
+    PropTypes.checkPropTypes(ErrorBoundary.propTypes, this.props, 'prop', 'ErrorBoundary');
+  };
+
   shouldComponentUpdate(nextProps, nextState) {
     if (this.props.showBackup) {
       return (

packages/decap-cms-core/src/components/UI/Modal.js

@@ -63,6 +63,9 @@ export class Modal extends React.Component {
   };
 
   componentDidMount() {
+    // Manually validate PropTypes - React 19 breaking change
+    PropTypes.checkPropTypes(Modal.propTypes, this.props, 'prop', 'Modal');
+
     ReactModal.setAppElement('#nc-root');
   }
 

packages/decap-cms-core/src/components/Workflow/Workflow.js

@@ -67,6 +67,9 @@ class Workflow extends Component {
   };
 
   componentDidMount() {
+    // Manually validate PropTypes - React 19 breaking change
+    PropTypes.checkPropTypes(Workflow.propTypes, this.props, 'prop', 'Workflow');
+
     const { loadUnpublishedEntries, isEditorialWorkflow, collections } = this.props;
     if (isEditorialWorkflow) {
       loadUnpublishedEntries(collections);

packages/decap-cms-core/src/components/Workflow/WorkflowList.js

@@ -139,6 +139,11 @@ class WorkflowList extends React.Component {
     collections: ImmutablePropTypes.map.isRequired,
   };
 
+  componentDidMount() {
+    // Manually validate PropTypes - React 19 breaking change
+    PropTypes.checkPropTypes(WorkflowList.propTypes, this.props, 'prop', 'WorkflowList');
+  };
+
   handleChangeStatus = (newStatus, dragProps) => {
     const slug = dragProps.slug;
     const collection = dragProps.collection;

packages/decap-cms-ui-default/src/GoBackButton.js

@@ -26,6 +26,11 @@ export default class GoBackButton extends React.Component {
     t: PropTypes.func.isRequired,
   };
 
+  componentDidMount() {
+    // Manually validate PropTypes - React 19 breaking change
+    PropTypes.checkPropTypes(GoBackButton.propTypes, this.props, 'prop', 'GoBackButton');
+  };
+
   render() {
     const { href, t } = this.props;
 

packages/decap-cms-ui-default/src/Loader.js

@@ -66,6 +66,11 @@ export class Loader extends React.Component {
     currentItem: 0,
   };
 
+  componentDidMount() {
+    // Manually validate PropTypes - React 19 breaking change
+    PropTypes.checkPropTypes(Loader.propTypes, this.props, 'prop', 'Loader');
+  };
+
   componentWillUnmount() {
     if (this.interval) {
       clearInterval(this.interval);

packages/decap-cms-ui-default/src/ObjectWidgetTopBar.js

@@ -62,6 +62,11 @@ class ObjectWidgetTopBar extends React.Component {
     t: PropTypes.func.isRequired,
   };
 
+  componentDidMount() {
+    // Manually validate PropTypes - React 19 breaking change
+    PropTypes.checkPropTypes(ObjectWidgetTopBar.propTypes, this.props, 'prop', 'ObjectWidgetTopBar');
+  };
+
   renderAddUI() {
     if (!this.props.allowAdd) {
       return null;

packages/decap-cms-widget-code/src/CodeControl.js

@@ -98,6 +98,9 @@ export default class CodeControl extends React.Component {
   }
 
   componentDidMount() {
+    // Manually validate PropTypes - React 19 breaking change
+    PropTypes.checkPropTypes(CodeControl.propTypes, this.props, 'prop', 'CodeControl');
+
     this.setState({
       lang: this.getInitialLang() || '',
     });

packages/decap-cms-widget-colorstring/src/ColorControl.js

@@ -93,6 +93,10 @@ export default class ColorControl extends React.Component {
   state = {
     showColorPicker: false,
   };
+  componentDidMount() {
+    // Manually validate PropTypes - React 19 breaking change
+    PropTypes.checkPropTypes(ColorControl.propTypes, this.props, 'prop', 'ColorControl');
+  };
   // show/hide color picker
   handleClick = () => {
     this.setState({ showColorPicker: !this.state.showColorPicker });

packages/decap-cms-widget-datetime/src/DateTimeControl.js

@@ -63,6 +63,9 @@ class DateTimeControl extends React.Component {
   };
 
   componentDidMount() {
+    // Manually validate PropTypes - React 19 breaking change
+    PropTypes.checkPropTypes(DateTimeControl.propTypes, this.props, 'prop', 'DateTimeControl');
+
     const { value } = this.props;
     if (value === '{{now}}') {
       this.handleChange(this.getNow());