Function Sidebar

packages/shared/src/components/sidebar/Sidebar.tsx:34–82

({
  additionalButtons,
  isNavButtons,
  showFeedbackWidget,
  onNavTabClick,
  onLogoClick,
  activePage,
}: SidebarProps)

}

export const Sidebar = ({
  additionalButtons,
  isNavButtons,
  showFeedbackWidget,
  onNavTabClick,
  onLogoClick,
  activePage,
}: SidebarProps): ReactElement | null => {
  const isLaptop = useViewSize(ViewSize.Laptop);
  const isTablet = useViewSize(ViewSize.Tablet);
  const featureTheme = useFeatureTheme();
  const { isV2 } = useLayoutVariant();

  if (!isLaptop && isTablet) {
    return (
      <SidebarTablet
        activePage={activePage}
        onLogoClick={onLogoClick}
        featureTheme={featureTheme}
      />
    );
  }

  if (isLaptop) {
    if (isV2) {
      return (
        <SidebarDesktopV2
          activePage={isExtension ? activePage : undefined}
          featureTheme={featureTheme}
          additionalButtons={additionalButtons}
          isNavButtons={isNavButtons}
          showFeedbackWidget={showFeedbackWidget}
          onNavTabClick={onNavTabClick}
          onLogoClick={onLogoClick}
        />
      );
    }
    return (
      <SidebarDesktop
        activePage={isExtension ? activePage : undefined}
        featureTheme={featureTheme}
        isNavButtons={isNavButtons}
        onNavTabClick={onNavTabClick}
      />
    );
  }

  return null;
};