refactor: move magnet torrent logic to a hook

src/common/NavBar/HorizontalNavBar/NavMenu/NavMenuContent.js

@@ -3,18 +3,19 @@
 const React = require('react');
 const PropTypes = require('prop-types');
 const classnames = require('classnames');
-const magnet = require('magnet-uri');
 const Icon = require('@stremio/stremio-icons/dom');
 const { useServices } = require('stremio/services');
 const Button = require('stremio/common/Button');
 const useFullscreen = require('stremio/common/useFullscreen');
 const useProfile = require('stremio/common/useProfile');
+const useTorrent = require('stremio/common/useTorrent');
 const { withCoreSuspender } = require('stremio/common/CoreSuspender');
 const styles = require('./styles');
 
 const NavMenuContent = ({ onClick }) => {
     const { core } = useServices();
     const profile = useProfile();
+    const { createTorrentFromMagnet } = useTorrent();
     const [fullscreen, requestFullscreen, exitFullscreen] = useFullscreen();
     const logoutButtonOnClick = React.useCallback(() => {
         core.transport.dispatch({
@@ -27,16 +28,7 @@ const NavMenuContent = ({ onClick }) => {
     const onPlayMagnetLinkClick = React.useCallback(async () => {
         try {
             const clipboardText = await navigator.clipboard.readText();
-            const parsed = magnet.decode(clipboardText);
-            if (parsed && typeof parsed.infoHash === 'string') {
-                core.transport.dispatch({
-                    action: 'StreamingServer',
-                    args: {
-                        action: 'CreateTorrent',
-                        args: clipboardText
-                    }
-                });
-            }
+            createTorrentFromMagnet(clipboardText);
         } catch(e) {
             console.error(e);
         }

src/common/NavBar/HorizontalNavBar/SearchBar/SearchBar.js

@@ -3,17 +3,17 @@
 const React = require('react');
 const PropTypes = require('prop-types');
 const classnames = require('classnames');
-const magnet = require('magnet-uri');
-const { useServices } = require('stremio/services');
 const Icon = require('@stremio/stremio-icons/dom');
 const { useRouteFocused } = require('stremio-router');
 const Button = require('stremio/common/Button');
 const TextInput = require('stremio/common/TextInput');
+const useTorrent = require('stremio/common/useTorrent');
+const { withCoreSuspender } = require('stremio/common/CoreSuspender');
 const styles = require('./styles');
 
 const SearchBar = ({ className, query, active }) => {
-    const { core } = useServices();
     const routeFocused = useRouteFocused();
+    const { createTorrentFromMagnet } = useTorrent();
     const searchInputRef = React.useRef(null);
     const searchBarOnClick = React.useCallback(() => {
         if (!active) {
@@ -22,17 +22,7 @@ const SearchBar = ({ className, query, active }) => {
     }, [active]);
     const queryInputOnChange = React.useCallback(() => {
         try {
-            const parsed = magnet.decode(searchInputRef.current.value);
-            if (parsed && typeof parsed.infoHash === 'string') {
-                core.transport.dispatch({
-                    action: 'StreamingServer',
-                    args: {
-                        action: 'CreateTorrent',
-                        args: searchInputRef.current.value
-                    }
-                });
-                searchInputRef.current.value = '';
-            }
+            createTorrentFromMagnet(searchInputRef.current.value);
             // eslint-disable-next-line no-empty
         } catch { }
     }, []);
@@ -80,4 +70,4 @@ SearchBar.propTypes = {
     active: PropTypes.bool
 };
 
-module.exports = SearchBar;
+module.exports = withCoreSuspender(SearchBar);

src/common/index.js

@@ -38,6 +38,7 @@ const useModelState = require('./useModelState');
 const useOnScrollToBottom = require('./useOnScrollToBottom');
 const useProfile = require('./useProfile');
 const useStreamingServer = require('./useStreamingServer');
+const useTorrent = require('./useTorrent');
 
 module.exports = {
     AddonDetailsModal,
@@ -80,5 +81,6 @@ module.exports = {
     useModelState,
     useOnScrollToBottom,
     useProfile,
-    useStreamingServer
+    useStreamingServer,
+    useTorrent
 };

src/common/useTorrent.js

@@ -0,0 +1,50 @@
+// Copyright (C) 2017-2022 Smart code 203358507
+
+const React = require('react');
+const magnet = require('magnet-uri');
+const { useServices } = require('stremio/services');
+const useToast = require('stremio/common/Toast/useToast');
+const useStreamingServer = require('stremio/common/useStreamingServer');
+
+const useTorrent = () => {
+    const { core } = useServices();
+    const streamingServer = useStreamingServer();
+    const toast = useToast();
+    const createTorrentTimeout = React.useRef(null);
+    const createTorrentFromMagnet = React.useCallback((text) => {
+        const parsed = magnet.decode(text);
+        if (parsed && typeof parsed.infoHash === 'string') {
+            core.transport.dispatch({
+                action: 'StreamingServer',
+                args: {
+                    action: 'CreateTorrent',
+                    args: text
+                }
+            });
+            clearTimeout(createTorrentTimeout.current);
+            createTorrentTimeout.current = setTimeout(() => {
+                toast.show({
+                    type: 'error',
+                    title: 'It\'s taking a long time to get metadata from the torrent.',
+                    timeout: 10000
+                });
+            }, 10000);
+        }
+    }, [toast]);
+    React.useEffect(() => {
+        if (streamingServer.torrent !== null) {
+            const [, { type }] = streamingServer.torrent;
+            if (type === 'Ready') {
+                clearTimeout(createTorrentTimeout.current);
+            }
+        }
+    }, [streamingServer.torrent]);
+    React.useEffect(() => {
+        return () => clearTimeout(createTorrentTimeout.current);
+    }, []);
+    return {
+        createTorrentFromMagnet
+    };
+};
+
+module.exports = useTorrent;