Localization of ImageCropper component

src/components/image_cropper/image_cropper.js

@@ -26,12 +26,10 @@ const ImageCropper = {
       default: 'image/png, image/gif, image/jpeg, image/bmp, image/x-icon'
     },
     title: {
-      type: String,
-      default: 'Crop picture'
+      type: String
     },
     saveButtonLabel: {
-      type: String,
-      default: 'Save'
+      type: String
     }
   },
   data () {
@@ -44,6 +42,14 @@ const ImageCropper = {
   components: {
     Modal
   },
+  computed: {
+    modalTitle () {
+      return this.title || this.$t('image_cropper.crop_picture')
+    },
+    modalSaveButtonLabel () {
+      return this.saveButtonLabel || this.$t('image_cropper.save')
+    }
+  },
   methods: {
     destroy () {
       this.cropper.destroy()

src/components/image_cropper/image_cropper.vue

@@ -1,13 +1,13 @@
 <template>
   <div class="image-cropper">
-    <modal :show="dataUrl" :title="title" @close="destroy">
+    <modal :show="dataUrl" :title="modalTitle" @close="destroy">
       <div class="modal-body">
         <div class="image-cropper-image-container">
           <img ref="img" :src="dataUrl" alt="" @load.stop="createCropper" />
         </div>
       </div>
       <div class="modal-footer">
-        <button class="btn image-cropper-btn" type="button" @click="submit" v-text="saveButtonLabel"></button>
+        <button class="btn image-cropper-btn" type="button" @click="submit" v-text="modalSaveButtonLabel"></button>
       </div>
     </modal>
     <input ref="input" type="file" class="image-cropper-img-input" :accept="mimes">

src/i18n/en.json

@@ -21,6 +21,10 @@
     "more": "More",
     "generic_error": "An error occured"
   },
+  "image_cropper": {
+    "crop_picture": "Crop picture",
+    "save": "Save"
+  },
   "login": {
     "login": "Log in",
     "description": "Log in with OAuth",