From 5986ab2070dfa3cf12844d1ceeac63d59f7ef2fa Mon Sep 17 00:00:00 2001
From: Matt Rider <mattwr18@gmail.com>
Date: Mon, 10 Jun 2019 17:12:00 -0300
Subject: [PATCH 1/8] Create Posts with a specified language, or fallback

---
 backend/src/schema/resolvers/posts.spec.js   | 18 ++++++++++-
 backend/src/schema/types/type/Post.gql       | 30 +++++++++++-------
 webapp/components/ContributionForm/index.vue | 33 +++++++++++++++++++-
 webapp/graphql/PostMutations.js              | 10 +++---
 4 files changed, 74 insertions(+), 17 deletions(-)

diff --git a/backend/src/schema/resolvers/posts.spec.js b/backend/src/schema/resolvers/posts.spec.js
index 9e2ec70a2..86f0665a0 100644
--- a/backend/src/schema/resolvers/posts.spec.js
+++ b/backend/src/schema/resolvers/posts.spec.js
@@ -19,7 +19,7 @@ afterEach(async () => {
 describe('CreatePost', () => {
   const mutation = `
     mutation {
-      CreatePost(title: "I am a title", content: "Some content") {
+      CreatePost(title: "I am a title", content: "Some content", language: "en") {
         title
         content
         slug
@@ -74,6 +74,22 @@ describe('CreatePost', () => {
         await expect(client.request(mutation)).resolves.toMatchObject(expected)
       })
     })
+
+    describe('language', () => {
+      it('allows a user to set the language of the post', async () => {
+        const createPostWithLanguageMutation = `
+          mutation {
+            CreatePost(title: "I am a title", content: "Some content", language: "en") {
+              language
+            }
+          }
+        `
+        const expected = { CreatePost: { language: 'en' } }
+        await expect(client.request(createPostWithLanguageMutation)).resolves.toEqual(
+          expect.objectContaining(expected),
+        )
+      })
+    })
   })
 })
 
diff --git a/backend/src/schema/types/type/Post.gql b/backend/src/schema/types/type/Post.gql
index c402a1233..271d92750 100644
--- a/backend/src/schema/types/type/Post.gql
+++ b/backend/src/schema/types/type/Post.gql
@@ -15,29 +15,37 @@ type Post {
   disabledBy: User @relation(name: "DISABLED", direction: "IN")
   createdAt: String
   updatedAt: String
-
-  relatedContributions: [Post]! @cypher(
-    statement: """
+  language: String
+  relatedContributions: [Post]!
+    @cypher(
+      statement: """
       MATCH (this)-[:TAGGED|CATEGORIZED]->(categoryOrTag)<-[:TAGGED|CATEGORIZED]-(post:Post)
       RETURN DISTINCT post
       LIMIT 10
-    """
-  )
+      """
+    )
 
   tags: [Tag]! @relation(name: "TAGGED", direction: "OUT")
   categories: [Category]! @relation(name: "CATEGORIZED", direction: "OUT")
 
   comments: [Comment]! @relation(name: "COMMENTS", direction: "IN")
-  commentsCount: Int! @cypher(statement: "MATCH (this)<-[:COMMENTS]-(r:Comment) WHERE NOT r.deleted = true AND NOT r.disabled = true  RETURN COUNT(r)")
+  commentsCount: Int!
+    @cypher(
+      statement: "MATCH (this)<-[:COMMENTS]-(r:Comment) WHERE NOT r.deleted = true AND NOT r.disabled = true  RETURN COUNT(r)"
+    )
 
   shoutedBy: [User]! @relation(name: "SHOUTED", direction: "IN")
-  shoutedCount: Int! @cypher(statement: "MATCH (this)<-[:SHOUTED]-(r:User) WHERE NOT r.deleted = true AND NOT r.disabled = true RETURN COUNT(DISTINCT r)")
+  shoutedCount: Int!
+    @cypher(
+      statement: "MATCH (this)<-[:SHOUTED]-(r:User) WHERE NOT r.deleted = true AND NOT r.disabled = true RETURN COUNT(DISTINCT r)"
+    )
 
   # Has the currently logged in user shouted that post?
-  shoutedByCurrentUser: Boolean! @cypher(
-    statement: """
+  shoutedByCurrentUser: Boolean!
+    @cypher(
+      statement: """
       MATCH (this)<-[:SHOUTED]-(u:User {id: $cypherParams.currentUserId})
       RETURN COUNT(u) >= 1
-    """
-  )
+      """
+    )
 }
diff --git a/webapp/components/ContributionForm/index.vue b/webapp/components/ContributionForm/index.vue
index cf90a23b4..3e059d7cd 100644
--- a/webapp/components/ContributionForm/index.vue
+++ b/webapp/components/ContributionForm/index.vue
@@ -6,6 +6,12 @@
         <no-ssr>
           <hc-editor :users="users" :value="form.content" @input="updateEditorContent" />
         </no-ssr>
+        <ds-select
+          model="language"
+          :options="form.languageOptions"
+          icon="globe"
+          :placeholder="locale"
+        />
         <div slot="footer" style="text-align: right">
           <ds-button :disabled="loading || disabled" ghost @click.prevent="$router.back()">
             {{ $t('actions.cancel') }}
@@ -28,6 +34,7 @@
 <script>
 import gql from 'graphql-tag'
 import HcEditor from '~/components/Editor'
+import orderBy from 'lodash/orderBy'
 
 export default {
   components: {
@@ -41,6 +48,18 @@ export default {
       form: {
         title: '',
         content: '',
+        language: null,
+        locales: orderBy(process.env.locales, 'name'),
+        languageOptions: [
+          {
+            label: 'Deutsch',
+            value: 'de',
+          },
+          {
+            label: 'English',
+            value: 'en',
+          },
+        ],
       },
       formSchema: {
         title: { required: true, min: 3, max: 64 },
@@ -67,11 +86,17 @@ export default {
       },
     },
   },
+  computed: {
+    locale() {
+      let locale
+      locale = this.form.locales.find(this.returnLocaleName)
+      return locale.name
+    },
+  },
   methods: {
     submit() {
       const postMutations = require('~/graphql/PostMutations.js').default(this)
       this.loading = true
-
       this.$apollo
         .mutate({
           mutation: this.id ? postMutations.UpdatePost : postMutations.CreatePost,
@@ -79,6 +104,7 @@ export default {
             id: this.id,
             title: this.form.title,
             content: this.form.content,
+            language: this.form.language ? this.form.language.value : this.$i18n.locale(),
           },
         })
         .then(res => {
@@ -103,6 +129,11 @@ export default {
       // this.form.content = value
       this.$refs.contributionForm.update('content', value)
     },
+    returnLocaleName(locale) {
+      if (this.$i18n.locale() === locale.code) {
+        return locale
+      }
+    },
   },
   apollo: {
     User: {
diff --git a/webapp/graphql/PostMutations.js b/webapp/graphql/PostMutations.js
index dbaa4cd78..86b07c9b6 100644
--- a/webapp/graphql/PostMutations.js
+++ b/webapp/graphql/PostMutations.js
@@ -3,24 +3,26 @@ import gql from 'graphql-tag'
 export default app => {
   return {
     CreatePost: gql(`
-      mutation($title: String!, $content: String!) {
-        CreatePost(title: $title, content: $content) {
+      mutation($title: String!, $content: String!, $language: String) {
+        CreatePost(title: $title, content: $content, language: $language) {
           id
           title
           slug
           content
           contentExcerpt
+          language
         }
       }
     `),
     UpdatePost: gql(`
-      mutation($id: ID!, $title: String!, $content: String!) {
-        UpdatePost(id: $id, title: $title, content: $content) {
+      mutation($id: ID!, $title: String!, $content: String!, $language: String) {
+        UpdatePost(id: $id, title: $title, content: $content, language: $language) {
           id
           title
           slug
           content
           contentExcerpt
+          language
         }
       }
     `),

From 4407d6648a3e63f98fea2cff867cbc6485805d24 Mon Sep 17 00:00:00 2001
From: Matt Rider <mattwr18@gmail.com>
Date: Tue, 11 Jun 2019 15:45:33 -0300
Subject: [PATCH 2/8] Add component tests, translations

---
 .vscode/settings.json                         |   2 +-
 backend/src/schema/resolvers/posts.spec.js    |   2 +-
 .../ContributionForm/ContributionForm.spec.js | 137 ++++++++++++++++++
 webapp/components/ContributionForm/index.vue  |   9 +-
 webapp/locales/de.json                        |   3 +
 webapp/locales/en.json                        |   3 +
 webapp/pages/profile/_id/_slug.spec.js        |   2 +-
 7 files changed, 153 insertions(+), 5 deletions(-)
 create mode 100644 webapp/components/ContributionForm/ContributionForm.spec.js

diff --git a/.vscode/settings.json b/.vscode/settings.json
index 908252f41..e2a727871 100644
--- a/.vscode/settings.json
+++ b/.vscode/settings.json
@@ -9,4 +9,4 @@
   ],
   "editor.formatOnSave": true,
   "eslint.autoFixOnSave": true
-}
\ No newline at end of file
+}
diff --git a/backend/src/schema/resolvers/posts.spec.js b/backend/src/schema/resolvers/posts.spec.js
index 86f0665a0..3bff53ddb 100644
--- a/backend/src/schema/resolvers/posts.spec.js
+++ b/backend/src/schema/resolvers/posts.spec.js
@@ -19,7 +19,7 @@ afterEach(async () => {
 describe('CreatePost', () => {
   const mutation = `
     mutation {
-      CreatePost(title: "I am a title", content: "Some content", language: "en") {
+      CreatePost(title: "I am a title", content: "Some content") {
         title
         content
         slug
diff --git a/webapp/components/ContributionForm/ContributionForm.spec.js b/webapp/components/ContributionForm/ContributionForm.spec.js
new file mode 100644
index 000000000..8d68de7d3
--- /dev/null
+++ b/webapp/components/ContributionForm/ContributionForm.spec.js
@@ -0,0 +1,137 @@
+import { config, mount, createLocalVue } from '@vue/test-utils'
+import ContributionForm from './index.vue'
+import Styleguide from '@human-connection/styleguide'
+
+const localVue = createLocalVue()
+
+localVue.use(Styleguide)
+
+config.stubs['no-ssr'] = '<span><slot /></span>'
+
+describe('ContributionForm.vue', () => {
+  let wrapper
+  let postTitleInput
+  let expectedParams
+  let deutschOption
+  let cancelBtn
+  const postTitle = 'this is a title for a post'
+  const postContent = 'this is a post'
+  const computed = { locale: () => 'English' }
+  const mocks = {
+    $t: jest.fn(),
+    $apollo: {
+      mutate: jest
+        .fn()
+        .mockResolvedValueOnce({
+          data: {
+            CreatePost: {
+              title: postTitle,
+              slug: 'this-is-a-title-for-a-post',
+              content: postContent,
+              contentExcerpt: postContent,
+              language: 'en',
+            },
+          },
+        })
+        .mockRejectedValue({ message: 'Not Authorised!' }),
+    },
+    $toast: {
+      error: jest.fn(),
+      success: jest.fn(),
+    },
+    $i18n: {
+      locale: () => 'en',
+    },
+    $router: {
+      back: jest.fn(),
+      push: jest.fn(),
+    },
+  }
+
+  describe('mount', () => {
+    const Wrapper = () => {
+      return mount(ContributionForm, { mocks, localVue, computed })
+    }
+
+    beforeEach(() => {
+      wrapper = Wrapper()
+    })
+
+    describe('CreatePost', () => {
+      describe('invalid form submission', () => {
+        it('title required for form submission', async () => {
+          postTitleInput = wrapper.find('.ds-input')
+          postTitleInput.setValue('this is a title for a post')
+          await wrapper.find('form').trigger('submit')
+          expect(mocks.$apollo.mutate).not.toHaveBeenCalled()
+        })
+
+        it('content required for form submission', async () => {
+          wrapper.vm.updateEditorContent('this is a post')
+          await wrapper.find('form').trigger('submit')
+          expect(mocks.$apollo.mutate).not.toHaveBeenCalled()
+        })
+      })
+
+      describe('valid form submission', () => {
+        expectedParams = {
+          variables: { title: postTitle, content: postContent, language: 'en', id: null },
+        }
+        beforeEach(async () => {
+          postTitleInput = wrapper.find('.ds-input')
+          postTitleInput.setValue('this is a title for a post')
+          wrapper.vm.updateEditorContent('this is a post')
+          await wrapper.find('form').trigger('submit')
+        })
+
+        it('with title and content', () => {
+          expect(mocks.$apollo.mutate).toHaveBeenCalledTimes(1)
+        })
+
+        it("sends a fallback language based on a user's locale", () => {
+          expect(mocks.$apollo.mutate).toHaveBeenCalledWith(expect.objectContaining(expectedParams))
+        })
+
+        it('supports changing the language', async () => {
+          expectedParams.variables.language = 'de'
+          deutschOption = wrapper.findAll('li').at(0)
+          deutschOption.trigger('click')
+          await wrapper.find('form').trigger('submit')
+          expect(mocks.$apollo.mutate).toHaveBeenCalledWith(expect.objectContaining(expectedParams))
+        })
+
+        it("pushes the user to the post's page", async () => {
+          expect(mocks.$router.push).toHaveBeenCalledTimes(1)
+        })
+
+        it('shows a success toaster', () => {
+          expect(mocks.$toast.success).toHaveBeenCalledTimes(1)
+        })
+      })
+
+      describe('cancel', () => {
+        it('calls $router.back() when cancel button clicked', () => {
+          cancelBtn = wrapper.find('.cancel-button')
+          cancelBtn.trigger('click')
+          expect(mocks.$router.back).toHaveBeenCalledTimes(1)
+        })
+      })
+
+      describe('handles errors', () => {
+        beforeEach(async () => {
+          wrapper = Wrapper()
+          postTitleInput = wrapper.find('.ds-input')
+          postTitleInput.setValue('this is a title for a post')
+          wrapper.vm.updateEditorContent('this is a post')
+          // second submission causes mutation to reject
+          await wrapper.find('form').trigger('submit')
+        })
+        it('shows an error toaster when apollo mutation rejects', async () => {
+          await wrapper.find('form').trigger('submit')
+          await mocks.$apollo.mutate
+          expect(mocks.$toast.error).toHaveBeenCalledWith('Not Authorised!')
+        })
+      })
+    })
+  })
+})
diff --git a/webapp/components/ContributionForm/index.vue b/webapp/components/ContributionForm/index.vue
index 3e059d7cd..6320eb368 100644
--- a/webapp/components/ContributionForm/index.vue
+++ b/webapp/components/ContributionForm/index.vue
@@ -13,7 +13,12 @@
           :placeholder="locale"
         />
         <div slot="footer" style="text-align: right">
-          <ds-button :disabled="loading || disabled" ghost @click.prevent="$router.back()">
+          <ds-button
+            :disabled="loading || disabled"
+            ghost
+            class="cancel-button"
+            @click="$router.back()"
+          >
             {{ $t('actions.cancel') }}
           </ds-button>
           <ds-button
@@ -109,7 +114,7 @@ export default {
         })
         .then(res => {
           this.loading = false
-          this.$toast.success('Saved!')
+          this.$toast.success(this.$t('contribution.success'))
           this.disabled = true
 
           const result = res.data[this.id ? 'UpdatePost' : 'CreatePost']
diff --git a/webapp/locales/de.json b/webapp/locales/de.json
index f2d1e7415..04b18b6b8 100644
--- a/webapp/locales/de.json
+++ b/webapp/locales/de.json
@@ -300,5 +300,8 @@
     "avatar": {
       "submitted": "Upload erfolgreich"
     }
+  },
+  "contribution": {
+    "success": "Gespeichert!"
   }
 }
diff --git a/webapp/locales/en.json b/webapp/locales/en.json
index 093393045..839d3147a 100644
--- a/webapp/locales/en.json
+++ b/webapp/locales/en.json
@@ -299,5 +299,8 @@
     "avatar": {
       "submitted": "Upload successful"
     }
+  },
+  "contribution": {
+    "success": "Saved!"
   }
 }
diff --git a/webapp/pages/profile/_id/_slug.spec.js b/webapp/pages/profile/_id/_slug.spec.js
index d79f9b885..790c9c6c0 100644
--- a/webapp/pages/profile/_id/_slug.spec.js
+++ b/webapp/pages/profile/_id/_slug.spec.js
@@ -20,7 +20,7 @@ describe('ProfileSlug', () => {
         name: 'It is a post',
       },
       $t: jest.fn(),
-      // If you mocking router, than don't use VueRouter with lacalVue: https://vue-test-utils.vuejs.org/guides/using-with-vue-router.html
+      // If you're mocking router, then don't use VueRouter with localVue: https://vue-test-utils.vuejs.org/guides/using-with-vue-router.html
       $router: {
         history: {
           push: jest.fn(),

From 97e8fa1af8d788b73814eb83c92a3a080e03e903 Mon Sep 17 00:00:00 2001
From: Matt Rider <mattwr18@gmail.com>
Date: Wed, 12 Jun 2019 18:08:20 -0300
Subject: [PATCH 3/8] Style, update languageOptions to contain all

- languages we support for translations
---
 webapp/components/ContributionForm/index.vue | 46 ++++++++++++--------
 webapp/locales/de.json                       |  3 +-
 webapp/locales/en.json                       |  3 +-
 3 files changed, 32 insertions(+), 20 deletions(-)

diff --git a/webapp/components/ContributionForm/index.vue b/webapp/components/ContributionForm/index.vue
index 6320eb368..d56cb11e3 100644
--- a/webapp/components/ContributionForm/index.vue
+++ b/webapp/components/ContributionForm/index.vue
@@ -6,12 +6,20 @@
         <no-ssr>
           <hc-editor :users="users" :value="form.content" @input="updateEditorContent" />
         </no-ssr>
-        <ds-select
-          model="language"
-          :options="form.languageOptions"
-          icon="globe"
-          :placeholder="locale"
-        />
+        <ds-space margin-bottom="xxx-large" />
+        <ds-flex class="contribution-form-footer">
+          <ds-flex-item :width="{ base: '0%', sm: '10%', md: '10%', lg: '15%' }" />
+          <ds-flex-item :width="{ base: '80%', sm: '30%', md: '30%', lg: '20%' }">
+            <ds-space margin-bottom="small" />
+            <ds-select
+              model="language"
+              :options="form.languageOptions"
+              icon="globe"
+              :placeholder="locale"
+              :label="$t('contribution.languageSelectLabel')"
+            />
+          </ds-flex-item>
+        </ds-flex>
         <div slot="footer" style="text-align: right">
           <ds-button
             :disabled="loading || disabled"
@@ -54,17 +62,7 @@ export default {
         title: '',
         content: '',
         language: null,
-        locales: orderBy(process.env.locales, 'name'),
-        languageOptions: [
-          {
-            label: 'Deutsch',
-            value: 'de',
-          },
-          {
-            label: 'English',
-            value: 'en',
-          },
-        ],
+        languageOptions: [],
       },
       formSchema: {
         title: { required: true, min: 3, max: 64 },
@@ -94,10 +92,13 @@ export default {
   computed: {
     locale() {
       let locale
-      locale = this.form.locales.find(this.returnLocaleName)
+      locale = process.env.locales.find(this.returnLocaleName)
       return locale.name
     },
   },
+  mounted() {
+    this.availableLocales()
+  },
   methods: {
     submit() {
       const postMutations = require('~/graphql/PostMutations.js').default(this)
@@ -139,6 +140,11 @@ export default {
         return locale
       }
     },
+    availableLocales() {
+      orderBy(process.env.locales, 'name').map(locale => {
+        this.form.languageOptions.push({ label: locale.name, value: locale.code })
+      })
+    },
   },
   apollo: {
     User: {
@@ -171,4 +177,8 @@ export default {
     padding-right: 0;
   }
 }
+
+.contribution-form-footer {
+  border-top: $border-size-base solid $border-color-softest;
+}
 </style>
diff --git a/webapp/locales/de.json b/webapp/locales/de.json
index 0bd5f9424..4cee530f8 100644
--- a/webapp/locales/de.json
+++ b/webapp/locales/de.json
@@ -297,6 +297,7 @@
     }
   },
   "contribution": {
-    "success": "Gespeichert!"
+    "success": "Gespeichert!",
+    "languageSelectLabel": "Sprache"
   }
 }
diff --git a/webapp/locales/en.json b/webapp/locales/en.json
index da39e6ebe..0034ce1b3 100644
--- a/webapp/locales/en.json
+++ b/webapp/locales/en.json
@@ -296,6 +296,7 @@
     }
   },
   "contribution": {
-    "success": "Saved!"
+    "success": "Saved!",
+    "languageSelectLabel": "Language"
   }
 }

From 8d72532098ae83e9ef40cc4b3aa9f1fbe9734677 Mon Sep 17 00:00:00 2001
From: Matt Rider <mattwr18@gmail.com>
Date: Wed, 12 Jun 2019 19:29:51 -0300
Subject: [PATCH 4/8] Fix test, import locales
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Co-authored-by: Robert Schäfer <git@roschaefer.de>
---
 .../ContributionForm/ContributionForm.spec.js | 63 ++++++++++---------
 webapp/components/ContributionForm/index.vue  |  5 +-
 2 files changed, 37 insertions(+), 31 deletions(-)

diff --git a/webapp/components/ContributionForm/ContributionForm.spec.js b/webapp/components/ContributionForm/ContributionForm.spec.js
index 8d68de7d3..f7f306fc3 100644
--- a/webapp/components/ContributionForm/ContributionForm.spec.js
+++ b/webapp/components/ContributionForm/ContributionForm.spec.js
@@ -14,39 +14,43 @@ describe('ContributionForm.vue', () => {
   let expectedParams
   let deutschOption
   let cancelBtn
+  let mocks
   const postTitle = 'this is a title for a post'
   const postContent = 'this is a post'
   const computed = { locale: () => 'English' }
-  const mocks = {
-    $t: jest.fn(),
-    $apollo: {
-      mutate: jest
-        .fn()
-        .mockResolvedValueOnce({
-          data: {
-            CreatePost: {
-              title: postTitle,
-              slug: 'this-is-a-title-for-a-post',
-              content: postContent,
-              contentExcerpt: postContent,
-              language: 'en',
+
+  beforeEach(() => {
+    mocks = {
+      $t: jest.fn(),
+      $apollo: {
+        mutate: jest
+          .fn()
+          .mockResolvedValueOnce({
+            data: {
+              CreatePost: {
+                title: postTitle,
+                slug: 'this-is-a-title-for-a-post',
+                content: postContent,
+                contentExcerpt: postContent,
+                language: 'en',
+              },
             },
-          },
-        })
-        .mockRejectedValue({ message: 'Not Authorised!' }),
-    },
-    $toast: {
-      error: jest.fn(),
-      success: jest.fn(),
-    },
-    $i18n: {
-      locale: () => 'en',
-    },
-    $router: {
-      back: jest.fn(),
-      push: jest.fn(),
-    },
-  }
+          })
+          .mockRejectedValue({ message: 'Not Authorised!' }),
+      },
+      $toast: {
+        error: jest.fn(),
+        success: jest.fn(),
+      },
+      $i18n: {
+        locale: () => 'en',
+      },
+      $router: {
+        back: jest.fn(),
+        push: jest.fn(),
+      },
+    }
+  })
 
   describe('mount', () => {
     const Wrapper = () => {
@@ -55,6 +59,7 @@ describe('ContributionForm.vue', () => {
 
     beforeEach(() => {
       wrapper = Wrapper()
+      wrapper.setData({ form: { languageOptions: [{ label: 'Deutsch', value: 'de' }] } })
     })
 
     describe('CreatePost', () => {
diff --git a/webapp/components/ContributionForm/index.vue b/webapp/components/ContributionForm/index.vue
index d56cb11e3..8e19944e4 100644
--- a/webapp/components/ContributionForm/index.vue
+++ b/webapp/components/ContributionForm/index.vue
@@ -48,6 +48,7 @@
 import gql from 'graphql-tag'
 import HcEditor from '~/components/Editor'
 import orderBy from 'lodash/orderBy'
+import locales from '~/locales'
 
 export default {
   components: {
@@ -92,7 +93,7 @@ export default {
   computed: {
     locale() {
       let locale
-      locale = process.env.locales.find(this.returnLocaleName)
+      locale = locales.find(this.returnLocaleName)
       return locale.name
     },
   },
@@ -141,7 +142,7 @@ export default {
       }
     },
     availableLocales() {
-      orderBy(process.env.locales, 'name').map(locale => {
+      orderBy(locales, 'name').map(locale => {
         this.form.languageOptions.push({ label: locale.name, value: locale.code })
       })
     },

From 3ab69b5fdee5a94ad76791ea4c03cb963094ed99 Mon Sep 17 00:00:00 2001
From: Matt Rider <mattwr18@gmail.com>
Date: Wed, 12 Jun 2019 19:44:09 -0300
Subject: [PATCH 5/8] Improve mobile responsiveness

---
 webapp/components/ContributionForm/index.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/webapp/components/ContributionForm/index.vue b/webapp/components/ContributionForm/index.vue
index 8e19944e4..475ed60d8 100644
--- a/webapp/components/ContributionForm/index.vue
+++ b/webapp/components/ContributionForm/index.vue
@@ -8,7 +8,7 @@
         </no-ssr>
         <ds-space margin-bottom="xxx-large" />
         <ds-flex class="contribution-form-footer">
-          <ds-flex-item :width="{ base: '0%', sm: '10%', md: '10%', lg: '15%' }" />
+          <ds-flex-item :width="{ base: '10%', sm: '10%', md: '10%', lg: '15%' }" />
           <ds-flex-item :width="{ base: '80%', sm: '30%', md: '30%', lg: '20%' }">
             <ds-space margin-bottom="small" />
             <ds-select

From 5266de2c62ca451e18c5900fb87e64a32678a551 Mon Sep 17 00:00:00 2001
From: Matt Rider <mattwr18@gmail.com>
Date: Thu, 13 Jun 2019 17:29:33 -0300
Subject: [PATCH 6/8] Set dropdown with language of post if exists

follow `PR` review by @Tirokk
---
 webapp/components/ContributionForm/index.vue | 6 +++++-
 webapp/pages/post/edit/_id.vue               | 5 ++---
 2 files changed, 7 insertions(+), 4 deletions(-)

diff --git a/webapp/components/ContributionForm/index.vue b/webapp/components/ContributionForm/index.vue
index 475ed60d8..cbaff79f3 100644
--- a/webapp/components/ContributionForm/index.vue
+++ b/webapp/components/ContributionForm/index.vue
@@ -87,6 +87,7 @@ export default {
         this.slug = contribution.slug
         this.form.content = contribution.content
         this.form.title = contribution.title
+        this.form.language = this.locale
       },
     },
   },
@@ -137,7 +138,10 @@ export default {
       this.$refs.contributionForm.update('content', value)
     },
     returnLocaleName(locale) {
-      if (this.$i18n.locale() === locale.code) {
+      if (
+        this.contribution.language === locale.code ||
+        (!this.contribution.language && this.$i18n.locale() === locale.code)
+      ) {
         return locale
       }
     },
diff --git a/webapp/pages/post/edit/_id.vue b/webapp/pages/post/edit/_id.vue
index 7dcff5036..150087ce2 100644
--- a/webapp/pages/post/edit/_id.vue
+++ b/webapp/pages/post/edit/_id.vue
@@ -3,9 +3,7 @@
     <ds-flex-item :width="{ base: '100%', md: 3 }">
       <hc-contribution-form :contribution="contribution" />
     </ds-flex-item>
-    <ds-flex-item :width="{ base: '100%', md: 1 }">
-      &nbsp;
-    </ds-flex-item>
+    <ds-flex-item :width="{ base: '100%', md: 1 }">&nbsp;</ds-flex-item>
   </ds-flex>
 </template>
 
@@ -49,6 +47,7 @@ export default {
               deleted
               slug
               image
+              language
               author {
                 id
                 disabled

From a099c209a870b4521874cfb5ff083850f7f20968 Mon Sep 17 00:00:00 2001
From: Matt Rider <mattwr18@gmail.com>
Date: Thu, 13 Jun 2019 19:54:47 -0300
Subject: [PATCH 7/8] Fix cypress tests

---
 webapp/components/ContributionForm/index.vue | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/webapp/components/ContributionForm/index.vue b/webapp/components/ContributionForm/index.vue
index cbaff79f3..20b3d6b9b 100644
--- a/webapp/components/ContributionForm/index.vue
+++ b/webapp/components/ContributionForm/index.vue
@@ -139,8 +139,8 @@ export default {
     },
     returnLocaleName(locale) {
       if (
-        this.contribution.language === locale.code ||
-        (!this.contribution.language && this.$i18n.locale() === locale.code)
+        (this.contribution && this.contribution.language === locale.code) ||
+        (!this.contribution && this.$i18n.locale() === locale.code)
       ) {
         return locale
       }

From 614a7eebc1da7fefe3a003e4b6d5735e59be13e2 Mon Sep 17 00:00:00 2001
From: Matt Rider <mattwr18@gmail.com>
Date: Fri, 14 Jun 2019 13:30:00 -0300
Subject: [PATCH 8/8] Refactor ContributionForm to deal with posts with no
 languages

---
 webapp/components/ContributionForm/index.vue | 17 ++++++-----------
 1 file changed, 6 insertions(+), 11 deletions(-)

diff --git a/webapp/components/ContributionForm/index.vue b/webapp/components/ContributionForm/index.vue
index 20b3d6b9b..f6bd9d38c 100644
--- a/webapp/components/ContributionForm/index.vue
+++ b/webapp/components/ContributionForm/index.vue
@@ -15,7 +15,7 @@
               model="language"
               :options="form.languageOptions"
               icon="globe"
-              :placeholder="locale"
+              :placeholder="form.placeholder"
               :label="$t('contribution.languageSelectLabel')"
             />
           </ds-flex-item>
@@ -64,6 +64,7 @@ export default {
         content: '',
         language: null,
         languageOptions: [],
+        placeholder: '',
       },
       formSchema: {
         title: { required: true, min: 3, max: 64 },
@@ -88,13 +89,15 @@ export default {
         this.form.content = contribution.content
         this.form.title = contribution.title
         this.form.language = this.locale
+        this.form.placeholder = this.locale
       },
     },
   },
   computed: {
     locale() {
-      let locale
-      locale = locales.find(this.returnLocaleName)
+      const locale = this.contribution.language
+        ? locales.find(loc => this.contribution.language === loc.code)
+        : locales.find(loc => this.$i18n.locale() === loc.code)
       return locale.name
     },
   },
@@ -137,14 +140,6 @@ export default {
       // this.form.content = value
       this.$refs.contributionForm.update('content', value)
     },
-    returnLocaleName(locale) {
-      if (
-        (this.contribution && this.contribution.language === locale.code) ||
-        (!this.contribution && this.$i18n.locale() === locale.code)
-      ) {
-        return locale
-      }
-    },
     availableLocales() {
       orderBy(locales, 'name').map(locale => {
         this.form.languageOptions.push({ label: locale.name, value: locale.code })