feat: migrate nextjs to rr7

apps/remix/app/components/general/refresh-on-focus.tsx

@@ -0,0 +1,26 @@
+import { useCallback, useEffect } from 'react';
+
+import { useRevalidator } from 'react-router';
+
+/**
+ * Not really used anymore, this causes random 500s when the user refreshes while this occurs.
+ */
+export const RefreshOnFocus = () => {
+  const { revalidate, state } = useRevalidator();
+
+  const onFocus = useCallback(() => {
+    if (state === 'idle') {
+      void revalidate();
+    }
+  }, [revalidate]);
+
+  useEffect(() => {
+    window.addEventListener('focus', onFocus);
+
+    return () => {
+      window.removeEventListener('focus', onFocus);
+    };
+  }, [onFocus]);
+
+  return null;
+};