Add docs for x-nextjs-cache header (vercel#36023)

This adds documentation for the `x-nextjs-cache` header which is now exposed for ISR pages and image optimization requests to help signal the cache state. 

## Documentation / Examples

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

Co-authored-by: Steven <steven@ceriously.com>

docs/api-reference/data-fetching/get-static-props.md

@@ -83,6 +83,12 @@ export async function getStaticProps() {
 
 Learn more about [Incremental Static Regeneration](/docs/basic-features/data-fetching/incremental-static-regeneration.md)
 
+The cache status of a page leveraging ISR can be determined by reading the value of the `x-nextjs-cache` response header. The possible values are the following:
+
+- `MISS` - the path is not in the cache (occurs at most once, on the first visit)
+- `STALE` - the path is in the cache but exceeded the revalidate time so it will be updated in the background
+- `HIT` - the path is in the cache and has not exceeded the revalidate time
+
 ### `notFound`
 
 The `notFound` boolean allows the page to return a `404` status and [404 Page](/docs/advanced-features/custom-error-page.md#404-page). With `notFound: true`, the page will return a `404` even if there was a successfully generated page before. This is meant to support use cases like user-generated content getting removed by its author. Note, `notFound` follows the same `revalidate` behavior [described here](/docs/api-reference/data-fetching/get-static-props.md#revalidate)

docs/api-reference/next/image.md

@@ -422,6 +422,12 @@ The following describes the caching algorithm for the default [loader](#loader).
 
 Images are optimized dynamically upon request and stored in the `<distDir>/cache/images` directory. The optimized image file will be served for subsequent requests until the expiration is reached. When a request is made that matches a cached but expired file, the expired image is served stale immediately. Then the image is optimized again in the background (also called revalidation) and saved to the cache with the new expiration date.
 
+The cache status of an image can be determined by reading the value of the `x-nextjs-cache` response header. The possible values are the following:
+
+- `MISS` - the path is not in the cache (occurs at most once, on the first visit)
+- `STALE` - the path is in the cache but exceeded the revalidate time so it will be updated in the background
+- `HIT` - the path is in the cache and has not exceeded the revalidate time
+
 The expiration (or rather Max Age) is defined by either the [`minimumCacheTTL`](#minimum-cache-ttl) configuration or the upstream server's `Cache-Control` header, whichever is larger. Specifically, the `max-age` value of the `Cache-Control` header is used. If both `s-maxage` and `max-age` are found, then `s-maxage` is preferred.
 
 - You can configure [`minimumCacheTTL`](#minimum-cache-ttl) to increase the cache duration when the upstream image does not include `Cache-Control` header or the value is very low.