Moved mercure hub binding from custom hook to HOC

src/mercure/helpers/boundToMercureHub.tsx

@@ -0,0 +1,26 @@
+import React, { FC, useEffect } from 'react';
+import { CreateVisit } from '../../visits/types';
+import { MercureInfo } from '../reducers/mercureInfo';
+import { bindToMercureTopic } from './index';
+
+export interface MercureBoundProps {
+  createNewVisit: (visitData: CreateVisit) => void;
+  loadMercureInfo: Function;
+  mercureInfo: MercureInfo;
+}
+
+export function boundToMercureHub<T = {}>(
+  WrappedComponent: FC<MercureBoundProps & T>,
+  getTopicForProps: (props: T) => string,
+) {
+  return (props: MercureBoundProps & T) => {
+    const { createNewVisit, loadMercureInfo, mercureInfo } = props;
+
+    useEffect(
+      bindToMercureTopic(mercureInfo, getTopicForProps(props), createNewVisit, loadMercureInfo),
+      [ mercureInfo ],
+    );
+
+    return <WrappedComponent {...props} />;
+  };
+}

src/mercure/helpers/index.ts

@@ -1,4 +1,3 @@
-import { useEffect } from 'react';
 import { EventSourcePolyfill as EventSource } from 'event-source-polyfill';
 import { MercureInfo } from '../reducers/mercureInfo';
 
@@ -23,18 +22,3 @@ export const bindToMercureTopic = <T>(mercureInfo: MercureInfo, topic: string, o
 
   return () => es.close();
 };
-
-export const useMercureTopicBinding = <T>(
-  mercureInfo: MercureInfo,
-  topic: string,
-  onMessage: (message: T) => void,
-  onTokenExpired: Function,
-) => {
-  useEffect(bindToMercureTopic(mercureInfo, topic, onMessage, onTokenExpired), [ mercureInfo ]);
-};
-
-export interface MercureBoundProps {
-  createNewVisit: (message: any) => void;
-  loadMercureInfo: Function;
-  mercureInfo: MercureInfo;
-}