I am searching for a secure method to create keyed objects in this manner:
interface Types {
RED: 'RED';
BLUE: 'BLUE';
GREEN: 'GREEN';
}
type TypeKeys = keyof Types;
const COLORS: Types = {
RED: 'RED',
BLUE: 'BLUE',
GREEN: 'GREEN',
};
However, I find it quite cumbersome and repetitive to define the values twice.
Is there a more efficient and safer approach to accomplish this?
In my React component, the implementation looks like this:
const [color, setColor] = useState<TypeKeys>(COLORS.RED);
const handleColorChange = (
event: React.ChangeEvent<{ name?: string; value: unknown }>
) => {
const newColorValue = event.target.value as TypeKeys;
setColor(newColorValue);
};