Adding support for internationalization / i18n (#189)

* Still not working

* Starting to work on internationalization

* Main done.

* i18n translations first pass.

* Localization testing mostly done.

* Second front end pass.

* Added a few more translations.

* Adding back end translations.

1 files changed, 11 insertions, 9 deletions

diff --git a/ui/src/components/sponsors.tsx b/ui/src/components/sponsors.tsx
index c0b36e4c..3fd55c2f 100644
--- a/ui/src/components/sponsors.tsx
+++ b/ui/src/components/sponsors.tsx
@@ -1,5 +1,7 @@
 import { Component } from 'inferno';
 import { WebSocketService } from '../services';
+import { i18n } from '../i18next';
+import { T } from 'inferno-i18next';
 
 let general = 
   [
@@ -18,7 +20,7 @@ export class Sponsors extends Component<any, any> {
   }
 
   componentDidMount() {
-    document.title = `Sponsors - ${WebSocketService.Instance.site.name}`;
+    document.title = `${i18n.t('sponsors')} - ${WebSocketService.Instance.site.name}`;
   }
 
   render() {
@@ -36,19 +38,19 @@ export class Sponsors extends Component<any, any> {
   topMessage() {
     return (
       <div>
-        <h5>Sponsors of Lemmy</h5>
+        <h5><T i18nKey="sponsors_of_lemmy">#</T></h5>
         <p>
-          Lemmy is free, <a href="https://github.com/dessalines/lemmy">open-source</a> software, meaning no advertising, monetizing, or venture capital, ever. Your donations directly support full-time development of the project. Thank you to the following people:
+          <T i18nKey="sponsor_message">#<a href="https://github.com/dessalines/lemmy">#</a></T>
         </p>
-        <a class="btn btn-secondary" href="https://www.patreon.com/dessalines">Support on Patreon</a>
+        <a class="btn btn-secondary" href="https://www.patreon.com/dessalines"><T i18nKey="support_on_patreon">#</T></a>
       </div>
     )
   }
   sponsors() {
     return (
       <div class="container">
-        <h5>Sponsors</h5>
-        <p>General Sponsors are those that pledged $10 to $39 to Lemmy.</p>
+        <h5><T i18nKey="sponsors">#</T></h5>
+        <p><T i18nKey="general_sponsors">#</T></p>
         <div class="row card-columns">
           {general.map(s => 
             <div class="card col-12 col-md-2">
@@ -63,16 +65,16 @@ export class Sponsors extends Component<any, any> {
   bitcoin() {
     return (
       <div>
-      <h5>Crypto</h5>
+        <h5><T i18nKey="crypto">#</T></h5>
       <div class="table-responsive">
         <table class="table table-hover text-center">
           <tbody>
           <tr>
-            <td>Bitcoin</td>
+            <td><T i18nKey="bitcoin">#</T></td>
             <td><code>1Hefs7miXS5ff5Ck5xvmjKjXf5242KzRtK</code></td>
           </tr>
           <tr>
-            <td>Ethereum</td>
+            <td><T i18nKey="ethereum">#</T></td>
             <td><code>0x400c96c96acbC6E7B3B43B1dc1BB446540a88A01</code></td>
           </tr>
           </tbody>