@khanacademy/wonder-blocks-data 10.1.0 → 10.1.2

package/src/util/{graphql-document-node-parser.js → graphql-document-node-parser.ts}

@@ -1,4 +1,3 @@
-// @flow
 import type {
     DocumentNode,
     DefinitionNode,
@@ -12,12 +11,12 @@ export const DocumentTypes = Object.freeze({
     mutation: "mutation",
 });
 
-export type DocumentType = $Values<typeof DocumentTypes>;
+export type DocumentType = typeof DocumentTypes[keyof typeof DocumentTypes];
 
 export interface IDocumentDefinition {
     type: DocumentType;
     name: string;
-    variables: $ReadOnlyArray<VariableDefinitionNode>;
+    variables: ReadonlyArray<VariableDefinitionNode>;
 }
 
 const cache = new Map<DocumentNode, IDocumentDefinition>();
@@ -60,19 +59,19 @@ export function graphQLDocumentNodeParser(
 
     const queries = document.definitions.filter(
         (x: DefinitionNode) =>
-            // $FlowIgnore[prop-missing]
+            // @ts-expect-error [FEI-5019] - TS2339 - Property 'operation' does not exist on type 'DefinitionNode'.
             x.kind === "OperationDefinition" && x.operation === "query",
     );
 
     const mutations = document.definitions.filter(
         (x: DefinitionNode) =>
-            // $FlowIgnore[prop-missing]
+            // @ts-expect-error [FEI-5019] - TS2339 - Property 'operation' does not exist on type 'DefinitionNode'.
             x.kind === "OperationDefinition" && x.operation === "mutation",
     );
 
     const subscriptions = document.definitions.filter(
         (x: DefinitionNode) =>
-            // $FlowIgnore[prop-missing]
+            // @ts-expect-error [FEI-5019] - TS2339 - Property 'operation' does not exist on type 'DefinitionNode'.
             x.kind === "OperationDefinition" && x.operation === "subscription",
     );
 
@@ -120,7 +119,7 @@ export function graphQLDocumentNodeParser(
     const type = queries.length ? DocumentTypes.query : DocumentTypes.mutation;
     const definitions = queries.length ? queries : mutations;
 
-    const definition: OperationDefinitionNode = (definitions[0]: any);
+    const definition: OperationDefinitionNode = definitions[0] as any;
     const variables = definition.variableDefinitions || [];
 
     // fallback to using data if no name

package/src/util/graphql-types.ts

@@ -0,0 +1,27 @@
+// NOTE(somewhatabstract):
+// These types are bare minimum to support document parsing. They're derived
+// from graphql@14.5.8, the last version that provided TypeScript types.
+// Doing this avoids us having to take a dependency on that library just for
+// these types.
+export interface DefinitionNode {
+    readonly kind: string;
+}
+
+export type VariableDefinitionNode = {
+    readonly kind: "VariableDefinition";
+};
+
+export interface OperationDefinitionNode extends DefinitionNode {
+    readonly kind: "OperationDefinition";
+    readonly operation: string;
+    readonly variableDefinitions: ReadonlyArray<VariableDefinitionNode>;
+    readonly name?: {
+        readonly kind: unknown;
+        readonly value: string;
+    };
+}
+
+export type DocumentNode = {
+    readonly kind: "Document";
+    readonly definitions: ReadonlyArray<DefinitionNode>;
+};

package/src/util/{hydration-cache-api.js → hydration-cache-api.ts}

@@ -1,4 +1,3 @@
-// @flow
 import {SsrCache} from "./ssr-cache";
 
 import type {ValidCacheData, CachedResponse, ResponseCache} from "./types";
@@ -23,6 +22,9 @@ export const initializeHydrationCache = (source: ResponseCache): void =>
 export const purgeHydrationCache = (
     predicate?: (
         key: string,
-        cacheEntry: ?$ReadOnly<CachedResponse<ValidCacheData>>,
+        cacheEntry?:
+            | Readonly<CachedResponse<ValidCacheData>>
+            | null
+            | undefined,
     ) => boolean,
 ): void => SsrCache.Default.purgeData(predicate);

package/src/util/{merge-gql-context.js → merge-gql-context.ts}

@@ -1,4 +1,3 @@
-// @flow
 import type {GqlContext} from "./gql-types";
 
 /**
@@ -7,7 +6,7 @@ import type {GqlContext} from "./gql-types";
  * Values in the partial context that are `undefined` will be ignored.
  * Values in the partial context that are `null` will be deleted.
  */
-export const mergeGqlContext = <TContext: GqlContext>(
+export const mergeGqlContext = <TContext extends GqlContext>(
     defaultContext: TContext,
     overrides: Partial<TContext>,
 ): TContext => {
@@ -24,6 +23,7 @@ export const mergeGqlContext = <TContext: GqlContext>(
                     delete acc[key];
                 } else {
                     // Otherwise, we set it.
+                    // @ts-expect-error [FEI-5019] - TS2536 - Type 'string' cannot be used to index type 'TContext'.
                     acc[key] = overrides[key];
                 }
             }

package/src/util/{purge-caches.js → purge-caches.ts}

@@ -1,4 +1,3 @@
-// @flow
 import {SharedCache} from "../hooks/use-shared-cache";
 import {purgeHydrationCache} from "./hydration-cache-api";
 

package/src/util/{request-api.js → request-api.ts}

@@ -1,4 +1,3 @@
-// @flow
 import {Server} from "@khanacademy/wonder-blocks-core";
 import {RequestTracker} from "./request-tracking";
 import {RequestFulfillment} from "./request-fulfillment";

package/src/util/{request-fulfillment.js → request-fulfillment.ts}

@@ -1,16 +1,15 @@
-// @flow
 import type {Result, ValidCacheData} from "./types";
 
 import {DataError, DataErrors} from "./data-error";
 
 type RequestCache = {
-    [id: string]: Promise<Result<any>>,
+    [id: string]: Promise<Result<any>>;
 };
 
-type FulfillOptions<TData: ValidCacheData> = {|
-    handler: () => Promise<TData>,
-    hydrate?: boolean,
-|};
+type FulfillOptions<TData extends ValidCacheData> = {
+    handler: () => Promise<TData>;
+    hydrate?: boolean;
+};
 
 let _default: RequestFulfillment;
 
@@ -33,10 +32,10 @@ export class RequestFulfillment {
      * This will return an inflight request if one exists, otherwise it will
      * make a new request. Inflight requests are deleted once they resolve.
      */
-    fulfill: <TData: ValidCacheData>(
+    fulfill: <TData extends ValidCacheData>(
         id: string,
         options: FulfillOptions<TData>,
-    ) => Promise<Result<TData>> = <TData: ValidCacheData>(
+    ) => Promise<Result<TData>> = <TData extends ValidCacheData>(
         id: string,
         {handler, hydrate = true}: FulfillOptions<TData>,
     ): Promise<Result<TData>> => {
@@ -52,10 +51,12 @@ export class RequestFulfillment {
          * We don't have an inflight request, so let's set one up.
          */
         const request = handler()
-            .then((data: TData): Result<TData> => ({
-                status: "success",
-                data,
-            }))
+            .then(
+                (data: TData): Result<TData> => ({
+                    status: "success",
+                    data,
+                }),
+            )
             .catch((error: string | Error): Result<TData> => {
                 const actualError =
                     typeof error === "string"

package/src/util/{request-tracking.js → request-tracking.ts}

@@ -1,22 +1,20 @@
-// @flow
 import * as React from "react";
 import {SsrCache} from "./ssr-cache";
 import {RequestFulfillment} from "./request-fulfillment";
 
 import type {ResponseCache, ValidCacheData} from "./types";
 
-type TrackerFn = <TData: ValidCacheData>(
+type TrackerFn = <TData extends ValidCacheData>(
     id: string,
     handler: () => Promise<TData>,
     hydrate: boolean,
 ) => void;
 
 type RequestCache = {
-    [id: string]: {|
-        hydrate: boolean,
-        handler: () => Promise<any>,
-    |},
-    ...
+    [id: string]: {
+        hydrate: boolean;
+        handler: () => Promise<any>;
+    };
 };
 
 /**
@@ -24,8 +22,8 @@ type RequestCache = {
  *
  * INTERNAL USE ONLY
  */
-export const TrackerContext: React.Context<?TrackerFn> =
-    React.createContext<?TrackerFn>(null);
+export const TrackerContext: React.Context<TrackerFn | null | undefined> =
+    React.createContext<TrackerFn | null | undefined>(null);
 
 /**
  * The default instance is stored here.
@@ -53,7 +51,8 @@ export class RequestTracker {
     _responseCache: SsrCache;
     _requestFulfillment: RequestFulfillment;
 
-    constructor(responseCache: ?SsrCache = undefined) {
+    // @ts-expect-error [FEI-5019] - TS2322 - Type 'undefined' is not assignable to type 'SsrCache | null'.
+    constructor(responseCache: SsrCache | null = undefined) {
         this._responseCache = responseCache || SsrCache.Default;
         this._requestFulfillment = new RequestFulfillment();
     }
@@ -64,11 +63,11 @@ export class RequestTracker {
      * This method caches a request and its handler for use during server-side
      * rendering to allow us to fulfill requests before producing a final render.
      */
-    trackDataRequest: <TData: ValidCacheData>(
+    trackDataRequest: <TData extends ValidCacheData>(
         id: string,
         handler: () => Promise<TData>,
         hydrate: boolean,
-    ) => void = <TData: ValidCacheData>(
+    ) => void = <TData extends ValidCacheData>(
         id: string,
         handler: () => Promise<TData>,
         hydrate: boolean,
@@ -167,7 +166,7 @@ export class RequestTracker {
                                 return;
                             }),
                     );
-                } catch (e) {
+                } catch (e: any) {
                     // This captures if there are problems in the code that
                     // begins the requests.
                     promises.push(

package/src/util/{result-from-cache-response.js → result-from-cache-response.ts}

@@ -1,4 +1,3 @@
-// @flow
 import {Status} from "./status";
 import {DataError, DataErrors} from "./data-error";
 import type {ValidCacheData, CachedResponse, Result} from "./types";
@@ -6,9 +5,9 @@ import type {ValidCacheData, CachedResponse, Result} from "./types";
 /**
  * Turns a cache entry into a stateful result.
  */
-export const resultFromCachedResponse = <TData: ValidCacheData>(
-    cacheEntry: ?CachedResponse<TData>,
-): ?Result<TData> => {
+export const resultFromCachedResponse = <TData extends ValidCacheData>(
+    cacheEntry?: CachedResponse<TData> | null,
+): Result<TData> | null | undefined => {
     // No cache entry means no result to be hydrated.
     if (cacheEntry == null) {
         return null;

package/src/util/{scoped-in-memory-cache.js → scoped-in-memory-cache.ts}

@@ -1,4 +1,3 @@
-// @flow
 import {DataError, DataErrors} from "./data-error";
 import type {ScopedCache, RawScopedCache, ValidCacheData} from "./types";
 
@@ -53,7 +52,7 @@ export class ScopedInMemoryCache implements ScopedCache {
     /**
      * Retrieve a value from the cache.
      */
-    get(scope: string, id: string): ?ValidCacheData {
+    get(scope: string, id: string): ValidCacheData | null | undefined {
         return this._cache[scope]?.[id] ?? null;
     }
 

package/src/util/{serializable-in-memory-cache.js → serializable-in-memory-cache.ts}

@@ -1,4 +1,3 @@
-// @flow
 import {clone} from "@khanacademy/wonder-stuff-core";
 import {DataError, DataErrors} from "./data-error";
 import {ScopedInMemoryCache} from "./scoped-in-memory-cache";
@@ -11,7 +10,7 @@ export class SerializableInMemoryCache extends ScopedInMemoryCache {
     constructor(initialCache: RawScopedCache = {}) {
         try {
             super(clone(initialCache));
-        } catch (e) {
+        } catch (e: any) {
             throw new DataError(
                 `An error occurred trying to initialize from a response cache snapshot: ${e}`,
                 DataErrors.InvalidInput,
@@ -32,7 +31,7 @@ export class SerializableInMemoryCache extends ScopedInMemoryCache {
     clone(): RawScopedCache {
         try {
             return clone(this._cache);
-        } catch (e) {
+        } catch (e: any) {
             throw new DataError(
                 "An error occurred while trying to clone the cache",
                 DataErrors.Internal,

package/src/util/{ssr-cache.js → ssr-cache.ts}

@@ -1,4 +1,3 @@
-// @flow
 import {Server} from "@khanacademy/wonder-blocks-core";
 import {SerializableInMemoryCache} from "./serializable-in-memory-cache";
 
@@ -29,15 +28,15 @@ export class SsrCache {
     _ssrOnlyCache: SerializableInMemoryCache;
 
     constructor(
-        hydrationCache: ?SerializableInMemoryCache = null,
-        ssrOnlyCache: ?SerializableInMemoryCache = null,
+        hydrationCache: SerializableInMemoryCache | null = null,
+        ssrOnlyCache: SerializableInMemoryCache | null = null,
     ) {
         this._ssrOnlyCache = ssrOnlyCache || new SerializableInMemoryCache();
         this._hydrationCache =
             hydrationCache || new SerializableInMemoryCache();
     }
 
-    _setCachedResponse<TData: ValidCacheData>(
+    _setCachedResponse<TData extends ValidCacheData>(
         id: string,
         entry: CachedResponse<TData>,
         hydrate: boolean,
@@ -70,7 +69,6 @@ export class SsrCache {
             );
         }
         this._hydrationCache = new SerializableInMemoryCache({
-            // $FlowIgnore[incompatible-call]
             [DefaultScope]: source,
         });
     };
@@ -80,11 +78,11 @@ export class SsrCache {
      *
      * This is a noop when client-side.
      */
-    cacheData: <TData: ValidCacheData>(
+    cacheData: <TData extends ValidCacheData>(
         id: string,
         data: TData,
         hydrate: boolean,
-    ) => CachedResponse<TData> = <TData: ValidCacheData>(
+    ) => CachedResponse<TData> = <TData extends ValidCacheData>(
         id: string,
         data: TData,
         hydrate: boolean,
@@ -95,11 +93,11 @@ export class SsrCache {
      *
      * This is a noop when client-side.
      */
-    cacheError: <TData: ValidCacheData>(
+    cacheError: <TData extends ValidCacheData>(
         id: string,
         error: Error | string,
         hydrate: boolean,
-    ) => CachedResponse<TData> = <TData: ValidCacheData>(
+    ) => CachedResponse<TData> = <TData extends ValidCacheData>(
         id: string,
         error: Error | string,
         hydrate: boolean,
@@ -111,11 +109,13 @@ export class SsrCache {
     /**
      * Retrieve data from our cache.
      */
-    getEntry: <TData: ValidCacheData>(
+    getEntry: <TData extends ValidCacheData>(
         id: string,
-    ) => ?$ReadOnly<CachedResponse<TData>> = <TData: ValidCacheData>(
+    ) => Readonly<CachedResponse<TData>> | null | undefined = <
+        TData extends ValidCacheData,
+    >(
         id: string,
-    ): ?$ReadOnly<CachedResponse<TData>> => {
+    ): Readonly<CachedResponse<TData>> | null | undefined => {
         // Get the cached entry for this value.
 
         // We first look in the ssr cache, if we need to.
@@ -139,8 +139,8 @@ export class SsrCache {
             this._hydrationCache.purge(DefaultScope, id);
         }
         // Getting the typing right between the in-memory cache and this
-        // is hard. Just telling flow it's OK.
-        // $FlowIgnore[incompatible-return]
+        // 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;
     };
 
@@ -155,14 +155,15 @@ export class SsrCache {
     purgeData: (
         predicate?: (
             key: string,
-            cachedEntry: $ReadOnly<CachedResponse<ValidCacheData>>,
+            cachedEntry: Readonly<CachedResponse<ValidCacheData>>,
         ) => boolean,
     ) => void = (predicate) => {
         const realPredicate = predicate
             ? // We know what we're putting into the cache so let's assume it
               // conforms.
-              // $FlowIgnore[incompatible-call]
-              (_, key, cachedEntry) => predicate(key, cachedEntry)
+              // @ts-expect-error [FEI-5019] - TS7006 - Parameter 'cachedEntry' implicitly has an 'any' type.
+              (_: string, key: string, cachedEntry) =>
+                  predicate(key, cachedEntry)
             : undefined;
 
         // Apply the predicate to what we have in our caches.
@@ -183,7 +184,7 @@ 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.
-        // $FlowIgnore[incompatible-return]
+        // @ts-expect-error [FEI-5019] - TS2322 - Type '{ [id: string]: ValidCacheData; }' is not assignable to type 'ResponseCache'.
         return cache[DefaultScope] ?? {};
     };
 }

package/src/util/{status.js → status.ts}

@@ -1,4 +1,3 @@
-// @flow
 import type {Result, ValidCacheData} from "./types";
 
 const loadingStatus = Object.freeze({
@@ -13,15 +12,15 @@ const abortedStatus = Object.freeze({
  * Create Result<TData> instances with specific statuses.
  */
 export const Status = Object.freeze({
-    loading: <TData: ValidCacheData = ValidCacheData>(): Result<TData> =>
+    loading: <TData extends ValidCacheData = ValidCacheData>(): Result<TData> =>
         loadingStatus,
-    aborted: <TData: ValidCacheData = ValidCacheData>(): Result<TData> =>
+    aborted: <TData extends ValidCacheData = ValidCacheData>(): Result<TData> =>
         abortedStatus,
-    success: <TData: ValidCacheData>(data: TData): Result<TData> => ({
+    success: <TData extends ValidCacheData>(data: TData): Result<TData> => ({
         status: "success",
         data,
     }),
-    error: <TData: ValidCacheData = ValidCacheData>(
+    error: <TData extends ValidCacheData = ValidCacheData>(
         error: Error,
     ): Result<TData> => ({
         status: "error",

package/src/util/{to-gql-operation.js → to-gql-operation.ts}

@@ -1,4 +1,3 @@
-// @flow
 import {graphQLDocumentNodeParser} from "./graphql-document-node-parser";
 import type {GqlOperation} from "./gql-types";
 import type {DocumentNode} from "./graphql-types";
@@ -32,7 +31,7 @@ import type {DocumentNode} from "./graphql-types";
  * };
  * ```
  */
-export const toGqlOperation = <TData, TVariables: {...}>(
+export const toGqlOperation = <TData, TVariables extends Record<any, any>>(
     documentNode: DocumentNode,
 ): GqlOperation<TData, TVariables> => {
     const definition = graphQLDocumentNodeParser(documentNode);

package/src/util/{types.js → types.ts}

@@ -1,4 +1,3 @@
-// @flow
 import type {Metadata} from "@khanacademy/wonder-stuff-core";
 
 /**
@@ -10,24 +9,24 @@ export const FetchPolicy = {
      * If the data is in the cache, return that; otherwise, fetch from the
      * server.
      */
-    CacheBeforeNetwork: ("CacheBeforeNetwork": "CacheBeforeNetwork"),
+    CacheBeforeNetwork: "CacheBeforeNetwork" as const,
 
     /**
      * If the data is in the cache, return that; always fetch from the server
      * regardless of cache.
      */
-    CacheAndNetwork: ("CacheAndNetwork": "CacheAndNetwork"),
+    CacheAndNetwork: "CacheAndNetwork" as const,
 
     /**
      * If the data is in the cache, return that; otherwise, do nothing.
      */
-    CacheOnly: ("CacheOnly": "CacheOnly"),
+    CacheOnly: "CacheOnly" as const,
 
     /**
      * Ignore any existing cached result; always fetch from the server.
      */
-    NetworkOnly: ("NetworkOnly": "NetworkOnly"),
-};
+    NetworkOnly: "NetworkOnly" as const,
+} as const;
 
 /**
  * Define what can be cached.
@@ -39,47 +38,46 @@ export type ValidCacheData =
     | string
     | boolean
     | number
-    | {...}
-    | Array<?ValidCacheData>;
+    | Record<any, any>
+    | Array<ValidCacheData | null | undefined>;
 
 /**
  * The normalized result of a request.
  */
-export type Result<TData: ValidCacheData> =
-    | {|
-          status: "loading",
-      |}
-    | {|
-          status: "success",
-          data: TData,
-      |}
-    | {|
-          status: "error",
-          error: Error,
-      |}
-    | {|
-          status: "aborted",
-      |};
+export type Result<TData extends ValidCacheData> =
+    | {
+          status: "loading";
+      }
+    | {
+          status: "success";
+          data: TData;
+      }
+    | {
+          status: "error";
+          error: Error;
+      }
+    | {
+          status: "aborted";
+      };
 
 /**
  * A cache entry for a fulfilled request response.
  */
-export type CachedResponse<TData: ValidCacheData> =
-    | {|
-          +error: string,
-          +data?: void,
-      |}
-    | {|
-          +data: TData,
-          +error?: void,
-      |};
+export type CachedResponse<TData extends ValidCacheData> =
+    | {
+          readonly error: string;
+          readonly data?: undefined;
+      }
+    | {
+          readonly data: TData;
+          readonly error?: undefined;
+      };
 
 /**
  * A cache of fulfilled request responses.
  */
 export type ResponseCache = {
-    [key: string]: CachedResponse<any>,
-    ...
+    [key: string]: CachedResponse<any>;
 };
 
 /**
@@ -93,40 +91,34 @@ export type RawScopedCache = {
         /**
          * Each value in the cache is then identified within a given scope.
          */
-        [id: string]: ValidCacheData,
-        ...
-    },
-    ...
+        [id: string]: ValidCacheData;
+    };
 };
 
 /**
  * Options to pass to error construction.
  */
-export type ErrorOptions = {|
+export type ErrorOptions = {
     /**
      * Metadata to attach to the error.
      */
-    metadata?: ?Metadata,
-
+    metadata?: Metadata | null | undefined;
     /**
      * The error that caused the error being constructed.
      */
-    cause?: ?Error,
-|};
+    cause?: Error | null | undefined;
+};
 
 export interface ScopedCache {
     set(scope: string, id: string, value: ValidCacheData): void;
-
     /**
      * Retrieve a value from the cache.
      */
-    get(scope: string, id: string): ?ValidCacheData;
-
+    get(scope: string, id: string): ValidCacheData | null | undefined;
     /**
      * Purge an item from the cache.
      */
     purge(scope: string, id: string): void;
-
     /**
      * Purge a scope of items that match the given predicate.
      *
@@ -136,7 +128,6 @@ export interface ScopedCache {
         scope: string,
         predicate?: (id: string, value: ValidCacheData) => boolean,
     ): void;
-
     /**
      * Purge all items from the cache that match the given predicate.
      *

package/tsconfig.json

@@ -0,0 +1,11 @@
+{
+    "exclude": ["dist"],
+    "extends": "../tsconfig-shared.json",
+    "compilerOptions": {
+        "outDir": "./dist",
+        "rootDir": "src",
+    },
+    "references": [
+        {"path": "../wonder-blocks-core"},
+    ]
+}