Fix translations in blog

Author: melissawm

src/components/footer.js

@@ -15,7 +15,7 @@ import { getRootURL } from '@/lib/seo-utils'
 import { GitSHA } from '@/components/git-sha'
 import { Image, Link } from '@/components/mdx'
 import { NetlifyCallout } from '@/components/netlify'
-import { footerItems } from '@/data/footer-items'
+import { getFooterItems } from '@/data/footer-items'
 import { FaGithub, FaRss, FaTwitter, FaYoutube } from 'react-icons/fa'
 import { useLingui } from '@lingui/react/macro'
 

src/components/layout.js

@@ -23,7 +23,7 @@ export const Layout = ({
   const router = useRouter()
   const { pathname, asPath, query } = router
 
-  const bannerTitle = 'Check out the latest blog post:'
+  const bannerTitle = t`Check out the latest blog post:`
   // The first link will be the main description for the banner
   const bannerDescription = (
     <Link href='/blog/xarray-napari-plan' fontWeight='medium'>

src/components/raw-html.js

@@ -1,5 +1,6 @@
 import { sanitizeHTML } from '@/lib/sanitize-html'
 import { Box } from '@chakra-ui/react'
+import { useLingui } from '@lingui/react/macro'
 import useSWR from 'swr'
 
 async function fetcher(url) {
@@ -20,14 +21,16 @@ async function fetcher(url) {
 }
 
 export const RawHTML = ({ filePath }) => {
+  const { t } = useLingui()
+
   const { data: htmlContent, error } = useSWR(
     `/api/html-content?filePath=${encodeURIComponent(filePath)}`,
     fetcher,
     { dedupingInterval: 60 * 60 * 1000 }, // 1 hour in milliseconds
   )
 
   if (error) {
-    return <div>{`tError loading content`}</div>
+    return <div>{t`Error loading content`}</div>
   }
 
   if (!htmlContent) {