Repository: TabbyML/tabby
File: ee/tabby-ui/components/license-banner.tsx (TypeScript)

Code before:
  )
}

export function useShowLicenseBanner(): [
  boolean,
  React.Dispatch<React.SetStateAction<boolean>>
] {
  const { isShowLicenseBanner, setIsShowLicenseBanner } = React.useContext(
    ShowLicenseBannerContext
  )
  return [isShowLicenseBanner, setIsShowLicenseBanner]
}

export function LicenseBanner() {
  const [isShowLicenseBanner, setIsShowLicenseBanner] = useShowLicenseBanner()
  const { isExpired, isSeatsExceeded } = useLicenseValidity()
  const pathname = usePathname()
  const style = isShowLicenseBanner ? { height: BANNER_HEIGHT } : { height: 0 }

  const tips = useMemo(() => {
    if (isExpired) {
      return 'Your license is expired.'
    }

    if (isSeatsExceeded) {
      return 'You have more active users than seats included in your license.'
    }

    return 'No valid license configured'
  }, [isExpired, isSeatsExceeded])

  return (
    <div
      className={cn(
        'flex items-center justify-between border-b bg-secondary px-4 text-secondary-foreground transition-all md:px-5',
        {
          'opacity-100 pointer-events-auto': isShowLicenseBanner,
          'opacity-0 pointer-events-none': !isShowLicenseBanner
        }
      )}
      style={style}
    >
      <div className="flex items-center gap-1 font-semibold text-destructive">
        <IconNotice />
        {tips}
      </div>

      <div className="flex items-center gap-x-4 md:gap-x-8">
        {pathname !== '/settings/subscription' && (
          <Link
            href="/settings/subscription"

Review comment (suggestion):
```suggestion
      return 'You have more active users than seats included in your subscription.'
```

Code after:
  )
}

export function useShowLicenseBanner(): [
  boolean,
  React.Dispatch<React.SetStateAction<boolean>>
] {
  const { isShowLicenseBanner, setIsShowLicenseBanner } = React.useContext(
    ShowLicenseBannerContext
  )
  return [isShowLicenseBanner, setIsShowLicenseBanner]
}

export function LicenseBanner() {
  const [isShowLicenseBanner, setIsShowLicenseBanner] = useShowLicenseBanner()
  const { isExpired, isSeatsExceeded } = useLicenseValidity()
  const pathname = usePathname()
  const style = isShowLicenseBanner ? { height: BANNER_HEIGHT } : { height: 0 }

  const tips = useMemo(() => {
    if (isExpired) {
      return 'Your subscription is expired.'
    }

    if (isSeatsExceeded) {
      return 'You have more active users than seats included in your subscription.'
    }

    return 'No valid license configured'
  }, [isExpired, isSeatsExceeded])

  return (
    <div
      className={cn(
        'flex items-center justify-between border-b bg-secondary px-4 text-secondary-foreground transition-all md:px-5',
        {
          'opacity-100 pointer-events-auto': isShowLicenseBanner,
          'opacity-0 pointer-events-none': !isShowLicenseBanner
        }
      )}
      style={style}
    >
      <div className="flex items-center gap-1 font-semibold text-destructive">
        <IconNotice />
        {tips}
      </div>

      <div className="flex items-center gap-x-4 md:gap-x-8">
        {pathname !== '/settings/subscription' && (
          <Link
            href="/settings/subscription"