Channel - Vertical Mode

Below is an example that allows you to render your custom Channel component using Planby's style components with Vertical mode.

Available props

Property	Type	Description	Status
isVerticalMode	boolean	Vertical mode	optional
channel	object	Object contains position styles and url for logo	optional

import {
  useEpg,
  Epg,
  Layout,
  ChannelBox,
  ChannelLogo,
  Channel,
  ChannelItem,
} from "@nessprim/planby-pro";

const CustomChannelItem = ({ isVerticalMode, channel }: ChannelItem) => {
  const { position, logo } = channel;

  return (
    <ChannelBox
      data-testid="sidebar-item"
      isVerticalMode={isVerticalMode}
      {...position}
    >
      <ChannelLogo src={logo} alt="Logo" />
    </ChannelBox>
  );
};