refactor: replace hardcoded strings with intl equivalents

packages/concordia-app/public/locales/en/translation.json

@@ -22,12 +22,12 @@
   "edit.information.modal.form.profile.picture.field.placeholder": "URL",
   "edit.information.modal.form.submit.button": "Submit",
   "edit.information.modal.title": "Edit profile information",
-  "poll.create.question.field.label": "Poll Question",
+  "poll.create.add.option.button": "Add Option",
-  "poll.create.question.field.placeholder": "Question",
   "poll.create.allow.vote.changes.field.label": "Allow vote changes",
   "poll.create.option.field.label": "Option #{{id}}",
   "poll.create.option.field.placeholder": "Option #{{id}}",
-  "poll.create.add.option.button": "Add Option",
+  "poll.create.question.field.label": "Poll Question",
+  "poll.create.question.field.placeholder": "Question",
   "post.create.form.send.button": "Post",
   "post.form.content.field.placeholder": "Message",
   "post.form.subject.field.placeholder": "Subject",
@@ -39,8 +39,8 @@
   "profile.general.tab.location.row.title": "Location:",
   "profile.general.tab.number.of.posts.row.title": "Number of posts:",
   "profile.general.tab.number.of.topics.row.title": "Number of topics created:",
-  "profile.general.tab.posts.db.address.row.title": "PostsDB:",
   "profile.general.tab.polls.db.address.row.title": "PollsDB:",
+  "profile.general.tab.posts.db.address.row.title": "PostsDB:",
   "profile.general.tab.registration.date.row.title": "Member since:",
   "profile.general.tab.save.info.button.title": "Save information",
   "profile.general.tab.title": "General",
@@ -75,14 +75,20 @@
   "topbar.button.create.topic": "Create topic",
   "topbar.button.profile": "Profile",
   "topbar.button.register": "Sign Up",
+  "topic.create.form.add.poll.button": "Add Poll",
   "topic.create.form.content.field.label": "First post content",
   "topic.create.form.content.field.placeholder": "Message",
   "topic.create.form.post.button": "Create Topic",
+  "topic.create.form.remove.poll.button": "Remove Poll",
   "topic.create.form.subject.field.label": "Topic subject",
   "topic.create.form.subject.field.placeholder": "Subject",
-  "topic.create.form.add.poll.button": "Add Poll",
-  "topic.create.form.remove.poll.button": "Remove Poll",
   "topic.list.row.topic.id": "#{{id}}",
+  "topic.poll.guest.header": "Only registered users are able to vote in polls.",
+  "topic.poll.guest.sub.header.link": "signup",
+  "topic.poll.guest.sub.header.post": " page.",
+  "topic.poll.guest.sub.header.pre": "You can register in the ",
+  "topic.poll.invalid.data.header": "This topic has a poll but the data are untrusted!",
+  "topic.poll.invalid.data.sub.header": "The poll data downloaded from the poster have been tampered with.",
   "topic.poll.tab.graph.title": "Results",
   "topic.poll.tab.results.votes.count": "{{totalVotes}} votes casted",
   "topic.poll.tab.vote.form.button.submit": "Submit",

packages/concordia-app/src/components/PollView/PollDataInvalid/index.jsx

@@ -1,16 +1,23 @@
 import React from 'react';
 import { Container, Header, Icon } from 'semantic-ui-react';
+import { useTranslation } from 'react-i18next';
 
-const PollDataInvalid = () => (
+const PollDataInvalid = () => {
-    <Container id="topic-poll-data-invalid-container">
+  const { t } = useTranslation();
-        <Header as="h3">
+
-            <Icon name="warning sign" color="red" />
+  return (
-            <Header.Content>
+      <Container id="topic-poll-data-invalid-container" textAlign="center">
-                This topic has a poll but the data are untrusted!
+          <Header as="h3" icon textAlign="center">
-                <Header.Subheader>The poll data downloaded from the poster have been tampered with.</Header.Subheader>
+              <Icon name="warning sign" color="red" />
-            </Header.Content>
+              <Header.Content>
-        </Header>
+                  {t('topic.poll.invalid.data.header')}
-    </Container>
+                  <Header.Subheader>
-);
+                      {t('topic.poll.invalid.data.sub.header')}
+                  </Header.Subheader>
+              </Header.Content>
+          </Header>
+      </Container>
+  );
+};
 
 export default PollDataInvalid;

packages/concordia-app/src/components/PollView/PollGuestView/index.jsx

@@ -1,21 +1,26 @@
 import React from 'react';
 import { Container, Header, Icon } from 'semantic-ui-react';
 import { Link } from 'react-router-dom';
+import { useTranslation } from 'react-i18next';
 
-const PollGuestView = () => (
+const PollGuestView = () => {
-    <Container id="topic-poll-guest-view-container" textAlign="center">
+  const { t } = useTranslation();
-        <Header as="h3" icon textAlign="center">
+
-            <Icon name="signup" />
+  return (
-            <Header.Content>
+      <Container id="topic-poll-guest-view-container" textAlign="center">
-                Only registered users are able to vote in polls.
+          <Header as="h3" icon textAlign="center">
-                <Header.Subheader>
+              <Icon name="signup" />
-                    You can register in the&nbsp;
+              <Header.Content>
-                    <Link to="/auth/register">signup</Link>
+                  {t('topic.poll.guest.header')}
-                    &nbsp;page.
+                  <Header.Subheader>
-                </Header.Subheader>
+                      {t('topic.poll.guest.sub.header.pre')}
-            </Header.Content>
+                      <Link to="/auth/register">{t('topic.poll.guest.sub.header.link')}</Link>
-        </Header>
+                      {t('topic.poll.guest.sub.header.post')}
-    </Container>
+                  </Header.Subheader>
-);
+              </Header.Content>
+          </Header>
+      </Container>
+  );
+};
 
 export default PollGuestView;