feat: add es and zh translation to the feedback form

Author: brolag

public/locales/en/translation.json

@@ -4,7 +4,12 @@
     "more": "More",
     "editThisPage": "Edit this page",
     "joinOurCommunity": "Join our community",
-    "feedback": "Feedback"
+    "feedback": "Feedback",
+    "feedbackForm": {
+      "thankYouMessage": "We appreciate your feedback! 🤎",
+      "instructions": "Tell us more about your experience.",
+      "submit": "submit"
+    }
   },
   "ui": {
     "whatsNext": "What's Next",

public/locales/es/translation.json

@@ -4,7 +4,12 @@
     "more": "Más",
     "editThisPage": "Editar esta página",
     "joinOurCommunity": "Únete a nuestro Discord",
-    "feedback": "Feedback"
+    "feedback": "Comentarios",
+    "feedbackForm": {
+      "thankYouMessage": "¡Agradecemos tus comentarios! 🤎",
+      "instructions": "Cuéntanos más sobre tu experiencia.",
+      "submit": "enviar"
+    }
   },
   "ui": {
     "whatsNext": "¿Qué sigue?",

public/locales/zh/translation.json

@@ -4,7 +4,12 @@
     "more": "更多",
     "editThisPage": "编辑本页",
     "joinOurCommunity": "加入我们的社区",
-    "feedback": "反馈"
+    "feedback": "反馈",
+    "feedbackForm": {
+      "thankYouMessage": "我们非常感谢您的反馈！🤎",
+      "instructions": "请告诉我们更多关于您的体验。",
+      "submit": "提交"
+    }
   },
   "ui": {
     "whatsNext": "接下来是什么",

src/components/PageContent/Feedback.tsx

@@ -1,3 +1,4 @@
+import { t } from "i18next"
 import { useState } from "preact/hooks"
 import button from "../../styles/design-system/button.module.css"
 
@@ -113,7 +114,7 @@ export const Feedback = () => {
         >
           {isSent ? (
             <div className="text-dark dark:text-white" style={{ fontSize: "1rem", lineHeight: "normal" }}>
-              We appreciate your feedback! 🤎
+              {t("rightSidebar.feedbackForm.thankYouMessage")}
             </div>
           ) : (
             <form
@@ -126,7 +127,7 @@ export const Feedback = () => {
                 className="text-dark dark:text-white"
                 style={{ fontSize: "1rem", lineHeight: "normal", marginBottom: "16px" }}
               >
-                Tell us more about your experience.
+                {t("rightSidebar.feedbackForm.instructions")}
               </label>
               <div style={{ display: "flex", flexDirection: "column" }}>
                 <textarea
@@ -147,7 +148,7 @@ export const Feedback = () => {
                   style={{ borderRadius: "5px", borderWidth: " 0", background: "var(--orange-400)" }}
                   disabled={isSubmitting}
                 >
-                  submit
+                  {t("rightSidebar.feedbackForm.submit")}
                 </button>
               </div>
             </form>