Added section about router methods returning a promise (vercel#31341)

This PR adds a section on certain router methods returning a promise, and the error you will see if you have no-floating-promises enabled.

## Bug

- [x] Related issues linked using fixes: vercel#31337
- [ ] Integration tests added
- [ ] Errors have helpful link attached, see `contributing.md`

## Feature

- [ ] Implements an existing feature request or RFC. Make sure the feature request has been accepted for implementation before opening a PR.
- [ ] Related issues linked using `fixes #number`
- [ ] Integration tests added
- [ ] Documentation added
- [ ] Telemetry added. In case of a feature if it's used or not.
- [ ] Errors have helpful link attached, see `contributing.md`

## Documentation / Examples

- [ ] Make sure the linting passes by running `yarn lint`

Author: molebox

docs/api-reference/next/router.md

@@ -53,7 +53,7 @@ The following is the definition of the `router` object returned by both [`useRou
 - `isReady`: `boolean` - Whether the router fields are updated client-side and ready for use. Should only be used inside of `useEffect` methods and not for conditionally rendering on the server.
 - `isPreview`: `boolean` - Whether the application is currently in [preview mode](/docs/advanced-features/preview-mode.md).
 
-Additionally, the following methods are also included inside `router`:
+The following methods are included inside `router`:
 
 ### router.push
 
@@ -414,6 +414,53 @@ export default function MyApp({ Component, pageProps }) {
 }
 ```
 
+## Potential ESLint errors
+
+Certain methods accessible on the `router` object return a Promise. If you have the ESLint rule, [no-floating-promises](https://github.com/typescript-eslint/typescript-eslint/blob/master/packages/eslint-plugin/docs/rules/no-floating-promises.md) enabled, consider disabling it either globally, or for the affected line.
+
+If your application needs this rule, you should either `void` the promise – or use an `async` function, `await` the Promise, then void the function call. **This is not applicable when the method is called from inside an `onClick` handler**.
+
+The affected methods are:
+
+- `router.push`
+- `router.replace`
+- `router.prefetch`
+
+### Potential solutions
+
+```jsx
+import { useEffect } from 'react'
+import { useRouter } from 'next/router'
+
+// Here you would fetch and return the user
+const useUser = () => ({ user: null, loading: false })
+
+export default function Page() {
+  const { user, loading } = useUser()
+  const router = useRouter()
+
+  useEffect(() => {
+    // disable the linting on the next line - This is the cleanest solution
+    // eslint-disable-next-line no-floating-promises
+    router.push('/login')
+
+    // void the Promise returned by router.push
+    if (!(user || loading)) {
+      void router.push('/login')
+    }
+    // or use an async function, await the Promise, then void the function call
+    async function handleRouteChange() {
+      if (!(user || loading)) {
+        await router.push('/login')
+      }
+    }
+    void handleRouteChange()
+  }, [user, loading])
+
+  return <p>Redirecting...</p>
+}
+```
+
 ## withRouter
 
 If [`useRouter`](#useRouter) is not the best fit for you, `withRouter` can also add the same [`router` object](#router-object) to any component.