migration

Author: MacKentoch

front/src/hoc/withEnterAnimation/index.js front/src/hoc/withEnterAnimation/index.tsfront/src/hoc/withEnterAnimation/index.js renamed to front/src/hoc/withEnterAnimation/index.ts

@@ -1,4 +1,3 @@
-// @flow
 
 import withEnterAnimation from './withEnterAnimation';
 

…withEnterAnimation/styled/AnimatedDiv.js …ithEnterAnimation/styled/AnimatedDiv.tsxfront/src/hoc/withEnterAnimation/styled/AnimatedDiv.js renamed to front/src/hoc/withEnterAnimation/styled/AnimatedDiv.tsx front/src/hoc/withEnterAnimation/styled/AnimatedDiv.js renamed to front/src/hoc/withEnterAnimation/styled/AnimatedDiv.tsx

@@ -1,8 +1,4 @@
-// @flow
-
-// @region imports
-import styled, { keyframes, css } from 'styled-components';
-// #endregion
+import styled, { keyframes, css, ThemeProps } from 'styled-components';
 
 const fadeIn = keyframes`
   from {
@@ -14,7 +10,12 @@ const fadeIn = keyframes`
   }
 `;
 
-const AnimatedDiv = styled.div`
+type Props = {
+  readonly theme: ThemeProps<any>;
+  readonly viewEnter: boolean;
+};
+
+const AnimatedDiv = styled.div<Props>`
   ${({ viewEnter }) =>
     viewEnter &&
     css`

…withEnterAnimation/withEnterAnimation.js …ithEnterAnimation/withEnterAnimation.tsxfront/src/hoc/withEnterAnimation/withEnterAnimation.js renamed to front/src/hoc/withEnterAnimation/withEnterAnimation.tsx front/src/hoc/withEnterAnimation/withEnterAnimation.js renamed to front/src/hoc/withEnterAnimation/withEnterAnimation.tsx

@@ -1,12 +1,9 @@
-// @flow
-
-// #region imports
 import React, { Component } from 'react';
+// @ts-ignore
 import wrapDisplayName from 'recompose/wrapDisplayName';
 import AnimatedDiv from './styled/AnimatedDiv';
-// #endregion
 
-// #region flow types
+// #region types
 type Props = any;
 
 type State = any;
@@ -19,7 +16,7 @@ function withEnterAnimation() {
         const { ...passProps } = this.props;
 
         return (
-          <AnimatedDiv viewEnter={true}>
+          <AnimatedDiv viewEnter>
             <BaseComponent {...passProps} />
           </AnimatedDiv>
         );
@@ -29,7 +26,7 @@ function withEnterAnimation() {
     /* eslint-disable no-process-env */
     if (process.env.NODE_ENV !== 'production') {
       // HOC would obfuscate component name, this trick is helpful for dev (we don't care in production)
-      WithEnterAnimation.displayName = wrapDisplayName(
+      (WithEnterAnimation as any).displayName = wrapDisplayName(
         BaseComponent,
         'withEnterAnimation',
       );