Renamed useCacheValue to useImperativeCacheValue

packages/suspense-website/index.tsx

@@ -29,7 +29,7 @@ import IsPromiseLikeRoute from "./src/routes/api/isPromiseLike";
 import PageNotFoundRoute from "./src/routes/PageNotFound";
 import UseCacheMutationRoute from "./src/routes/api/useCacheMutation";
 import UseCacheStatusRoute from "./src/routes/api/useCacheStatus";
-import UseCacheValueRoute from "./src/routes/api/useCacheValue";
+import UseCacheValueRoute from "./src/routes/api/useImperativeCacheValue";
 import UseStreamingValuesRoute from "./src/routes/api/useStreamingValues";
 import AbortingRequestRoute from "./src/routes/examples/aborting-a-request";
 import MemoryManagementRoute from "./src/routes/examples/memory-management";

packages/suspense-website/src/examples/index.ts

@@ -196,9 +196,9 @@ const useCacheMutation = {
   ),
 };
 
-const useCacheValue = {
+const useImperativeCacheValue = {
   hook: processExample(
-    readFileSync(join(__dirname, "useCacheValue", "hook.ts"), "utf8")
+    readFileSync(join(__dirname, "useImperativeCacheValue", "hook.ts"), "utf8")
   ),
 };
 
@@ -211,5 +211,5 @@ export {
   demos,
   isPromiseLike,
   useCacheMutation,
-  useCacheValue,
+  useImperativeCacheValue,
 };

packages/suspense-website/src/examples/useCacheValue/hook.ts → packages/suspense-website/src/examples/useImperativeCacheValue/hook.ts

@@ -6,11 +6,14 @@ import {
   STATUS_PENDING,
   STATUS_REJECTED,
   STATUS_RESOLVED,
-  useCacheValue,
+  useImperativeCacheValue,
 } from "suspense";
 
 function Example({ userId }: { userId: string }) {
-  const { error, status, value } = useCacheValue(userProfileCache, userId);
+  const { error, status, value } = useImperativeCacheValue(
+    userProfileCache,
+    userId
+  );
 
   switch (status) {
     case STATUS_PENDING:

packages/suspense-website/src/routes/Home.tsx

@@ -88,7 +88,7 @@ export default function Route() {
             type="code"
           />
           <LinkListItem
-            children="useCacheValue"
+            children="useImperativeCacheValue"
             to={USE_CACHE_VALUE}
             type="code"
           />

packages/suspense-website/src/routes/api/useCacheValue.tsx → packages/suspense-website/src/routes/api/useImperativeCacheValue.tsx

@@ -5,22 +5,22 @@ import Container from "../../components/Container";
 import Header from "../../components/Header";
 import Note from "../../components/Note";
 import SubHeading from "../../components/SubHeading";
-import { useCacheValue } from "../../examples";
+import { useImperativeCacheValue } from "../../examples";
 
 export default function Route() {
   return (
     <Container>
       <Block>
-        <Header title="useCacheValue" />
+        <Header title="useImperativeCacheValue" />
       </Block>
       <Block>
         <SubHeading title="Loading data without Suspense" />
         <p>
           Data can be fetched without suspending using the{" "}
-          <code>useCacheValue</code> hook. (This hook uses the imperative{" "}
-          <code>readAsync</code> API, called from an effect.)
+          <code>useImperativeCacheValue</code> hook. (This hook uses the
+          imperative <code>readAsync</code> API, called from an effect.)
         </p>
-        <Code code={useCacheValue.hook} />
+        <Code code={useImperativeCacheValue.hook} />
       </Block>
       <Note type="warn">
         <p>

packages/suspense-website/src/routes/config.ts

@@ -7,7 +7,7 @@ export const CREATE_STREAMING_CACHE = "/createStreamingCache";
 export const IS_PROMISE_LIKE = "/isPromiseLike";
 export const USE_CACHE_MUTATION = "/useCacheMutation";
 export const USE_CACHE_STATUS = "/useCacheStatus";
-export const USE_CACHE_VALUE = "/useCacheValue";
+export const USE_CACHE_VALUE = "/useImperativeCacheValue";
 export const USE_STREAMING_CACHE = "/useStreamingValues";
 
 // Guides

packages/suspense/CHANGELOG.md

@@ -1,5 +1,8 @@
 # Changelog
 
+## 0.0.17
+* Renamed `useCacheValue` to `useImperativeCacheValue` to make it clearer that the hook is an escape hatch.
+
 ## 0.0.16
 * Add `useCacheValue` hook for loading values using the imperative cache API rather than Suspense.
 

packages/suspense/src/hooks/useCacheValue.test.tsx → packages/suspense/src/hooks/useImperativeCacheValue.test.tsx

@@ -13,9 +13,9 @@ import {
 } from "../constants";
 import { Cache, CacheLoadOptions, Deferred, Status } from "../types";
 import { createDeferred } from "../utils/createDeferred";
-import { useCacheValue } from "./useCacheValue";
+import { useImperativeCacheValue } from "./useImperativeCacheValue";
 
-describe("useCacheValue", () => {
+describe("useImperativeCacheValue", () => {
   let cache: Cache<[string], string>;
   let fetch: jest.Mock<Promise<string> | string, [string, CacheLoadOptions]>;
   let getCacheKey: jest.Mock<string, [string]>;
@@ -25,7 +25,7 @@ describe("useCacheValue", () => {
   let pendingDeferred: Deferred<string>[] = [];
 
   function Component({ string }: { string: string }): any {
-    const result = useCacheValue(cache, string);
+    const result = useImperativeCacheValue(cache, string);
 
     lastRenderedError = result.error;
     lastRenderedStatus = result.status;

packages/suspense/src/hooks/useCacheValue.ts → packages/suspense/src/hooks/useImperativeCacheValue.ts

@@ -20,7 +20,7 @@ export type ResolvedResponse<Value> = {
   value: Value;
 };
 
-export function useCacheValue<Params extends any[], Value>(
+export function useImperativeCacheValue<Params extends any[], Value>(
   cache: Cache<Params, Value>,
   ...params: Params
 ): ErrorResponse | PendingResponse | ResolvedResponse<Value> {

packages/suspense/src/index.ts

@@ -5,7 +5,7 @@ export * from "./cache/createSingleEntryCache";
 export * from "./cache/createStreamingCache";
 export * from "./hooks/useCacheMutation";
 export * from "./hooks/useCacheStatus";
-export * from "./hooks/useCacheValue";
+export * from "./hooks/useImperativeCacheValue";
 export * from "./hooks/useStreamingValues";
 export * from "./utils/createDeferred";
 export * from "./utils/createInfallibleCache";