Typing help

[fickle owl]

    if (Object.keys(lang).filter(e => e === modifier.identifier).length) {
        modifierData = lang[modifier.identifier];
    }```

``` Element implicitly has an 'any' type because expression of type 'string' can't be used to index type '{ "the_vault:attack_damage": { name: string; description: string; color: string; }; "the_vault:attack_range": { name: string; description: string; color: string; }; "the_vault:attack_speed": { name: string; description: string; color: string; }; ... 79 more ...; "the_vault:immortality": { ...; }; }'.
  No index signature with a parameter of type 'string' was found on type '{ "the_vault:attack_damage": { name: string; description: string; color: string; }; "the_vault:attack_range": { name: string; description: string; color: string; }; "the_vault:attack_speed": { name: string; description: string; color: string; }; ... 79 more ...; "the_vault:immortality": { ...; }; }'.```

How can I remove the error?

[hollow reef]

well, modifier.identifier comes from outside of that if statement

and it looks like it's typed as a string

instead, modifier.identifier should be typed as keyof typeof lang

[fickle owl]

it comes from a json file so cant really change that

oh

[hollow reef]

you can always give a type to the JSON you are importing

or you can do a cast inside the if statement, where you are accessing the lang

[fickle owl]

thats cool 😮

[hollow reef]

modifierData = lang[modifier.identifier as keyof typeof lang];

[fickle owl]

yerp that works

thats amazing thanks!

[hollow reef]

wait, I think there is another way, using the in operator

[dusty cypress]

if you don't want to assert you can also do something like this:

const specificLang = Object.entries(lang).flatMap(([e, value]) => e === modifier.identifier ? [value] : []).pop()
if (specificLang) {
  modifierData = specificLang
}

or filter then map or somesuch if your runtime doesn't yet have flatMap

[fickle owl]

well theoritically it should always return the right result

[hollow reef]

!ts

[coral sedge]

ascor8522#0

Playground Link

Preview:```ts
declare const lang: Record<PropertyKey, unknown>
declare const modifier: {
identifier: string
}

const foo = modifier.identifier
let modifierData
if (foo in lang) {
modifierData = lang[foo]
}```

You can choose specific lines to embed by selecting them before copying the link.

declare const lang: Record<PropertyKey, unknown>;
declare const modifier: {
    identifier: string;
};

const foo = modifier.identifier;
let modifierData;
if (foo in lang) {
    modifierData = lang[foo];
}

[dusty cypress]

oh wow yeah, i don't know why i overcomplicated it

[fickle owl]

        modifierData = lang[modifier.identifier];
    }``` still requires typing the modifier.identifier though

[dusty cypress]

how about:

[coral sedge]

mkantor#0

Playground Link

Preview:ts ... let modifierData modifierData = lang[modifier.identifier] ?? modifierData ...

[dusty cypress]

(even better with noUncheckedIndexedAccess enabled to prevent mistakes)

sorry, i think i missed the "typed as string" bit

[fickle owl]

i mean the way i sent works

[fickle owl]

    console.log(event);
    
    setValue(event.target.value);
    onChange(event.target.value);
  };``` why does this not allow target?

[hollow reef]

it's a different question, so it should probably have its own thread, but anyway

is this React code?

also, what do you mean by "not allowed"?

@fickle owl

[fickle owl]

Property 'target' does not exist on type 'ChangeEventHandler<HTMLInputElement>'.

Yeah its react

[hollow reef]

are you sure about the event:ChangeEventHandler type?

[...]Handler sounds like the type for a function, not the type for an event

shouldn't it be of type React.ChangeEvent<HTMLInputElement>?

[fickle owl]

I just hovered over it in VSC and thats what it suggested 😛