Delay fetching of streams due to rate limiting.

src/Streams.jsx

@@ -1,11 +1,22 @@
 import { Heading } from "@qwhub/Common";
 import { useGetStreamsQuery } from "@qwhub/services/hub/hub";
-import React, { Fragment } from "react";
+import React, { Fragment, useState } from "react";
+import { useTimeout } from "usehooks-ts";
 import { TwitchButton } from "./Buttons";
 
+function useDelay(delay) {
+  const [skip, setSkip] = useState(true);
+  useTimeout(() => {
+    setSkip(false);
+  }, delay);
+  return skip;
+}
+
 export function FeaturedStreams() {
+  const skip = useDelay(1500);
   const { data: streams = [] } = useGetStreamsQuery(null, {
     pollingInterval: 15500,
+    skip,
   });
 
   return (
@@ -26,7 +37,8 @@ const FeaturedStream = (props) => {
 };
 
 export function AllStreams() {
-  const { data: streams = [] } = useGetStreamsQuery(null);
+  const skip = useDelay(1520);
+  const { data: streams = [] } = useGetStreamsQuery(null, { skip });
 
   return (
     <div className="app-links my-8">