Miss Dada  🏳️‍⚧️

TypeScript: type A = {kind: "a"} type B = {kind: "b"} type AorB = A | B function takesB(b: B) { } function makeB(): AorB { return {kind: "b"} } I can do: const b = makeB() b.kind === "b" && takesB(b) But how do I make this work? const isB = b.kind === "b" isB && takesB(b)

This is super genericized to fit in a tweet, but this exact situation comes up all the time in my React components.

Does this fit your needs? function isB(aOrB: AorB): aOrB is B { return aOrB.kind === "b" } isB(b) && takesB(b);

It will help. My goal here is to avoid breaking JSX lines. I have: {chooseable.kind === "lesson"&& ... You propose this, which is shorter: isLesson(chooseable) && ... But what I really want is: isLesson && ...

Yeah, I don't think it's possible to get exactly that (since once it's assigned it's a bool and no longer a type guard). This is one other option though? const definitelyB = b.kind === "b" && b; definitelyB && takesB(definitelyB);

is there a reason this works but it doesn't work if you try to put the conditionals inline?

(Not an expert in TS, this is just my understanding. Take it with a grain of salt). `const b = aOrB.kind ==="b" && b` assigns a new variable with a known type of `B`. `const isB = b.kind === "b"` assigns a variable of type `boolean` not `b is B`.