install localisation library

src/components/Card.tsx

@@ -4,6 +4,7 @@ import styled from "styled-components";
 import { colors } from "@theme/colors";
 import { Link } from "@components/index";
 import breakpoints from "@theme/breakpoints";
+import { useTranslation } from "../i18n";
 
 interface WrappedCardProps {
   title: string;
@@ -71,6 +72,7 @@ const StyledCard = styled.article`
 const WrappedCard: React.FC<WrappedCardProps> = ({
   title, text, link, image, start_time, buttonOnClick, ...props
 }) => {
+  const { t } = useTranslation();
   const options: Intl.DateTimeFormatOptions = {
     day: "numeric",
     month: "numeric",
@@ -83,7 +85,7 @@ const WrappedCard: React.FC<WrappedCardProps> = ({
   const button = (
     <Link to={link}>
       <button type="button" onClick={buttonOnClick}>
-        Lue lisää&nbsp;›
+        {t("Lue lisää")}&nbsp;›
       </button>
     </Link>
   );

src/components/ChangeLanguageButton.tsx

@@ -0,0 +1,14 @@
+import React from "react";
+import i18nNext, { useTranslation } from "../i18n";
+
+const ChangeLanguageButton: React.FC = () => {
+  const { t } = useTranslation();
+
+  const { i18n } = i18nNext;
+
+  return (
+    <button type="button" onClick={() => i18n.changeLanguage(i18n.language === "fi" ? "en" : "fi")}>{t("lngButton")}</button>
+  );
+};
+
+export default ChangeLanguageButton;