diff --git a/app/controllers/admin/indexes/item/documents/document/edit.js b/app/controllers/admin/indexes/item/documents/document/edit.js
index 23c3749..51a8ee4 100644
--- a/app/controllers/admin/indexes/item/documents/document/edit.js
+++ b/app/controllers/admin/indexes/item/documents/document/edit.js
@@ -28,7 +28,9 @@ export default class AdminIndexesItemDocumentsDocumentEditController extends Con
 
       this.isSaving = false;
 
-      this.toaster.taskToast(task);
+      if (task) {
+        this.toaster.taskToast(task);
+      }
     } catch (error) {
       this.errors = [error.error || error];
     }
diff --git a/app/controllers/admin/indexes/item/documents/new.js b/app/controllers/admin/indexes/item/documents/new.js
index 6de710b..8f7a522 100644
--- a/app/controllers/admin/indexes/item/documents/new.js
+++ b/app/controllers/admin/indexes/item/documents/new.js
@@ -1,20 +1,18 @@
-import Controller from '@ember/controller';
+import AdminIndexesItemDocumentsDocumentEditController from './document/edit';
 import { action } from '@ember/object';
-import { inject as service } from '@ember/service';
-import { tracked } from '@glimmer/tracking';
-import ActionInvoker from 'meiliadmin/lib/action-invoker';
 
-export default class AdminIndexesItemDocumentsNewController extends Controller {
-  @service router;
-  @service toaster;
+export default class AdminIndexesItemDocumentsNewController extends AdminIndexesItemDocumentsDocumentEditController {
+  fileInputId = 'upload-file';
 
-  @tracked errors = [];
-  @tracked isSaving;
+  @action
+  async readFile(event) {
+    event.preventDefault();
 
-  constructor() {
-    super(...arguments);
+    const formData = new FormData(event.currentTarget);
+    const data = Object.fromEntries(formData.entries());
+    const text = await data[this.fileInputId].text();
 
-    this.invoker = new ActionInvoker();
+    this.save(text);
   }
 
   @action
@@ -24,22 +22,15 @@ export default class AdminIndexesItemDocumentsNewController extends Controller {
     this.isSaving = true;
 
     try {
-      const task = await this.model.index.saveDocuments(JSON.parse(value));
+      const task = await this.model.index.saveDocuments(value);
 
       this.isSaving = false;
 
-      this.toaster.taskToast(task);
+      if (task) {
+        this.toaster.taskToast(task);
+      }
     } catch (error) {
       this.errors = [error.error || error];
     }
   }
-
-  @action
-  cancel() {
-    const newRouteName = this.router.currentRouteName.replace(
-      /\.(new|edit|delete)$/,
-      ''
-    );
-    this.router.transitionTo(newRouteName);
-  }
 }
diff --git a/app/models/index.js b/app/models/index.js
index 4221e6c..538d775 100644
--- a/app/models/index.js
+++ b/app/models/index.js
@@ -56,15 +56,8 @@ export default class Index {
     });
   }
 
-  saveDocuments(documents) {
-    if (typeof documents === 'string') {
-      documents = JSON.parse(documents);
-    }
-
-    return query(`${this.path}/documents`, {
-      method: 'POST',
-      body: JSON.stringify(documents),
-    });
+  saveDocuments(body) {
+    return query(`${this.path}/documents`, { method: 'POST', body });
   }
 
   deleteDocument(document) {
diff --git a/app/templates/admin/indexes/item/documents/new.hbs b/app/templates/admin/indexes/item/documents/new.hbs
index 5cb8cc4..3f3f458 100644
--- a/app/templates/admin/indexes/item/documents/new.hbs
+++ b/app/templates/admin/indexes/item/documents/new.hbs
@@ -1,5 +1,28 @@
+<form class='mb-4' {{on 'submit' this.readFile}}>
+  <Form::Element
+    @errors={{this.errors}}
+    @label='Upload file'
+    @helper='JSON format. The file must contains an array of documents.'
+    @for={{this.fileInputId}}
+  >
+    <input
+      type='file'
+      accept='application/json'
+      id={{this.fileInputId}}
+      name={{this.fileInputId}}
+    />
+  </Form::Element>
+
+  <Button
+    type='submit'
+    @text='Upload'
+    @style='primary'
+    @state={{if this.isSaving 'pending'}}
+  />
+</form>
+
 <div class='mb-4'>
-  <Form::Element @errors={{this.errors}}>
+  <Form::Element @errors={{this.errors}} @label='Form'>
     <MonacoEditor
       @value={{json-stringify @model.documents}}
       @uri={{@model.schema.uri}}
diff --git a/app/utils/query.js b/app/utils/query.js
index 599d40e..50b7f5c 100644
--- a/app/utils/query.js
+++ b/app/utils/query.js
@@ -23,18 +23,18 @@ export default function query(path, options = {}) {
       } else if (response.ok) {
         return response.json();
       } else {
-        response.json().then((reason) => {
+        return response.json().then((reason) => {
           toaster.dangerToast({
             header: reason.type,
             text: reason.message,
           });
 
-          throw new Error('Network response was not OK');
+          // throw new Error('Network response was not OK');
         });
       }
     })
     .catch((response) => {
-      response.json().then((reason) => {
+      return response.json().then((reason) => {
         toaster.dangerToast({
           header: reason.type,
           text: reason.message,