fix: tab item is not translated (#19735)

packages/ui/components/navigation/tabs/HorizontalTabItem.tsx

@@ -1,5 +1,6 @@
 import Link from "next/link";
 
+import { useLocale } from "@calcom/lib/hooks/useLocale";
 import { useUrlMatchesCurrentUrl } from "@calcom/lib/hooks/useUrlMatchesCurrentUrl";
 import classNames from "@calcom/ui/classNames";
 
@@ -33,6 +34,7 @@ const HorizontalTabItem = function ({
   ...props
 }: HorizontalTabItemProps) {
   const isCurrent = useUrlMatchesCurrentUrl(href, matchFullPath) || props?.isActive;
+  const { t } = useLocale();
 
   return (
     <Link
@@ -63,7 +65,7 @@ const HorizontalTabItem = function ({
           aria-hidden="true"
         />
       )}
-      {avatar && <Avatar size="xs" imageSrc={avatar} alt="avatar" className="-ml-0.5 me-1" />} {name}
+      {avatar && <Avatar size="xs" imageSrc={avatar} alt="avatar" className="-ml-0.5 me-1" />} {t(name)}
     </Link>
   );
 };

packages/ui/components/navigation/tabs/VerticalTabItem.tsx

@@ -1,6 +1,7 @@
 import Link from "next/link";
 import { Fragment } from "react";
 
+import { useLocale } from "@calcom/lib/hooks/useLocale";
 import { useUrlMatchesCurrentUrl } from "@calcom/lib/hooks/useUrlMatchesCurrentUrl";
 import classNames from "@calcom/ui/classNames";
 
@@ -40,6 +41,7 @@ const VerticalTabItem = ({
   ...props
 }: VerticalTabItemProps) => {
   const isCurrent = useUrlMatchesCurrentUrl(href) || props?.isActive;
+  const { t } = useLocale();
 
   return (
     <Fragment key={name}>
@@ -76,7 +78,7 @@ const VerticalTabItem = ({
             )}
             <div className="h-fit min-w-0 flex-1">
               <span className="flex items-center gap-2">
-                {name}
+                {t(name)}
                 {props.isExternalLink ? <Icon name="external-link" data-testid="external-link" /> : null}
               </span>
               {info && (