Add react-i18next for multi-language support (#917)

This is a rough start on adding react-i18next. I'll be working on adding
more translatable strings and translations in the coming days. I'm going
to need to wrap class components in HOCs, so let me know if there's
something I should be fixing before doing that. I'm thinking now to keep
the exported class names exactly the same, and rename the existing
classes by prefixing an `I` (for internal). For example:

```
export default class AppToolbar ...
```

becomes

```
class IAppToolbar ...
const AppToolbar = withTranslation()(IAppToolbar);
export default AppToolbar;
```

I'll be able to contribute Japanese strings (I've talked to a couple
people on my team and they'll be happy to help as well), so that's the
language I decided to go with in this PR.

Closes #746

---------

Co-authored-by: Ko Nagase <nagase@georepublic.co.jp>
Co-authored-by: Harel M <harel.mazor@gmail.com>

src/components/Modal.tsx

@@ -2,9 +2,9 @@ import React, { PropsWithChildren } from 'react'
 import {MdClose} from 'react-icons/md'
 import AriaModal from 'react-aria-modal'
 import classnames from 'classnames';
+import { WithTranslation, withTranslation } from 'react-i18next';
 
-
-type ModalProps = PropsWithChildren & {
+type ModalInternalProps = PropsWithChildren & {
   "data-wd-key"?: string
   isOpen: boolean
   title: string
@@ -12,10 +12,10 @@ type ModalProps = PropsWithChildren & {
   underlayClickExits?: boolean
   underlayProps?: any
   className?: string
-};
+} & WithTranslation;
 
 
-export default class Modal extends React.Component<ModalProps> {
+class ModalInternal extends React.Component<ModalInternalProps> {
   static defaultProps = {
     underlayClickExits: true
   }
@@ -32,6 +32,7 @@ export default class Modal extends React.Component<ModalProps> {
   }
 
   render() {
+    const t = this.props.t;
     if(this.props.isOpen) {
       return <AriaModal
         titleText={this.props.title}
@@ -49,7 +50,7 @@ export default class Modal extends React.Component<ModalProps> {
             <h1 className="maputnik-modal-header-title">{this.props.title}</h1>
             <span className="maputnik-modal-header-space"></span>
             <button className="maputnik-modal-header-toggle"
-              title="Close modal"
+              title={t("Close modal")}
               onClick={this.onClose}
               data-wd-key={this.props["data-wd-key"]+".close-modal"}
             >
@@ -68,3 +69,5 @@ export default class Modal extends React.Component<ModalProps> {
   }
 }
 
+const Modal = withTranslation()(ModalInternal);
+export default Modal;