How can you obtain the key that comes after or before an existing key in a sorted TypeScript string enum?

Given the key STEPS.GENDER and the string enum below

export enum STEPS {
  NAME = "name",
  GENDER = "gender",
  BIRTHDAY = "birthday",
  SUCCESS = "success"
}

Is there a way to programmatically determine the next or previous key in the enum, such as STEPS.BIRTHDAY and STEPS.NAME in this particular case?

Note: Or any other key related to the current key where the relationship can be defined. If no matching key is found, return undefined.

Answer №1

Here is how a string enum gets transpiled to JavaScript:

var PROCESSES;
(function (PROCESSES) {
    PROCESSES["START"] = "start";
    PROCESSES["PAUSE"] = "pause";
    PROCESSES["RESUME"] = "resume";
    PROCESSES["END"] = "end";
})(PROCESSES || (PROCESSES = {}));

With this in mind:

enum PROCESSES {
  START = "start",
  PAUSE = "pause",
  RESUME = "resume",
  END = "end"
}

const values = Object.values(PROCESSES);

const index = values.indexOf(PROCESSES.PAUSE);
const nextStep: PROCESSES = values[index + 1];
console.log(nextStep);

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Improving the readability of Angular and RxJS code

I'm new to RxJs and angular and was wondering if there's a way to make the following code simpler while retaining its functionality. Is there room for improvement or is this as good as it gets? private configureDataStreams() { let params$ = thi ...

Cannon-js: Experience dynamic body bouncing on the y axis as it reacts to force applied on the x and z axes

Currently, I am working on an FPS game where the player controller applies force based on keyboard inputs to a dynamic cannon body. The angular dampening is set to 1 on the player body. The PlayerController class takes both the player class (which extends ...

The unknown number of arguments in a Typescript generic type

I'm currently working on developing a function that utilizes a generic type to take in a function, an array of arguments for the function, and then apply them accordingly. However, I am facing an issue with TypeScript not correctly interpreting the ar ...

In an attempt to successfully retrieve data from a formatted XML API, I am working on making a straightforward API call using JavaScript/TypeScript

I'm currently working on a project that involves calling an API in XML format, but I'm having trouble getting any data to show up. So far, I've attempted to use both JavaScript and TypeScript for making the HTTP request, as well as trying o ...

Provide a TypeScript interface that dynamically adjusts according to the inputs of the function

Here is a TypeScript interface that I am working with: interface MyInterface { property1?: string; property2?: string; }; type InterfaceKey = keyof MyInterface; The following code snippet demonstrates how an object is created based on the MyInter ...

Implementing updates to a particular value in a sub-document in Cosmos DB using Azure Function and TypeScript

I am looking to update a specific value called statutProduit in a sub-document residing within a document collection in Azure Cosmos DB. This will be accomplished using an HttpTrigger Azure Function that requires two parameters: the document ID (id) and th ...

Storing data retrieved from a GraphQL response into the sessionStorage: A step-by-step guide

I am facing a challenge in saving my GraphQL response in sessionStorage to access it across different parts of the application without making repeated API calls. I am currently using the useQuery hook with a skip property to check if the data is already st ...

user interface grid element in Materia

After writing this code, I encountered the following error: No overload matches this call. Overload 1 of 2, '(props: { component: ElementType<any>; } & SystemProps<Theme> & { children?: ReactNode; classes?: Partial<GridClasses>; .. ...

Challenges with React Event Listener Types

https://i.sstatic.net/cVlpr.png useEffect(() => { const handleEscClose = (e: KeyboardEvent) => { if (e.key === 'Escape') changeVisibility(); }; if (isVisible) document.addEventListener('keydown', handleEscClos ...

Using ES6 and Typescript, when a button is clicked, apply a class to all TD elements within the button except for the first one. No need for jQuery

A sample table structure is shown below: <table> <tr> <td>1</td> <td>joe</td> <td>brown</td> <td><button onclick="addClasses()">Add Class to add TD's in t ...

The error message "Can't resolve all parameters for CustomerService" is preventing Angular from injecting HttpClient

I have a customerService where I am attempting to inject httpClient. The error occurs on the line where I commented //error happens on this line. Everything works fine until I try to inject httpClient into my service. The error message is: `compiler.js: ...

Next.js experiencing hydration error due to dynamic component

Having an issue with my RandomShape component, where it should display a random SVG shape each time the page is reloaded. However, I am encountering a hydration error on the client side. import React from "react"; import shapes, { getRandomShape ...

``There is an issue with Cross-Origin Resource Sharing (CORS) in a Node.js application utilizing TypeScript

I've encountered some issues with my application, specifically regarding CORS. I suspect it may be due to a misconfiguration on my server. The problem arises when I attempt to create a user in my PostgreeSQL database via the frontend. I have a tsx com ...

Utilizing statuses in Typescript React for conditional rendering instead of manually checking each individual variable

It's common for developers, myself included, to perform conditional rendering by checking variable values like this: import React, { useState, useMemo } from 'react' const Page = () => { const [data, setData] = useState<any[]>() ...

Adjusting the settimeout delay time during its execution

Is there a way to adjust the setTimeout delay time while it is already running? I tried using debounceTime() as an alternative, but I would like to modify the existing delay time instead of creating a new one. In the code snippet provided, the delay is se ...

What steps can be taken to resolve the issue of receiving the error message "Invalid 'code' in request" from Discord OAuth2?

I'm in the process of developing an authentication application, but I keep encountering the error message Invalid "code" in request when attempting to obtain a refresh token from the code provided by Discord. Below is a snippet of my reques ...

Interactive Typescript slider with drag functionality

Seeking assistance in developing a draggable slider using TypeScript. I have managed to retrieve the client and scroll positions, but I am struggling to change the ref scrollLeft position. There are no errors thrown; however, the ref's scrollLeft prop ...

Here's how you can retrieve URL parameters in NextJs, such as `userid/:this_is_a_param`

I'm struggling to retrieve URL parameters using Next.js. I normally do this with Express by getting a :param from the URL like this: users/:userid/ console.log(req.params.userid) All I've been able to do is get the "userid" from the URL like thi ...

Error occurred during MS ADAL Integration: Authentication failed due to user canceling the flow on Ionic 4 with RequestId

Currently, I am attempting to incorporate Ms ADAL into my Ionic 4 project, but encountering the following issue: Authentication failed Error: User cancelled the flow RequestId Below is a snippet of my code: import { MSAdal, AuthenticationContext, Auth ...

Guidelines for incorporating Dropdown menus in a Multi-level Carousel themed SideNav using Angular 5 Material

https://i.sstatic.net/cbmuA.gif Hey there, World! I've been working on a sidenav with tabs that has the perfect transition effect I was looking for. Now, I want to add functionality so that when users click on "Option 1, Option 2 or Option 3", the tab ...