Convert withModal to useModal

client/js/components/modals/Topic.js

@@ -1,21 +1,26 @@
 import React from 'react';
+import Modal from 'react-modal';
+import { useSelector } from 'react-redux';
 import { FiX } from 'react-icons/fi';
 import Button from 'components/ui/Button';
-import withModal from 'components/modals/withModal';
+import useModal from 'components/modals/useModal';
+import { getSelectedChannel } from 'state/channels';
 import { linkify } from 'utils';
 
-const Topic = ({ payload: { topic, channel }, onClose }) => {
+const Topic = () => {
+  const [modal, channel, closeModal] = useModal('topic');
+
+  const topic = useSelector(state => getSelectedChannel(state)?.topic);
+
   return (
-    <>
+    <Modal {...modal}>
       <div className="modal-header">
         <h2>Topic in {channel}</h2>
-        <Button icon={FiX} className="modal-close" onClick={onClose} />
+        <Button icon={FiX} className="modal-close" onClick={closeModal} />
       </div>
       <p className="modal-content">{linkify(topic)}</p>
-    </>
+    </Modal>
   );
 };
 
-export default withModal({
-  name: 'topic'
-})(Topic);
+export default Topic;