Moved connection functions to main

frontend/src/components/ConnectionBlock.js

@@ -1,16 +1,17 @@
 import { useState, useEffect } from 'react';
 import ScanBlock from './ScanBlock';
 import Table from './Table';
+import { getConnection } from './main';
 
 const ConnectionBlock = () => {
-  const [connectData, setConnectData] = useState('');
+  const [data, setData] = useState('');
   const [display, setDisplay] = useState('');
 
   useEffect(() => {
     fetch('https://api.vytal.io/ip/')
       .then((response) => response.json())
-      .then((data) => {
+      .then((json) => {
-        setConnectData(data);
+        setData(getConnection(json));
         setDisplay(1);
       })
       .catch(() => {
@@ -18,47 +19,6 @@ const ConnectionBlock = () => {
       });
   }, []);
 
-  const detectTor = () => {
-    const date = new Date();
-    if (
-      navigator.plugins.length === 0 &&
-      date.getTimezoneOffset() === 0 &&
-      window.outerWidth === window.screen.availWidth &&
-      window.outerHeight === window.screen.availHeight
-    ) {
-      return true;
-    }
-    return false;
-  };
-
-  const data = [
-    {
-      key: 'ipAddress',
-      title: 'IP address',
-      value: connectData.query,
-    },
-    {
-      key: 'isp',
-      title: 'ISP',
-      value: connectData.isp,
-    },
-    {
-      key: 'org',
-      title: 'Organization',
-      value: connectData.org,
-    },
-    {
-      key: 'asn',
-      title: 'ASN',
-      value: connectData.as,
-    },
-    {
-      key: 'tor',
-      title: 'Tor browser detected',
-      value: detectTor() ? 'True' : 'False',
-    },
-  ];
-
   return (
     <ScanBlock>
       <h1>Connection</h1>

frontend/src/components/main.js

@@ -4,6 +4,8 @@ import axios from 'axios';
 
 export {
   getLocation,
+  getConnection,
+  detectTor,
   getSoftware,
   getHardware,
   getWebGL,
@@ -14,42 +16,86 @@ export {
   handleSave,
 };
 
-const getLocation = (locationData) => {
+const getLocation = (json) => {
   const data = [
     {
       key: 'country',
       title: 'Country',
-      value: locationData.country,
+      value: json.country,
     },
     {
       key: 'regionName',
       title: 'Region',
-      value: locationData.regionName,
+      value: json.regionName,
     },
     {
       key: 'lat',
       title: 'City',
-      value: locationData.city,
+      value: json.city,
     },
     {
       key: 'zip',
       title: 'Zip code',
-      value: locationData.zip,
+      value: json.zip,
     },
     {
       key: 'lat',
       title: 'Latitude',
-      value: locationData.lat,
+      value: json.lat,
     },
     {
       key: 'lon',
       title: 'Longitude',
-      value: locationData.lon,
+      value: json.lon,
     },
   ];
   return data;
 };
 
+const getConnection = (json) => {
+  const data = [
+    {
+      key: 'ipAddress',
+      title: 'IP address',
+      value: json.query,
+    },
+    {
+      key: 'isp',
+      title: 'ISP',
+      value: json.isp,
+    },
+    {
+      key: 'org',
+      title: 'Organization',
+      value: json.org,
+    },
+    {
+      key: 'asn',
+      title: 'ASN',
+      value: json.as,
+    },
+    {
+      key: 'tor',
+      title: 'Tor browser detected',
+      value: detectTor() ? 'True' : 'False',
+    },
+  ];
+  return data;
+};
+
+const detectTor = () => {
+  const date = new Date();
+  if (
+    navigator.plugins.length === 0 &&
+    date.getTimezoneOffset() === 0 &&
+    window.outerWidth === window.screen.availWidth &&
+    window.outerHeight === window.screen.availHeight
+  ) {
+    return true;
+  }
+  return false;
+};
+
 const getHardware = () => {
   const data = [
     {