When using conditional types for the return of a function, how to get type awareness on each return in TypeScript?

See the code below. As I am doing the switch (pageName), I was expecting TS to be aware of what should be returned in each case. How can I achieve that?

TypeScript Playground link

type PageName = 'pageA' | 'pageB';


type PageProps<T extends PageName> = 
  T extends 'pageA' ? { fooA: 'barA'} :
  T extends 'pageB' ?{ fooB: 'barB'} :
  never
;
    

type GetPageData = <T extends PageName>(pageName: T) => Promise<PageProps<T>>;

export const getPageData: GetPageData = async (pageName) => {
    switch (pageName) {
        case 'pageA' {
            return {
                
            }
        }
        case 'pageB' {
            return {
                
            }
        }
    }
    return;
}

Screenshot version: