Add use hook API reference page (#6177)

* [WIP] Add use hook API reference page

* [WIP] Update use hook API reference page based on feedback

* [WIP] use hook API ref doc: add browser API example

* [WIP] use hook API ref doc: add context, lib examples

* [WIP] use reference doc - incorporate all current feedback

* [WIP] use reference page fix typos

* use reference doc: address PR feedback from Luna, Sophia,Eli, and Lee

* Apply @harish-sethuraman's typo fixes from code review

Co-authored-by: Strek <[email protected]>

* use reference doc typo fixes

* use reference doc: update style to match other react.dev conventions

* minor fixes

* Remove client Promises, use canary labels

* Add use hook section to index, remove RSC section on components page

* Final edits

* Clarify use reference caveats

---------

Co-authored-by: Strek <[email protected]>

Author: mattcarrollcode

src/content/reference/react/index.md

@@ -106,6 +106,24 @@ To prioritize rendering, use one of these Hooks:
 
 ---
 
+## Resource Hooks {/*resource-hooks*/}
+
+*Resources* can be accessed by a component without having them as part of their state. For example, a component can read a message from a Promise or read styling information from a context.
+
+To read a value from a resource, use this Hook:
+
+- [`use`](/reference/react/use) lets you read the value of a resource like a [Promise](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Promise) or [context](/learn/passing-data-deeply-with-context).
+
+```js
+function MessageComponent({ messagePromise }) {
+  const message = use(messagePromise);
+  const theme = use(ThemeContext);
+  // ...
+}
+```
+
+---
+
 ## Other Hooks {/*other-hooks*/}
 
 These Hooks are mostly useful to library authors and aren't commonly used in the application code.