discriminated union as props

is there anything noticeably wrong with this

type SidebareOpenContentsProps = {
  showSkeletons: boolean;
  sidebarItems: MockSidebarItems | {};
} & (
  | {
      showSkeletons: true;
      sidebarItems: {};
    }
  | {
      showSkeletons: false;
      sidebarItems: MockSidebarItems;
    }
);

type SidebareOpenContentsProps = {
  showSkeletons: boolean;
  sidebarItems: MockSidebarItems | {};
} & (
  | {
      showSkeletons: true;
      sidebarItems: {};
    }
  | {
      showSkeletons: false;
      sidebarItems: MockSidebarItems;
    }
);

, when used like

        <SidebarOpenContents
          sidebarItems={status === "success" ? sidebarItems : {}}
          showSkeletons={status === "loading"}
        />

        <SidebarOpenContents
          sidebarItems={status === "success" ? sidebarItems : {}}
          showSkeletons={status === "loading"}
        />

I'm getting a "false is not assignable to boolean" error, but I thought this would be the only way to use discrimnated union to type narrow properly here.

0 Replies

No replies yetBe the first to reply to this messageJoin

Gaming

Programming

discriminated union as props