How do I create a typescript definition file (d.ts) for an existing redux connected (jsx)component?

Question

I'm adding new components written in TypeScript(tsx) to an existing codebase consisting of vanilla ES6 react components(jsx). When importing the existing jsx-components into a tsx-component I'm adding type defintions for the jsx-components.

My issue is how do I add a type definition for a jsx-component that is connected to redux using connect

Say I have an existing jsx component:

class DateField extends React.Component {
...
}

function mapStateToProps(state) {
  return {
    locale: state.systemUser.language.langKey
  };
}

export default connect(mapStateToProps) (DateField);

How would a typedefintion look like for this component?

Note: without the connect I would write the typedefinition like:

import * as React from 'react';
import * as moment from "moment";

export type IonDateFieldChange = (value: string | Date | moment.Moment) => void;
export interface IDateFieldProps {
  value: string | Date | moment.Moment
  onChange?: IonDateFieldChange
  placeholder?: string
}
declare class DateField extends React.Component<IDateFieldProps,any> {}

Veii

Have you figured this out yet? If so please answer your own question. – Nicotine