add all base translation folders

components/auth/footer.tsx

@@ -22,7 +22,7 @@ const AuthFooterInner: React.FC<Props> = props => {
   }
 
   return (
-    <div
+    <footer
       style={{
         position: 'absolute',
         bottom: 0,
@@ -44,7 +44,7 @@ const AuthFooterInner: React.FC<Props> = props => {
             Hi, {props.me.username}
           </span>,
           <Button
-            key={'Logout'}
+            key={'logout'}
             type={'link'}
             ghost
             onClick={logout}
@@ -85,7 +85,7 @@ const AuthFooterInner: React.FC<Props> = props => {
       >
         &copy; OhMyForm
       </Button>
-    </div>
+    </footer>
   )
 }
 

components/form/admin/self.notifications.tab.tsx

@@ -67,6 +67,7 @@ export const SelfNotificationsTab: React.FC<Props> = props => {
             message: 'Please provide a Template',
           },
         ]}
+        extra={'You can also use <a href="https://mjml.io/try-it-live">MJML</a> to create your email templates'}
       >
         <Input.TextArea autoSize />
       </Form.Item>

components/form/admin/submission.values.tsx

@@ -1,6 +1,7 @@
 import {Descriptions, Table} from 'antd'
 import {ColumnsType} from 'antd/lib/table/interface'
 import React from 'react'
+import {useTranslation} from 'react-i18next'
 import {
   AdminPagerSubmissionEntryFieldQueryData,
   AdminPagerSubmissionEntryQueryData,
@@ -13,9 +14,11 @@ interface Props {
 }
 
 export const SubmissionValues: React.FC<Props> = props => {
+  const { t } = useTranslation()
+
   const columns: ColumnsType<AdminPagerSubmissionEntryFieldQueryData> = [
     {
-      title: 'Field',
+      title: t('submission:field'),
       render: (row: AdminPagerSubmissionEntryFieldQueryData) => {
 
         if (row.field) {
@@ -26,7 +29,7 @@ export const SubmissionValues: React.FC<Props> = props => {
       }
     },
     {
-      title: 'Value',
+      title: t('submission:value'),
       render: row => {
         try {
           const data = JSON.parse(row.value)
@@ -41,11 +44,11 @@ export const SubmissionValues: React.FC<Props> = props => {
 
   return (
     <div>
-      <Descriptions title={'Submission'}>
+      <Descriptions title={t('submission:submission')}>
-        <Descriptions.Item label="Country">{props.submission.geoLocation.country}</Descriptions.Item>
+        <Descriptions.Item label={t('submission:country')}>{props.submission.geoLocation.country}</Descriptions.Item>
-        <Descriptions.Item label="City">{props.submission.geoLocation.city}</Descriptions.Item>
+        <Descriptions.Item label={t('submission:city')}>{props.submission.geoLocation.city}</Descriptions.Item>
-        <Descriptions.Item label="Device Type">{props.submission.device.type}</Descriptions.Item>
+        <Descriptions.Item label={t('submission:device.type')}>{props.submission.device.type}</Descriptions.Item>
-        <Descriptions.Item label="Device Name">{props.submission.device.name}</Descriptions.Item>
+        <Descriptions.Item label={t('submission:device.name')}>{props.submission.device.name}</Descriptions.Item>
       </Descriptions>
 
       <Table

components/form/admin/types/date.type.tsx

@@ -1,13 +1,16 @@
 import {DatePicker, Form} from 'antd'
 import moment from 'moment'
 import React from 'react'
+import {useTranslation} from 'react-i18next'
 import {AdminFieldTypeProps} from './type.props'
 
 export const DateType: React.FC<AdminFieldTypeProps> = ({field, form}) => {
+  const { t } = useTranslation()
+
   return (
     <div>
       <Form.Item
-        label={'Default Date'}
+        label={t('type:date.default')}
         name={[field.name, 'value']}
         labelCol={{ span: 6 }}
         getValueFromEvent={e => e ? e.format('YYYY-MM-DD') : undefined}
@@ -18,7 +21,7 @@ export const DateType: React.FC<AdminFieldTypeProps> = ({field, form}) => {
         />
       </Form.Item>
       <Form.Item
-        label={'Min Date'}
+        label={t('type:date.min')}
         name={[field.name, 'optionKeys', 'min']}
         labelCol={{ span: 6 }}
         getValueFromEvent={e => e.format('YYYY-MM-DD')}
@@ -28,7 +31,7 @@ export const DateType: React.FC<AdminFieldTypeProps> = ({field, form}) => {
       </Form.Item>
 
       <Form.Item
-        label={'Max Date'}
+        label={t('type:date.max')}
         name={[field.name, 'optionKeys', 'max']}
         labelCol={{ span: 6 }}
         getValueFromEvent={e => e.format('YYYY-MM-DD')}

components/form/admin/types/dropdown.type.tsx

@@ -1,12 +1,15 @@
 import {Button, Col, Form, Input, Row} from 'antd'
 import React from 'react'
+import {useTranslation} from 'react-i18next'
 import {AdminFieldTypeProps} from './type.props'
 
 export const DropdownType: React.FC<AdminFieldTypeProps> = props => {
+  const { t } = useTranslation()
+
   return (
     <div>
       <Form.Item
-        label={'Default Value'}
+        label={t('type:dropdown.default')}
         name={[props.field.name, 'value']}
         labelCol={{ span: 6 }}
       >
@@ -26,7 +29,7 @@ export const DropdownType: React.FC<AdminFieldTypeProps> = props => {
                     sm: { offset: index === 0 ? 0 : 6 },
                   }}
                   labelCol={{ span: 6 }}
-                  label={index === 0 ? 'Options' : ''}
+                  label={index === 0 ? t('type:dropdown.options') : ''}
                   key={field.key}
                 >
                   <Row gutter={16}>
@@ -36,7 +39,7 @@ export const DropdownType: React.FC<AdminFieldTypeProps> = props => {
                         name={[field.name, 'title']}
                         style={{marginBottom: 0}}
                       >
-                        <Input placeholder={'Title'} />
+                        <Input placeholder={t('type:dropdown.titlePlaceholder')} />
                       </Form.Item>
                     </Col>
                     <Col span={8}>
@@ -45,15 +48,15 @@ export const DropdownType: React.FC<AdminFieldTypeProps> = props => {
                         name={[field.name, 'value']}
                         style={{marginBottom: 0}}
                         rules={[
-                          { required: true, message: 'Please provide a value' }
+                          { required: true, message: t('validation:valueRequired') }
                         ]}
                       >
-                        <Input placeholder={'Value'} />
+                        <Input placeholder={t('type:dropdown.valuePlaceholder')} />
                       </Form.Item>
                     </Col>
                     <Col span={4}>
                       <Button danger onClick={() => remove(index)}>
-                        Remove
+                        {t('type:dropdown.removeOption')}
                       </Button>
                     </Col>
                   </Row>
@@ -69,7 +72,8 @@ export const DropdownType: React.FC<AdminFieldTypeProps> = props => {
                 <Button
                   type={'dashed'}
                   onClick={() => add()}
-                >Add Option</Button>
+                >
+                  {t('type:dropdown.addOption')}</Button>
               </Form.Item>
             </div>
           )

components/form/admin/types/email.type.tsx

@@ -1,15 +1,18 @@
 import {Form, Input} from 'antd'
 import React from 'react'
+import {useTranslation} from 'react-i18next'
 import {AdminFieldTypeProps} from './type.props'
 
 export const EmailType: React.FC<AdminFieldTypeProps> = props => {
+  const { t } = useTranslation()
+
   return (
     <div>
       <Form.Item
-        label={'Default Email'}
+        label={t('type:email.default')}
         name={[props.field.name, 'value']}
         rules={[
-          { type: 'email', message: 'Must be a valid email' }
+          { type: 'email', message: t('validation:emailRequired') }
         ]}
         labelCol={{ span: 6 }}
       >

components/form/admin/types/hidden.type.tsx

@@ -1,12 +1,15 @@
 import {Form, Input} from 'antd'
 import React from 'react'
+import {useTranslation} from 'react-i18next'
 import {AdminFieldTypeProps} from './type.props'
 
 export const HiddenType: React.FC<AdminFieldTypeProps> = props => {
+  const { t } = useTranslation()
+
   return (
     <div>
       <Form.Item
-        label={'Default Value'}
+        label={t('type:hidden.default')}
         name={[props.field.name, 'value']}
         labelCol={{ span: 6 }}
       >

components/form/admin/types/link.type.tsx

@@ -1,15 +1,18 @@
 import {Form, Input} from 'antd'
 import React from 'react'
+import {useTranslation} from 'react-i18next'
 import {AdminFieldTypeProps} from './type.props'
 
 export const LinkType: React.FC<AdminFieldTypeProps> = props => {
+  const { t } = useTranslation()
+
   return (
     <div>
       <Form.Item
-        label={'Default Link'}
+        label={t('type:link.default')}
         name={[props.field.name, 'value']}
         rules={[
-          { type: 'url', message: 'Must be a valid URL' }
+          { type: 'url', message: t('validation:invalidUrl') }
         ]}
         labelCol={{ span: 6 }}
       >

components/form/admin/types/number.type.tsx

@@ -1,12 +1,15 @@
 import {Form, InputNumber} from 'antd'
 import React from 'react'
+import {useTranslation} from 'react-i18next'
 import {AdminFieldTypeProps} from './type.props'
 
 export const NumberType: React.FC<AdminFieldTypeProps> = props => {
+  const { t } = useTranslation()
+
   return (
     <div>
       <Form.Item
-        label={'Default Number'}
+        label={t('type:number:default')}
         name={[props.field.name, 'value']}
         labelCol={{ span: 6 }}
       >

components/form/admin/types/radio.type.tsx

@@ -1,12 +1,15 @@
 import {Button, Col, Form, Input, Row} from 'antd'
 import React from 'react'
+import {useTranslation} from 'react-i18next'
 import {AdminFieldTypeProps} from './type.props'
 
 export const RadioType: React.FC<AdminFieldTypeProps> = props => {
+  const { t } = useTranslation()
+
   return (
     <div>
       <Form.Item
-        label={'Default Value'}
+        label={t('type:radio:default')}
         name={[props.field.name, 'value']}
         labelCol={{ span: 6 }}
       >

components/form/admin/types/rating.type.tsx

@@ -1,13 +1,16 @@
 import {Form, Rate} from 'antd'
 import React from 'react'
+import {useTranslation} from 'react-i18next'
 import {AdminFieldTypeProps} from './type.props'
 
 export const RatingType: React.FC<AdminFieldTypeProps> = props => {
+  const { t } = useTranslation()
+
   // TODO add ratings
   return (
     <div>
       <Form.Item
-        label={'Default Value'}
+        label={t('type:rating:default')}
         name={[props.field.name, 'value']}
         labelCol={{ span: 6 }}
         extra={'Click again to remove default value'}

components/form/admin/types/text.type.tsx

@@ -1,11 +1,14 @@
 import {Form, Input} from 'antd'
 import React from 'react'
+import {useTranslation} from 'react-i18next'
 import {AdminFieldTypeProps} from './type.props'
 
 export const TextType: React.FC<AdminFieldTypeProps> = props => {
+  const { t } = useTranslation()
+
   return (
     <Form.Item
-      label={'Default Value'}
+      label={t('type:text:default')}
       name={[props.field.name, 'value']}
       labelCol={{ span: 6 }}
     >

components/form/admin/types/textarea.type.tsx

@@ -1,12 +1,15 @@
 import {Form, Input} from 'antd'
 import React from 'react'
+import {useTranslation} from 'react-i18next'
 import {AdminFieldTypeProps} from './type.props'
 
 export const TextareaType: React.FC<AdminFieldTypeProps> = props => {
+  const { t } = useTranslation()
+
   return (
     <div>
       <Form.Item
-        label={'Default Value'}
+        label={t('type:textarea:default')}
         name={[props.field.name, 'value']}
         labelCol={{ span: 6 }}
       >

components/form/admin/types/yes_no.type.tsx

@@ -1,13 +1,16 @@
 import {Form, Input} from 'antd'
 import React from 'react'
+import {useTranslation} from 'react-i18next'
 import {AdminFieldTypeProps} from './type.props'
 
 export const YesNoType: React.FC<AdminFieldTypeProps> = props => {
+  const { t } = useTranslation()
+
   // TODO add switch
   return (
     <div>
       <Form.Item
-        label={'Default Value'}
+        label={t('type:yes_no:default')}
         name={[props.field.name, 'value']}
         labelCol={{ span: 6 }}
       >

i18n.ts

@@ -3,10 +3,7 @@ import detector from "i18next-browser-languagedetector"
 import {initReactI18next} from "react-i18next"
 import {resources} from './locales'
 
-export const languages = [
+export const languages = Object.keys(resources)
-  'de',
-  'en',
-]
 
 i18n
   .use(detector)

locales/cn/index.ts

@@ -0,0 +1 @@
+export const cn = {}

locales/de/index.ts

@@ -0,0 +1 @@
+export const de = {}

locales/en/admin.ts

@@ -3,4 +3,6 @@ export const admin = {
   users: 'Users',
   forms: 'Forms',
   submissions: 'Submissions',
+  profile: 'Profile',
+  username: 'Username',
 }

locales/en/common.ts

@@ -4,5 +4,4 @@ export const common = {
   register: "Create Account",
   recover: 'Lost Password',
   admin: "Admin",
-  'mandatory-fields-missing': 'Mandatory fields missing',
 }

locales/en/form.ts

@@ -2,4 +2,31 @@ export const form = {
   building: 'Building Form',
   submitted: 'Thank you for your submission!',
   restart: 'Restart Form',
+  loading: 'Loading Form',
+  mange: 'Edit Form "{{title}}"',
+  new: 'New Form',
+  created: 'Form Created',
+  creationError: 'Could not create form',
+  create: 'Create new form',
+  createNow: 'Save',
+  baseData: 'Base Data',
+  updated: 'Form updated',
+  updateError: 'Could not update form',
+  updateNow: 'Save',
+  design: 'Design',
+  startPage: 'Start Page',
+  endPage: 'End Page',
+  confirmDelete: 'Are you sure delete this form with all submissions?',
+  deleted: 'Form deleted',
+  deleteError: 'could not delete form',
+  deleteNow: 'Delete Now!',
+  row: {
+    isLive: 'Live',
+    title: 'Title',
+    admin: 'Owner',
+    language: 'Language',
+    created: 'Created',
+    lastModified: 'Last Modified',
+    menu: ''
+  }
 }

locales/en/index.ts

@@ -2,8 +2,11 @@ import {admin} from './admin'
 import {common} from './common'
 import {form} from './form'
 import {login} from './login'
+import {profile} from './profile'
 import {register} from './register'
 import {statistic} from './statistic'
+import {submission} from './submission'
+import {user} from './user'
 import {validation} from './validation'
 
 export const en = {
@@ -11,7 +14,10 @@ export const en = {
   common,
   form,
   login,
+  profile,
   register,
   statistic,
+  submission,
+  user,
   validation,
 }

locales/en/profile.ts

@@ -0,0 +1,10 @@
+export const profile = {
+  updated: 'Profile updated',
+  updateError: 'Could not update Profile',
+  updateNow: 'Save',
+  language: 'Language',
+  email: 'Email',
+  username: 'Username',
+  firstName: 'First Name',
+  lastName: 'Last Name',
+}

locales/en/submission.ts

@@ -0,0 +1,16 @@
+export const submission = {
+  progress: 'Progress',
+  created: 'Created',
+  lastModified: 'Last Change',
+  submission: 'Submission',
+  add: 'Add Submission',
+  edit: 'Edit',
+  field: 'Field',
+  value: 'Value',
+  country: 'Country',
+  city: 'City',
+  device: {
+    type: 'Device Type',
+    name: 'Device Name',
+  }
+}

locales/en/type.ts

@@ -0,0 +1,42 @@
+export const type = {
+  date: {
+    default: 'Default Date',
+    min: 'Min Date',
+    max: 'Max Date',
+  },
+  dropdown: {
+    default: 'Default Value',
+    options: 'Options',
+    titlePlaceholder: 'Title',
+    valuePlaceholder: 'Value',
+    removeOption: 'Remove',
+    addOption: 'Add Option',
+  },
+  email: {
+    default: 'Default Email',
+  },
+  hidden: {
+    default: 'Default Value',
+  },
+  link: {
+    default: 'Default Link',
+  },
+  number: {
+    default: 'Default Number',
+  },
+  radio: {
+    default: 'Default Value',
+  },
+  rating: {
+    default: 'Default Value',
+  },
+  text: {
+    default: 'Default Value',
+  },
+  textarea: {
+    default: 'Default Value',
+  },
+  yes_no: {
+    default: 'Default Value',
+  },
+}

locales/en/user.ts

@@ -0,0 +1,18 @@
+export const user = {
+  confirmDelete: 'Are you sure delete this user?',
+  deleted: 'User deleted',
+  deleteError: 'could not delete user',
+  deleteNow: 'Delete Now!',
+  loading: 'Loading User',
+  mange: 'Edit User "{{email}}"',
+  row: {
+    roles: 'Role',
+    email: 'Email',
+    created: 'Created',
+    menu: ''
+  },
+  updated: 'Form updated',
+  updateError: 'Could not update form',
+  updateNow: 'Save',
+  baseData: 'Base Data',
+}

locales/en/validation.ts

@@ -1,3 +1,9 @@
 export const validation = {
-  'invalid-email': 'Must be a valid email!',
+  invalidEmail: 'Must be a valid email!',
+  mandatoryFieldsMissing: 'Mandatory fields missing',
+  usernameRequired: 'Please provide a Username',
+  emailRequired: 'Please provide an Email',
+  languageRequired: 'Please select a Language',
+  valueRequired: 'Please provide a Value',
+  invalidUrl: 'Must be a valid URL',
 }

locales/es/index.ts

@@ -0,0 +1 @@
+export const es = {}

locales/fr/index.ts

@@ -0,0 +1 @@
+export const fr = {}

locales/index.ts

@@ -1,5 +1,15 @@
+import {cn} from './cn'
+import {de} from './de'
 import {en} from './en'
+import {es} from './es'
+import {fr} from './fr'
+import {it} from './it'
 
 export const resources = {
+  cn,
+  de,
   en,
+  es,
+  fr,
+  it,
 }

locales/it/index.ts

@@ -0,0 +1 @@
+export const it = {}

pages/admin/forms/[id]/index.tsx

@@ -98,21 +98,19 @@ const Index: NextPage = () => {
       form.setFieldsValue(next)
       setFields(next.form.fields)
 
-      message.success('Form Updated')
+      message.success(t('form:updated'))
     } catch (e) {
       console.error('failed to save', e)
-      message.error('Could not save Form')
+      message.error(t('form:updateError'))
     }
 
     setSaving(false)
   }
 
-
-
   return (
     <Structure
       loading={loading || saving}
-      title={loading ? 'Loading Form' : `Edit Form "${data.form.title}"`}
+      title={loading ? t('form:loading') : t('form:mange', { title: data.form.title })}
       selected={'forms'}
       breadcrumbs={[
         { href: '/admin', name: t('admin:home') },
@@ -124,17 +122,13 @@ const Index: NextPage = () => {
           href={'/admin/forms/[id]/submissions'}
           as={`/admin/forms/${router.query.id}/submissions`}
         >
-          <Button>
+          <Button>{t('admin:submissions')}</Button>
-            Submissions
-          </Button>
         </Link>,
         <Button
           key={'save'}
           onClick={form.submit}
           type={'primary'}
-        >
+        >{t('form:updateNow')}</Button>,
-          Save
-        </Button>,
       ]}
       style={{paddingTop: 0}}
     >
@@ -142,7 +136,8 @@ const Index: NextPage = () => {
         form={form}
         onFinish={save}
         onFinishFailed={errors => {
-          message.error('Required fields are missing')
+          // TODO process errors
+          message.error(t('validation:mandatoryFieldsMissing'))
         }}
         labelCol={{
           xs: { span: 24 },
@@ -163,8 +158,8 @@ const Index: NextPage = () => {
             onChangeFields={setFields}
             form={form}
           />
-          <BaseDataTab key={'base_data'} tab={'Base Data'} />
+          <BaseDataTab key={'base_data'} tab={t('form:baseData')} />
-          <DesignTab key={'design'} tab={'Design'} />
+          <DesignTab key={'design'} tab={'form:design'} />
           <SelfNotificationsTab
             key={'self_notifications'}
             tab={'Self Notifications'}
@@ -177,8 +172,8 @@ const Index: NextPage = () => {
             fields={fields}
             form={form}
           />
-          <StartPageTab key={'start_page'} tab={'Start Page'} />
+          <StartPageTab key={'start_page'} tab={t('form:startPage')} />
-          <EndPageTab key={'end_page'} tab={'End Page'} />
+          <EndPageTab key={'end_page'} tab={t('form:endPage')} />
         </Tabs>
       </Form>
     </Structure>

pages/admin/forms/[id]/submissions.tsx

@@ -47,7 +47,7 @@ const Submissions: NextPage = () => {
 
   const columns:ColumnsType<AdminPagerSubmissionEntryQueryData> = [
     {
-      title: 'Progress',
+      title: t('submission:progress'),
       render: (row: AdminPagerSubmissionEntryQueryData) => {
         let status: any = 'active'
 
@@ -63,12 +63,12 @@ const Submissions: NextPage = () => {
       }
     },
     {
-      title: 'Created',
+      title: t('submission:created'),
       dataIndex: 'created',
       render: date => <DateTime date={date} />
     },
     {
-      title: 'Last Change',
+      title: t('submission:lastModified'),
       dataIndex: 'lastModified',
       render: date => <TimeAgo date={date} />
     },
@@ -82,7 +82,7 @@ const Submissions: NextPage = () => {
       breadcrumbs={[
         { href: '/admin', name: t('admin:home') },
         { href: '/admin/forms', name: t('admin:forms') },
-        { href: '/admin/forms/[id]', name: loading || !form ? 'Loading Form' : `Edit Form "${form.title}"`, as: `/admin/forms/${router.query.id}` },
+        { href: '/admin/forms/[id]', name: loading || !form ? t('form:loading') : t('form:mange', { title: form.title }), as: `/admin/forms/${router.query.id}` },
       ]}
       padded={false}
       extra={[
@@ -91,18 +91,14 @@ const Submissions: NextPage = () => {
           href={'/admin/forms/[id]'}
           as={`/admin/forms/${router.query.id}`}
         >
-          <Button>
+          <Button>{t('submission:edit')}</Button>
-            Edit
-          </Button>
         </Link>,
         <Button
           key={'web'}
           href={`/form/${router.query.id}`}
           target={'_blank'}
           type={'primary'}
-        >
+        >{t('submission:add')}</Button>,
-          Add Submission
-        </Button>,
       ]}
     >
       <Table

pages/admin/forms/create.tsx

@@ -25,19 +25,18 @@ const Create: NextPage = () => {
 
   const save = async (formData: AdminFormQueryData) => {
     setSaving(true)
-    console.log('try to save form!', formData)
 
     try {
       const next = (await create({
         variables: cleanInput(formData),
       })).data
 
-      message.success('Form Created')
+      message.success(t('form:created'))
 
       router.replace('/admin/forms/[id]', `/admin/forms/${next.form.id}`)
     } catch (e) {
       console.error('failed to save', e)
-      message.error('Could not save Form')
+      message.error(t('form:creationError'))
     }
 
     setSaving(false)
@@ -46,7 +45,7 @@ const Create: NextPage = () => {
   return (
     <Structure
       loading={saving}
-      title={'Create New Form'}
+      title={t('form:create')}
       selected={'forms'}
       breadcrumbs={[
         { href: '/admin', name: t('admin:home') },
@@ -57,9 +56,7 @@ const Create: NextPage = () => {
           key={'create'}
           onClick={form.submit}
           type={'primary'}
-        >
+        >{t('form:createNow')}</Button>,
-          Save
-        </Button>,
       ]}
       style={{paddingTop: 0}}
     >
@@ -67,7 +64,8 @@ const Create: NextPage = () => {
         form={form}
         onFinish={save}
         onFinishFailed={errors => {
-          message.error('Required fields are missing')
+          // TODO process errors
+          message.error(t('validation:mandatoryFieldsMissing'))
         }}
         labelCol={{
           xs: { span: 24 },
@@ -81,33 +79,7 @@ const Create: NextPage = () => {
         <Form.Item noStyle name={['form', 'id']}><Input type={'hidden'} /></Form.Item>
 
         <Tabs>
-          {/*
+          <BaseDataTab key={'base_data'} tab={t('form:baseData')} />
-          <FieldsTab
-            key={'fields'}
-            tab={'Fields'}
-            fields={fields}
-            onChangeFields={setFields}
-            form={form}
-          />
-          */}
-          <BaseDataTab key={'base_data'} tab={'Base Data'} />
-          {/*
-          <DesignTab key={'design'} tab={'Design'} />
-          <SelfNotificationsTab
-            key={'self_notifications'}
-            tab={'Self Notifications'}
-            fields={fields}
-            form={form}
-          />
-          <RespondentNotificationsTab
-            key={'respondent_notifications'}
-            tab={'Respondent Notifications'}
-            fields={fields}
-            form={form}
-          />
-          <StartPageTab key={'start_page'} tab={'Start Page'} />
-          <EndPageTab key={'end_page'} tab={'End Page'} />
-          */}
         </Tabs>
       </Form>
     </Structure>

pages/admin/forms/index.tsx

@@ -59,24 +59,24 @@ const Index: NextPage = () => {
         setEntries(next)
       }
 
-      message.success('form deleted')
+      message.success(t('form:deleted'))
     } catch (e) {
-      message.error('could not delete form')
+      message.error(t('form:deleteError'))
     }
   }
 
   const columns: ColumnsType<AdminPagerFormEntryQueryData> = [
     {
-      title: 'Live',
+      title: t('form:row.isLive'),
       dataIndex: 'isLive',
       render: live => <FormIsLive isLive={live} />
     },
     {
-      title: 'Title',
+      title: t('form:row.title'),
       dataIndex: 'title',
     },
     {
-      title: 'Owner',
+      title: t('form:row.admin'),
       dataIndex: 'admin',
       render: user => (
         <Link href={'/admin/users/[id]'} as={`/admin/users/${user.id}`}>
@@ -87,20 +87,21 @@ const Index: NextPage = () => {
       )
     },
     {
-      title: 'Language',
+      title: t('form:row.language'),
       dataIndex: 'language',
     },
     {
-      title: 'Created',
+      title: t('form:row.created'),
       dataIndex: 'created',
       render: date => <DateTime date={date} />
     },
     {
-      title: 'Last Change',
+      title: t('form:row.lastModified'),
       dataIndex: 'lastModified',
       render: date => <TimeAgo date={date} />
     },
     {
+      title: t('form:row.menu'),
       align: 'right',
       render: row => {
         return (
@@ -122,9 +123,9 @@ const Index: NextPage = () => {
             </Link>
 
             <Popconfirm
-              title="Are you sure delete this form with all submissions?"
+              title={t('form:confirmDelete')}
               onConfirm={() => deleteForm(row)}
-              okText={'Delete now!'}
+              okText={t('form:deleteNow')}
               okButtonProps={{ danger: true }}
             >
               <Button danger><DeleteOutlined /></Button>
@@ -160,9 +161,7 @@ const Index: NextPage = () => {
         >
           <Button
             type={'primary'}
-          >
+          >{t('form:new')}</Button>
-            New Form
-          </Button>
         </Link>,
       ]}
     >

pages/admin/profile.tsx

@@ -4,6 +4,7 @@ import {useForm} from 'antd/lib/form/Form'
 import {NextPage} from 'next'
 import {useRouter} from 'next/router'
 import React, {useState} from 'react'
+import {useTranslation} from 'react-i18next'
 import {cleanInput} from '../../components/clean.input'
 import Structure from '../../components/structure'
 import {
@@ -20,6 +21,7 @@ import {AdminUserQueryData} from '../../graphql/query/admin.user.query'
 import {languages} from '../../i18n'
 
 const Profile: NextPage = () => {
+  const { t } = useTranslation()
   const router = useRouter()
   const [form] = useForm()
   const [saving, setSaving] = useState(false)
@@ -42,10 +44,10 @@ const Profile: NextPage = () => {
 
       form.setFieldsValue(next)
 
-      message.success('Profile Updated')
+      message.success(t('profile:updated'))
     } catch (e) {
       console.error('failed to save', e)
-      message.error('Could not save Profile')
+      message.error(t('profile:updateError'))
     }
 
     setSaving(false)
@@ -55,26 +57,25 @@ const Profile: NextPage = () => {
   return (
     <Structure
       loading={loading || saving}
-      title={'Profile'}
+      title={t('admin:profile')}
       selected={'profile'}
       breadcrumbs={[
-        { href: '/admin', name: 'Home' },
+        { href: '/admin', name: t('admin:home') },
       ]}
       extra={[
         <Button
           key={'save'}
           onClick={form.submit}
           type={'primary'}
-        >
+        >{t('profile:updateNow')}</Button>,
-          Save
-        </Button>,
       ]}
     >
       <Form
         form={form}
         onFinish={save}
         onFinishFailed={errors => {
-          message.error('Required fields are missing')
+          // TODO process errors
+          message.error(t('validation:mandatoryFieldsMissing'))
         }}
         labelCol={{
           xs: { span: 24 },
@@ -88,12 +89,12 @@ const Profile: NextPage = () => {
         <Form.Item noStyle name={['user', 'id']}><Input type={'hidden'} /></Form.Item>
 
         <Form.Item
-          label="Username"
+          label={t('profile:username')}
           name={['user', 'username']}
           rules={[
             {
               required: true,
-              message: 'Please provide a Username',
+              message: t('validation:usernameRequired'),
             },
           ]}
         >
@@ -101,16 +102,16 @@ const Profile: NextPage = () => {
         </Form.Item>
 
         <Form.Item
-          label="Email"
+          label={t('profile:email')}
           name={['user', 'email']}
           rules={[
             {
               required: true,
-              message: 'Please provide an email',
+              message: t('validation:emailRequired'),
             },
             {
               type: 'email',
-              message: 'Must be a valid email',
+              message: t('validation:invalidEmail'),
             },
           ]}
         >
@@ -118,12 +119,12 @@ const Profile: NextPage = () => {
         </Form.Item>
 
         <Form.Item
-          label="Language"
+          label={t('profile:language')}
           name={['user', 'language']}
           rules={[
             {
               required: true,
-              message: 'Please select a Language',
+              message: t('validation:languageRequired'),
             },
           ]}
         >
@@ -133,14 +134,14 @@ const Profile: NextPage = () => {
         </Form.Item>
 
         <Form.Item
-          label="First Name"
+          label={t('profile:firstName')}
           name={['user', 'firstName']}
         >
           <Input  />
         </Form.Item>
 
         <Form.Item
-          label="Last Name"
+          label={t('profile:lastName')}
           name={['user', 'lastName']}
         >
           <Input  />

pages/admin/users/[id]/index.tsx

@@ -42,10 +42,10 @@ const Index: NextPage = () => {
 
       form.setFieldsValue(next)
 
-      message.success('User Updated')
+      message.success(t('user:updated'))
     } catch (e) {
       console.error('failed to save', e)
-      message.error('Could not save User')
+      message.error(t('user:updateError'))
     }
 
     setSaving(false)
@@ -54,7 +54,7 @@ const Index: NextPage = () => {
   return (
     <Structure
       loading={loading || saving}
-      title={loading ? 'Loading User' : `Edit User "${data.user.email}"`}
+      title={loading ? t('user:loading') : t('user:mange', { title: data.user.email })}
       selected={'users'}
       breadcrumbs={[
         { href: '/admin', name: t('admin:home') },
@@ -65,9 +65,7 @@ const Index: NextPage = () => {
           key={'save'}
           onClick={form.submit}
           type={'primary'}
-        >
+        >{t('user:updateNow')}</Button>,
-          Save
-        </Button>,
       ]}
       style={{paddingTop: 0}}
     >
@@ -75,7 +73,8 @@ const Index: NextPage = () => {
         form={form}
         onFinish={save}
         onFinishFailed={errors => {
-          message.error('Required fields are missing')
+          // TODO process errors
+          message.error(t('validation:mandatoryFieldsMissing'))
         }}
         labelCol={{
           xs: { span: 24 },
@@ -91,7 +90,7 @@ const Index: NextPage = () => {
         <Tabs>
           <BaseDataTab
             key={'base_data'}
-            tab={'Base Data'}
+            tab={t('user:baseData')}
           />
         </Tabs>
       </Form>

pages/admin/users/index.tsx

@@ -57,28 +57,29 @@ const Index: NextPage = () => {
       } else {
         setEntries(next)
       }
-      message.success('user deleted')
+      message.success(t('user:deleted'))
     } catch (e) {
-      message.error('could not delete user')
+      message.error(t('user:deleteError'))
     }
   }
 
   const columns: ColumnsType<AdminPagerUserEntryQueryData> = [
     {
-      title: 'Role',
+      title: t('user:row.roles'),
       dataIndex: 'roles',
       render: roles => <UserRole roles={roles} />
     },
     {
-      title: 'Email',
+      title: t('user:row.email'),
       render: row => <Tag color={row.verifiedEmail ? 'lime' : 'volcano' }>{row.email}</Tag>
     },
     {
-      title: 'Created',
+      title: t('user:row.created'),
       dataIndex: 'created',
       render: date => <DateTime date={date} />
     },
     {
+      title: t('user:row.menu'),
       align: 'right',
       render: row => {
         return (
@@ -91,9 +92,9 @@ const Index: NextPage = () => {
             </Link>
 
             <Popconfirm
-              title="Are you sure delete this user?"
+              title={t('user:confirmDelete')}
               onConfirm={() => deleteUser(row)}
-              okText={'Delete now!'}
+              okText={t('user:deleteNow')}
               okButtonProps={{ danger: true }}
             >
               <Button danger><DeleteOutlined /></Button>

pages/login/index.tsx

@@ -41,7 +41,7 @@ const Index: NextPage = () => {
   }
 
   const failed = () => {
-    message.error(t('mandatory-fields-missing'))
+    message.error(t('validation:mandatoryFieldsMissing'))
   }
 
   return (

pages/register.tsx

@@ -44,7 +44,7 @@ const Register: NextPage = () => {
   }
 
   const failed = () => {
-    message.error(t('mandatory-fields-missing'))
+    message.error(t('validation:mandatoryFieldsMissing'))
   }
 
   return (
@@ -86,7 +86,7 @@ const Register: NextPage = () => {
           name="email"
           rules={[
             { required: true, message: t('register:email-required') },
-            { type: 'email', message: t('validation:invalid-email') }
+            { type: 'email', message: t('validation:invalidEmail') }
           ]}
         >
           <Input