Typescript: how can I assert the type of a variable derived from the data returned from a query if isSuccess is true?

[lorenzo-dallamuta]

React-Query can tell Typescript that the result of a query is defined if the isSuccess flag is true (with DefinedUseInfiniteQueryResult), but I can't figure out how to tell Typescript to do the same for a value derived from the query results such as the following.

const { data: isSuccess } = useQuery({ ...query_options });
const derived = isSuccess ? { ...data, something_else: '' } : undefined;

return isSucess ? <p>{derived.something_else}</p> : null;

This will yield 'derived' is possibly 'undefined'.ts(18048) and I'm not really sure how React-Query does the trick with the original query result in the first place.

Can I express that a derived values is defined if it is dervied from the query result and isSuccess is true without additional null checks?

[TkDodo]

we have a discriminated union type internally, but that discrimination gets lost when you just create your own object. Not sure what your use-case is but the simple version is likely just:

return derived ? <p>{derived.something_else}</p> : null;

[lorenzo-dallamuta]

Yeah, I guess the simple answer fits my use case.