Connect the keys from one enum to either keys or values in another enum

Question

Connect the keys from one enum to either keys or values in another enum

When working with the code below, it is important that the keys of PropertiesNamesInDataBase align with those in User.Keys. While the values of PropertiesNamesInDataBase are used in the backend, it is crucial for uniformity that the names match in the frontend.

namespace User {
    export enum Keys {
        ID = "ID",
        name = "name"
    }
}

enum PropertiesNamesInDataBase {
    ID = "id",
    name = "nm"
}

This setup poses at least two challenges:

We may have to manually retype or copy-paste the keys
PropertiesNamesInDataBase operates independently from User.Keys, but ideally, the keys in PropertiesNamesInDataBase should somehow reference User.Keys.

To address the second issue, one solution is to associate the keys in PropertiesNamesInDataBase with those in User.Keys:

namespace User {
    export enum Keys {
        ID = "ID",
        name = "name"
    }
}

enum PropertiesNamesInDataBase {
    [User.Keys.ID] = "id",
    [User.Keys.name] = "nm"
}

However, TypeScript does not support this approach:

Computed property names are not allowed in enums. (1164)

If you have any ideas on how to efficiently reuse enum keys or reference PropertiesNamesInDataBase's keys based on User.Keys's values, please share your suggestions.

typescript enums

Answer 1

Answer №1

If you're considering abandoning the use of enum, one alternative is to create your own enum-like objects for added flexibility. While this approach allows you to define keys only once, it does come with a trade-off – you will lose some of the built-in expressiveness that comes with using enum.

Here's an example of how you can implement this:

const KeysAndPropNames = {
  ID: { key: "ID", propName: "id" },
  name: { key: "name", propName: "nm" }
} as const;

This single object maps keys to values similar to what you had in your previous User.Keys and PropertiesNamesInDataBase enums. You can extract these enum-like objects like this:

const User = { Keys: objMapProp(KeysAndPropNames, "key") };
const PropertiesNamesInDataBase = objMapProp(KeysAndPropNames, "propName");

The function objMapProp() helps map a property access over an object:

// Library Function
function objMapProp<T extends Record<keyof T, Record<K, any>>, K extends keyof any>(
  obj: T,
  key: K
) {
  const ret = {} as { [P in keyof T]: T[P][K] };
  for (let k in obj) {
    ret[k] = obj[k][key];
  }
  return ret;
}

If you check the types of the new User and PropertiesNamesInDataBase objects using IntelliSense, you'll see they align with the old values.

To create the corresponding types named User.Keys and PropertiesNamesInDataBase, you can define them as follows:

namespace User {
  export type Keys = (typeof User.Keys)[keyof typeof User.Keys];
  // type User.Keys = "ID" | "name"
}
type PropertiesNamesInDataBase = typeof PropertiesNamesInDataBase[keyof typeof PropertiesNamesInDataBase];
// type PropertiesNamesInDataBase = "id" | "nm"

I hope this solution either fulfills your requirements or guides you on how to progress further. Best of luck!

Playground link to code

Answer 2

If you're considering abandoning the use of enum, one alternative is to create your own enum-like objects for added flexibility. While this approach allows you to define keys only once, it does come with a trade-off – you will lose some of the built-in expressiveness that comes with using enum.

Here's an example of how you can implement this:

const KeysAndPropNames = {
  ID: { key: "ID", propName: "id" },
  name: { key: "name", propName: "nm" }
} as const;

This single object maps keys to values similar to what you had in your previous User.Keys and PropertiesNamesInDataBase enums. You can extract these enum-like objects like this:

const User = { Keys: objMapProp(KeysAndPropNames, "key") };
const PropertiesNamesInDataBase = objMapProp(KeysAndPropNames, "propName");

The function objMapProp() helps map a property access over an object:

// Library Function
function objMapProp<T extends Record<keyof T, Record<K, any>>, K extends keyof any>(
  obj: T,
  key: K
) {
  const ret = {} as { [P in keyof T]: T[P][K] };
  for (let k in obj) {
    ret[k] = obj[k][key];
  }
  return ret;
}

If you check the types of the new User and PropertiesNamesInDataBase objects using IntelliSense, you'll see they align with the old values.

To create the corresponding types named User.Keys and PropertiesNamesInDataBase, you can define them as follows:

namespace User {
  export type Keys = (typeof User.Keys)[keyof typeof User.Keys];
  // type User.Keys = "ID" | "name"
}
type PropertiesNamesInDataBase = typeof PropertiesNamesInDataBase[keyof typeof PropertiesNamesInDataBase];
// type PropertiesNamesInDataBase = "id" | "nm"

I hope this solution either fulfills your requirements or guides you on how to progress further. Best of luck!

Playground link to code

Connect the keys from one enum to either keys or values in another enum

Answer №1

Similar questions

Switching the phone formatting from JavaScript to TypeScript

Using RxJS switchMap in combination with toArray allows for seamless transformation

I can't figure out why I'm receiving undefined even though all the variables are populated with the necessary

Error message encountered when trying to associate "can" with an ability instance within Types

How to anticipate an error being thrown by an observable in RxJS

Add a hyperlink within a button element

Unable to utilize console.log and alert functions within the Next.js application

JavaScript: Translating Date into Moment

Issue with blueprintjs/core type in JupyterLab Extension after running npm install

Is there a way to reset the selected value of a specific option in Mat-Select?

Tips for having tsc Resolve Absolute Paths in Module Imports with baseUrl Setting

What is the best way to delete markers from a leaflet map?

What is the reason behind TypeScript enclosing a class within an IIFE (Immediately Invoked Function

Implementing express-openid-connect in a TypeScript project

Encountering an error with the Next Auth adapter in TypeScript when attempting to modify the default User interface

Troubleshooting Angular 2: Why Array Interpolation is Failing

What is the best way to forward specific props from a parent to its children?

In TypeScript, what specific term denotes a type of data?

disable the button border on native-base

Typescript, creating multiple definitions for a function with an object parameter