@khanacademy/wonder-blocks-data 11.0.16 → 13.0.0

package/src/hooks/use-hydratable-effect.ts

@@ -10,8 +10,7 @@ import type {Result, ValidCacheData} from "../util/types";
 /**
  * Policies to define how a hydratable effect should behave client-side.
  */
-// TODO(FEI-5000): Convert to TS enum after all codebases have been migrated
-export const WhenClientSide = {
+export enum WhenClientSide {
     /**
      * The result from executing the effect server-side will not be hydrated.
      * The effect will always be executed client-side.
@@ -20,7 +19,7 @@ export const WhenClientSide = {
      * for properly hydrating this component (for example, the action invokes
      * Apollo which manages its own cache to ensure things render properly).
      */
-    DoNotHydrate: "DoNotHydrate" as const,
+    DoNotHydrate = "DoNotHydrate",
 
     /**
      * The result from executing the effect server-side will be hydrated.
@@ -28,7 +27,7 @@ export const WhenClientSide = {
      * be hydrated (i.e. both error and success hydration results prevent the
      * effect running client-side).
      */
-    ExecuteWhenNoResult: "ExecuteWhenNoResult" as const,
+    ExecuteWhenNoResult = "ExecuteWhenNoResult",
 
     /**
      * The result from executing the effect server-side will be hydrated.
@@ -37,15 +36,15 @@ export const WhenClientSide = {
      * If the hydrated result was not a success result, or there was no
      * hydrated result, the effect will not be executed.
      */
-    ExecuteWhenNoSuccessResult: "ExecuteWhenNoSuccessResult" as const,
+    ExecuteWhenNoSuccessResult = "ExecuteWhenNoSuccessResult",
 
     /**
      * The result from executing the effect server-side will be hydrated.
      * The effect will always be executed client-side, regardless of the
      * hydrated result status.
      */
-    AlwaysExecute: "AlwaysExecute" as const,
-} as const;
+    AlwaysExecute = "AlwaysExecute",
+}
 
 type HydratableEffectOptions<TData extends ValidCacheData> = {
     /**

package/src/hooks/use-request-interception.ts

@@ -30,20 +30,22 @@ export const useRequestInterception = <TData extends ValidCacheData>(
     const interceptedHandler = React.useCallback((): Promise<TData> => {
         // Call the interceptors from closest to furthest.
         // If one returns a non-null result, then we keep that.
-        const interceptResponse = interceptors.reduceRight(
-            // @ts-expect-error [FEI-5019] - TS2769 - No overload matches this call.
-            (prev, interceptor) => {
-                if (prev != null) {
-                    return prev;
-                }
-                return interceptor(requestId);
-            },
-            null,
-        );
+        const interceptResponse: Promise<TData> | null | undefined =
+            interceptors.reduceRight(
+                (prev: Promise<TData> | null | undefined, interceptor) => {
+                    if (prev != null) {
+                        return prev;
+                    }
+                    return interceptor(requestId) as
+                        | Promise<TData>
+                        | null
+                        | undefined;
+                },
+                null,
+            );
         // If nothing intercepted this request, invoke the original handler.
         // NOTE: We can't guarantee all interceptors return the same type
         // as our handler, so how can TypeScript know? Let's just suppress that.
-        // @ts-expect-error [FEI-5019] - TS2739 - Type '(requestId: string) => Promise<ValidCacheData | null | undefined> | null | undefined' is missing the following properties from type 'Promise<TData>': then, catch, finally, [Symbol.toStringTag]
         return interceptResponse ?? handler();
     }, [handler, interceptors, requestId]);
 

package/src/hooks/use-shared-cache.ts

@@ -81,8 +81,10 @@ export const useSharedCache = <TValue extends ValidCacheData>(
     // since our last run through. Also, our cache does not know what type it
     // stores, so we have to cast it to the type we're exporting. This is a
     // dev time courtesy, rather than a runtime thing.
-    // @ts-expect-error [FEI-5019] - TS2322 - Type 'ValidCacheData | null | undefined' is not assignable to type 'TValue | null | undefined'.
-    let currentValue: TValue | null | undefined = cache.get(scope, id);
+    let currentValue: TValue | null | undefined = cache.get(scope, id) as
+        | TValue
+        | null
+        | undefined;
 
     // If we have an initial value, we need to add it to the cache
     // and use it as our current value.

package/src/util/__tests__/request-api.test.ts

@@ -1,3 +1,5 @@
+// eslint-disable-next-line import/no-unassigned-import
+import "jest-extended";
 import {Server} from "@khanacademy/wonder-blocks-core";
 import {RequestFulfillment} from "../request-fulfillment";
 import {RequestTracker} from "../request-tracking";
@@ -123,7 +125,6 @@ describe("#hasTrackedRequestsToBeFetched", () => {
             const result = hasTrackedRequestsToBeFetched();
 
             // Assert
-            // @ts-expect-error [FEI-5019] - TS2339 - Property 'toBeTrue' does not exist on type 'JestMatchers<boolean>'.
             expect(result).toBeTrue();
         });
     });

package/src/util/__tests__/request-tracking.test.tsx

@@ -162,13 +162,12 @@ describe("../request-tracking.js", () => {
             it("should cache errors occurring in promises", async () => {
                 // Arrange
                 const requestTracker = createRequestTracker();
-                const fakeBadRequestHandler = () =>
+                const fakeBadRequestHandler = (): Promise<any> =>
                     new Promise((resolve: any, reject: any) =>
                         reject("OH NO!"),
                     );
                 requestTracker.trackDataRequest(
                     "ID",
-                    // @ts-expect-error [FEI-5019] - TS2345 - Argument of type '() => Promise<unknown>' is not assignable to parameter of type '() => Promise<ValidCacheData>'.
                     fakeBadRequestHandler,
                     true,
                 );
@@ -192,23 +191,22 @@ describe("../request-tracking.js", () => {
                  * - Handlers that reject the promise
                  * - Handlers that resolve
                  */
-                const fakeBadRequestHandler = () =>
+                const fakeBadRequestHandler = (): Promise<any> =>
                     new Promise((resolve: any, reject: any) =>
                         reject("OH NO!"),
                     );
-                const fakeBadHandler = () => {
+                const fakeBadHandler = (): Promise<any> => {
                     throw new Error("OH NO!");
                 };
-                const fakeValidHandler = (() => {
+                const fakeValidHandler = ((): (() => Promise<any>) => {
                     let counter = 0;
-                    return (o: any) => {
+                    return () => {
                         counter++;
                         return Promise.resolve(`DATA:${counter}`);
                     };
                 })();
                 requestTracker.trackDataRequest(
                     "BAD_REQUEST",
-                    // @ts-expect-error [FEI-5019] - TS2345 - Argument of type '() => Promise<unknown>' is not assignable to parameter of type '() => Promise<ValidCacheData>'.
                     fakeBadRequestHandler,
                     true,
                 );
@@ -219,13 +217,11 @@ describe("../request-tracking.js", () => {
                 );
                 requestTracker.trackDataRequest(
                     "VALID_HANDLER1",
-                    // @ts-expect-error [FEI-5019] - TS2345 - Argument of type '(o: any) => Promise<string>' is not assignable to parameter of type '() => Promise<string>'.
                     fakeValidHandler,
                     true,
                 );
                 requestTracker.trackDataRequest(
                     "VALID_HANDLER2",
-                    // @ts-expect-error [FEI-5019] - TS2345 - Argument of type '(o: any) => Promise<string>' is not assignable to parameter of type '() => Promise<string>'.
                     fakeValidHandler,
                     true,
                 );

package/src/util/__tests__/result-from-cache-response.test.ts

@@ -70,8 +70,8 @@ describe("#resultFromCachedResponse", () => {
         };
 
         // Act
-        // @ts-expect-error [FEI-5019] - TS2339 - Property 'error' does not exist on type 'Result<ValidCacheData> | null | undefined'.
-        const {error} = resultFromCachedResponse(cacheEntry);
+        const cacheResult = resultFromCachedResponse(cacheEntry);
+        const error = cacheResult?.status === "error" && cacheResult.error;
 
         // Assert
         expect(error).toMatchInlineSnapshot(`[HydratedDataError: ERROR]`);

package/src/util/__tests__/serializable-in-memory-cache.test.ts

@@ -9,12 +9,11 @@ describe("SerializableInMemoryCache", () => {
                 scope: {
                     key: "value",
                 },
-            } as const;
+            };
 
             // Act
             const cache = new SerializableInMemoryCache(sourceData);
             // Try to mutate the cache.
-            // @ts-expect-error [FEI-5019] - TS2540 - Cannot assign to 'scope' because it is a read-only property.
             sourceData["scope"] = {key: "SOME_NEW_DATA"};
             const result = cache.get("scope", "key");
 

package/src/util/__tests__/ssr-cache.test.ts

@@ -125,12 +125,11 @@ describe("../ssr-cache.js", () => {
             const cache = new SsrCache();
             const sourceData = {
                 MY_KEY: {data: "THE_DATA"},
-            } as const;
+            };
 
             // Act
             cache.initialize(sourceData);
             // Try to mutate the cache.
-            // @ts-expect-error [FEI-5019] - TS2540 - Cannot assign to 'MY_KEY' because it is a read-only property.
             sourceData["MY_KEY"] = {data: "SOME_NEW_DATA"};
             const result = cache.getEntry("MY_KEY");
 
@@ -448,8 +447,7 @@ describe("../ssr-cache.js", () => {
             const cloneSpy = jest
                 .spyOn(hydrationCache, "clone")
                 .mockReturnValue({
-                    // @ts-expect-error [FEI-5019] - TS2322 - Type 'string' is not assignable to type '{ [id: string]: ValidCacheData; }'.
-                    default: "CLONE!",
+                    default: "CLONE!" as any,
                 });
             const cache = new SsrCache(hydrationCache);
             // Let's add to the initialized state to check that everything

package/src/util/__tests__/to-gql-operation.test.ts

@@ -9,11 +9,10 @@ describe("#toGqlOperation", () => {
         const documentNode: any = {};
         const parserSpy = jest
             .spyOn(GDNP, "graphQLDocumentNodeParser")
-            // @ts-expect-error [FEI-5019] - TS2345 - Argument of type '{ name: string; type: string; }' is not assignable to parameter of type 'IDocumentDefinition'.
             .mockReturnValue({
                 name: "operationName",
                 type: "query",
-            });
+            } as any);
 
         // Act
         toGqlOperation(documentNode);
@@ -25,11 +24,10 @@ describe("#toGqlOperation", () => {
     it("should return the Wonder Blocks Data representation of the given document node", () => {
         // Arrange
         const documentNode: any = {};
-        // @ts-expect-error [FEI-5019] - TS2345 - Argument of type '{ name: string; type: string; }' is not assignable to parameter of type 'IDocumentDefinition'.
         jest.spyOn(GDNP, "graphQLDocumentNodeParser").mockReturnValue({
             name: "operationName",
             type: "mutation",
-        });
+        } as any);
 
         // Act
         const result = toGqlOperation(documentNode);

package/src/util/graphql-document-node-parser.ts

@@ -59,20 +59,20 @@ export function graphQLDocumentNodeParser(
 
     const queries = document.definitions.filter(
         (x: DefinitionNode) =>
-            // @ts-expect-error [FEI-5019] - TS2339 - Property 'operation' does not exist on type 'DefinitionNode'.
-            x.kind === "OperationDefinition" && x.operation === "query",
+            x.kind === "OperationDefinition" &&
+            (x as OperationDefinitionNode).operation === "query",
     );
 
     const mutations = document.definitions.filter(
         (x: DefinitionNode) =>
-            // @ts-expect-error [FEI-5019] - TS2339 - Property 'operation' does not exist on type 'DefinitionNode'.
-            x.kind === "OperationDefinition" && x.operation === "mutation",
+            x.kind === "OperationDefinition" &&
+            (x as OperationDefinitionNode).operation === "mutation",
     );
 
     const subscriptions = document.definitions.filter(
         (x: DefinitionNode) =>
-            // @ts-expect-error [FEI-5019] - TS2339 - Property 'operation' does not exist on type 'DefinitionNode'.
-            x.kind === "OperationDefinition" && x.operation === "subscription",
+            x.kind === "OperationDefinition" &&
+            (x as OperationDefinitionNode).operation === "subscription",
     );
 
     if (fragments.length && !queries.length && !mutations.length) {

package/src/util/merge-gql-context.ts

@@ -23,7 +23,8 @@ export const mergeGqlContext = <TContext extends GqlContext>(
                     delete acc[key];
                 } else {
                     // Otherwise, we set it.
-                    // @ts-expect-error [FEI-5019] - TS2536 - Type 'string' cannot be used to index type 'TContext'.
+                    // @ts-expect-error TypeScript doesn't seem to see that
+                    // TContext can have string keys.
                     acc[key] = overrides[key];
                 }
             }

package/src/util/request-tracking.ts

@@ -53,8 +53,7 @@ export class RequestTracker {
     _responseCache: SsrCache;
     _requestFulfillment: RequestFulfillment;
 
-    // @ts-expect-error [FEI-5019] - TS2322 - Type 'undefined' is not assignable to type 'SsrCache | null'.
-    constructor(responseCache: SsrCache | null = undefined) {
+    constructor(responseCache?: SsrCache | null) {
         this._responseCache = responseCache || SsrCache.Default;
         this._requestFulfillment = new RequestFulfillment();
     }
@@ -160,6 +159,11 @@ export class RequestTracker {
                                 // the code wrong. Rather than bloat
                                 // code with useless error, just ignore.
 
+                                // For status === "no-data":
+                                // Could never get here unless we wrote
+                                // the code wrong. Rather than bloat
+                                // code with useless error, just ignore.
+
                                 // For status === "aborted":
                                 // We won't cache this.
                                 // We don't hydrate aborted requests,

package/src/util/ssr-cache.ts

@@ -124,7 +124,7 @@ export class SsrCache {
             : null;
 
         // Now we defer to the SSR value, and fallback to the hydration cache.
-        const internalEntry =
+        const internalEntry: ValidCacheData | null | undefined =
             ssrEntry ?? this._hydrationCache.get(DefaultScope, id);
 
         // If we are not server-side and we hydrated something, let's clear
@@ -140,8 +140,10 @@ export class SsrCache {
         }
         // Getting the typing right between the in-memory cache and this
         // is hard. Just telling TypeScript it's OK.
-        // @ts-expect-error [FEI-5019] - TS2322 - Type 'string | number | boolean | Record<any, any> | null | undefined' is not assignable to type 'Readonly<CachedResponse<TData>> | null | undefined'.
-        return internalEntry;
+        return internalEntry as
+            | Readonly<CachedResponse<TData>>
+            | null
+            | undefined;
     };
 
     /**
@@ -161,9 +163,11 @@ export class SsrCache {
         const realPredicate = predicate
             ? // We know what we're putting into the cache so let's assume it
               // conforms.
-              // @ts-expect-error [FEI-5019] - TS7006 - Parameter 'cachedEntry' implicitly has an 'any' type.
-              (_: string, key: string, cachedEntry) =>
-                  predicate(key, cachedEntry)
+              (_: string, key: string, cachedEntry: ValidCacheData) =>
+                  predicate(
+                      key,
+                      cachedEntry as Readonly<CachedResponse<ValidCacheData>>,
+                  )
             : undefined;
 
         // Apply the predicate to what we have in our caches.
@@ -184,7 +188,6 @@ export class SsrCache {
         // to an empty object.
         // We only need the default scope out of our scoped in-memory cache.
         // We know that it conforms to our expectations.
-        // @ts-expect-error [FEI-5019] - TS2322 - Type '{ [id: string]: ValidCacheData; }' is not assignable to type 'ResponseCache'.
-        return cache[DefaultScope] ?? {};
+        return (cache[DefaultScope] as ResponseCache) ?? {};
     };
 }

package/src/util/status.ts

@@ -4,6 +4,10 @@ const loadingStatus = Object.freeze({
     status: "loading",
 });
 
+const noDataStatus = Object.freeze({
+    status: "no-data",
+});
+
 const abortedStatus = Object.freeze({
     status: "aborted",
 });
@@ -14,6 +18,8 @@ const abortedStatus = Object.freeze({
 export const Status = Object.freeze({
     loading: <TData extends ValidCacheData = ValidCacheData>(): Result<TData> =>
         loadingStatus,
+    noData: <TData extends ValidCacheData = ValidCacheData>(): Result<TData> =>
+        noDataStatus,
     aborted: <TData extends ValidCacheData = ValidCacheData>(): Result<TData> =>
         abortedStatus,
     success: <TData extends ValidCacheData>(data: TData): Result<TData> => ({

package/src/util/types.ts

@@ -3,30 +3,29 @@ import type {Metadata} from "@khanacademy/wonder-stuff-core";
 /**
  * Defines the various fetch policies that can be applied to requests.
  */
-// TODO(FEI-5000): Convert to TS enum after all codebases have been migrated
-export const FetchPolicy = {
+export enum FetchPolicy {
     /**
      * If the data is in the cache, return that; otherwise, fetch from the
      * server.
      */
-    CacheBeforeNetwork: "CacheBeforeNetwork" as const,
+    CacheBeforeNetwork = "CacheBeforeNetwork",
 
     /**
      * If the data is in the cache, return that; always fetch from the server
      * regardless of cache.
      */
-    CacheAndNetwork: "CacheAndNetwork" as const,
+    CacheAndNetwork = "CacheAndNetwork",
 
     /**
      * If the data is in the cache, return that; otherwise, do nothing.
      */
-    CacheOnly: "CacheOnly" as const,
+    CacheOnly = "CacheOnly",
 
     /**
      * Ignore any existing cached result; always fetch from the server.
      */
-    NetworkOnly: "NetworkOnly" as const,
-} as const;
+    NetworkOnly = "NetworkOnly",
+}
 
 /**
  * Define what can be cached.
@@ -48,6 +47,9 @@ export type Result<TData extends ValidCacheData> =
     | {
           status: "loading";
       }
+    | {
+          status: "no-data";
+      }
     | {
           status: "success";
           data: TData;