rename TeaserImage component to ImageUploader

webapp/components/ContributionForm/ContributionForm.spec.js

@@ -6,7 +6,7 @@ import Vuex from 'vuex'
 import PostMutations from '~/graphql/PostMutations.js'
 import CategoriesSelect from '~/components/CategoriesSelect/CategoriesSelect'
 
-import TeaserImage from '~/components/TeaserImage/TeaserImage'
+import ImageUploader from '~/components/ImageUploader/ImageUploader'
 import MutationObserver from 'mutation-observer'
 
 global.MutationObserver = MutationObserver
@@ -234,7 +234,7 @@ describe('ContributionForm.vue', () => {
 
         it('supports adding a teaser image', async () => {
           expectedParams.variables.imageUpload = imageUpload
-          wrapper.find(TeaserImage).vm.$emit('addTeaserImage', imageUpload)
+          wrapper.find(ImageUploader).vm.$emit('addHeroImage', imageUpload)
           await wrapper.find('form').trigger('submit')
           expect(mocks.$apollo.mutate).toHaveBeenCalledWith(expect.objectContaining(expectedParams))
         })

webapp/components/ContributionForm/ContributionForm.vue

@@ -24,10 +24,10 @@
             :src="contribution.image | proxyApiUrl"
             :class="['image', form.blurImage && '--blur-image']"
           />
-          <teaser-image
+          <image-uploader
             :contribution="contribution"
             :class="[form.blurImage && '--blur-image']"
-            @addTeaserImage="addTeaserImage"
+            @addHeroImage="addHeroImage"
             @addImageAspectRatio="addImageAspectRatio"
           />
         </template>
@@ -101,13 +101,13 @@ import HcEditor from '~/components/Editor/Editor'
 import locales from '~/locales'
 import PostMutations from '~/graphql/PostMutations.js'
 import CategoriesSelect from '~/components/CategoriesSelect/CategoriesSelect'
-import TeaserImage from '~/components/TeaserImage/TeaserImage'
+import ImageUploader from '~/components/ImageUploader/ImageUploader'
 
 export default {
   components: {
     HcEditor,
     CategoriesSelect,
-    TeaserImage,
+    ImageUploader,
   },
   props: {
     contribution: { type: Object, default: () => {} },
@@ -236,7 +236,7 @@ export default {
     updateEditorContent(value) {
       this.$refs.contributionForm.update('content', value)
     },
-    addTeaserImage(file) {
+    addHeroImage(file) {
       this.form.teaserImage = file
     },
     addImageAspectRatio(aspectRatio) {

webapp/components/ImageUploader/ImageUploader.spec.js

@@ -1,9 +1,9 @@
 import { mount } from '@vue/test-utils'
-import TeaserImage from './TeaserImage.vue'
+import ImageUploader from './ImageUploader.vue'
 
 const localVue = global.localVue
 
-describe('TeaserImage.vue', () => {
+describe('ImageUploader.vue', () => {
   let wrapper
   let mocks
 
@@ -17,7 +17,7 @@ describe('TeaserImage.vue', () => {
   })
   describe('mount', () => {
     const Wrapper = () => {
-      return mount(TeaserImage, { mocks, localVue })
+      return mount(ImageUploader, { mocks, localVue })
     }
     beforeEach(() => {
       wrapper = Wrapper()

webapp/components/ImageUploader/ImageUploader.vue

@@ -1,5 +1,4 @@
 <template>
-  <!-- TODO: rename to ImageUploader when delete-teaser-image PR is merged -->
   <div class="image-uploader">
     <vue-dropzone
       v-show="!showCropper"
@@ -87,7 +86,7 @@ export default {
         canvas.toBlob(blob => {
           const imageAspectRatio = canvas.width / canvas.height
           const croppedImageFile = new File([blob], this.file.name, { type: this.file.type })
-          this.$emit('addTeaserImage', croppedImageFile)
+          this.$emit('addHeroImage', croppedImageFile)
           this.$emit('addImageAspectRatio', imageAspectRatio)
           this.$emit('cropInProgress', false)
           this.setupPreview(canvas.toDataURL())
@@ -96,7 +95,7 @@ export default {
         const imageAspectRatio = this.file.width / this.file.height || 1.0
         const croppedImageFile = this.file
         this.setupPreview(this.file.dataURL)
-        this.$emit('addTeaserImage', croppedImageFile)
+        this.$emit('addHeroImage', croppedImageFile)
         this.$emit('addImageAspectRatio', imageAspectRatio)
         this.$emit('cropInProgress', false)
       }