Tipos para la notación de corchetes en TypeScript

Estoy tratando de crear una acción de Redux para algunas actualizaciones rutinarias del estado y me pregunto si es posible hacer que los tipos funcionen con la notación de corchetes:

interface IThing {
  someProp: string;
  otherProp: boolean;
}

const state = {
  thing: {
    someProp: 'prop',
    otherProp: true,
  } as IThing
}

const action = { name: 'someProp' as keyof IThing, value: 'someValue' as any }

// gives typescript error: Type 'any' is not assignable to type 'never'
state.thing[action.name] = action.value;

Respuesta #1

El problema aquí es que si estás asignando un valor mediante un nombre de propiedad dinámico, entonces el valor en el lado derecho necesita ser asignable a cualquier propiedad que puedas nombrar. En este caso, eso significa que debe ser asignable tanto a string como a boolean, lo que significa que debe ser del tipo never (ya que los dos tipos no tienen valores en común).

La solución es usar un tipo genérico, de modo que puedas restringir el nombre de la propiedad a ser de tipo K, y el valor que asignes puede ser de tipo IThing[K] que no necesariamente es never. Aquí hay un ejemplo:

interface IAction<K extends keyof IThing> {
  name: K;
  value: IThing[K];
}

function assign<K extends keyof IThing>(thing: IThing, action: IAction<K>): void {
  thing[action.name] = action.value;
}

const action = { name: 'someProp', value: 'someValue' } as const;
assign(state.thing, action); // ok

Enlace del parque