refactor(core): convert ResourceStatus to a string type (angular#60919)

An outcome of the Resource RFC was that we should use string constants for
communicating the resource status instead of an enum. This commit converts
`ResourceStatus` accordingly.

PR Close angular#60919

Author: alxhub

adev/src/content/guide/signals/resource.md

@@ -47,8 +47,7 @@ The `ResourceLoaderParams` object contains three properties: `request`, `previou
 | `previous`    | An object with a `status` property, containing the previous `ResourceStatus`.                                                                    |
 | `abortSignal` | An [`AbortSignal`](https://developer.mozilla.org/en-US/docs/Web/API/AbortSignal). See [Aborting requests](#aborting-requests) below for details. |
 
-
-If the `request` computation returns `undefined`, the loader function does not run and the resource status becomes `Idle`.
+If the `request` computation returns `undefined`, the loader function does not run and the resource status becomes `'idle'`.
 
 ### Aborting requests
 
@@ -100,15 +99,15 @@ The resource object has several signal properties for reading the status of the
 | `isLoading` | Whether the resource loader is currently running.                                                               |
 | `status`    | The resource's specific `ResourceStatus`, as described below.                                                   |
 
-The `status` signal provides a specific `ResourceStatus` that describes the state of the resource.
+The `status` signal provides a specific `ResourceStatus` that describes the state of the resource using a string constant.
 
-| Status      | `value()`         | Description                                                                  |
-| ----------- | :---------------- | ---------------------------------------------------------------------------- |
-| `Idle`      | `undefined`       | The resource has no valid request and the loader has not run.                |
-| `Error`     | `undefined`       | The loader has encountered an error.                                         |
-| `Loading`   | `undefined`       | The loader is running as a result of the `request` value changing.           |
-| `Reloading` | Previous value    | The loader is running as a result calling of the resource's `reload` method. |
-| `Resolved`  | Resolved value    | The loader has completed.                                                    |
-| `Local`     | Locally set value | The resource's value has been set locally via `.set()` or `.update()`        |
+| Status        | `value()`         | Description                                                                  |
+| ------------- | :---------------- | ---------------------------------------------------------------------------- |
+| `'idle'`      | `undefined`       | The resource has no valid request and the loader has not run.                |
+| `'error'`     | `undefined`       | The loader has encountered an error.                                         |
+| `'loading'`   | `undefined`       | The loader is running as a result of the `request` value changing.           |
+| `'reloading'` | Previous value    | The loader is running as a result calling of the resource's `reload` method. |
+| `'resolved'`  | Resolved value    | The loader has completed.                                                    |
+| `'local'`     | Locally set value | The resource's value has been set locally via `.set()` or `.update()`        |
 
 You can use this status information to conditionally display user interface elements, such loading indicators and error messages.

goldens/public-api/core/index.api.md

@@ -1638,14 +1638,7 @@ export interface ResourceRef<T> extends WritableResource<T> {
 }
 
 // @public
-export enum ResourceStatus {
-    Error = 1,
-    Idle = 0,
-    Loading = 2,
-    Local = 5,
-    Reloading = 3,
-    Resolved = 4
-}
+export type ResourceStatus = 'idle' | 'error' | 'loading' | 'reloading' | 'resolved' | 'local';
 
 // @public
 export type ResourceStreamingLoader<T, R> = (param: ResourceLoaderParams<R>) => PromiseLike<Signal<ResourceStreamItem<T>>>;

packages/common/http/src/resource.ts

@@ -301,9 +301,7 @@ class HttpResourceImpl<T>
   });
 
   readonly headers = computed(() =>
-    this.status() === ResourceStatus.Resolved || this.status() === ResourceStatus.Error
-      ? this._headers()
-      : undefined,
+    this.status() === 'resolved' || this.status() === 'error' ? this._headers() : undefined,
   );
   readonly progress = this._progress.asReadonly();
   readonly statusCode = this._statusCode.asReadonly();

packages/core/src/resource/api.ts

@@ -11,49 +11,29 @@ import {Signal, ValueEqualityFn} from '../render3/reactivity/api';
 import {WritableSignal} from '../render3/reactivity/signal';
 
 /**
- * Status of a `Resource`.
+ * String value capturing the status of a `Resource`.
+ *
+ * Possible statuses are:
+ *
+ * `idle` - The resource has no valid request and will not perform any loading. `value()` will be
+ * `undefined`.
+ *
+ * `loading` - The resource is currently loading a new value as a result of a change in its reactive
+ * dependencies. `value()` will be `undefined`.
+ *
+ * `reloading` - The resource is currently reloading a fresh value for the same reactive
+ * dependencies. `value()` will continue to return the previously fetched value during the reloading
+ * operation.
+ *
+ * `error` - Loading failed with an error. `value()` will be `undefined`.
+ *
+ * `resolved` - Loading has completed and the resource has the value returned from the loader.
+ *
+ * `local` - The resource's value was set locally via `.set()` or `.update()`.
  *
  * @experimental
  */
-export enum ResourceStatus {
-  /**
-   * The resource has no valid request and will not perform any loading.
-   *
-   * `value()` will be `undefined`.
-   */
-  Idle,
-
-  /**
-   * Loading failed with an error.
-   *
-   * `value()` will be `undefined`.
-   */
-  Error,
-
-  /**
-   * The resource is currently loading a new value as a result of a change in its `request`.
-   *
-   * `value()` will be `undefined`.
-   */
-  Loading,
-
-  /**
-   * The resource is currently reloading a fresh value for the same request.
-   *
-   * `value()` will continue to return the previously fetched value during the reloading operation.
-   */
-  Reloading,
-
-  /**
-   * Loading has completed and the resource has the value returned from the loader.
-   */
-  Resolved,
-
-  /**
-   * The resource's value was set locally via `.set()` or `.update()`.
-   */
-  Local,
-}
+export type ResourceStatus = 'idle' | 'error' | 'loading' | 'reloading' | 'resolved' | 'local';
 
 /**
  * A Resource is an asynchronous dependency (for example, the results of an API call) that is

packages/core/src/resource/resource.ts

@@ -68,11 +68,7 @@ export function resource<T, R>(options: ResourceOptions<T, R>): ResourceRef<T |
   );
 }
 
-type ResourceInternalStatus =
-  | ResourceStatus.Idle
-  | ResourceStatus.Loading
-  | ResourceStatus.Resolved
-  | ResourceStatus.Local;
+type ResourceInternalStatus = 'idle' | 'loading' | 'resolved' | 'local';
 
 /**
  * Internal state of a resource.
@@ -114,9 +110,7 @@ abstract class BaseWritableResource<T> implements WritableResource<T> {
     this.set(updateFn(untracked(this.value)));
   }
 
-  readonly isLoading = computed(
-    () => this.status() === ResourceStatus.Loading || this.status() === ResourceStatus.Reloading,
-  );
+  readonly isLoading = computed(() => this.status() === 'loading' || this.status() === 'reloading');
 
   hasValue(): this is ResourceRef<Exclude<T, undefined>> {
     return this.value() !== undefined;
@@ -181,13 +175,12 @@ export class ResourceImpl<T, R> extends BaseWritableResource<T> implements Resou
       source: this.extRequest,
       // Compute the state of the resource given a change in status.
       computation: (extRequest, previous) => {
-        const status =
-          extRequest.request === undefined ? ResourceStatus.Idle : ResourceStatus.Loading;
+        const status = extRequest.request === undefined ? 'idle' : 'loading';
         if (!previous) {
           return {
             extRequest,
             status,
-            previousStatus: ResourceStatus.Idle,
+            previousStatus: 'idle',
             stream: undefined,
           };
         } else {
@@ -234,18 +227,15 @@ export class ResourceImpl<T, R> extends BaseWritableResource<T> implements Resou
     const current = untracked(this.value);
     const state = untracked(this.state);
 
-    if (
-      state.status === ResourceStatus.Local &&
-      (this.equal ? this.equal(current, value) : current === value)
-    ) {
+    if (state.status === 'local' && (this.equal ? this.equal(current, value) : current === value)) {
       return;
     }
 
     // Enter Local state with the user-defined value.
     this.state.set({
       extRequest: state.extRequest,
-      status: ResourceStatus.Local,
-      previousStatus: ResourceStatus.Local,
+      status: 'local',
+      previousStatus: 'local',
       stream: signal({value}),
     });
 
@@ -257,7 +247,7 @@ export class ResourceImpl<T, R> extends BaseWritableResource<T> implements Resou
   override reload(): boolean {
     // We don't want to restart in-progress loads.
     const {status} = untracked(this.state);
-    if (status === ResourceStatus.Idle || status === ResourceStatus.Loading) {
+    if (status === 'idle' || status === 'loading') {
       return false;
     }
 
@@ -274,8 +264,8 @@ export class ResourceImpl<T, R> extends BaseWritableResource<T> implements Resou
     // Destroyed resources enter Idle state.
     this.state.set({
       extRequest: {request: undefined, reload: 0},
-      status: ResourceStatus.Idle,
-      previousStatus: ResourceStatus.Idle,
+      status: 'idle',
+      previousStatus: 'idle',
       stream: undefined,
     });
   }
@@ -290,7 +280,7 @@ export class ResourceImpl<T, R> extends BaseWritableResource<T> implements Resou
     if (extRequest.request === undefined) {
       // Nothing to load (and we should already be in a non-loading state).
       return;
-    } else if (currentStatus !== ResourceStatus.Loading) {
+    } else if (currentStatus !== 'loading') {
       // We're not in a loading or reloading state, so this loading request is stale.
       return;
     }
@@ -334,8 +324,8 @@ export class ResourceImpl<T, R> extends BaseWritableResource<T> implements Resou
 
       this.state.set({
         extRequest,
-        status: ResourceStatus.Resolved,
-        previousStatus: ResourceStatus.Resolved,
+        status: 'resolved',
+        previousStatus: 'resolved',
         stream,
       });
     } catch (err) {
@@ -345,8 +335,8 @@ export class ResourceImpl<T, R> extends BaseWritableResource<T> implements Resou
 
       this.state.set({
         extRequest,
-        status: ResourceStatus.Resolved,
-        previousStatus: ResourceStatus.Error,
+        status: 'resolved',
+        previousStatus: 'error',
         stream: signal({error: err}),
       });
     } finally {
@@ -398,10 +388,10 @@ function isStreamingResourceOptions<T, R>(
  */
 function projectStatusOfState(state: ResourceState<unknown>): ResourceStatus {
   switch (state.status) {
-    case ResourceStatus.Loading:
-      return state.extRequest.reload === 0 ? ResourceStatus.Loading : ResourceStatus.Reloading;
-    case ResourceStatus.Resolved:
-      return isResolved(untracked(state.stream!)) ? ResourceStatus.Resolved : ResourceStatus.Error;
+    case 'loading':
+      return state.extRequest.reload === 0 ? 'loading' : 'reloading';
+    case 'resolved':
+      return isResolved(untracked(state.stream!)) ? 'resolved' : 'error';
     default:
       return state.status;
   }