.

components/utility/announcements.tsx

@@ -8,10 +8,12 @@ import { Announcement } from "@/types/announcement"
 import { IconExternalLink, IconSpeakerphone } from "@tabler/icons-react"
 import { FC, useEffect, useState } from "react"
 import { SIDEBAR_ICON_SIZE } from "../sidebar/sidebar-switcher"
+import { useTranslation } from 'react-i18next'
 
 interface AnnouncementsProps {}
 
 export const Announcements: FC<AnnouncementsProps> = () => {
+  const { t } = useTranslation()
   const [announcements, setAnnouncements] = useState<Announcement[]>([])
 
   useEffect(() => {
@@ -93,7 +95,7 @@ export const Announcements: FC<AnnouncementsProps> = () => {
         <div className="grid gap-4">
           <div>
             <div className="mb-4 text-left text-xl font-bold leading-none">
-              Updates
+            {t("help.updates")}
             </div>
 
             <div className="grid space-y-4">
@@ -120,13 +122,13 @@ export const Announcements: FC<AnnouncementsProps> = () => {
                           size="sm"
                           onClick={() => markAsRead(a.id)}
                         >
-                          Mark as Read
+                          {t("help.markAsRead")}
                         </Button>
 
                         {a.link && (
                           <a href={a.link} target="_blank" rel="noreferrer">
                             <Button className="h-[26px] text-xs" size="sm">
-                              Demo{" "}
+                            {t("help.demo")}{" "}
                               <IconExternalLink className="ml-1" size={14} />
                             </Button>
                           </a>
@@ -144,17 +146,17 @@ export const Announcements: FC<AnnouncementsProps> = () => {
                   variant="outline"
                   onClick={markAllAsRead}
                 >
-                  Mark All as Read
+                  {t("help.markAllAsRead")}
                 </Button>
               ) : (
                 <div className="text-muted-foreground text-sm leading-snug">
-                  You are all caught up!
+                  {t("help.youAreAllCaughtUp")}
                   {announcements.length > 0 && (
                     <div
                       className="mt-6 cursor-pointer underline"
                       onClick={() => markAllAsUnread()}
                     >
-                      Show recent updates
+                      {t("help.showRecentUpdates")}
                     </div>
                   )}
                 </div>