Updating ip info service

Closes #482

CHANGELOG.md

@@ -3,6 +3,12 @@
 All notable changes to this project will be documented in this file.
 The format is based on [Keep a Changelog](http://keepachangelog.com/en/1.0.0/).
 
+## [Unreleased]
+
+### Fixed
+
+- Updated IP Info widget with a more reliable service and more frequent updates
+
 ## [2.6.0] - 2022-04-25
 
 ### Added

src/plugins/widgets/ipInfo/IpInfo.tsx

@@ -1,36 +1,28 @@
-import React, { FC } from "react";
-
-import { useCachedEffect } from "../../../hooks";
-
-import { Props, defaultData } from "./types";
+import React from "react";
+import { usePushError } from "../../../api";
 import { getIpInfo } from "./api";
-import { MINUTES } from "../../../utils";
-
-const IpInfo: FC<Props> = ({ cache, data = defaultData, setCache, loader }) => {
-  const refreshInterval = data.refreshInterval * MINUTES;
-
-  useCachedEffect(
-    () => {
-      getIpInfo(loader).then(setCache);
-    },
-    cache ? cache.timestamp + refreshInterval : 0,
-    [],
-  );
+import { defaultData, Props } from "./types";
+
+const IpInfo: React.FC<Props> = ({
+  cache,
+  data = defaultData,
+  setCache,
+  loader,
+}) => {
+  const pushError = usePushError();
+  React.useEffect(() => {
+    getIpInfo(loader).then(setCache).catch(pushError);
+  }, []);
 
   if (!cache) {
     return null;
   }
 
-  return (
-    <div className="IpInfo">
-      {cache.ip ? cache.ip : data.ip}
-
-      {data.displayCity && (cache.city ? ", " + cache.city : data.city)}
+  const info = [cache.ip];
+  if (data.displayCity) info.push(cache.city);
+  if (data.displayCountry) info.push(cache.country);
 
-      {data.displayCountry &&
-        (cache.country ? ", " + cache.country : data.country)}
-    </div>
-  );
+  return <div className="IpInfo">{info.join(", ")}</div>;
 };
 
 export default IpInfo;

src/plugins/widgets/ipInfo/IpInfoSettings.tsx

@@ -1,8 +1,7 @@
-import React, { FC } from "react";
+import React from "react";
+import { defaultData, Props } from "./types";
 
-import { Props, defaultData } from "./types";
-
-const IpInfoSettings: FC<Props> = ({ data = defaultData, setData }) => (
+const IpInfoSettings: React.FC<Props> = ({ data = defaultData, setData }) => (
   <div className="IpInfoSettings">
     <label>
       <input
@@ -23,19 +22,6 @@ const IpInfoSettings: FC<Props> = ({ data = defaultData, setData }) => (
       />
       Display Country
     </label>
-
-    <label>
-      Refresh interval (minutes)
-      <input
-        type="number"
-        value={data.refreshInterval}
-        onChange={(event) =>
-          setData({ ...data, refreshInterval: Number(event.target.value) })
-        }
-        min={1}
-        max={60}
-      />
-    </label>
   </div>
 );
 

src/plugins/widgets/ipInfo/api.ts

@@ -1,18 +1,16 @@
 import { API } from "../../types";
-
 import { IpData } from "./types";
 
 export async function getIpInfo(loader: API["loader"]): Promise<IpData> {
   loader.push();
 
-  const data = await fetch("https://www.gogeoip.com/json/?user")
+  const data = await fetch("https://ipwho.is/")
     .then((res) => res.json())
     .finally(() => loader.pop());
 
   return {
-    ip: data && data.network && data.network.ip,
-    city: data && data.location && data.location.city,
-    country: data && data.location && data.location.country.name,
-    timestamp: Date.now(),
+    ip: data.ip,
+    city: data.city,
+    country: data.country,
   };
 }

src/plugins/widgets/ipInfo/types.ts

@@ -1,30 +1,21 @@
 import { API } from "../../types";
 
 type Data = {
-  ip: string;
-  city: string;
-  country: string;
   displayCity: boolean;
   displayCountry: boolean;
-  refreshInterval: number;
 };
 
 export type IpData = {
   ip: string;
   city: string;
   country: string;
-  timestamp: number;
 };
 
 type Cache = IpData;
 
 export type Props = API<Data, Cache>;
 
 export const defaultData: Data = {
-  ip: "Fetching IP data...",
-  city: "",
-  country: "",
   displayCity: true,
   displayCountry: true,
-  refreshInterval: 5,
 };