Fix hoc typing

See: microsoft/TypeScript#28938 (comment)
nusmodifications · Feb 11, 2019 · 8dad8a3 · 8dad8a3
1 parent 5be1ef7
commit 8dad8a3
Show file tree

Hide file tree

Showing 2 changed files with 9 additions and 5 deletions.
diff --git a/www/src/js/views/hocs/makeResponsive.tsx b/www/src/js/views/hocs/makeResponsive.tsx
@@ -8,7 +8,7 @@ export interface WithBreakpoint {
   matchBreakpoint: boolean;
 }
 
-function makeResponsive<Props>(
+function makeResponsive<Props extends WithBreakpoint>(
   WrappedComponent: React.ComponentType<Props>,
   mediaQuery: string | QueryObject | QueryObject[],
 ): React.ComponentType<Omit<Props, keyof WithBreakpoint>> {
@@ -43,8 +43,11 @@ function makeResponsive<Props>(
     };
 
     render() {
-      // @ts-ignore TODO: Figure out what's wrong here
-      return <WrappedComponent matchBreakpoint={this.state.matchBreakpoint} {...this.props} />;
+      return (
+        // TODO: remove as Props hack as defined in:
+        // https://github.com/Microsoft/TypeScript/issues/28938#issuecomment-450636046
+        <WrappedComponent {...this.props as Props} matchBreakpoint={this.state.matchBreakpoint} />
+      );
     }
   };
 }

diff --git a/www/src/js/views/hocs/withTimer.tsx b/www/src/js/views/hocs/withTimer.tsx
@@ -53,8 +53,9 @@ function withTimer<Props extends TimerData>(
     };
 
     render() {
-      // @ts-ignore TODO: Figure out what's wrong here
-      return <WrappedComponent {...this.state} {...this.props} />;
+      // TODO: remove as Props hack as defined in:
+      // https://github.com/Microsoft/TypeScript/issues/28938#issuecomment-450636046
+      return <WrappedComponent {...this.state} {...this.props as Props} />;
     }
   };
 }