👌 move hoc to components folder

Author: ghalestrilo

client/components/useAsModal.jsx

@@ -0,0 +1,10 @@
+import React from 'react';
+import { useModalBehavior } from '../utils/custom-hooks';
+
+export default (component) => {
+  const [visible, trigger, setRef] = useModalBehavior();
+
+  const wrapper = () => <div ref={setRef}> {visible && component} </div>; // eslint-disable-line
+
+  return [trigger, wrapper];
+};

client/modules/IDE/pages/MobileIDEView.jsx

@@ -31,7 +31,7 @@ import Console from '../components/Console';
 import { remSize } from '../../../theme';
 // import OverlayManager from '../../../components/OverlayManager';
 import ActionStrip from '../../../components/mobile/ActionStrip';
-import { useAsModal } from '../../../utils/custom-hooks';
+import useAsModal from '../../../components/useAsModal';
 import { PreferencesIcon } from '../../../common/icons';
 import Dropdown from '../../../components/Dropdown';
 

client/utils/custom-hooks.js

@@ -1,4 +1,4 @@
-import React, { useEffect, useRef, useMemo, useState } from 'react';
+import React, { useEffect, useRef, useState } from 'react';
 
 export const noop = () => {};
 
@@ -40,12 +40,3 @@ export const useModalBehavior = (hideOverlay) => {
 
   return [visible, trigger, setRef];
 };
-
-// TODO: This is HOC, not a hook. Where do we put it?
-export const useAsModal = (component) => {
-  const [visible, trigger, setRef] = useModalBehavior();
-
-  const wrapper = () => (<div ref={setRef}> {visible && component} </div>); // eslint-disable-line
-
-  return [trigger, wrapper];
-};