remove InferProps (#259)

remove InferProps
Sitecore · Sep 25, 2019 · e204577 · e204577
1 parent 08c3806
commit e204577
Show file tree

Hide file tree

Showing 9 changed files with 70 additions and 74 deletions.
diff --git a/packages/sitecore-jss-react/src/components/Date.tsx b/packages/sitecore-jss-react/src/components/Date.tsx
@@ -1,5 +1,5 @@
 import React from 'react';
-import PropTypes, { InferProps } from 'prop-types';
+import PropTypes from 'prop-types';
 
 export interface DateFieldProps {
   /** The date field data. */
@@ -21,7 +21,7 @@ export interface DateFieldProps {
   [htmlAttributes: string]: any;
 }
 
-export const DateField: React.SFC<DateFieldProps> = ({ field, tag, editable, render, ...otherProps }: DateFieldPropTypes) => {
+export const DateField: React.SFC<DateFieldProps> = ({ field, tag, editable, render, ...otherProps }) => {
   if (!field || (!field.editable && !field.value)) {
     return null;
   }
@@ -49,20 +49,18 @@ export const DateField: React.SFC<DateFieldProps> = ({ field, tag, editable, ren
   }
 };
 
-const dateFieldPropTypes = {
+DateField.propTypes = {
   field: PropTypes.shape({
     value: PropTypes.any,
     editable: PropTypes.string,
-  }),
+  }).isRequired,
   tag: PropTypes.string,
   editable: PropTypes.bool,
   render: PropTypes.func,
 };
 
-type DateFieldPropTypes = InferProps<typeof dateFieldPropTypes>;
-
 DateField.defaultProps = {
   editable: true,
 };
 
-DateField.displayName = 'Date';
+DateField.displayName = 'Date';
diff --git a/packages/sitecore-jss-react/src/components/File.tsx b/packages/sitecore-jss-react/src/components/File.tsx
@@ -1,4 +1,4 @@
-import PropTypes, { InferProps } from 'prop-types';
+import PropTypes from 'prop-types';
 import React from 'react';
 
 export interface FileFieldValue {
@@ -19,7 +19,7 @@ export interface FileProps {
   [attributeName: string]: any;
 }
 
-export const File: React.SFC<FileProps> = ({ field, children, ...otherProps }: FilePropTypes) => {
+export const File: React.SFC<FileProps> = ({ field, children, ...otherProps }) => {
   /*
     File fields cannot be managed via the EE. We never output "editable."
   */
@@ -43,18 +43,15 @@ export const File: React.SFC<FileProps> = ({ field, children, ...otherProps }: F
   return React.createElement('a', { ...anchorAttrs, ...otherProps }, linkText, children);
 };
 
-const filePropTypes = {
+File.propTypes = {
   field: PropTypes.oneOfType([
     PropTypes.shape({
       src: PropTypes.string,
     }),
     PropTypes.shape({
       value: PropTypes.object,
     }),
-  ]),
-  children: PropTypes.node
+  ]).isRequired,
 };
 
-type FilePropTypes = InferProps<typeof filePropTypes>;
-
-File.displayName = 'File';
+File.displayName = 'File';
diff --git a/packages/sitecore-jss-react/src/components/Image.tsx b/packages/sitecore-jss-react/src/components/Image.tsx
@@ -1,5 +1,5 @@
 import { mediaApi } from '@sitecore-jss/sitecore-jss';
-import PropTypes, { InferProps } from 'prop-types';
+import PropTypes from 'prop-types';
 import React from 'react';
 import ReactDOMServer from 'react-dom/server';
 import { convertAttributesToReactProps } from '../utils';
@@ -109,7 +109,7 @@ export const Image: React.SFC<ImageProps> = ({
   imageParams,
   field,
   ...otherProps
-}: ImagePropTypes) => {
+}) => {
   // allows the mistake of using 'field' prop instead of 'media' (consistent with other helpers)
   if (field && !media) {
     media = field;
@@ -155,7 +155,7 @@ export const Image: React.SFC<ImageProps> = ({
   return null; // we can't handle the truth
 };
 
-const imagePropTypes = {
+Image.propTypes = {
   media: PropTypes.oneOfType([
     PropTypes.shape({
       src: PropTypes.string,
@@ -166,14 +166,14 @@ const imagePropTypes = {
     }),
   ]),
   editable: PropTypes.bool,
-  imageParams: PropTypes.object,
-  field: PropTypes.any
+  imageParams: PropTypes.objectOf(PropTypes.oneOfType([
+    PropTypes.number.isRequired,
+    PropTypes.string.isRequired
+  ]).isRequired)
 };
 
-type ImagePropTypes = InferProps<typeof imagePropTypes>;
-
 Image.defaultProps = {
   editable: true,
 };
 
-Image.displayName = 'Image';
+Image.displayName = 'Image';
diff --git a/packages/sitecore-jss-react/src/components/Link.tsx b/packages/sitecore-jss-react/src/components/Link.tsx
@@ -1,5 +1,5 @@
 import React, { ReactElement } from 'react';
-import PropTypes, { InferProps } from 'prop-types';
+import PropTypes from 'prop-types';
 
 export interface LinkFieldValue {
   href?: string;
@@ -32,7 +32,7 @@ export type LinkProps = React.DetailedHTMLProps<React.AnchorHTMLAttributes<HTMLA
   showLinkTextWithChildrenPresent?: boolean;
 };
 
-export const Link: React.SFC<LinkProps> = ({ field, editable, children, showLinkTextWithChildrenPresent, ...otherProps }: LinkPropTypes) => {
+export const Link: React.SFC<LinkProps> = ({ field, editable, children, showLinkTextWithChildrenPresent, ...otherProps }) => {
   const dynamicField: any = field;
 
   if (!field || (!dynamicField.editableFirstPart && !dynamicField.value && !dynamicField.href)) {
@@ -93,7 +93,7 @@ export const Link: React.SFC<LinkProps> = ({ field, editable, children, showLink
   return <React.Fragment>{resultTags}</React.Fragment>;
 };
 
-const linkPropTypes = {
+Link.propTypes = {
   field: PropTypes.oneOfType([
     PropTypes.shape({
       href: PropTypes.string,
@@ -103,16 +103,12 @@ const linkPropTypes = {
       editableFirstPart: PropTypes.string,
       editableLastPart: PropTypes.string,
     }),
-  ]),
+  ]).isRequired,
   editable: PropTypes.bool,
-  showLinkTextWithChildrenPresent: PropTypes.bool,
-  children: PropTypes.node
 };
 
-type LinkPropTypes = InferProps<typeof linkPropTypes>;
-
 Link.defaultProps = {
   editable: true,
 };
 
-Link.displayName = 'Link';
+Link.displayName = 'Link';
diff --git a/packages/sitecore-jss-react/src/components/Placeholder.tsx b/packages/sitecore-jss-react/src/components/Placeholder.tsx
@@ -1,5 +1,5 @@
 import React from 'react';
-import { PlaceholderCommon, PlaceholderProps, PlaceholderCommonPropTypes } from './PlaceholderCommon';
+import { PlaceholderCommon, PlaceholderProps } from './PlaceholderCommon';
 import { withComponentFactory } from '../enhancers/withComponentFactory';
 import { ComponentRendering, HtmlElementRendering } from '@sitecore-jss/sitecore-jss';
 
@@ -22,13 +22,14 @@ function isRawRendering(rendering: HtmlElementRendering | ComponentRendering): r
 }
 
 class PlaceholderComponent extends PlaceholderCommon {
+  static propTypes = PlaceholderCommon.propTypes;
 
-  constructor(props: PlaceholderCommonPropTypes) {
+  constructor(props: PlaceholderComponentProps) {
     super(props);
   }
 
   render() {
-    let childProps: any = {...this.props};
+    let childProps: any = { ...this.props };
 
     delete childProps.componentFactory;
 
@@ -67,4 +68,4 @@ class PlaceholderComponent extends PlaceholderCommon {
   }
 }
 
-export const Placeholder = withComponentFactory<PlaceholderProps>(PlaceholderComponent);
+export const Placeholder = withComponentFactory(PlaceholderComponent);
diff --git a/packages/sitecore-jss-react/src/components/PlaceholderCommon.tsx b/packages/sitecore-jss-react/src/components/PlaceholderCommon.tsx
@@ -1,5 +1,5 @@
 import React from 'react';
-import PropTypes, { Requireable, InferProps } from 'prop-types';
+import PropTypes, { Requireable } from 'prop-types';
 import { MissingComponent } from '../components/MissingComponent';
 import { ComponentFactory } from '../components/sharedTypes';
 import { ComponentRendering, RouteData, Field, Item, HtmlElementRendering } from '@sitecore-jss/sitecore-jss';
@@ -49,20 +49,27 @@ export interface PlaceholderProps {
   [key: string]: any;
 }
 
-const placeholderCommonPropTypes = {
-  name: PropTypes.string.isRequired,
-  rendering: PropTypes.oneOfType(
-    [PropTypes.object, PropTypes.object] as [Requireable<RouteData>, Requireable<ComponentRendering>]
-  ).isRequired,
-  fields: PropTypes.object,
-  params: PropTypes.object,
-  missingComponentComponent: PropTypes.node,
-  errorComponent: PropTypes.node,
-};
-
-export type PlaceholderCommonPropTypes = InferProps<typeof placeholderCommonPropTypes>;
-
 export class PlaceholderCommon extends React.Component<PlaceholderProps> {
+  static propTypes = {
+    rendering: PropTypes.oneOfType([
+      PropTypes.object as Requireable<RouteData>,
+      PropTypes.object as Requireable<ComponentRendering>
+    ]).isRequired,
+    fields: PropTypes.objectOf(PropTypes.oneOfType([
+      PropTypes.object as Requireable<Field>,
+      PropTypes.object as Requireable<Item[]>
+    ]).isRequired),
+    params: PropTypes.objectOf(PropTypes.string.isRequired),
+    missingComponentComponent: PropTypes.oneOfType([
+      PropTypes.object as Requireable<React.ComponentClass<any>>,
+      PropTypes.object as Requireable<React.SFC<any>>
+    ]),
+    errorComponent: PropTypes.oneOfType([
+      PropTypes.object as Requireable<React.ComponentClass<any>>,
+      PropTypes.object as Requireable<React.SFC<any>>
+    ]),
+  };
+
   nodeRefs: any[];
   state: Readonly<{ error?: Error }>;
 
@@ -86,7 +93,7 @@ export class PlaceholderCommon extends React.Component<PlaceholderProps> {
     return result;
   }
 
-  constructor(props: PlaceholderCommonPropTypes) {
+  constructor(props: PlaceholderProps) {
     super(props);
     this.nodeRefs = [];
     this.state = {};
@@ -129,7 +136,7 @@ export class PlaceholderCommon extends React.Component<PlaceholderProps> {
       if (!component) {
         console.error(
           `Placeholder ${name} contains unknown component ${
-            rendering.componentName
+          rendering.componentName
           }. Ensure that a React component exists for it, and that it is registered in your componentFactory.js.`
         );
 
@@ -150,7 +157,7 @@ export class PlaceholderCommon extends React.Component<PlaceholderProps> {
 
       return React.createElement(component as any, finalProps);
     })
-    .filter((element: any) => element); // remove nulls
+      .filter((element: any) => element); // remove nulls
   }
 
   getComponentForRendering(renderingDefinition: { componentName: string }) {
@@ -212,4 +219,4 @@ export class PlaceholderCommon extends React.Component<PlaceholderProps> {
       }
     });
   }
-}
+}
diff --git a/packages/sitecore-jss-react/src/components/RichText.tsx b/packages/sitecore-jss-react/src/components/RichText.tsx
@@ -1,5 +1,5 @@
 import React from 'react';
-import PropTypes, { InferProps } from 'prop-types';
+import PropTypes from 'prop-types';
 
 export interface RichTextProps {
   /** The rich text field data. */
@@ -21,7 +21,7 @@ export interface RichTextProps {
   [htmlAttributes: string]: any;
 }
 
-export const RichText: React.SFC<RichTextProps> = ({ field, tag, editable, ...otherProps }: RichTextPropTypes) => {
+export const RichText: React.SFC<RichTextProps> = ({ field, tag, editable, ...otherProps }) => {
   if (!field || (!field.editable && !field.value)) {
     return null;
   }
@@ -36,20 +36,18 @@ export const RichText: React.SFC<RichTextProps> = ({ field, tag, editable, ...ot
   return React.createElement(tag || 'div', htmlProps);
 };
 
-const richTextPropTypes = {
+RichText.propTypes = {
   field: PropTypes.shape({
     value: PropTypes.string,
     editable: PropTypes.string,
-  }),
+  }).isRequired,
   tag: PropTypes.string,
   editable: PropTypes.bool,
 };
 
-type RichTextPropTypes = InferProps<typeof richTextPropTypes>;
-
 RichText.defaultProps = {
   tag: 'div',
   editable: true,
 };
 
-RichText.displayName = 'RichText';
+RichText.displayName = 'RichText';
diff --git a/packages/sitecore-jss-react/src/components/Text.tsx b/packages/sitecore-jss-react/src/components/Text.tsx
@@ -1,5 +1,5 @@
 import React from 'react';
-import PropTypes, { InferProps } from 'prop-types';
+import PropTypes from 'prop-types';
 
 export interface TextProps {
   /** The text field data. */
@@ -24,7 +24,7 @@ export interface TextProps {
   [htmlAttributes: string]: any;
 }
 
-export const Text: React.SFC<TextProps> = ({ field, tag, editable, encode, ...otherProps }: TextPropTypes) => {
+export const Text: React.SFC<TextProps> = ({ field, tag, editable, encode, ...otherProps }) => {
   if (!field || (!field.editable && !field.value)) {
     return null;
   }
@@ -58,21 +58,19 @@ export const Text: React.SFC<TextProps> = ({ field, tag, editable, encode, ...ot
   }
 };
 
-const textPropTypes = {
+Text.propTypes = {
   field: PropTypes.shape({
     value: PropTypes.any,
     editable: PropTypes.string,
-  }),
+  }).isRequired,
   tag: PropTypes.string,
   editable: PropTypes.bool,
   encode: PropTypes.bool,
 };
 
-type TextPropTypes = InferProps<typeof textPropTypes>;
-
 Text.defaultProps = {
   editable: true,
   encode: true,
 };
 
-Text.displayName = 'Text';
+Text.displayName = 'Text';