From ec66b0b5765b4bb2d464e6425e36273891716a5b Mon Sep 17 00:00:00 2001
From: weryques <weryques@outlook.com>
Date: Fri, 23 Mar 2018 10:03:39 -0300
Subject: [PATCH 01/16] Delete category

---
 .../components/lists/categories-list.vue      | 44 +++++++++----------
 .../components/lists/collections-list.vue     |  1 -
 src/admin/tainacan-admin-i18n.php             |  3 ++
 ...s-tainacan-rest-collections-controller.php |  8 ++--
 ...class-tainacan-rest-filters-controller.php | 20 +++------
 .../class-tainacan-rest-items-controller.php  | 10 ++---
 ...ss-tainacan-rest-taxonomies-controller.php | 18 +++-----
 .../class-tainacan-collections.php            |  4 +-
 .../repositories/class-tainacan-filters.php   |  4 +-
 .../repositories/class-tainacan-items.php     |  4 +-
 .../class-tainacan-taxonomies.php             |  4 +-
 src/js/store/modules/category/actions.js      | 11 +++--
 src/js/store/modules/category/mutations.js    |  8 ++++
 tests/test-api-collections.php                |  8 ++--
 tests/test-api-filters.php                    | 12 ++---
 tests/test-api-items.php                      |  8 ++--
 tests/test-api-taxonomies.php                 | 14 +++---
 17 files changed, 88 insertions(+), 93 deletions(-)

diff --git a/src/admin/components/lists/categories-list.vue b/src/admin/components/lists/categories-list.vue
index aaa42edb1..71620b137 100644
--- a/src/admin/components/lists/categories-list.vue
+++ b/src/admin/components/lists/categories-list.vue
@@ -93,7 +93,6 @@
 </template>
 
 <script>
-
     import { mapActions } from 'vuex'
 
     export default {
@@ -118,28 +117,29 @@
                 this.$dialog.confirm({
                     message: this.$i18n.get('info_warning_category_delete'),
                     onConfirm: () => {
-                        this.deleteCategory(categoryId).then(() => {
-                            this.loadCategories();
-                            this.$toast.open({
-                                duration: 3000,
-                                message: this.$i18n.get('info_category_deleted'),
-                                position: 'is-bottom',
-                                type: 'is-secondary',
-                                queue: true
-                            });
-                            for (let i = 0; i < this.selectedCategories.length; i++) {
-                                if (this.selectedCategories[i].id === this.categoryId)
-                                    this.selectedCategories.splice(i, 1);
-                            }
-                        }).catch(() =>
-                            this.$toast.open({
-                                duration: 3000,
-                                message: this.$i18n.get('info_error_deleting_category'),
-                                position: 'is-bottom',
-                                type: 'is-danger',
-                                queue: true
+                        this.deleteCategory(categoryId)
+                            .then((res) => {
+                                this.$toast.open({
+                                    duration: 3000,
+                                    message: this.$i18n.get('info_category_deleted'),
+                                    position: 'is-bottom',
+                                    type: 'is-secondary',
+                                    queue: true
+                                });
+                                for (let i = 0; i < this.selectedCategories.length; i++) {
+                                    if (this.selectedCategories[i].id === this.categoryId)
+                                        this.selectedCategories.splice(i, 1);
+                                }
                             })
-                        );
+                            .catch((error) => {
+                                this.$toast.open({
+                                    duration: 3000,
+                                    message: this.$i18n.get('info_error_deleting_category'),
+                                    position: 'is-bottom',
+                                    type: 'is-danger',
+                                    queue: true
+                                });
+                            });
                     }
                 });
             },
diff --git a/src/admin/components/lists/collections-list.vue b/src/admin/components/lists/collections-list.vue
index c8acab76f..57e9f294b 100644
--- a/src/admin/components/lists/collections-list.vue
+++ b/src/admin/components/lists/collections-list.vue
@@ -95,7 +95,6 @@ export default {
                 message: this.$i18n.get('info_warning_collection_delete'),
                 onConfirm: () => {
                     this.deleteCollection(collectionId).then(() => {
-                        this.loadCollections();
                         this.$toast.open({
                             duration: 3000,
                             message: this.$i18n.get('info_collection_deleted'),
diff --git a/src/admin/tainacan-admin-i18n.php b/src/admin/tainacan-admin-i18n.php
index 05dd1bc26..5c7c4ec51 100644
--- a/src/admin/tainacan-admin-i18n.php
+++ b/src/admin/tainacan-admin-i18n.php
@@ -137,10 +137,13 @@ return [
 	'info_no_category_created'                 => __( 'No category was created in this repository.', 'tainacan' ),
 	'info_no_item_created'                     => __( 'No item was created in this collection.', 'tainacan' ),
 	'info_error_deleting_collection'           => __( 'Error on deleting collection.', 'tainacan' ),
+	'info_error_deleting_category'             => __( 'Error on deleting category', 'tainacan' ),
 	'info_collection_deleted'                  => __( 'Collection deleted.', 'tainacan' ),
 	'info_item_deleted'                        => __( 'Item deleted.', 'tainacan' ),
+	'info_category_deleted'                    => __( 'Category deleted', 'tainacan' ),
 	'info_warning_collection_delete'           => __( 'Do you really want to delete this collection?', 'tainacan' ),
 	'info_warning_item_delete'                 => __( 'Do you really want to delete this item?', 'tainacan' ),
+	'info_warning_category_delete'             => __( 'Do you really want to delete this category?', 'tainacan' ),
 	'info_warning_selected_collections_delete' => __( 'Do you really want to delete the selected collections?', 'tainacan' ),
 	'info_warning_selected_items_delete'       => __( 'Do you really want to delete the selected items?', 'tainacan' ),
 	'info_warning_collection_related'          => __( 'The field Collection related is required', 'tainacan' ),
diff --git a/src/api/endpoints/class-tainacan-rest-collections-controller.php b/src/api/endpoints/class-tainacan-rest-collections-controller.php
index 2aa186755..7d3fcef6f 100644
--- a/src/api/endpoints/class-tainacan-rest-collections-controller.php
+++ b/src/api/endpoints/class-tainacan-rest-collections-controller.php
@@ -68,8 +68,8 @@ class TAINACAN_REST_Collections_Controller extends TAINACAN_REST_Controller {
                 'callback'            => array($this, 'delete_item'),
                 'permission_callback' => array($this, 'delete_item_permissions_check'),
 	            'args'                => array(
-	            	'body_args' => array(
-		                'description' => __('To delete permanently, in body you can pass \'is_permanently\' as true. By default this will only trash collection'),
+	            	'permanently' => array(
+		                'description' => __('To delete permanently, you can pass \'permanently\' as true. By default this will only trash collection'),
 			            'default'     => 'false'
 		            ),
 	            )
@@ -275,9 +275,9 @@ class TAINACAN_REST_Collections_Controller extends TAINACAN_REST_Controller {
 	 */
 	public function delete_item( $request ) {
 	    $collection_id = $request['collection_id'];
-		$is_permanently = json_decode($request->get_body(), true);
+		$permanently = $request['permanently'];
 
-		$args = [$collection_id, $is_permanently];
+		$args = [$collection_id, $permanently];
 
 		$collection = $this->collections_repository->delete($args);
 
diff --git a/src/api/endpoints/class-tainacan-rest-filters-controller.php b/src/api/endpoints/class-tainacan-rest-filters-controller.php
index bfbd97ab8..de08efa4a 100644
--- a/src/api/endpoints/class-tainacan-rest-filters-controller.php
+++ b/src/api/endpoints/class-tainacan-rest-filters-controller.php
@@ -78,8 +78,8 @@ class TAINACAN_REST_Filters_Controller extends TAINACAN_REST_Controller {
 				'callback'            => array($this, 'delete_item'),
 				'permission_callback' => array($this, 'delete_item_permissions_check'),
 				'args'                => array(
-	            	'body_args' => array(
-		                'description' => __('To delete permanently, in body you can pass \'is_permanently\' as true. By default this will only trash collection'),
+	            	'permanently' => array(
+		                'description' => __('To delete permanently, you can pass \'permanently\' as true. By default this will only trash collection'),
 			            'default'     => 'false'
 		            ),
 	            )
@@ -218,21 +218,13 @@ class TAINACAN_REST_Filters_Controller extends TAINACAN_REST_Controller {
 	 */
 	public function delete_item( $request ) {
 		$filter_id = $request['filter_id'];
+		$permanently = $request['permanently'];
 
-		$is_permanently = json_decode($request->get_body(), true);
+		$args = [$filter_id, $permanently];
 
-		if(!empty($is_permanently)){
-			$args = [$filter_id, $is_permanently];
+		$filter = $this->filter_repository->delete($args);
 
-			$filter = $this->filter_repository->delete($args);
-
-			return new WP_REST_Response($this->prepare_item_for_response($filter, $request), 200);
-		}
-
-		return new WP_REST_Response([
-			'error_message' => __('The body could not be empty', 'tainacan'),
-			'body'          => $request->get_body()
-		], 400);
+		return new WP_REST_Response($this->prepare_item_for_response($filter, $request), 200);
 	}
 
 	/**
diff --git a/src/api/endpoints/class-tainacan-rest-items-controller.php b/src/api/endpoints/class-tainacan-rest-items-controller.php
index 34e08cf1a..a710990a9 100644
--- a/src/api/endpoints/class-tainacan-rest-items-controller.php
+++ b/src/api/endpoints/class-tainacan-rest-items-controller.php
@@ -77,8 +77,8 @@ class TAINACAN_REST_Items_Controller extends TAINACAN_REST_Controller {
 					'callback'            => array($this, 'delete_item'),
 					'permission_callback' => array($this, 'delete_item_permissions_check'),
 					'args'                => array(
-						'body_args' => array(
-							'description' => __('To delete permanently, in body you can pass \'is_permanently\' as true. By default this will only trash collection'),
+						'permanently' => array(
+							'description' => __('To delete permanently, you can pass \'permanently\' as true. By default this will only trash collection'),
 							'default'     => 'false'
 						),
 					)
@@ -306,10 +306,10 @@ class TAINACAN_REST_Items_Controller extends TAINACAN_REST_Controller {
 	 * @return WP_Error|WP_REST_Response
 	 */
 	public function delete_item( $request ) {
-		$item_id        = $request['item_id'];
-		$is_permanently = json_decode($request->get_body(), true);
+		$item_id     = $request['item_id'];
+		$permanently = $request['permanently'];
 
-		$args = [$item_id, $is_permanently];
+		$args = [$item_id, $permanently];
 
 		$item = $this->items_repository->delete($args);
 
diff --git a/src/api/endpoints/class-tainacan-rest-taxonomies-controller.php b/src/api/endpoints/class-tainacan-rest-taxonomies-controller.php
index 5df724943..2f16f9db9 100644
--- a/src/api/endpoints/class-tainacan-rest-taxonomies-controller.php
+++ b/src/api/endpoints/class-tainacan-rest-taxonomies-controller.php
@@ -58,9 +58,9 @@ class TAINACAN_REST_Taxonomies_Controller extends TAINACAN_REST_Controller {
 					'callback'            => array($this, 'delete_item'),
 					'permission_callback' => array($this, 'delete_item_permissions_check'),
 					'args'                => array(
-						'body_args' => array(
-							'description' => __('To delete permanently, in body you can pass \'is_permanently\' as true. By default this will only trash collection'),
-							'default'     => 'false'
+						'permanently' => array(
+							'description' => __('To delete permanently, you can pass \'permanently\' as true. By default this will only trash collection'),
+							'default'     => 'false',
 						),
 					)
 				),
@@ -164,22 +164,14 @@ class TAINACAN_REST_Taxonomies_Controller extends TAINACAN_REST_Controller {
 	 */
 	public function delete_item( $request ) {
 		$taxonomy_id = $request['taxonomy_id'];
-
-		if(empty($request->get_body())){
-			return new WP_REST_Response([
-				'error_message' => __('Body can not be empty.', 'tainacan'),
-				'body'          => $request->get_body()
-			], 400);
-		}
-
-		$is_permanently = json_decode($request->get_body(), true);
+		$permanently = $request['permanently'];
 
 		$taxonomy = $this->taxonomy_repository->fetch($taxonomy_id);
 
 		if(!empty($taxonomy)) {
 			$taxonomy_name = $taxonomy->get_db_identifier();
 
-			$args = [ $taxonomy_id, $taxonomy_name, $is_permanently ];
+			$args = [ $taxonomy_id, $taxonomy_name, $permanently ];
 
 			$deleted = $this->taxonomy_repository->delete( $args );
 
diff --git a/src/classes/repositories/class-tainacan-collections.php b/src/classes/repositories/class-tainacan-collections.php
index 24dc7f627..20c3c4535 100644
--- a/src/classes/repositories/class-tainacan-collections.php
+++ b/src/classes/repositories/class-tainacan-collections.php
@@ -243,8 +243,8 @@ class Collections extends Repository {
 	 * @return mixed|Collection
 	 */
 	public function delete( $args ) {
-		if ( ! empty( $args[1] ) && $args[1]['is_permanently'] === true ) {
-			return new Entities\Collection( wp_delete_post( $args[0], $args[1]['is_permanently'] ) );
+		if ( ! empty( $args[1] ) && $args[1] === true ) {
+			return new Entities\Collection( wp_delete_post( $args[0], $args[1] ) );
 		}
 
 		return new Entities\Collection( wp_trash_post( $args[0] ) );
diff --git a/src/classes/repositories/class-tainacan-filters.php b/src/classes/repositories/class-tainacan-filters.php
index 2f57ec875..52a8b869d 100644
--- a/src/classes/repositories/class-tainacan-filters.php
+++ b/src/classes/repositories/class-tainacan-filters.php
@@ -188,8 +188,8 @@ class Filters extends Repository {
      *
      */
     public function delete($args){
-	    if(!empty($args[1]) && $args[1]['is_permanently'] === true){
-		    return new Entities\Filter(wp_delete_post($args[0], $args[1]['is_permanently']));
+	    if(!empty($args[1]) && $args[1] === true){
+		    return new Entities\Filter(wp_delete_post($args[0], $args[1]));
 	    }
 
 	    return new Entities\Filter(wp_trash_post($args[0]));
diff --git a/src/classes/repositories/class-tainacan-items.php b/src/classes/repositories/class-tainacan-items.php
index 4952d1598..156121d41 100644
--- a/src/classes/repositories/class-tainacan-items.php
+++ b/src/classes/repositories/class-tainacan-items.php
@@ -304,8 +304,8 @@ class Items extends Repository {
 	 * @return mixed|Entities\Item
 	 */
 	public function delete( $args ) {
-		if ( ! empty( $args[1] ) && $args[1]['is_permanently'] === true ) {
-			return new Entities\Item( wp_delete_post( $args[0], $args[1]['is_permanently'] ) );
+		if ( ! empty( $args[1] ) && $args[1] === true ) {
+			return new Entities\Item( wp_delete_post( $args[0], $args[1] ) );
 		}
 
 		return new Entities\Item( wp_trash_post( $args[0] ) );
diff --git a/src/classes/repositories/class-tainacan-taxonomies.php b/src/classes/repositories/class-tainacan-taxonomies.php
index d0558c3a4..82556ce73 100644
--- a/src/classes/repositories/class-tainacan-taxonomies.php
+++ b/src/classes/repositories/class-tainacan-taxonomies.php
@@ -209,9 +209,9 @@ class Taxonomies extends Repository {
     public function delete($args){
 	    $taxonomy_id    = $args[0];
 	    $taxonomy_name  = $args[1];
-	    $is_permanently = $args[2]['is_permanently'];
+	    $permanently    = $args[2];
 
-	    if($is_permanently === true){
+	    if($permanently === true){
 		    $unregistered = unregister_taxonomy($taxonomy_name);
 
 		    if($unregistered instanceof \WP_Error){
diff --git a/src/js/store/modules/category/actions.js b/src/js/store/modules/category/actions.js
index d8b4ff671..887c330b0 100644
--- a/src/js/store/modules/category/actions.js
+++ b/src/js/store/modules/category/actions.js
@@ -25,14 +25,17 @@ export const createCategory = ({commit}, category) => {
 
 export const deleteCategory = ({ commit }, categoryId) => {
   return new Promise(( resolve, reject ) => {
-      axios.tainacan.delete(`/taxonomies/${categoryId}`, {
-          'is_permanently': true
-      })
+      axios.tainacan.delete(`/taxonomies/${categoryId}?permanently=${true}`)
           .then(res => {
+              console.info(res);
 
-              resolve( res.data );
+              commit('deleteCategory', res.data);
+
+              resolve( res );
           })
           .catch(error => {
+              console.error(error);
+
               reject( error )
           });
   });
diff --git a/src/js/store/modules/category/mutations.js b/src/js/store/modules/category/mutations.js
index d8bc5a110..686659651 100644
--- a/src/js/store/modules/category/mutations.js
+++ b/src/js/store/modules/category/mutations.js
@@ -8,4 +8,12 @@ export const setCategories = (state, categories) => {
 
 export const setCategoryName = (state, name) => {
     state.categoryName = name;
+};
+
+export const deleteCategory = ( state, category ) => {
+    let index = state.categories.findIndex(deletedCategory => deletedCategory.id === category.id);
+
+    if (index >= 0) {
+        state.categories.splice(index, 1);
+    }
 };
\ No newline at end of file
diff --git a/tests/test-api-collections.php b/tests/test-api-collections.php
index 020646e9d..24979d194 100644
--- a/tests/test-api-collections.php
+++ b/tests/test-api-collections.php
@@ -97,13 +97,13 @@ class TAINACAN_REST_Collections_Controller extends TAINACAN_UnitApiTestCase {
 		$collection1 = $this->tainacan_entity_factory->create_entity('collection', '', true);
 
 		// Delete permanently
-		$delete_permanently = json_encode(['is_permanently' => true]);
+		$delete_permanently = ['permanently' => true];
 
 		$request  = new \WP_REST_Request(
 			'DELETE',
 			$this->namespace . '/collections/' . $collection1->get_id()
 		);
-		$request->set_body($delete_permanently);
+		$request->set_query_params($delete_permanently);
 
 		$response = $this->server->dispatch($request);
 
@@ -122,13 +122,13 @@ class TAINACAN_REST_Collections_Controller extends TAINACAN_UnitApiTestCase {
 	    $collection2 = $this->tainacan_entity_factory->create_entity('collection', '', true);
 
 	    // Move to trash
-	    $delete_permanently = json_encode(['is_permanently' => false]);
+	    $delete_permanently = ['permanently' => false];
 
 	    $request  = new \WP_REST_Request(
 		    'DELETE',
 		    $this->namespace . '/collections/' . $collection2->get_id()
 	    );
-	    $request->set_body($delete_permanently);
+	    $request->set_query_params($delete_permanently);
 
 	    $response = $this->server->dispatch($request);
 
diff --git a/tests/test-api-filters.php b/tests/test-api-filters.php
index b877629f3..85882ba2b 100644
--- a/tests/test-api-filters.php
+++ b/tests/test-api-filters.php
@@ -84,14 +84,12 @@ class TAINACAN_REST_Terms_Controller extends TAINACAN_UnitApiTestCase {
 			true
 		);
 
-		$is_permanently = json_encode([
-			'is_permanently' => false
-		]);
+		$permanently = [ 'permanently' => false ];
 
 		$request = new \WP_REST_Request(
 			'DELETE', $this->namespace . '/filters/' . $filter->get_id());
 
-		$request->set_body($is_permanently);
+		$request->set_query_params($permanently);
 
 		$response = $this->server->dispatch($request);
 
@@ -105,14 +103,12 @@ class TAINACAN_REST_Terms_Controller extends TAINACAN_UnitApiTestCase {
 
 		##### DELETE #####
 
-		$is_permanently = json_encode([
-			'is_permanently' => true
-		]);
+		$permanently = [ 'permanently' => true ];
 
 		$request = new \WP_REST_Request(
 			'DELETE', $this->namespace . '/filters/' . $filter->get_id());
 
-		$request->set_body($is_permanently);
+		$request->set_query_params($permanently);
 
 		$response = $this->server->dispatch($request);
 
diff --git a/tests/test-api-items.php b/tests/test-api-items.php
index 17d44be88..a283a7ccc 100644
--- a/tests/test-api-items.php
+++ b/tests/test-api-items.php
@@ -93,13 +93,13 @@ class TAINACAN_REST_Items_Controller extends TAINACAN_UnitApiTestCase {
 		);
 
 		// Move to trash
-		$delete_permanently = json_encode(['is_permanently' => false]);
+		$delete_permanently = ['permanently' => false];
 
 		$request  = new \WP_REST_Request(
 			'DELETE',
 			$this->namespace . '/items/' . $item1->get_id()
 		);
-		$request->set_body($delete_permanently);
+		$request->set_query_params($delete_permanently);
 
 		$response = $this->server->dispatch($request);
 
@@ -126,13 +126,13 @@ class TAINACAN_REST_Items_Controller extends TAINACAN_UnitApiTestCase {
 		);
 
 		// Delete permanently
-		$delete_permanently = json_encode(['is_permanently' => true]);
+		$delete_permanently = ['permanently' => true];
 
 		$request  = new \WP_REST_Request(
 			'DELETE',
 			$this->namespace . '/items/' . $item2->get_id()
 		);
-		$request->set_body($delete_permanently);
+		$request->set_query_params($delete_permanently);
 
 		$response = $this->server->dispatch($request);
 
diff --git a/tests/test-api-taxonomies.php b/tests/test-api-taxonomies.php
index 39a6a8ced..e60ef19c8 100644
--- a/tests/test-api-taxonomies.php
+++ b/tests/test-api-taxonomies.php
@@ -19,13 +19,13 @@ class TAINACAN_REST_Taxonomies_Controller extends TAINACAN_UnitApiTestCase {
 			true
 		);
 
-		$is_permanently = json_encode(['is_permanently' => false]);
+		$permanently = [ 'permanently' => false ];
 
 		$request_trash = new \WP_REST_Request(
 			'DELETE', $this->namespace . '/taxonomies/' . $taxonomy->get_id()
 		);
 
-		$request_trash->set_body($is_permanently);
+		$request_trash->set_query_params($permanently);
 
 		$this->server->dispatch($request_trash);
 
@@ -36,13 +36,13 @@ class TAINACAN_REST_Taxonomies_Controller extends TAINACAN_UnitApiTestCase {
 
 		################ DELETE ###
 
-		$is_permanently = json_encode(['is_permanently' => true]);
+		$permanently = [ 'permanently' => true ];
 
 		$request_delete = new \WP_REST_Request(
 			'DELETE', $this->namespace . '/taxonomies/' . $taxonomy->get_id()
 		);
 
-		$request_delete->set_body($is_permanently);
+		$request_delete->set_query_params($permanently);
 
 		$this->server->dispatch($request_delete);
 
@@ -122,8 +122,10 @@ class TAINACAN_REST_Taxonomies_Controller extends TAINACAN_UnitApiTestCase {
 
 		$data = $response->get_data();
 
-		$this->assertEquals($taxonomy1->get_name(), $data[1]['name']);
-		$this->assertEquals($taxonomy2->get_name(), $data[0]['name']);
+		$names = [ $data[1]['name'], $data[0]['name']];
+
+		$this->assertContains($taxonomy1->get_name(), $names);
+		$this->assertContains($taxonomy2->get_name(), $names);
 	}
 
 	public function test_update_taxonomy(){

From 0b5dfa8b309bed0ec79b82393f81b2204e63fc6f Mon Sep 17 00:00:00 2001
From: mateuswetah <mateus.m.luna@gmail.com>
Date: Fri, 23 Mar 2018 10:20:37 -0300
Subject: [PATCH 02/16] LINTER FOLKS. LINTER.

---
 .eslintrc.js                                  |  16 +
 package-lock.json                             | 822 ++++++++++++++++++
 package.json                                  |   3 +
 .../edition/category-edition-form.vue         |   5 +-
 .../edition/collection-edition-form.vue       |   4 +-
 .../components/edition/field-edition-form.vue |   4 +-
 .../edition/filter-edition-form.vue           |   4 +-
 .../components/edition/item-edition-form.vue  |  10 +-
 .../components/lists/categories-list.vue      |   7 +-
 .../components/lists/collections-list.vue     |   9 +-
 src/admin/components/lists/fields-list.vue    |  10 +-
 .../components/lists/filters-items-list.vue   |   1 -
 src/admin/components/lists/filters-list.vue   |  18 +-
 src/admin/components/lists/items-list.vue     |  10 +-
 .../components/navigation/primary-menu.vue    |   2 +-
 .../components/navigation/secondary-menu.vue  |   2 +-
 .../components/navigation/tainacan-header.vue |   2 +-
 src/admin/components/other/help-button.vue    |   2 +-
 src/admin/pages/lists/categories-page.vue     |   4 +-
 src/admin/pages/lists/collections-page.vue    |   4 +-
 src/admin/pages/lists/items-page.vue          |  14 +-
 src/admin/pages/singles/item-page.vue         |   2 +-
 .../field-types/category/AddNewTerm.vue       |   4 +-
 .../field-types/category/CategoryCheckbox.vue |   4 +-
 .../field-types/category/CategoryRadio.vue    |   4 +-
 .../category/CategorySelectbox.vue            |   2 +-
 .../field-types/category/FormCategory.vue     |  10 +-
 .../relationship/FormRelationship.vue         |   9 +-
 .../field-types/selectbox/Selectbox.vue       |   2 +-
 .../field-types/tainacan-form-item.vue        |  46 +-
 src/classes/field-types/text/Text.vue         |   3 -
 src/classes/field-types/textarea/Textarea.vue |   3 -
 .../filter-types/checkbox/Checkbox.vue        |   8 +-
 .../filter-types/selectbox/Selectbox.vue      |   4 +-
 .../filter-types/taginput/Taginput.vue        |   2 +-
 .../filter-types/tainacan-filters-list.vue    |   1 -
 webpack.config.js                             |   6 +
 37 files changed, 949 insertions(+), 114 deletions(-)
 create mode 100644 .eslintrc.js

diff --git a/.eslintrc.js b/.eslintrc.js
new file mode 100644
index 000000000..511ca2732
--- /dev/null
+++ b/.eslintrc.js
@@ -0,0 +1,16 @@
+module.exports = {
+  extends: [
+    // add more generic rulesets here, such as:
+    'eslint:recommended',
+    'plugin:vue/essential'
+  ],
+  rules: {
+    // override/add rules settings here, such as:
+    'vue/no-unused-vars': 'error',
+    "no-console": "warn",
+    "no-unused-vars": "warn",
+    "no-undef": "warn",
+    "vue/no-side-effects-in-computed-properties": "warn",
+    "vue/return-in-computed-property": "warn"
+  }
+}
\ No newline at end of file
diff --git a/package-lock.json b/package-lock.json
index 00f14f1db..801522907 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -130,6 +130,23 @@
         }
       }
     },
+    "acorn-jsx": {
+      "version": "3.0.1",
+      "resolved": "https://registry.npmjs.org/acorn-jsx/-/acorn-jsx-3.0.1.tgz",
+      "integrity": "sha1-r9+UiPsezvyDSPb7IvRk4ypYs2s=",
+      "dev": true,
+      "requires": {
+        "acorn": "3.3.0"
+      },
+      "dependencies": {
+        "acorn": {
+          "version": "3.3.0",
+          "resolved": "https://registry.npmjs.org/acorn/-/acorn-3.3.0.tgz",
+          "integrity": "sha1-ReN/s56No/JbruP/U2niu18iAXo=",
+          "dev": true
+        }
+      }
+    },
     "ajv": {
       "version": "5.5.2",
       "resolved": "https://registry.npmjs.org/ajv/-/ajv-5.5.2.tgz",
@@ -288,6 +305,12 @@
       "integrity": "sha1-odl8yvy8JiXMcPrc6zalDFiwGlM=",
       "dev": true
     },
+    "arrify": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/arrify/-/arrify-1.0.1.tgz",
+      "integrity": "sha1-iYUI2iIm84DfkEcoRWhJwVAaSw0=",
+      "dev": true
+    },
     "asn1": {
       "version": "0.2.3",
       "resolved": "https://registry.npmjs.org/asn1/-/asn1-0.2.3.tgz",
@@ -1604,6 +1627,21 @@
         }
       }
     },
+    "caller-path": {
+      "version": "0.1.0",
+      "resolved": "https://registry.npmjs.org/caller-path/-/caller-path-0.1.0.tgz",
+      "integrity": "sha1-lAhe9jWB7NPaqSREqP6U6CV3dR8=",
+      "dev": true,
+      "requires": {
+        "callsites": "0.2.0"
+      }
+    },
+    "callsites": {
+      "version": "0.2.0",
+      "resolved": "https://registry.npmjs.org/callsites/-/callsites-0.2.0.tgz",
+      "integrity": "sha1-r6uWJikQp/M8GaV3WCXGnzTjUMo=",
+      "dev": true
+    },
     "camelcase": {
       "version": "1.2.1",
       "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-1.2.1.tgz",
@@ -1677,6 +1715,12 @@
         "supports-color": "2.0.0"
       }
     },
+    "chardet": {
+      "version": "0.4.2",
+      "resolved": "https://registry.npmjs.org/chardet/-/chardet-0.4.2.tgz",
+      "integrity": "sha1-tUc7M9yXxCTl2Y3IfVXU2KKci/I=",
+      "dev": true
+    },
     "check-more-types": {
       "version": "2.24.0",
       "resolved": "https://registry.npmjs.org/check-more-types/-/check-more-types-2.24.0.tgz",
@@ -1716,6 +1760,12 @@
         "safe-buffer": "5.1.1"
       }
     },
+    "circular-json": {
+      "version": "0.3.3",
+      "resolved": "https://registry.npmjs.org/circular-json/-/circular-json-0.3.3.tgz",
+      "integrity": "sha512-UZK3NBx2Mca+b5LsG7bY183pHWt5Y1xts4P3Pz7ENTwGVnJOUWbRb3ocjvX7hx9tq/yTAdclXm9sZ38gNuem4A==",
+      "dev": true
+    },
     "clap": {
       "version": "1.2.3",
       "resolved": "https://registry.npmjs.org/clap/-/clap-1.2.3.tgz",
@@ -1836,6 +1886,12 @@
         "string-width": "1.0.2"
       }
     },
+    "cli-width": {
+      "version": "2.2.0",
+      "resolved": "https://registry.npmjs.org/cli-width/-/cli-width-2.2.0.tgz",
+      "integrity": "sha1-/xnt6Kml5XkyQUewwR8PvLq+1jk=",
+      "dev": true
+    },
     "clipboard": {
       "version": "1.7.1",
       "resolved": "https://registry.npmjs.org/clipboard/-/clipboard-1.7.1.tgz",
@@ -2619,6 +2675,12 @@
       "integrity": "sha1-9dJgKStmDghO/0zbyfCK0yR0SLU=",
       "dev": true
     },
+    "deep-is": {
+      "version": "0.1.3",
+      "resolved": "https://registry.npmjs.org/deep-is/-/deep-is-0.1.3.tgz",
+      "integrity": "sha1-s2nW+128E+7PUk+RsHD+7cNXzzQ=",
+      "dev": true
+    },
     "deepmerge": {
       "version": "1.5.2",
       "resolved": "https://registry.npmjs.org/deepmerge/-/deepmerge-1.5.2.tgz",
@@ -2762,6 +2824,15 @@
         "buffer-indexof": "1.1.1"
       }
     },
+    "doctrine": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/doctrine/-/doctrine-2.1.0.tgz",
+      "integrity": "sha512-35mSku4ZXK0vfCuHEDAwt55dg2jNajHZ1odvF+8SSr82EsZY4QmXfuWso8oEd8zRhVObSN18aM0CjSdoBX7zIw==",
+      "dev": true,
+      "requires": {
+        "esutils": "2.0.2"
+      }
+    },
     "document-register-element": {
       "version": "1.7.0",
       "resolved": "https://registry.npmjs.org/document-register-element/-/document-register-element-1.7.0.tgz",
@@ -2997,12 +3068,225 @@
         "estraverse": "4.2.0"
       }
     },
+    "eslint": {
+      "version": "4.19.1",
+      "resolved": "https://registry.npmjs.org/eslint/-/eslint-4.19.1.tgz",
+      "integrity": "sha512-bT3/1x1EbZB7phzYu7vCr1v3ONuzDtX8WjuM9c0iYxe+cq+pwcKEoQjl7zd3RpC6YOLgnSy3cTN58M2jcoPDIQ==",
+      "dev": true,
+      "requires": {
+        "ajv": "5.5.2",
+        "babel-code-frame": "6.26.0",
+        "chalk": "2.3.2",
+        "concat-stream": "1.6.0",
+        "cross-spawn": "5.1.0",
+        "debug": "3.1.0",
+        "doctrine": "2.1.0",
+        "eslint-scope": "3.7.1",
+        "eslint-visitor-keys": "1.0.0",
+        "espree": "3.5.4",
+        "esquery": "1.0.0",
+        "esutils": "2.0.2",
+        "file-entry-cache": "2.0.0",
+        "functional-red-black-tree": "1.0.1",
+        "glob": "7.1.2",
+        "globals": "11.3.0",
+        "ignore": "3.3.7",
+        "imurmurhash": "0.1.4",
+        "inquirer": "3.3.0",
+        "is-resolvable": "1.1.0",
+        "js-yaml": "3.11.0",
+        "json-stable-stringify-without-jsonify": "1.0.1",
+        "levn": "0.3.0",
+        "lodash": "4.17.4",
+        "minimatch": "3.0.4",
+        "mkdirp": "0.5.1",
+        "natural-compare": "1.4.0",
+        "optionator": "0.8.2",
+        "path-is-inside": "1.0.2",
+        "pluralize": "7.0.0",
+        "progress": "2.0.0",
+        "regexpp": "1.0.1",
+        "require-uncached": "1.0.3",
+        "semver": "5.4.1",
+        "strip-ansi": "4.0.0",
+        "strip-json-comments": "2.0.1",
+        "table": "4.0.2",
+        "text-table": "0.2.0"
+      },
+      "dependencies": {
+        "ansi-regex": {
+          "version": "3.0.0",
+          "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-3.0.0.tgz",
+          "integrity": "sha1-7QMXwyIGT3lGbAKWa922Bas32Zg=",
+          "dev": true
+        },
+        "ansi-styles": {
+          "version": "3.2.1",
+          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-3.2.1.tgz",
+          "integrity": "sha512-VT0ZI6kZRdTh8YyJw3SMbYm/u+NqfsAxEpWO0Pf9sq8/e94WxxOpPKx9FR1FlyCtOVDNOQ+8ntlqFxiRc+r5qA==",
+          "dev": true,
+          "requires": {
+            "color-convert": "1.9.1"
+          }
+        },
+        "chalk": {
+          "version": "2.3.2",
+          "resolved": "https://registry.npmjs.org/chalk/-/chalk-2.3.2.tgz",
+          "integrity": "sha512-ZM4j2/ld/YZDc3Ma8PgN7gyAk+kHMMMyzLNryCPGhWrsfAuDVeuid5bpRFTDgMH9JBK2lA4dyyAkkZYF/WcqDQ==",
+          "dev": true,
+          "requires": {
+            "ansi-styles": "3.2.1",
+            "escape-string-regexp": "1.0.5",
+            "supports-color": "5.3.0"
+          }
+        },
+        "debug": {
+          "version": "3.1.0",
+          "resolved": "https://registry.npmjs.org/debug/-/debug-3.1.0.tgz",
+          "integrity": "sha512-OX8XqP7/1a9cqkxYw2yXss15f26NKWBpDXQd0/uK/KPqdQhxbPa994hnzjcE2VqQpDslf55723cKPUOGSmMY3g==",
+          "dev": true,
+          "requires": {
+            "ms": "2.0.0"
+          }
+        },
+        "esprima": {
+          "version": "4.0.0",
+          "resolved": "https://registry.npmjs.org/esprima/-/esprima-4.0.0.tgz",
+          "integrity": "sha512-oftTcaMu/EGrEIu904mWteKIv8vMuOgGYo7EhVJJN00R/EED9DCua/xxHRdYnKtcECzVg7xOWhflvJMnqcFZjw==",
+          "dev": true
+        },
+        "globals": {
+          "version": "11.3.0",
+          "resolved": "https://registry.npmjs.org/globals/-/globals-11.3.0.tgz",
+          "integrity": "sha512-kkpcKNlmQan9Z5ZmgqKH/SMbSmjxQ7QjyNqfXVc8VJcoBV2UEg+sxQD15GQofGRh2hfpwUb70VC31DR7Rq5Hdw==",
+          "dev": true
+        },
+        "has-flag": {
+          "version": "3.0.0",
+          "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-3.0.0.tgz",
+          "integrity": "sha1-tdRU3CGZriJWmfNGfloH87lVuv0=",
+          "dev": true
+        },
+        "js-yaml": {
+          "version": "3.11.0",
+          "resolved": "https://registry.npmjs.org/js-yaml/-/js-yaml-3.11.0.tgz",
+          "integrity": "sha512-saJstZWv7oNeOyBh3+Dx1qWzhW0+e6/8eDzo7p5rDFqxntSztloLtuKu+Ejhtq82jsilwOIZYsCz+lIjthg1Hw==",
+          "dev": true,
+          "requires": {
+            "argparse": "1.0.9",
+            "esprima": "4.0.0"
+          }
+        },
+        "progress": {
+          "version": "2.0.0",
+          "resolved": "https://registry.npmjs.org/progress/-/progress-2.0.0.tgz",
+          "integrity": "sha1-ihvjZr+Pwj2yvSPxDG/pILQ4nR8=",
+          "dev": true
+        },
+        "strip-ansi": {
+          "version": "4.0.0",
+          "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-4.0.0.tgz",
+          "integrity": "sha1-qEeQIusaw2iocTibY1JixQXuNo8=",
+          "dev": true,
+          "requires": {
+            "ansi-regex": "3.0.0"
+          }
+        },
+        "supports-color": {
+          "version": "5.3.0",
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-5.3.0.tgz",
+          "integrity": "sha512-0aP01LLIskjKs3lq52EC0aGBAJhLq7B2Rd8HC/DR/PtNNpcLilNmHC12O+hu0usQpo7wtHNRqtrhBwtDb0+dNg==",
+          "dev": true,
+          "requires": {
+            "has-flag": "3.0.0"
+          }
+        }
+      }
+    },
+    "eslint-loader": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/eslint-loader/-/eslint-loader-2.0.0.tgz",
+      "integrity": "sha512-VxxGDI4bXzLk0+/jMt/0EkGMRKS9ox6Czx+yapMb9WJmcS/ZHhlhqcVUNgUjFBNp02j/2pZLdGOrG7EXyjoz/g==",
+      "dev": true,
+      "requires": {
+        "loader-fs-cache": "1.0.1",
+        "loader-utils": "1.1.0",
+        "object-assign": "4.1.1",
+        "object-hash": "1.3.0",
+        "rimraf": "2.6.2"
+      },
+      "dependencies": {
+        "loader-utils": {
+          "version": "1.1.0",
+          "resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-1.1.0.tgz",
+          "integrity": "sha1-yYrvSIvM7aL/teLeZG1qdUQp9c0=",
+          "dev": true,
+          "requires": {
+            "big.js": "3.2.0",
+            "emojis-list": "2.1.0",
+            "json5": "0.5.1"
+          }
+        }
+      }
+    },
+    "eslint-plugin-vue": {
+      "version": "4.4.0",
+      "resolved": "https://registry.npmjs.org/eslint-plugin-vue/-/eslint-plugin-vue-4.4.0.tgz",
+      "integrity": "sha512-UHeE0aTEv9A/9xe8J6X7rDLMbwV6GuQFKAscMyLEv49Y4wK4KwQiifr2X0MsNsVlmccrDUyjI9KO4DuFTkPP9A==",
+      "dev": true,
+      "requires": {
+        "vue-eslint-parser": "2.0.3"
+      }
+    },
+    "eslint-scope": {
+      "version": "3.7.1",
+      "resolved": "https://registry.npmjs.org/eslint-scope/-/eslint-scope-3.7.1.tgz",
+      "integrity": "sha1-PWPD7f2gLgbgGkUq2IyqzHzctug=",
+      "dev": true,
+      "requires": {
+        "esrecurse": "4.2.0",
+        "estraverse": "4.2.0"
+      }
+    },
+    "eslint-visitor-keys": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/eslint-visitor-keys/-/eslint-visitor-keys-1.0.0.tgz",
+      "integrity": "sha512-qzm/XxIbxm/FHyH341ZrbnMUpe+5Bocte9xkmFMzPMjRaZMcXww+MpBptFvtU+79L362nqiLhekCxCxDPaUMBQ==",
+      "dev": true
+    },
+    "espree": {
+      "version": "3.5.4",
+      "resolved": "https://registry.npmjs.org/espree/-/espree-3.5.4.tgz",
+      "integrity": "sha512-yAcIQxtmMiB/jL32dzEp2enBeidsB7xWPLNiw3IIkpVds1P+h7qF9YwJq1yUNzp2OKXgAprs4F61ih66UsoD1A==",
+      "dev": true,
+      "requires": {
+        "acorn": "5.5.3",
+        "acorn-jsx": "3.0.1"
+      },
+      "dependencies": {
+        "acorn": {
+          "version": "5.5.3",
+          "resolved": "https://registry.npmjs.org/acorn/-/acorn-5.5.3.tgz",
+          "integrity": "sha512-jd5MkIUlbbmb07nXH0DT3y7rDVtkzDi4XZOUVWAer8ajmF/DTSSbl5oNFyDOl/OXA33Bl79+ypHhl2pN20VeOQ==",
+          "dev": true
+        }
+      }
+    },
     "esprima": {
       "version": "2.7.3",
       "resolved": "https://registry.npmjs.org/esprima/-/esprima-2.7.3.tgz",
       "integrity": "sha1-luO3DVd59q1JzQMmc9HDEnZ7pYE=",
       "dev": true
     },
+    "esquery": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/esquery/-/esquery-1.0.0.tgz",
+      "integrity": "sha1-z7qLV9f7qT8XKYqKAGoEzaE9gPo=",
+      "dev": true,
+      "requires": {
+        "estraverse": "4.2.0"
+      }
+    },
     "esrecurse": {
       "version": "4.2.0",
       "resolved": "https://registry.npmjs.org/esrecurse/-/esrecurse-4.2.0.tgz",
@@ -3171,6 +3455,28 @@
         "is-extendable": "0.1.1"
       }
     },
+    "external-editor": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/external-editor/-/external-editor-2.1.0.tgz",
+      "integrity": "sha512-E44iT5QVOUJBKij4IIV3uvxuNlbKS38Tw1HiupxEIHPv9qtC2PrDYohbXV5U+1jnfIXttny8gUhj+oZvflFlzA==",
+      "dev": true,
+      "requires": {
+        "chardet": "0.4.2",
+        "iconv-lite": "0.4.19",
+        "tmp": "0.0.33"
+      },
+      "dependencies": {
+        "tmp": {
+          "version": "0.0.33",
+          "resolved": "https://registry.npmjs.org/tmp/-/tmp-0.0.33.tgz",
+          "integrity": "sha512-jRCJlojKnZ3addtTOjdIqoRuPEKBvNXcGYqzO6zWZX8KfKEpnGY5jfggJQ3EjKuu8D4bJRr0y+cYJFmYbImXGw==",
+          "dev": true,
+          "requires": {
+            "os-tmpdir": "1.0.2"
+          }
+        }
+      }
+    },
     "extglob": {
       "version": "0.3.2",
       "resolved": "https://registry.npmjs.org/extglob/-/extglob-0.3.2.tgz",
@@ -3229,6 +3535,12 @@
       "integrity": "sha1-1RQsDK7msRifh9OnYREGT4bIu/I=",
       "dev": true
     },
+    "fast-levenshtein": {
+      "version": "2.0.6",
+      "resolved": "https://registry.npmjs.org/fast-levenshtein/-/fast-levenshtein-2.0.6.tgz",
+      "integrity": "sha1-PYpcZog6FqMMqGQ+hR8Zuqd5eRc=",
+      "dev": true
+    },
     "fastparse": {
       "version": "1.1.1",
       "resolved": "https://registry.npmjs.org/fastparse/-/fastparse-1.1.1.tgz",
@@ -3263,6 +3575,16 @@
         "object-assign": "4.1.1"
       }
     },
+    "file-entry-cache": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/file-entry-cache/-/file-entry-cache-2.0.0.tgz",
+      "integrity": "sha1-w5KZDD5oR4PYOLjISkXYoEhFg2E=",
+      "dev": true,
+      "requires": {
+        "flat-cache": "1.3.0",
+        "object-assign": "4.1.1"
+      }
+    },
     "file-loader": {
       "version": "0.9.0",
       "resolved": "https://registry.npmjs.org/file-loader/-/file-loader-0.9.0.tgz",
@@ -3326,6 +3648,49 @@
         "pinkie-promise": "2.0.1"
       }
     },
+    "flat-cache": {
+      "version": "1.3.0",
+      "resolved": "https://registry.npmjs.org/flat-cache/-/flat-cache-1.3.0.tgz",
+      "integrity": "sha1-0wMLMrOBVPTjt+nHCfSQ9++XxIE=",
+      "dev": true,
+      "requires": {
+        "circular-json": "0.3.3",
+        "del": "2.2.2",
+        "graceful-fs": "4.1.11",
+        "write": "0.2.1"
+      },
+      "dependencies": {
+        "del": {
+          "version": "2.2.2",
+          "resolved": "https://registry.npmjs.org/del/-/del-2.2.2.tgz",
+          "integrity": "sha1-wSyYHQZ4RshLyvhiz/kw2Qf/0ag=",
+          "dev": true,
+          "requires": {
+            "globby": "5.0.0",
+            "is-path-cwd": "1.0.0",
+            "is-path-in-cwd": "1.0.0",
+            "object-assign": "4.1.1",
+            "pify": "2.3.0",
+            "pinkie-promise": "2.0.1",
+            "rimraf": "2.6.2"
+          }
+        },
+        "globby": {
+          "version": "5.0.0",
+          "resolved": "https://registry.npmjs.org/globby/-/globby-5.0.0.tgz",
+          "integrity": "sha1-69hGZ8oNuzMLmbz8aOrCvFQ3Dg0=",
+          "dev": true,
+          "requires": {
+            "array-union": "1.0.2",
+            "arrify": "1.0.1",
+            "glob": "7.1.2",
+            "object-assign": "4.1.1",
+            "pify": "2.3.0",
+            "pinkie-promise": "2.0.1"
+          }
+        }
+      }
+    },
     "flatten": {
       "version": "1.0.2",
       "resolved": "https://registry.npmjs.org/flatten/-/flatten-1.0.2.tgz",
@@ -4343,6 +4708,12 @@
       "integrity": "sha512-yIovAzMX49sF8Yl58fSCWJ5svSLuaibPxXQJFLmBObTuCr0Mf1KiPopGM9NiFjiYBCbfaa2Fh6breQ6ANVTI0A==",
       "dev": true
     },
+    "functional-red-black-tree": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/functional-red-black-tree/-/functional-red-black-tree-1.0.1.tgz",
+      "integrity": "sha1-GwqzvVU7Kg1jmdKcDj6gslIHgyc=",
+      "dev": true
+    },
     "gauge": {
       "version": "2.7.4",
       "resolved": "https://registry.npmjs.org/gauge/-/gauge-2.7.4.tgz",
@@ -4840,6 +5211,12 @@
       "integrity": "sha1-vjPUCsEO8ZJnAfbwii2G+/0a0+Q=",
       "dev": true
     },
+    "ignore": {
+      "version": "3.3.7",
+      "resolved": "https://registry.npmjs.org/ignore/-/ignore-3.3.7.tgz",
+      "integrity": "sha512-YGG3ejvBNHRqu0559EOxxNFihD0AjpvHlC/pdGKd3X3ofe+CoJkYazwNJYTNebqpPKN+VVQbh4ZFn1DivMNuHA==",
+      "dev": true
+    },
     "import-local": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/import-local/-/import-local-1.0.0.tgz",
@@ -4870,6 +5247,12 @@
         }
       }
     },
+    "imurmurhash": {
+      "version": "0.1.4",
+      "resolved": "https://registry.npmjs.org/imurmurhash/-/imurmurhash-0.1.4.tgz",
+      "integrity": "sha1-khi5srkoojixPcT7a21XbyMUU+o=",
+      "dev": true
+    },
     "in-publish": {
       "version": "2.0.0",
       "resolved": "https://registry.npmjs.org/in-publish/-/in-publish-2.0.0.tgz",
@@ -4915,6 +5298,139 @@
       "integrity": "sha512-RZY5huIKCMRWDUqZlEi72f/lmXKMvuszcMBduliQ3nnWbx9X/ZBQO7DijMEYS9EhHBb2qacRUMtC7svLwe0lcw==",
       "dev": true
     },
+    "inquirer": {
+      "version": "3.3.0",
+      "resolved": "https://registry.npmjs.org/inquirer/-/inquirer-3.3.0.tgz",
+      "integrity": "sha512-h+xtnyk4EwKvFWHrUYsWErEVR+igKtLdchu+o0Z1RL7VU/jVMFbYir2bp6bAj8efFNxWqHX0dIss6fJQ+/+qeQ==",
+      "dev": true,
+      "requires": {
+        "ansi-escapes": "3.0.0",
+        "chalk": "2.3.2",
+        "cli-cursor": "2.1.0",
+        "cli-width": "2.2.0",
+        "external-editor": "2.1.0",
+        "figures": "2.0.0",
+        "lodash": "4.17.4",
+        "mute-stream": "0.0.7",
+        "run-async": "2.3.0",
+        "rx-lite": "4.0.8",
+        "rx-lite-aggregates": "4.0.8",
+        "string-width": "2.1.1",
+        "strip-ansi": "4.0.0",
+        "through": "2.3.8"
+      },
+      "dependencies": {
+        "ansi-escapes": {
+          "version": "3.0.0",
+          "resolved": "https://registry.npmjs.org/ansi-escapes/-/ansi-escapes-3.0.0.tgz",
+          "integrity": "sha512-O/klc27mWNUigtv0F8NJWbLF00OcegQalkqKURWdosW08YZKi4m6CnSUSvIZG1otNJbTWhN01Hhz389DW7mvDQ==",
+          "dev": true
+        },
+        "ansi-regex": {
+          "version": "3.0.0",
+          "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-3.0.0.tgz",
+          "integrity": "sha1-7QMXwyIGT3lGbAKWa922Bas32Zg=",
+          "dev": true
+        },
+        "ansi-styles": {
+          "version": "3.2.1",
+          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-3.2.1.tgz",
+          "integrity": "sha512-VT0ZI6kZRdTh8YyJw3SMbYm/u+NqfsAxEpWO0Pf9sq8/e94WxxOpPKx9FR1FlyCtOVDNOQ+8ntlqFxiRc+r5qA==",
+          "dev": true,
+          "requires": {
+            "color-convert": "1.9.1"
+          }
+        },
+        "chalk": {
+          "version": "2.3.2",
+          "resolved": "https://registry.npmjs.org/chalk/-/chalk-2.3.2.tgz",
+          "integrity": "sha512-ZM4j2/ld/YZDc3Ma8PgN7gyAk+kHMMMyzLNryCPGhWrsfAuDVeuid5bpRFTDgMH9JBK2lA4dyyAkkZYF/WcqDQ==",
+          "dev": true,
+          "requires": {
+            "ansi-styles": "3.2.1",
+            "escape-string-regexp": "1.0.5",
+            "supports-color": "5.3.0"
+          }
+        },
+        "cli-cursor": {
+          "version": "2.1.0",
+          "resolved": "https://registry.npmjs.org/cli-cursor/-/cli-cursor-2.1.0.tgz",
+          "integrity": "sha1-s12sN2R5+sw+lHR9QdDQ9SOP/LU=",
+          "dev": true,
+          "requires": {
+            "restore-cursor": "2.0.0"
+          }
+        },
+        "figures": {
+          "version": "2.0.0",
+          "resolved": "https://registry.npmjs.org/figures/-/figures-2.0.0.tgz",
+          "integrity": "sha1-OrGi0qYsi/tDGgyUy3l6L84nyWI=",
+          "dev": true,
+          "requires": {
+            "escape-string-regexp": "1.0.5"
+          }
+        },
+        "has-flag": {
+          "version": "3.0.0",
+          "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-3.0.0.tgz",
+          "integrity": "sha1-tdRU3CGZriJWmfNGfloH87lVuv0=",
+          "dev": true
+        },
+        "is-fullwidth-code-point": {
+          "version": "2.0.0",
+          "resolved": "https://registry.npmjs.org/is-fullwidth-code-point/-/is-fullwidth-code-point-2.0.0.tgz",
+          "integrity": "sha1-o7MKXE8ZkYMWeqq5O+764937ZU8=",
+          "dev": true
+        },
+        "onetime": {
+          "version": "2.0.1",
+          "resolved": "https://registry.npmjs.org/onetime/-/onetime-2.0.1.tgz",
+          "integrity": "sha1-BnQoIw/WdEOyeUsiu6UotoZ5YtQ=",
+          "dev": true,
+          "requires": {
+            "mimic-fn": "1.1.0"
+          }
+        },
+        "restore-cursor": {
+          "version": "2.0.0",
+          "resolved": "https://registry.npmjs.org/restore-cursor/-/restore-cursor-2.0.0.tgz",
+          "integrity": "sha1-n37ih/gv0ybU/RYpI9YhKe7g368=",
+          "dev": true,
+          "requires": {
+            "onetime": "2.0.1",
+            "signal-exit": "3.0.2"
+          }
+        },
+        "string-width": {
+          "version": "2.1.1",
+          "resolved": "https://registry.npmjs.org/string-width/-/string-width-2.1.1.tgz",
+          "integrity": "sha512-nOqH59deCq9SRHlxq1Aw85Jnt4w6KvLKqWVik6oA9ZklXLNIOlqg4F2yrT1MVaTjAqvVwdfeZ7w7aCvJD7ugkw==",
+          "dev": true,
+          "requires": {
+            "is-fullwidth-code-point": "2.0.0",
+            "strip-ansi": "4.0.0"
+          }
+        },
+        "strip-ansi": {
+          "version": "4.0.0",
+          "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-4.0.0.tgz",
+          "integrity": "sha1-qEeQIusaw2iocTibY1JixQXuNo8=",
+          "dev": true,
+          "requires": {
+            "ansi-regex": "3.0.0"
+          }
+        },
+        "supports-color": {
+          "version": "5.3.0",
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-5.3.0.tgz",
+          "integrity": "sha512-0aP01LLIskjKs3lq52EC0aGBAJhLq7B2Rd8HC/DR/PtNNpcLilNmHC12O+hu0usQpo7wtHNRqtrhBwtDb0+dNg==",
+          "dev": true,
+          "requires": {
+            "has-flag": "3.0.0"
+          }
+        }
+      }
+    },
     "internal-ip": {
       "version": "1.2.0",
       "resolved": "https://registry.npmjs.org/internal-ip/-/internal-ip-1.2.0.tgz",
@@ -5253,6 +5769,12 @@
         "has": "1.0.1"
       }
     },
+    "is-resolvable": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/is-resolvable/-/is-resolvable-1.1.0.tgz",
+      "integrity": "sha512-qgDYXFSR5WvEfuS5dMj6oTMEbrrSaM0CrFk2Yiq/gXnBvD9pMa2jGXxyhGLfvhZpuMZe18CJpFxAt3CRs42NMg==",
+      "dev": true
+    },
     "is-stream": {
       "version": "1.1.0",
       "resolved": "https://registry.npmjs.org/is-stream/-/is-stream-1.1.0.tgz",
@@ -5379,6 +5901,12 @@
         "jsonify": "0.0.0"
       }
     },
+    "json-stable-stringify-without-jsonify": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/json-stable-stringify-without-jsonify/-/json-stable-stringify-without-jsonify-1.0.1.tgz",
+      "integrity": "sha1-nbe1lJatPzz+8wp1FC0tkwrXJlE=",
+      "dev": true
+    },
     "json-stringify-safe": {
       "version": "5.0.1",
       "resolved": "https://registry.npmjs.org/json-stringify-safe/-/json-stringify-safe-5.0.1.tgz",
@@ -5467,6 +5995,16 @@
         "invert-kv": "1.0.0"
       }
     },
+    "levn": {
+      "version": "0.3.0",
+      "resolved": "https://registry.npmjs.org/levn/-/levn-0.3.0.tgz",
+      "integrity": "sha1-OwmSTt+fCDwEkP3UwLxEIeBHZO4=",
+      "dev": true,
+      "requires": {
+        "prelude-ls": "1.1.2",
+        "type-check": "0.3.2"
+      }
+    },
     "listr": {
       "version": "0.12.0",
       "resolved": "https://registry.npmjs.org/listr/-/listr-0.12.0.tgz",
@@ -5545,6 +6083,38 @@
         "strip-bom": "2.0.0"
       }
     },
+    "loader-fs-cache": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/loader-fs-cache/-/loader-fs-cache-1.0.1.tgz",
+      "integrity": "sha1-VuC/CL2XCLJqdltoUJhAyN7J/bw=",
+      "dev": true,
+      "requires": {
+        "find-cache-dir": "0.1.1",
+        "mkdirp": "0.5.1"
+      },
+      "dependencies": {
+        "find-cache-dir": {
+          "version": "0.1.1",
+          "resolved": "https://registry.npmjs.org/find-cache-dir/-/find-cache-dir-0.1.1.tgz",
+          "integrity": "sha1-yN765XyKUqinhPnjHFfHQumToLk=",
+          "dev": true,
+          "requires": {
+            "commondir": "1.0.1",
+            "mkdirp": "0.5.1",
+            "pkg-dir": "1.0.0"
+          }
+        },
+        "pkg-dir": {
+          "version": "1.0.0",
+          "resolved": "https://registry.npmjs.org/pkg-dir/-/pkg-dir-1.0.0.tgz",
+          "integrity": "sha1-ektQio1bstYp1EcFb/TpyTFM89Q=",
+          "dev": true,
+          "requires": {
+            "find-up": "1.1.2"
+          }
+        }
+      }
+    },
     "loader-runner": {
       "version": "2.3.0",
       "resolved": "https://registry.npmjs.org/loader-runner/-/loader-runner-2.3.0.tgz",
@@ -6014,6 +6584,12 @@
       "integrity": "sha1-iZ8R2WhuXgXLkbNdXw5jt3PPyQE=",
       "dev": true
     },
+    "mute-stream": {
+      "version": "0.0.7",
+      "resolved": "https://registry.npmjs.org/mute-stream/-/mute-stream-0.0.7.tgz",
+      "integrity": "sha1-MHXOk7whuPq0PhvE2n6BFe0ee6s=",
+      "dev": true
+    },
     "nan": {
       "version": "2.8.0",
       "resolved": "https://registry.npmjs.org/nan/-/nan-2.8.0.tgz",
@@ -6058,6 +6634,12 @@
         }
       }
     },
+    "natural-compare": {
+      "version": "1.4.0",
+      "resolved": "https://registry.npmjs.org/natural-compare/-/natural-compare-1.4.0.tgz",
+      "integrity": "sha1-Sr6/7tdUHywnrPspvbvRXI1bpPc=",
+      "dev": true
+    },
     "negotiator": {
       "version": "0.6.1",
       "resolved": "https://registry.npmjs.org/negotiator/-/negotiator-0.6.1.tgz",
@@ -6311,6 +6893,12 @@
         }
       }
     },
+    "object-hash": {
+      "version": "1.3.0",
+      "resolved": "https://registry.npmjs.org/object-hash/-/object-hash-1.3.0.tgz",
+      "integrity": "sha512-05KzQ70lSeGSrZJQXE5wNDiTkBJDlUT/myi6RX9dVIvz7a7Qh4oH93BQdiPMn27nldYvVQCKMUaM83AfizZlsQ==",
+      "dev": true
+    },
     "object-keys": {
       "version": "1.0.11",
       "resolved": "https://registry.npmjs.org/object-keys/-/object-keys-1.0.11.tgz",
@@ -6405,6 +6993,28 @@
         "is-wsl": "1.1.0"
       }
     },
+    "optionator": {
+      "version": "0.8.2",
+      "resolved": "https://registry.npmjs.org/optionator/-/optionator-0.8.2.tgz",
+      "integrity": "sha1-NkxeQJ0/TWMB1sC0wFu6UBgK62Q=",
+      "dev": true,
+      "requires": {
+        "deep-is": "0.1.3",
+        "fast-levenshtein": "2.0.6",
+        "levn": "0.3.0",
+        "prelude-ls": "1.1.2",
+        "type-check": "0.3.2",
+        "wordwrap": "1.0.0"
+      },
+      "dependencies": {
+        "wordwrap": {
+          "version": "1.0.0",
+          "resolved": "https://registry.npmjs.org/wordwrap/-/wordwrap-1.0.0.tgz",
+          "integrity": "sha1-J1hIEIkUVqQXHI0CJkQa3pDLyus=",
+          "dev": true
+        }
+      }
+    },
     "ora": {
       "version": "0.2.3",
       "resolved": "https://registry.npmjs.org/ora/-/ora-0.2.3.tgz",
@@ -6680,6 +7290,12 @@
         }
       }
     },
+    "pluralize": {
+      "version": "7.0.0",
+      "resolved": "https://registry.npmjs.org/pluralize/-/pluralize-7.0.0.tgz",
+      "integrity": "sha512-ARhBOdzS3e41FbkW/XWrTEtukqqLoK5+Z/4UeDaLuSW+39JPeFgs4gCGqsrJHVZX0fUrx//4OF0K1CUGwlIFow==",
+      "dev": true
+    },
     "portfinder": {
       "version": "1.0.13",
       "resolved": "https://registry.npmjs.org/portfinder/-/portfinder-1.0.13.tgz",
@@ -7441,6 +8057,12 @@
         "uniqs": "2.0.0"
       }
     },
+    "prelude-ls": {
+      "version": "1.1.2",
+      "resolved": "https://registry.npmjs.org/prelude-ls/-/prelude-ls-1.1.2.tgz",
+      "integrity": "sha1-IZMqVJ9eUv/ZqCf1cOBL5iqX2lQ=",
+      "dev": true
+    },
     "prepend-http": {
       "version": "1.0.4",
       "resolved": "https://registry.npmjs.org/prepend-http/-/prepend-http-1.0.4.tgz",
@@ -7784,6 +8406,12 @@
         "extend-shallow": "2.0.1"
       }
     },
+    "regexpp": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/regexpp/-/regexpp-1.0.1.tgz",
+      "integrity": "sha512-8Ph721maXiOYSLtaDGKVmDn5wdsNaF6Px85qFNeMPQq0r8K5Y10tgP6YuR65Ws35n4DvzFcCxEnRNBIXQunzLw==",
+      "dev": true
+    },
     "regexpu-core": {
       "version": "2.0.0",
       "resolved": "https://registry.npmjs.org/regexpu-core/-/regexpu-core-2.0.0.tgz",
@@ -7903,6 +8531,24 @@
       "resolved": "https://registry.npmjs.org/require-main-filename/-/require-main-filename-1.0.1.tgz",
       "integrity": "sha1-l/cXtp1IeE9fUmpsWqj/3aBVpNE="
     },
+    "require-uncached": {
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/require-uncached/-/require-uncached-1.0.3.tgz",
+      "integrity": "sha1-Tg1W1slmL9MeQwEcS5WqSZVUIdM=",
+      "dev": true,
+      "requires": {
+        "caller-path": "0.1.0",
+        "resolve-from": "1.0.1"
+      },
+      "dependencies": {
+        "resolve-from": {
+          "version": "1.0.1",
+          "resolved": "https://registry.npmjs.org/resolve-from/-/resolve-from-1.0.1.tgz",
+          "integrity": "sha1-Jsv+k10a7uq7Kbw/5a6wHpPUQiY=",
+          "dev": true
+        }
+      }
+    },
     "requires-port": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/requires-port/-/requires-port-1.0.0.tgz",
@@ -7976,6 +8622,30 @@
         "inherits": "2.0.3"
       }
     },
+    "run-async": {
+      "version": "2.3.0",
+      "resolved": "https://registry.npmjs.org/run-async/-/run-async-2.3.0.tgz",
+      "integrity": "sha1-A3GrSuC91yDUFm19/aZP96RFpsA=",
+      "dev": true,
+      "requires": {
+        "is-promise": "2.1.0"
+      }
+    },
+    "rx-lite": {
+      "version": "4.0.8",
+      "resolved": "https://registry.npmjs.org/rx-lite/-/rx-lite-4.0.8.tgz",
+      "integrity": "sha1-Cx4Rr4vESDbwSmQH6S2kJGe3lEQ=",
+      "dev": true
+    },
+    "rx-lite-aggregates": {
+      "version": "4.0.8",
+      "resolved": "https://registry.npmjs.org/rx-lite-aggregates/-/rx-lite-aggregates-4.0.8.tgz",
+      "integrity": "sha1-dTuHqJoRyVRnxKwWJsTvxOBcZ74=",
+      "dev": true,
+      "requires": {
+        "rx-lite": "4.0.8"
+      }
+    },
     "rxjs": {
       "version": "5.5.6",
       "resolved": "https://registry.npmjs.org/rxjs/-/rxjs-5.5.6.tgz",
@@ -8835,6 +9505,12 @@
         "get-stdin": "4.0.1"
       }
     },
+    "strip-json-comments": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/strip-json-comments/-/strip-json-comments-2.0.1.tgz",
+      "integrity": "sha1-PFMZQukIwml8DsNEhYwobHygpgo=",
+      "dev": true
+    },
     "style-loader": {
       "version": "0.19.1",
       "resolved": "https://registry.npmjs.org/style-loader/-/style-loader-0.19.1.tgz",
@@ -8884,6 +9560,97 @@
       "integrity": "sha1-g0D8RwLDEi310iKI+IKD9RPT/dQ=",
       "dev": true
     },
+    "table": {
+      "version": "4.0.2",
+      "resolved": "https://registry.npmjs.org/table/-/table-4.0.2.tgz",
+      "integrity": "sha512-UUkEAPdSGxtRpiV9ozJ5cMTtYiqz7Ni1OGqLXRCynrvzdtR1p+cfOWe2RJLwvUG8hNanaSRjecIqwOjqeatDsA==",
+      "dev": true,
+      "requires": {
+        "ajv": "5.5.2",
+        "ajv-keywords": "2.1.1",
+        "chalk": "2.3.2",
+        "lodash": "4.17.4",
+        "slice-ansi": "1.0.0",
+        "string-width": "2.1.1"
+      },
+      "dependencies": {
+        "ansi-regex": {
+          "version": "3.0.0",
+          "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-3.0.0.tgz",
+          "integrity": "sha1-7QMXwyIGT3lGbAKWa922Bas32Zg=",
+          "dev": true
+        },
+        "ansi-styles": {
+          "version": "3.2.1",
+          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-3.2.1.tgz",
+          "integrity": "sha512-VT0ZI6kZRdTh8YyJw3SMbYm/u+NqfsAxEpWO0Pf9sq8/e94WxxOpPKx9FR1FlyCtOVDNOQ+8ntlqFxiRc+r5qA==",
+          "dev": true,
+          "requires": {
+            "color-convert": "1.9.1"
+          }
+        },
+        "chalk": {
+          "version": "2.3.2",
+          "resolved": "https://registry.npmjs.org/chalk/-/chalk-2.3.2.tgz",
+          "integrity": "sha512-ZM4j2/ld/YZDc3Ma8PgN7gyAk+kHMMMyzLNryCPGhWrsfAuDVeuid5bpRFTDgMH9JBK2lA4dyyAkkZYF/WcqDQ==",
+          "dev": true,
+          "requires": {
+            "ansi-styles": "3.2.1",
+            "escape-string-regexp": "1.0.5",
+            "supports-color": "5.3.0"
+          }
+        },
+        "has-flag": {
+          "version": "3.0.0",
+          "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-3.0.0.tgz",
+          "integrity": "sha1-tdRU3CGZriJWmfNGfloH87lVuv0=",
+          "dev": true
+        },
+        "is-fullwidth-code-point": {
+          "version": "2.0.0",
+          "resolved": "https://registry.npmjs.org/is-fullwidth-code-point/-/is-fullwidth-code-point-2.0.0.tgz",
+          "integrity": "sha1-o7MKXE8ZkYMWeqq5O+764937ZU8=",
+          "dev": true
+        },
+        "slice-ansi": {
+          "version": "1.0.0",
+          "resolved": "https://registry.npmjs.org/slice-ansi/-/slice-ansi-1.0.0.tgz",
+          "integrity": "sha512-POqxBK6Lb3q6s047D/XsDVNPnF9Dl8JSaqe9h9lURl0OdNqy/ujDrOiIHtsqXMGbWWTIomRzAMaTyawAU//Reg==",
+          "dev": true,
+          "requires": {
+            "is-fullwidth-code-point": "2.0.0"
+          }
+        },
+        "string-width": {
+          "version": "2.1.1",
+          "resolved": "https://registry.npmjs.org/string-width/-/string-width-2.1.1.tgz",
+          "integrity": "sha512-nOqH59deCq9SRHlxq1Aw85Jnt4w6KvLKqWVik6oA9ZklXLNIOlqg4F2yrT1MVaTjAqvVwdfeZ7w7aCvJD7ugkw==",
+          "dev": true,
+          "requires": {
+            "is-fullwidth-code-point": "2.0.0",
+            "strip-ansi": "4.0.0"
+          }
+        },
+        "strip-ansi": {
+          "version": "4.0.0",
+          "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-4.0.0.tgz",
+          "integrity": "sha1-qEeQIusaw2iocTibY1JixQXuNo8=",
+          "dev": true,
+          "requires": {
+            "ansi-regex": "3.0.0"
+          }
+        },
+        "supports-color": {
+          "version": "5.3.0",
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-5.3.0.tgz",
+          "integrity": "sha512-0aP01LLIskjKs3lq52EC0aGBAJhLq7B2Rd8HC/DR/PtNNpcLilNmHC12O+hu0usQpo7wtHNRqtrhBwtDb0+dNg==",
+          "dev": true,
+          "requires": {
+            "has-flag": "3.0.0"
+          }
+        }
+      }
+    },
     "tapable": {
       "version": "0.2.8",
       "resolved": "https://registry.npmjs.org/tapable/-/tapable-0.2.8.tgz",
@@ -8900,6 +9667,12 @@
         "inherits": "2.0.3"
       }
     },
+    "text-table": {
+      "version": "0.2.0",
+      "resolved": "https://registry.npmjs.org/text-table/-/text-table-0.2.0.tgz",
+      "integrity": "sha1-f17oI66AUgfACvLfSoTsP8+lcLQ=",
+      "dev": true
+    },
     "throttle-debounce": {
       "version": "1.0.1",
       "resolved": "https://registry.npmjs.org/throttle-debounce/-/throttle-debounce-1.0.1.tgz",
@@ -8912,6 +9685,12 @@
       "integrity": "sha1-z+34jmDADdlpe2H90qg0OptoDq8=",
       "dev": true
     },
+    "through": {
+      "version": "2.3.8",
+      "resolved": "https://registry.npmjs.org/through/-/through-2.3.8.tgz",
+      "integrity": "sha1-DdTJ/6q8NXlgsbckEV1+Doai4fU=",
+      "dev": true
+    },
     "thunky": {
       "version": "0.1.0",
       "resolved": "https://registry.npmjs.org/thunky/-/thunky-0.1.0.tgz",
@@ -9128,6 +9907,15 @@
       "integrity": "sha1-WuaBd/GS1EViadEIr6k/+HQ/T2Q=",
       "optional": true
     },
+    "type-check": {
+      "version": "0.3.2",
+      "resolved": "https://registry.npmjs.org/type-check/-/type-check-0.3.2.tgz",
+      "integrity": "sha1-WITKtRLPHTVeP7eE8wgEsrUg23I=",
+      "dev": true,
+      "requires": {
+        "prelude-ls": "1.1.2"
+      }
+    },
     "type-is": {
       "version": "1.6.15",
       "resolved": "https://registry.npmjs.org/type-is/-/type-is-1.6.15.tgz",
@@ -9537,6 +10325,31 @@
         }
       }
     },
+    "vue-eslint-parser": {
+      "version": "2.0.3",
+      "resolved": "https://registry.npmjs.org/vue-eslint-parser/-/vue-eslint-parser-2.0.3.tgz",
+      "integrity": "sha512-ZezcU71Owm84xVF6gfurBQUGg8WQ+WZGxgDEQu1IHFBZNx7BFZg3L1yHxrCBNNwbwFtE1GuvfJKMtb6Xuwc/Bw==",
+      "dev": true,
+      "requires": {
+        "debug": "3.1.0",
+        "eslint-scope": "3.7.1",
+        "eslint-visitor-keys": "1.0.0",
+        "espree": "3.5.4",
+        "esquery": "1.0.0",
+        "lodash": "4.17.4"
+      },
+      "dependencies": {
+        "debug": {
+          "version": "3.1.0",
+          "resolved": "https://registry.npmjs.org/debug/-/debug-3.1.0.tgz",
+          "integrity": "sha512-OX8XqP7/1a9cqkxYw2yXss15f26NKWBpDXQd0/uK/KPqdQhxbPa994hnzjcE2VqQpDslf55723cKPUOGSmMY3g==",
+          "dev": true,
+          "requires": {
+            "ms": "2.0.0"
+          }
+        }
+      }
+    },
     "vue-hot-reload-api": {
       "version": "2.2.4",
       "resolved": "https://registry.npmjs.org/vue-hot-reload-api/-/vue-hot-reload-api-2.2.4.tgz",
@@ -10389,6 +11202,15 @@
       "resolved": "https://registry.npmjs.org/wrappy/-/wrappy-1.0.2.tgz",
       "integrity": "sha1-tSQ9jz7BqjXxNkYFvA0QNuMKtp8="
     },
+    "write": {
+      "version": "0.2.1",
+      "resolved": "https://registry.npmjs.org/write/-/write-0.2.1.tgz",
+      "integrity": "sha1-X8A4KOJkzqP+kUVUdvejxWbLB1c=",
+      "dev": true,
+      "requires": {
+        "mkdirp": "0.5.1"
+      }
+    },
     "xtend": {
       "version": "4.0.1",
       "resolved": "https://registry.npmjs.org/xtend/-/xtend-4.0.1.tgz",
diff --git a/package.json b/package.json
index 1159144f1..753a33d6a 100644
--- a/package.json
+++ b/package.json
@@ -31,6 +31,9 @@
     "css-loader": "^0.25.0",
     "cypress": "^2.1.0",
     "element-theme-chalk": "^2.1.0",
+    "eslint": "^4.19.1",
+    "eslint-loader": "^2.0.0",
+    "eslint-plugin-vue": "^4.4.0",
     "file-loader": "^0.9.0",
     "postcss-loader": "^2.1.0",
     "sass-resources-loader": "^1.3.2",
diff --git a/src/admin/components/edition/category-edition-form.vue b/src/admin/components/edition/category-edition-form.vue
index 2713d79f0..b9b008912 100644
--- a/src/admin/components/edition/category-edition-form.vue
+++ b/src/admin/components/edition/category-edition-form.vue
@@ -118,7 +118,9 @@
                 <p class="help is-danger">{{formErrorMessage}}</p>
             </form>
 
-            <b-loading :active.sync="isLoading" :canCancel="false"></b-loading>
+            <b-loading 
+                    :active.sync="isLoading" 
+                    :canCancel="false"></b-loading>
         </div>
     </div>
 </template>
@@ -224,7 +226,6 @@
                     status: 'private',
                     allowInsert: this.form.allowInsert
                 };
-
                 console.log(data);
 
                 this.updateCategory(data)
diff --git a/src/admin/components/edition/collection-edition-form.vue b/src/admin/components/edition/collection-edition-form.vue
index 7cec4d1c6..55c1ef80b 100644
--- a/src/admin/components/edition/collection-edition-form.vue
+++ b/src/admin/components/edition/collection-edition-form.vue
@@ -128,7 +128,7 @@
                         class="button is-success">{{ $i18n.get('save') }}</button>
                 </div>
             </div>
-            <p class="help is-danger">{{formErrorMessage}}</p>
+            <p class="help is-danger">{{formErrorMessage}}</p> 
         </form>
 
         <b-loading :active.sync="isLoading" :canCancel="false"></b-loading>
@@ -280,7 +280,7 @@ export default {
         deleteThumbnail() {
 
             this.updateThumbnail({collectionId: this.collectionId, thumbnailId: 0})
-            .then((res) => {
+            .then(() => {
                 this.collection.featured_image = false;
             })
             .catch((error) => {
diff --git a/src/admin/components/edition/field-edition-form.vue b/src/admin/components/edition/field-edition-form.vue
index c39fcdc34..51331f2e3 100644
--- a/src/admin/components/edition/field-edition-form.vue
+++ b/src/admin/components/edition/field-edition-form.vue
@@ -188,7 +188,7 @@ export default {
             if ((field.field_type_object && field.field_type_object.form_component) || field.edit_form == '') {
                 
                 this.updateField({collectionId: this.collectionId, fieldId: field.id, isRepositoryLevel: this.isRepositoryLevel, index: this.index, options: this.editForm})
-                    .then((field) => {
+                    .then(() => {
                         this.editForm = {};
                         this.formErrors = {};
                         this.formErrorMessage = '';
@@ -215,7 +215,7 @@ export default {
                     formObj[key] = value;
                 
                 this.updateField({collectionId: this.collectionId, fieldId: field.id, isRepositoryLevel: this.isRepositoryLevel, index: this.index, options: formObj})
-                    .then((field) => {
+                    .then(() => {
                         this.editForm = {};
                         this.formErrors = {};
                         this.formErrorMessage = '';
diff --git a/src/admin/components/edition/filter-edition-form.vue b/src/admin/components/edition/filter-edition-form.vue
index cbb823501..0a9480382 100644
--- a/src/admin/components/edition/filter-edition-form.vue
+++ b/src/admin/components/edition/filter-edition-form.vue
@@ -130,7 +130,7 @@ export default {
             if ((filter.filter_type_object && filter.filter_type_object.form_component) || filter.edit_form == '') {
                 
                 this.updateFilter({ filterId: filter.id, index: this.index, options: this.editForm})
-                    .then((filter) => {
+                    .then(() => {
                         this.editForm = {};
                         this.formErrors = {};
                         this.formErrorMessage = '';
@@ -157,7 +157,7 @@ export default {
                     formObj[key] = value;
                 
                 this.updateFilter({ filterId: filter.id, index: this.index, options: formObj})
-                    .then((filter) => {
+                    .then(() => {
                         this.editForm = {};
                         this.formErrors = {};
                         this.formErrorMessage = '';
diff --git a/src/admin/components/edition/item-edition-form.vue b/src/admin/components/edition/item-edition-form.vue
index 1f0ab493d..eedde9a30 100644
--- a/src/admin/components/edition/item-edition-form.vue
+++ b/src/admin/components/edition/item-edition-form.vue
@@ -195,7 +195,7 @@ export default {
 
                 this.$router.push(this.$routerHelper.getItemPath(this.form.collectionId, this.itemId));
             }).catch(error => {
-                
+                console.log(error);
                 this.isLoading = false;
             });
         },
@@ -234,7 +234,7 @@ export default {
         },
         loadMetadata() { 
             // Obtains Item Field
-            this.fetchFields(this.itemId).then(res => {
+            this.fetchFields(this.itemId).then(() => {
                 this.isLoading = false;
             });
         }, 
@@ -245,7 +245,7 @@ export default {
             
             for (let file of $event) {
                 this.sendAttachment({ item_id: this.itemId, file: file })
-                .then((res) => {
+                .then(() => {
                     
                 })
                 .catch((error) => {
@@ -273,7 +273,7 @@ export default {
         },
         deleteThumbnail() {
             this.updateThumbnail({itemId: this.itemId, thumbnailId: 0})
-            .then((res) => {
+            .then(() => {
                 this.item.featured_image = false;
             })
             .catch((error) => {
@@ -281,7 +281,7 @@ export default {
             });    
         },
         deleteFile(index) {
-
+            console.log("Delete:" + index);
         }
     },
     computed: {
diff --git a/src/admin/components/lists/categories-list.vue b/src/admin/components/lists/categories-list.vue
index aaa42edb1..e08ed9c9b 100644
--- a/src/admin/components/lists/categories-list.vue
+++ b/src/admin/components/lists/categories-list.vue
@@ -14,7 +14,6 @@
                 v-if="totalCategories > 0"
                 ref="categoryTable"
                 :data="categories"
-                @selection-change="handleSelectionChange"
                 :checked-rows.sync="selectedCategories"
                 checkable
                 :loading="isLoading"
@@ -150,7 +149,7 @@
 
                         for (let category of this.selectedCategories) {
                             this.deleteCategory(category.id)
-                                .then((res) => {
+                                .then(() => {
                                     this.loadCategories();
                                     this.$toast.open({
                                         duration: 3000,
@@ -159,7 +158,7 @@
                                         type: 'is-secondary',
                                         queue: false
                                     })
-                                }).catch((err) => {
+                                }).catch(() => {
                                 this.$toast.open({
                                     duration: 3000,
                                     message: this.$i18n.get('info_error_deleting_category'),
@@ -173,8 +172,6 @@
                     }
                 });
             },
-            handleSelectionChange(value) {
-            },
             goToCategoryPage(categoryId) {
                 this.$router.push(this.$routerHelper.getCategoryPath(categoryId));
             },
diff --git a/src/admin/components/lists/collections-list.vue b/src/admin/components/lists/collections-list.vue
index c8acab76f..426cee228 100644
--- a/src/admin/components/lists/collections-list.vue
+++ b/src/admin/components/lists/collections-list.vue
@@ -6,7 +6,6 @@
         <b-table
                 ref="collectionTable"
                 :data="collections"
-                @selection-change="handleSelectionChange"
                 :checked-rows.sync="selectedCollections"
                 checkable
                 :loading="isLoading"
@@ -70,7 +69,7 @@
 </template>
 
 <script>
-import { mapActions, mapGetters } from 'vuex'
+import { mapActions } from 'vuex'
 
 export default {
     name: 'CollectionsList',
@@ -126,7 +125,7 @@ export default {
 
                     for (let collection of this.selectedCollections) {
                         this.deleteCollection(collection.id)
-                        .then((res) => {
+                        .then(() => {
                             this.loadCollections();
                             this.$toast.open({
                                 duration: 3000,
@@ -135,7 +134,7 @@ export default {
                                 type: 'is-secondary',
                                 queue: false
                             })                            
-                        }).catch((err) => { 
+                        }).catch(() => { 
                             this.$toast.open({
                                 duration: 3000,
                                 message: this.$i18n.get('info_error_deleting_collection'),
@@ -149,8 +148,6 @@ export default {
                 }
             });
         },
-        handleSelectionChange(value) {
-        },
         goToCollectionPage(collectionId) {
             this.$router.push(this.$routerHelper.getCollectionPath(collectionId));
         },
diff --git a/src/admin/components/lists/fields-list.vue b/src/admin/components/lists/fields-list.vue
index c308f7d03..d5409ef7a 100644
--- a/src/admin/components/lists/fields-list.vue
+++ b/src/admin/components/lists/fields-list.vue
@@ -220,7 +220,7 @@ export default {
                 if (!this.isRepositoryLevel)
                     this.updateFieldsOrder(); 
             })
-            .catch((error) => {
+            .catch(() => {
             });
         },
         editField(field) {
@@ -270,10 +270,10 @@ export default {
         this.isLoadingFields = true;
 
         this.fetchFieldTypes()
-            .then((res) => {
+            .then(() => {
                 this.isLoadingFieldTypes = false;
             })
-            .catch((error) => {
+            .catch(() => {
                 this.isLoadingFieldTypes = false;
             });
 
@@ -285,10 +285,10 @@ export default {
         
 
         this.fetchFields({collectionId: this.collectionId, isRepositoryLevel: this.isRepositoryLevel})
-            .then((res) => {
+            .then(() => {
                 this.isLoadingFields = false;
             })
-            .catch((error) => {
+            .catch(() => {
                 this.isLoadingFields = false;
             });
     }
diff --git a/src/admin/components/lists/filters-items-list.vue b/src/admin/components/lists/filters-items-list.vue
index f3f04d47f..42f083913 100644
--- a/src/admin/components/lists/filters-items-list.vue
+++ b/src/admin/components/lists/filters-items-list.vue
@@ -9,7 +9,6 @@
 </template>
 <script>
     import { mapActions, mapGetters } from 'vuex';
-    import { eventFilterBus } from '../../../js/event-bus-filters'
 
     export default {
         data(){
diff --git a/src/admin/components/lists/filters-list.vue b/src/admin/components/lists/filters-list.vue
index 346ecd3cb..232fc161a 100644
--- a/src/admin/components/lists/filters-list.vue
+++ b/src/admin/components/lists/filters-list.vue
@@ -280,17 +280,15 @@ export default {
                     this.activeFilterList.splice(index, 1);
                     this.isLoadingFieldTypes = true;
                     this.fetchFields({collectionId: this.collectionId, isRepositoryLevel: this.isRepositoryLevel})
-                    .then((res) => {
+                    .then(() => {
                         this.isLoadingFieldTypes = false;
                     })
-                    .catch((error) => {
+                    .catch(() => {
                         this.isLoadingFieldTypes = false;
                     });
                 
                 if (!this.isRepositoryLevel)
                     this.updateFiltersOrder(); 
-            })
-            .catch((error) => {
             });
         },
         confirmSelectedFilterType() {
@@ -379,26 +377,26 @@ export default {
         this.isLoadingFilterTypes = true;
 
         this.fetchFilterTypes()
-            .then((res) => {
+            .then(() => {
                 this.isLoadingFilterTypes = false;
             })
-            .catch((error) => {
+            .catch(() => {
                 this.isLoadingFilterTypes = false;
             });        
 
         this.fetchFilters({collectionId: this.collectionId, isRepositoryLevel: this.isRepositoryLevel})
-            .then((res) => {
+            .then(() => {
                 this.isLoadingFilters = false;
                 // Needs to be done after activeFilterList exists to compare and remove chosen fields.
                 this.fetchFields({collectionId: this.collectionId, isRepositoryLevel: this.isRepositoryLevel})
-                    .then((res) => {
+                    .then(() => {
                         this.isLoadingFieldTypes = false;
                     })
-                    .catch((error) => {
+                    .catch(() => {
                         this.isLoadingFieldTypes = false;
                     });
             })
-            .catch((error) => {
+            .catch(() => {
                 this.isLoadingFilters = false;
             });
     }
diff --git a/src/admin/components/lists/items-list.vue b/src/admin/components/lists/items-list.vue
index 401a02878..73f3b655f 100644
--- a/src/admin/components/lists/items-list.vue
+++ b/src/admin/components/lists/items-list.vue
@@ -65,7 +65,7 @@
 </template>
 
 <script>
-import { mapActions, mapGetters } from 'vuex';
+import { mapActions } from 'vuex';
 
 export default {
     name: 'ItemsList',
@@ -92,7 +92,7 @@ export default {
             this.$dialog.confirm({
                 message: this.$i18n.get('info_warning_item_delete'),
                 onConfirm: () => {
-                    this.deleteItem(itemId).then((res) => {
+                    this.deleteItem(itemId).then(() => {
                         this.loadItems();
                         this.$toast.open({
                             duration: 3000,
@@ -105,7 +105,7 @@ export default {
                             if (this.selectedItems[i].id == this.itemId)
                                 this.selectedItems.splice(i, 1);
                         }
-                    }).catch(( error ) => {
+                    }).catch(() => {
 
                         this.$toast.open({ 
                             duration: 3000,
@@ -125,7 +125,7 @@ export default {
 
                     for (let item of this.selectedItems) {
                         this.deleteItem(item.id)
-                        .then((res) => {
+                        .then(() => {
                             this.loadItems();
                             this.$toast.open({
                                 duration: 3000,
@@ -135,7 +135,7 @@ export default {
                                 queue: false
                             });
                                                       
-                        }).catch((err) => { 
+                        }).catch(() => { 
                             this.$toast.open({
                                 duration: 3000,
                                 message: this.$i18n.get('info_error_deleting_item'),
diff --git a/src/admin/components/navigation/primary-menu.vue b/src/admin/components/navigation/primary-menu.vue
index 3621a436c..b28e0ef09 100644
--- a/src/admin/components/navigation/primary-menu.vue
+++ b/src/admin/components/navigation/primary-menu.vue
@@ -58,7 +58,7 @@ export default {
         }
     },
     watch: {
-        '$route' (to, from) {
+        '$route' (to) {
             this.isCompressed = (to.params.collectionId != undefined);
             this.activeRoute = to.name;
         }
diff --git a/src/admin/components/navigation/secondary-menu.vue b/src/admin/components/navigation/secondary-menu.vue
index 44a2e6e2a..c3b02f0e1 100644
--- a/src/admin/components/navigation/secondary-menu.vue
+++ b/src/admin/components/navigation/secondary-menu.vue
@@ -69,7 +69,7 @@ export default {
         id: Number
     },
     watch: {
-        '$route' (to, from) {
+        '$route' (to) {
             this.activeRoute = to.name;
         }
     },
diff --git a/src/admin/components/navigation/tainacan-header.vue b/src/admin/components/navigation/tainacan-header.vue
index e9e7e8878..15f5f22a5 100644
--- a/src/admin/components/navigation/tainacan-header.vue
+++ b/src/admin/components/navigation/tainacan-header.vue
@@ -93,7 +93,7 @@ export default {
         }
     },
     watch: {
-        '$route' (to, from) {
+        '$route' (to) {
             this.onSecondaryPage = (to.params.collectionId != undefined);
             this.pageTitle = this.$route.meta.title;
             this.currentIcon = this.$route.meta.icon;
diff --git a/src/admin/components/other/help-button.vue b/src/admin/components/other/help-button.vue
index 2bed50e68..a831185fb 100644
--- a/src/admin/components/other/help-button.vue
+++ b/src/admin/components/other/help-button.vue
@@ -56,7 +56,7 @@ export default {
         border-radius: 10px;
         margin: 0px 0px 0px -37px;
         position: absolute;
-        z-index: 99999999999999;
+        z-index: 999999999999999;
         bottom: 100%;
         left: 0%;
         min-width: 250px;
diff --git a/src/admin/pages/lists/categories-page.vue b/src/admin/pages/lists/categories-page.vue
index ea1c631ae..75f787a04 100644
--- a/src/admin/pages/lists/categories-page.vue
+++ b/src/admin/pages/lists/categories-page.vue
@@ -103,7 +103,7 @@
                         this.isLoading = false;
                         this.totalCategories = res.total;
                     })
-                    .catch((error) => {
+                    .catch(() => {
                         this.isLoading = false;
                     });
             },
@@ -126,7 +126,7 @@
                 .then((value) => {
                     this.categoriesPerPage = value;
                 })
-                .catch((error) => {
+                .catch(() => {
                     this.$userPrefs.set('categories_per_page', 12, null);
                 });
         },
diff --git a/src/admin/pages/lists/collections-page.vue b/src/admin/pages/lists/collections-page.vue
index 729f0c41d..031308a02 100644
--- a/src/admin/pages/lists/collections-page.vue
+++ b/src/admin/pages/lists/collections-page.vue
@@ -103,7 +103,7 @@ export default {
                 this.isLoading = false;
                 this.totalCollections = res.total;
             }) 
-            .catch((error) => {
+            .catch(() => {
                 this.isLoading = false;
             });
         },
@@ -126,7 +126,7 @@ export default {
             .then((value) => {
                 this.collectionsPerPage = value;
             })
-            .catch((error) => {
+            .catch(() => {
                 this.$userPrefs.set('collections_per_page', 12, null);
             }); 
     },
diff --git a/src/admin/pages/lists/items-page.vue b/src/admin/pages/lists/items-page.vue
index ea6dacfa2..8e0cae4e1 100644
--- a/src/admin/pages/lists/items-page.vue
+++ b/src/admin/pages/lists/items-page.vue
@@ -135,7 +135,7 @@ export default {
             'search_by_collection'
         ]),
         onChangeTableFields(field) {
-            let prevValue = this.prefTableFields;
+           // let prevValue = this.prefTableFields;
             let index = this.prefTableFields.findIndex(alteredField => alteredField.slug === field.slug);
             if (index >= 0) {
                 //prevValue[index].visible = this.prefTableFields[index].visible ? false : true;
@@ -187,11 +187,10 @@ export default {
                 this.alterQueryString();
             }
 
-
-            promisse.then((res) => {
+            promisse.then(() => {
                 this.isLoading = false;
             })
-            .catch((error) => {
+            .catch(() => {
                 this.isLoading = false;
             });
         },
@@ -233,7 +232,7 @@ export default {
         .then((value) => {
             this.itemsPerPage = value;
         })
-        .catch((error) => {
+        .catch(() => {
             this.$userPrefs.set('items_per_page', 12, null);
         });     
     },
@@ -307,11 +306,12 @@ export default {
             background-color: $primary-lighter;
             margin-left: -$page-small-side-padding;
             padding: $page-small-side-padding;
-
+            
             .label {
+                font-size: 12px;
                 font-weight: normal;
-                font-size: 0.85em;
             }
+            
         }
 
         .table-container {
diff --git a/src/admin/pages/singles/item-page.vue b/src/admin/pages/singles/item-page.vue
index 96af9c654..24683c6bd 100644
--- a/src/admin/pages/singles/item-page.vue
+++ b/src/admin/pages/singles/item-page.vue
@@ -70,7 +70,7 @@ export default {
         let loadingInstance = this;
 
         // Obtains Item 
-        this.fetchItem(this.itemId).then(res => {
+        this.fetchItem(this.itemId).then(() => {
             loadingInstance.isLoading = false;
         });
     }
diff --git a/src/classes/field-types/category/AddNewTerm.vue b/src/classes/field-types/category/AddNewTerm.vue
index 7539ae8fd..9c30e9ebf 100644
--- a/src/classes/field-types/category/AddNewTerm.vue
+++ b/src/classes/field-types/category/AddNewTerm.vue
@@ -22,7 +22,7 @@
                                 v-model="parent">
                             <option :value="0" selected> ---{{ $i18n.get('label_parent_term') }}--- </option>
                             <option
-                                    v-for="option,index in options"
+                                    v-for="(option,index) in options"
                                     :key="index"
                                     :value="option.term_id"
                                     v-html="setSpaces( option.level ) + option.name"></option>
@@ -97,7 +97,7 @@
                             if( !Array.isArray( val ) && this.field.field.multiple === 'no' ){
                                 axios.patch(`/item/${this.item_id}/metadata/${this.field_id}`, {
                                     values: term_id,
-                                }).then( res => {
+                                }).then(() => {
                                     instance.$emit('newTerm', term_id);
                                 })
                             } else {
diff --git a/src/classes/field-types/category/CategoryCheckbox.vue b/src/classes/field-types/category/CategoryCheckbox.vue
index fda2e17ab..215674544 100644
--- a/src/classes/field-types/category/CategoryCheckbox.vue
+++ b/src/classes/field-types/category/CategoryCheckbox.vue
@@ -1,6 +1,8 @@
 <template>
     <div>
-        <div v-for="option,index in options">
+        <div   
+                v-for="(option, index) in options"
+                :key="index">
             <b-checkbox
                     :id="id"
                     :style="{ paddingLeft: (option.level * 30)  + 'px' }"
diff --git a/src/classes/field-types/category/CategoryRadio.vue b/src/classes/field-types/category/CategoryRadio.vue
index 676cd8d30..c6421e210 100644
--- a/src/classes/field-types/category/CategoryRadio.vue
+++ b/src/classes/field-types/category/CategoryRadio.vue
@@ -1,6 +1,8 @@
 <template>
     <div>
-        <div v-for="option,index in options">
+        <div 
+                v-for="(option, index) in options"
+                :key="index">
             <b-radio
                     :id="id"
                     :style="{ paddingLeft: (option.level * 30)  + 'px' }"
diff --git a/src/classes/field-types/category/CategorySelectbox.vue b/src/classes/field-types/category/CategorySelectbox.vue
index a17b28470..5fc70dff4 100644
--- a/src/classes/field-types/category/CategorySelectbox.vue
+++ b/src/classes/field-types/category/CategorySelectbox.vue
@@ -7,7 +7,7 @@
                     @input="emitChange()"
                     :placeholder="$i18n.get('label_select_category')" expanded>
                 <option
-                        v-for="option,index in options"
+                        v-for="(option, index) in options"
                         :key="index"
                         :value="option.term_id"
                         v-html="setSpaces( option.level ) + option.name"></option>
diff --git a/src/classes/field-types/category/FormCategory.vue b/src/classes/field-types/category/FormCategory.vue
index 76cd8e8af..f0788f8d6 100644
--- a/src/classes/field-types/category/FormCategory.vue
+++ b/src/classes/field-types/category/FormCategory.vue
@@ -45,7 +45,7 @@
                     @input="emitValues()"
                     v-model="input_type">
                 <option
-                        v-for="option,index in single_types"
+                        v-for="(option, index) in single_types"
                         :value="index"
                         :key="index">
                     {{ option }}
@@ -60,7 +60,7 @@
                     v-else>
 
                 <option
-                        v-for="option,index in multiple_types"
+                        v-for="(option, index) in multiple_types"
                         :value="index"
                         :key="index">
                     {{ option }}
@@ -102,7 +102,7 @@
             errors: [ String, Object, Array ]
         },
         created(){
-            this.fetchTaxonomies().then( res => {
+            this.fetchTaxonomies().then(() => {
                 if ( this.value ) {
                     this.taxonomy_id = this.value.taxonomy_id;
                 }
@@ -124,12 +124,12 @@
                 if( this.field && this.field.multiple === 'no' ){
                     let types = Object.keys( this.single_types );
                     let hasValue = this.value && this.value.input_type && types.indexOf( this.value.input_type ) >= 0;
-                    this.input_type =  ( hasValue ) ? this.value.input_type : 'tainacan-category-radio';
+                    this.input_type = ( hasValue ) ? this.value.input_type : 'tainacan-category-radio';
                     return true;
                 } else {
                     let types = Object.keys( this.multiple_types );
                     let hasValue = this.value && this.value.input_type && types.indexOf( this.value.input_type ) >= 0;
-                    this.input_type =  ( hasValue ) ? this.value.input_type : 'tainacan-category-checkbox';
+                    this.input_type = ( hasValue ) ? this.value.input_type : 'tainacan-category-checkbox';
                     return false;
                 }
             },
diff --git a/src/classes/field-types/relationship/FormRelationship.vue b/src/classes/field-types/relationship/FormRelationship.vue
index cab58fbb9..0ae557389 100644
--- a/src/classes/field-types/relationship/FormRelationship.vue
+++ b/src/classes/field-types/relationship/FormRelationship.vue
@@ -45,7 +45,8 @@
                 </label>
                 <div class="block">
                     <div
-                        v-for="option in fields"
+                        v-for="(option, index) in fields"
+                        :key="index"
                         class="field">
                         <b-checkbox
                                 name="field_type_relationship[search][]"
@@ -82,7 +83,6 @@
 
 <script>
     import { tainacan as axios } from '../../../js/axios/axios';
-    import Vue from 'vue';
 
     export default {
         props: {
@@ -125,7 +125,7 @@
             }
         },
         created(){
-           this.fetchCollections().then( data => {
+           this.fetchCollections().then(() => {
                if( this.collection_id && this.collection_id !== '' ){
                    this.collection = this.collection_id;
                } else if ( this.value ) {
@@ -165,7 +165,6 @@
                     })
                     .catch(error => {
                         console.log(error);
-                        reject(error);
                     });
             },
             fetchFieldsFromCollection( value ){
@@ -198,7 +197,7 @@
                             })
                         }
                     })
-                    .catch((error) => {
+                    .catch(() => {
                         this.hasFields = false;
                     });
 
diff --git a/src/classes/field-types/selectbox/Selectbox.vue b/src/classes/field-types/selectbox/Selectbox.vue
index adefadf78..6fa00c162 100644
--- a/src/classes/field-types/selectbox/Selectbox.vue
+++ b/src/classes/field-types/selectbox/Selectbox.vue
@@ -5,7 +5,7 @@
             v-model="selected" 
             @input="onChecked()">
             <option
-                    v-for="option,index in getOptions"
+                    v-for="(option, index) in getOptions"
                     :key="index"
                     :label="option"
                     :value="option"
diff --git a/src/classes/field-types/tainacan-form-item.vue b/src/classes/field-types/tainacan-form-item.vue
index fed1c28a8..907040a57 100644
--- a/src/classes/field-types/tainacan-form-item.vue
+++ b/src/classes/field-types/tainacan-form-item.vue
@@ -1,29 +1,29 @@
 <template>
-        <b-field
-            :addons="false" 
-            :label="field.field.name"
-            :message="getErrorMessage"
-            :type="fieldTypeMessage">
-            <help-button 
-                :title="field.field.name" 
-                :message="field.field.description">
-            </help-button>
-            <div v-if="isTextInputComponent( field.field.field_type_object.component )">
-                <component :id="field.field.field_type_object.component + '-' + field.field.slug" :is="field.field.field_type_object.component" v-model="inputs[0]" :field="field" @blur="changeValue()"></component>
-                <div v-if="field.field.multiple == 'yes'">
-                    <div v-if="index > 0" v-for="(input, index) in inputsList " v-bind:key="index" class="multiple-inputs">
-                        <component :id="field.field.field_type_object.component + '-' + field.field.slug" :is="field.field.field_type_object.component" v-model="inputs[index]" :field="field" @blur="changeValue()"></component><a class="button" v-if="index > 0" @click="removeInput(index)">-</a>
-                    </div>
-                    <a class="button" @click="addInput">+</a>
+    <b-field
+        :addons="false"
+        :label="field.field.name"
+        :message="getErrorMessage"
+        :type="fieldTypeMessage">
+        <help-button 
+            :title="field.field.name" 
+            :message="field.field.description">
+        </help-button>
+        <div v-if="isTextInputComponent( field.field.field_type_object.component )">
+            <component :id="field.field.field_type_object.component + '-' + field.field.slug" :is="field.field.field_type_object.component" v-model="inputs[0]" :field="field" @blur="changeValue()"></component>
+            <div v-if="field.field.multiple == 'yes'">
+                <div v-if="index > 0" v-for="(input, index) in inputsList " v-bind:key="index" class="multiple-inputs">
+                    <component :id="field.field.field_type_object.component + '-' + field.field.slug" :is="field.field.field_type_object.component" v-model="inputs[index]" :field="field" @blur="changeValue()"></component><a class="button" v-if="index > 0" @click="removeInput(index)">-</a>
                 </div>
+                <a class="button" @click="addInput">+</a>
             </div>
-            <div v-else>
-                <component
-                        :id="field.field.field_type_object.component + '-' + field.field.slug"
-                        :is="field.field.field_type_object.component" v-model="inputs"
-                        :field="field" @blur="changeValue()"></component>
-            </div>
-        </b-field>
+        </div>
+        <div v-else>
+            <component
+                    :id="field.field.field_type_object.component + '-' + field.field.slug"
+                    :is="field.field.field_type_object.component" v-model="inputs"
+                    :field="field" @blur="changeValue()"></component>
+        </div>
+    </b-field>
 </template>
 
 <script>
diff --git a/src/classes/field-types/text/Text.vue b/src/classes/field-types/text/Text.vue
index 3d768d41a..c1a6b0851 100644
--- a/src/classes/field-types/text/Text.vue
+++ b/src/classes/field-types/text/Text.vue
@@ -33,9 +33,6 @@
                 this.inputValue = $event;
                 this.$emit('input', this.inputValue);
             }
-        },
-        created(){
-            this.inputValue = this.value;
         }
     }
 </script>
\ No newline at end of file
diff --git a/src/classes/field-types/textarea/Textarea.vue b/src/classes/field-types/textarea/Textarea.vue
index ab1d97b16..0df6c15c3 100644
--- a/src/classes/field-types/textarea/Textarea.vue
+++ b/src/classes/field-types/textarea/Textarea.vue
@@ -34,9 +34,6 @@
                 this.inputValue = $event;
                 this.$emit('input', this.inputValue);
             }
-        },
-        created(){
-            this.inputValue = this.value;
         }
     }
 </script>
diff --git a/src/classes/filter-types/checkbox/Checkbox.vue b/src/classes/filter-types/checkbox/Checkbox.vue
index 24a8f4ae9..0189a8142 100644
--- a/src/classes/filter-types/checkbox/Checkbox.vue
+++ b/src/classes/filter-types/checkbox/Checkbox.vue
@@ -1,7 +1,7 @@
 <template>
     <div class="block">
         <div
-                v-for="option,index in options"
+                v-for="(option, index) in options"
                 :key="index"
                 class="field">
             <b-checkbox
@@ -53,11 +53,11 @@
             }
         },
         methods: {
-            loadOptions(){
+            loadOptions(){deleteFile
                 let promise = null;
                 this.isLoading = true;
 
-                if ( this.type === 'Tainacan\Field_types\Relationship' ) {
+                if ( this.type === 'Tainacan\\Field_types\\Relationship' ) {
 
                     let collectionTarget = ( this.filter && this.filter.field.field_type_options.collection_id ) ?
                         this.filter.field.field_type_options.collection_id : this.collection_id;
@@ -67,7 +67,7 @@
                     promise = this.getValuesPlainText( this.field );
                 }
 
-                promise.then( data => {
+                promise.then(() => {
                     this.isLoading = false;
                     this.selectedValues()
                 })
diff --git a/src/classes/filter-types/selectbox/Selectbox.vue b/src/classes/filter-types/selectbox/Selectbox.vue
index ca8839f1b..26fdcc104 100644
--- a/src/classes/filter-types/selectbox/Selectbox.vue
+++ b/src/classes/filter-types/selectbox/Selectbox.vue
@@ -8,7 +8,7 @@
                 expanded>
             <option value="">{{ $i18n.get('label_selectbox_init') }}...</option>
             <option
-                    v-for="option,index in options"
+                    v-for="(option, index) in options"
                     :key="index"
                     :label="option.label"
                     :value="option.value"
@@ -66,7 +66,7 @@
                     promise = this.getValuesPlainText( this.field );
                 }
 
-                promise.then( data => {
+                promise.then(() => {
                     this.isLoading = false;
                     instance.selectedValues();
                 })
diff --git a/src/classes/filter-types/taginput/Taginput.vue b/src/classes/filter-types/taginput/Taginput.vue
index a10497d39..f9d5b7f43 100644
--- a/src/classes/filter-types/taginput/Taginput.vue
+++ b/src/classes/filter-types/taginput/Taginput.vue
@@ -81,7 +81,7 @@
                     promise = this.getValuesPlainText( this.field, query );
                 }
 
-                promise.then( data => {
+                promise.then(() => {
                     this.isLoading = false;
                 }).catch( error => {
                     console.log('error select', error );
diff --git a/src/classes/filter-types/tainacan-filters-list.vue b/src/classes/filter-types/tainacan-filters-list.vue
index c544a7640..bf0d02df0 100644
--- a/src/classes/filter-types/tainacan-filters-list.vue
+++ b/src/classes/filter-types/tainacan-filters-list.vue
@@ -15,7 +15,6 @@
 
 <script>
     import { eventFilterBus } from '../../js/event-bus-filters'
-    import qs from 'qs';
     import { mapActions, mapGetters } from 'vuex';
     import router from '../../admin/js/router'
 
diff --git a/webpack.config.js b/webpack.config.js
index a77c0d29a..3912b926b 100644
--- a/webpack.config.js
+++ b/webpack.config.js
@@ -14,6 +14,12 @@ module.exports = {
     devtool: 'eval-source-map',
     module: {
         rules: [
+            {
+                enforce: "pre",
+                test: /\.vue$/,
+                exclude: /node_modules/,
+                loader: "eslint-loader"
+            },
             {
                 test: /\.vue$/,
                 loader: 'vue-loader',

From 62fb4456eda24769cee2a4b796bfe2d31b316b62 Mon Sep 17 00:00:00 2001
From: Eduardo humberto <eduardo.humberto1992@gmail.com>
Date: Fri, 23 Mar 2018 11:12:59 -0300
Subject: [PATCH 03/16] adapt field types and filter types for linter

---
 .../field-types/category/AddNewTerm.vue       |  2 +-
 .../field-types/category/CategoryCheckbox.vue |  2 +-
 .../field-types/category/CategoryRadio.vue    |  2 +-
 .../field-types/category/CategoryTaginput.vue |  2 +-
 .../field-types/category/FormCategory.vue     | 19 ++++++++++++-------
 .../relationship/FormRelationship.vue         | 11 +++++++----
 .../field-types/relationship/Relationship.vue |  9 ++-------
 .../field-types/selectbox/FormSelectbox.vue   | 11 +++++++----
 .../field-types/tainacan-form-item.vue        |  7 +++++--
 .../autocomplete/Autocomplete.vue             |  3 ++-
 .../filter-types/checkbox/Checkbox.vue        |  2 +-
 .../filter-types/tainacan-filters-list.vue    |  7 +++++--
 12 files changed, 45 insertions(+), 32 deletions(-)

diff --git a/src/classes/field-types/category/AddNewTerm.vue b/src/classes/field-types/category/AddNewTerm.vue
index 9c30e9ebf..0c47ac694 100644
--- a/src/classes/field-types/category/AddNewTerm.vue
+++ b/src/classes/field-types/category/AddNewTerm.vue
@@ -105,7 +105,7 @@
                                 val.push( term_id );
                                 axios.patch(`/item/${this.item_id}/metadata/${this.field_id}`, {
                                     values: val,
-                                }).then( res => {
+                                }).then( () => {
                                     instance.$emit('newTerm', val);
                                 })
                             }
diff --git a/src/classes/field-types/category/CategoryCheckbox.vue b/src/classes/field-types/category/CategoryCheckbox.vue
index 215674544..6d6cab197 100644
--- a/src/classes/field-types/category/CategoryCheckbox.vue
+++ b/src/classes/field-types/category/CategoryCheckbox.vue
@@ -42,7 +42,7 @@
             value: [ Number, String, Array ]
         },
         methods: {
-            onChecked(option) {
+            onChecked() {
                 this.$emit('blur');
                 this.onInput(this.checked)
             },
diff --git a/src/classes/field-types/category/CategoryRadio.vue b/src/classes/field-types/category/CategoryRadio.vue
index c6421e210..ecdf6ea04 100644
--- a/src/classes/field-types/category/CategoryRadio.vue
+++ b/src/classes/field-types/category/CategoryRadio.vue
@@ -38,7 +38,7 @@
             value: [ Number, String, Array ]
         },
         methods: {
-            onChecked(option) {
+            onChecked() {
                 this.$emit('blur');
                 this.onInput(this.checked)
             },
diff --git a/src/classes/field-types/category/CategoryTaginput.vue b/src/classes/field-types/category/CategoryTaginput.vue
index 2e061d554..96c2daf0a 100644
--- a/src/classes/field-types/category/CategoryTaginput.vue
+++ b/src/classes/field-types/category/CategoryTaginput.vue
@@ -23,7 +23,7 @@
             }
         },
         watch: {
-            terms( val ){
+            terms(){
                 this.selectedValues();
             }
         },
diff --git a/src/classes/field-types/category/FormCategory.vue b/src/classes/field-types/category/FormCategory.vue
index f0788f8d6..3d6ee889f 100644
--- a/src/classes/field-types/category/FormCategory.vue
+++ b/src/classes/field-types/category/FormCategory.vue
@@ -124,23 +124,22 @@
                 if( this.field && this.field.multiple === 'no' ){
                     let types = Object.keys( this.single_types );
                     let hasValue = this.value && this.value.input_type && types.indexOf( this.value.input_type ) >= 0;
-                    this.input_type = ( hasValue ) ? this.value.input_type : 'tainacan-category-radio';
+                    this.setInputType( ( hasValue ) ? this.value.input_type : 'tainacan-category-radio' );
                     return true;
                 } else {
                     let types = Object.keys( this.multiple_types );
                     let hasValue = this.value && this.value.input_type && types.indexOf( this.value.input_type ) >= 0;
-                    this.input_type = ( hasValue ) ? this.value.input_type : 'tainacan-category-checkbox';
+                    this.setInputType( ( hasValue ) ? this.value.input_type : 'tainacan-category-checkbox' );
                     return false;
                 }
             },
             setError(){
                 if( this.errors && this.errors.taxonomy_id !== '' ){
-                    this.taxonomyType = 'is-danger';
-                    this.taxonomyMessage = this.errors.taxonomy_id;
+                    this.setErrorsAttributes( 'is-danger', this.errors.taxonomy_id );
                 } else {
-                    this.taxonomyType = '';
-                    this.taxonomyMessage = '';
+                    this.setErrorsAttributes( '', '' );
                 }
+                return true;
             }
         },
         data(){
@@ -158,6 +157,13 @@
             }
         },
         methods: {
+            setInputType( input ){
+                this.input_type = input;
+            },
+            setErrorsAttributes( type, message ){
+                this.taxonomyType = type;
+                this.taxonomyMessage = message;
+            },
             fetchTaxonomies(){
                 return axios.get('/taxonomies')
                     .then(res => {
@@ -172,7 +178,6 @@
                     })
                     .catch(error => {
                         console.log(error);
-                        reject(error);
                     });
             },
             labelNewTerms(){
diff --git a/src/classes/field-types/relationship/FormRelationship.vue b/src/classes/field-types/relationship/FormRelationship.vue
index 0ae557389..eaa2b87c2 100644
--- a/src/classes/field-types/relationship/FormRelationship.vue
+++ b/src/classes/field-types/relationship/FormRelationship.vue
@@ -142,15 +142,18 @@
         computed: {
             setError(){
                 if( this.errors && this.errors.collection_id !== '' ){
-                    this.collectionType = 'is-danger';
-                    this.collectionMessage = this.errors.collection_id;
+                    this.setErrorsAttributes( 'is-danger', this.errors.collection_id );
                 } else {
-                    this.collectionType = '';
-                    this.collectionMessage = '';
+                    this.setErrorsAttributes( '', '' );
                 }
+                return true;
             },
         },
         methods:{
+            setErrorsAttributes( type, message ){
+                this.collectionType = type;
+                this.collectionType = message;
+            },
             fetchCollections(){
                 return axios.get('/collections')
                     .then(res => {
diff --git a/src/classes/field-types/relationship/Relationship.vue b/src/classes/field-types/relationship/Relationship.vue
index eae80e74d..47f9425ea 100644
--- a/src/classes/field-types/relationship/Relationship.vue
+++ b/src/classes/field-types/relationship/Relationship.vue
@@ -83,15 +83,10 @@
                     this.loading = true;
                     this.options = [];
                     let collectionId = ( this.field && this.field.field.field_type_options.collection_id ) ? this.field.field.field_type_options.collection_id : this.collection_id;
-                    axios.get('/collection/'+collectionId+'/items')
+                    axios.get('/collection/'+collectionId+'/items?search=' + query)
                     .then( res => {
-                        let result = [];
                         this.loading = false;
-                        result = res.data.filter(item => {
-                            return item.title.toLowerCase()
-                                .indexOf(query.toLowerCase()) > -1;
-                        });
-
+                        let result = res.data;
                         for (let item of result) {
                             this.options.push({ label: item.title, value: item.id })
                         }
diff --git a/src/classes/field-types/selectbox/FormSelectbox.vue b/src/classes/field-types/selectbox/FormSelectbox.vue
index 25355c4da..8bdfcc285 100644
--- a/src/classes/field-types/selectbox/FormSelectbox.vue
+++ b/src/classes/field-types/selectbox/FormSelectbox.vue
@@ -45,12 +45,11 @@
         computed: {
             setError(){
                 if( this.errors && this.errors.options !== '' ){
-                    this.optionType = 'is-danger';
-                    this.optionMessage = this.errors.options;
+                    this.setErrorsAttributes( 'is-danger', this.errors.options )
                 } else {
-                    this.optionType = '';
-                    this.optionMessage = '';
+                    this.setErrorsAttributes( '', '' )
                 }
+                return true;
             }
         },
         methods: {
@@ -62,6 +61,10 @@
                 this.$emit('input',{
                     options: ( this.options.length > 0 ) ? this.options.join('\n') : ''
                 })
+            },
+            setErrorsAttributes( type, message ){
+                this.optionType = type;
+                this.optionMessage = message;
             }
         }
     }
diff --git a/src/classes/field-types/tainacan-form-item.vue b/src/classes/field-types/tainacan-form-item.vue
index 907040a57..2879d6853 100644
--- a/src/classes/field-types/tainacan-form-item.vue
+++ b/src/classes/field-types/tainacan-form-item.vue
@@ -48,12 +48,12 @@
                 let msg = '';
                 let errors = eventBus.getErrors(this.field.field.id);
                 if ( errors) {
-                    this.fieldTypeMessage = 'is-danger';
+                    this.setFieldTypeMessage('is-danger');
                     for (let index in errors) {
                       msg += errors[index] + '\n';
                     }
                 } else {
-                    this.fieldTypeMessage = '';
+                    this.setFieldTypeMessage('');
                 }
                 return msg;
             }
@@ -85,6 +85,9 @@
             isTextInputComponent( component ){
                 let array = ['tainacan-relationship','tainacan-category'];
                 return !( array.indexOf( component ) >= 0 );
+            },
+            setFieldTypeMessage( message ){
+                this.fieldTypeMessage = message;
             }
         }
     }
diff --git a/src/classes/filter-types/autocomplete/Autocomplete.vue b/src/classes/filter-types/autocomplete/Autocomplete.vue
index 9e0cf1a36..103c6928a 100644
--- a/src/classes/filter-types/autocomplete/Autocomplete.vue
+++ b/src/classes/filter-types/autocomplete/Autocomplete.vue
@@ -37,6 +37,7 @@
 <script>
     import { tainacan as axios } from '../../../js/axios/axios'
     import { filter_type_mixin } from '../filter-types-mixin'
+    import qs from 'qs';
 
     export default {
         created(){
@@ -95,7 +96,7 @@
                     promise = this.getValuesPlainText( this.field, query );
                 }
 
-                promise.then( data => {
+                promise.then( () => {
                     this.isLoading = false;
                 }).catch( error => {
                     console.log('error select', error );
diff --git a/src/classes/filter-types/checkbox/Checkbox.vue b/src/classes/filter-types/checkbox/Checkbox.vue
index 0189a8142..6c1a0b81a 100644
--- a/src/classes/filter-types/checkbox/Checkbox.vue
+++ b/src/classes/filter-types/checkbox/Checkbox.vue
@@ -53,7 +53,7 @@
             }
         },
         methods: {
-            loadOptions(){deleteFile
+            loadOptions(){
                 let promise = null;
                 this.isLoading = true;
 
diff --git a/src/classes/filter-types/tainacan-filters-list.vue b/src/classes/filter-types/tainacan-filters-list.vue
index bf0d02df0..1754b704e 100644
--- a/src/classes/filter-types/tainacan-filters-list.vue
+++ b/src/classes/filter-types/tainacan-filters-list.vue
@@ -35,12 +35,12 @@
                 let msg = '';
                 let errors = eventFilterBus.getErrors( this.filter.id );
                 if ( errors) {
-                    this.filterTypeMessage = 'is-danger';
+                    this.setFilterTypeMessage('is-danger');
                     for (let index in errors) {
                         msg += errors[index] + '\n';
                     }
                 } else {
-                    this.filterTypeMessage = '';
+                    this.setFilterTypeMessage('');
                 }
                 return msg;
             },
@@ -61,6 +61,9 @@
                 eventFilterBus.$emit( 'input', ( event.field_id ) ?  event :  event.detail[0] );
                 router.push({ query: {} });
                 router.push({ query: this.getPostQuery() });
+            },
+            setFilterTypeMessage( message ){
+                this.filterTypeMessage = message;
             }
         }
     }

From 08c56b64da3622ed762ca428a90d9ff566459e56 Mon Sep 17 00:00:00 2001
From: mateuswetah <mateus.m.luna@gmail.com>
Date: Fri, 23 Mar 2018 11:46:21 -0300
Subject: [PATCH 04/16] Creates ConsolePlugin for wrapping console.log, .info
 and .error callbacks.

---
 .../edition/category-edition-form.vue         |  6 +--
 .../edition/collection-edition-form.vue       |  8 ++--
 .../components/edition/item-edition-form.vue  | 14 +++---
 src/admin/components/lists/fields-list.vue    |  2 +-
 src/admin/components/lists/filters-list.vue   |  6 +--
 .../components/navigation/tainacan-header.vue |  6 +--
 src/admin/js/main.js                          |  5 +-
 src/admin/js/utilities.js                     | 47 +++++++++++++++++++
 src/admin/pages/lists/items-page.vue          |  4 +-
 9 files changed, 73 insertions(+), 25 deletions(-)

diff --git a/src/admin/components/edition/category-edition-form.vue b/src/admin/components/edition/category-edition-form.vue
index b9b008912..958c80393 100644
--- a/src/admin/components/edition/category-edition-form.vue
+++ b/src/admin/components/edition/category-edition-form.vue
@@ -226,13 +226,13 @@
                     status: 'private',
                     allowInsert: this.form.allowInsert
                 };
-                console.log(data);
+                this.$console.log(data);
 
                 this.updateCategory(data)
                     .then(updatedCategory => {
                         this.category = updatedCategory;
 
-                        console.info(this.category);
+                        this.$console.info(this.category);
 
                         // Fill this.form data with current data.
                         this.form.name = this.category.name;
@@ -303,7 +303,7 @@
 
                     }
                 )
-                    .catch(error => console.log(error));
+                    .catch(error => this.$console.error(error));
             },
             clearErrors(attribute) {
                 this.editFormErrors[attribute] = undefined;
diff --git a/src/admin/components/edition/collection-edition-form.vue b/src/admin/components/edition/collection-edition-form.vue
index 55c1ef80b..9d76927b7 100644
--- a/src/admin/components/edition/collection-edition-form.vue
+++ b/src/admin/components/edition/collection-edition-form.vue
@@ -251,7 +251,7 @@ export default {
                 this.isLoading = false;
                 
             })
-            .catch(error => console.log(error));
+            .catch(error => this.$console.error(error));
         },
         clearErrors(attribute) {
             this.editFormErrors[attribute] = undefined;
@@ -269,11 +269,11 @@ export default {
                     this.collection.featured_image = res.featured_image;
                 })
                 .catch((error) => {
-                    console.log(error);
+                    this.$console.error(error);
                 });
             })
             .catch((error) => {
-                console.log(error);
+                this.$console.error(error);
             });
             
         },
@@ -284,7 +284,7 @@ export default {
                 this.collection.featured_image = false;
             })
             .catch((error) => {
-                console.log(error);
+                this.$console.error(error);
             });    
         }
     },
diff --git a/src/admin/components/edition/item-edition-form.vue b/src/admin/components/edition/item-edition-form.vue
index eedde9a30..fc31c34bb 100644
--- a/src/admin/components/edition/item-edition-form.vue
+++ b/src/admin/components/edition/item-edition-form.vue
@@ -195,7 +195,7 @@ export default {
 
                 this.$router.push(this.$routerHelper.getItemPath(this.form.collectionId, this.itemId));
             }).catch(error => {
-                console.log(error);
+                this.$console.error(error);
                 this.isLoading = false;
             });
         },
@@ -230,7 +230,7 @@ export default {
                 this.loadMetadata();
                 
             })
-            .catch(error => console.log(error));
+            .catch(error => this.$console.error(error));
         },
         loadMetadata() { 
             // Obtains Item Field
@@ -249,7 +249,7 @@ export default {
                     
                 })
                 .catch((error) => {
-                    console.log(error);
+                    this.$console.error(error);
                 });
             }
         },
@@ -263,11 +263,11 @@ export default {
                     this.item.featured_image = res.featured_image;
                 })
                 .catch((error) => {
-                    console.log(error);
+                    this.$console.error(error);
                 });
             })
             .catch((error) => {
-                console.log(error);
+                this.$console.error(error);
             });
             
         },
@@ -277,11 +277,11 @@ export default {
                 this.item.featured_image = false;
             })
             .catch((error) => {
-                console.log(error);
+                this.$console.error(error);
             });    
         },
         deleteFile(index) {
-            console.log("Delete:" + index);
+            this.$console.log("Delete:" + index);
         }
     },
     computed: {
diff --git a/src/admin/components/lists/fields-list.vue b/src/admin/components/lists/fields-list.vue
index d5409ef7a..809648a83 100644
--- a/src/admin/components/lists/fields-list.vue
+++ b/src/admin/components/lists/fields-list.vue
@@ -207,7 +207,7 @@ export default {
                 this.hightlightedField = '';
             })
             .catch((error) => {
-                console.log(error);
+                this.$console.error(error);
             });
         },
         removeField(removedField) {
diff --git a/src/admin/components/lists/filters-list.vue b/src/admin/components/lists/filters-list.vue
index 232fc161a..a00a94f9a 100644
--- a/src/admin/components/lists/filters-list.vue
+++ b/src/admin/components/lists/filters-list.vue
@@ -226,7 +226,7 @@ export default {
             this.addNewFilter(fieldType, lastIndex);
         },
         addNewFilter(choosenField, newIndex) {
-            console.log(choosenField);
+            this.$console.log(choosenField);
             this.choosenField = choosenField;
             this.newIndex = newIndex;
             this.openedFilterId = '';
@@ -264,7 +264,7 @@ export default {
                 this.editFilter(filter);
             })
             .catch((error) => {
-                console.log(error);
+                this.$console.error(error);
                 this.newIndex = 0;
                 this.choosenField = {};
                 this.selectedFilterType = {}
@@ -309,7 +309,7 @@ export default {
 
             // Opening collapse
             } else {
-                console.log(this.choosenField);
+                this.$console.log(this.choosenField);
                 if (this.openedFilterId == '' && this.choosenField.id != undefined) {
                     this.availableFieldList.push(this.choosenField);
                     this.choosenField = {};
diff --git a/src/admin/components/navigation/tainacan-header.vue b/src/admin/components/navigation/tainacan-header.vue
index 15f5f22a5..2ad1581ad 100644
--- a/src/admin/components/navigation/tainacan-header.vue
+++ b/src/admin/components/navigation/tainacan-header.vue
@@ -71,17 +71,17 @@ export default {
                         case 'collections':
                             this.fetchCollectionName(this.arrayRealPath[i])
                                 .then(collectionName => this.arrayViewPath.splice(i, 1, collectionName))
-                                .catch((error) => console.log(error));
+                                .catch((error) => this.$console.error(error));
                             break;
                         case 'items':
                             this.fetchItemTitle(this.arrayRealPath[i])
                                 .then(itemTitle => this.arrayViewPath.splice(i, 1, itemTitle))
-                                .catch((error) => console.log(error));
+                                .catch((error) => this.$console.error(error));
                             break;
                         case 'categories':
                             this.fetchCategoryName(this.arrayRealPath[i])
                                 .then(categoryName => this.arrayViewPath.splice(i, 1, categoryName))
-                                .catch((error) => console.log(error));
+                                .catch((error) => this.$console.error(error));
                             break;
                     }
                     
diff --git a/src/admin/js/main.js b/src/admin/js/main.js
index c988ba60c..f0d8ca29f 100644
--- a/src/admin/js/main.js
+++ b/src/admin/js/main.js
@@ -30,17 +30,18 @@ import HelpButton from '../components/other/help-button.vue';
 import draggable from 'vuedraggable'
 import store from '../../js/store/store'
 import router from './router'
-import { I18NPlugin, UserPrefsPlugin, RouterHelperPlugin } from './utilities';
+import { I18NPlugin, UserPrefsPlugin, RouterHelperPlugin, ConsolePlugin } from './utilities';
 
 // Configure and Register Plugins
 router.beforeEach((to, from, next) => {
     document.title = to.meta.title
     next()
 });
+Vue.use(Buefy); 
 Vue.use(I18NPlugin);
 Vue.use(UserPrefsPlugin);
 Vue.use(RouterHelperPlugin);
-Vue.use(Buefy); 
+Vue.use(ConsolePlugin, {visual: false});
 
 // Register Components
 Vue.component('tainacan-text', Text);
diff --git a/src/admin/js/utilities.js b/src/admin/js/utilities.js
index b38b5669b..6f5ccef13 100644
--- a/src/admin/js/utilities.js
+++ b/src/admin/js/utilities.js
@@ -7,6 +7,53 @@ const wpApi = axios.create({
 
 wpApi.defaults.headers.common['X-WP-Nonce'] = tainacan_plugin.nonce;
 
+// I18N PLUGIN - Allows access to Wordpress translation file.
+export const ConsolePlugin = {};
+ConsolePlugin.install = function (Vue, options = { visual: false }) {
+
+    Vue.prototype.$console = {
+        log(something) {
+            if (options.visual) {
+                this.$snackbar.open({
+                    message: something,
+                    type: 'is-secondary',
+                    position: 'is-bottom-right',
+                    indefinite: true,
+                    queue: true
+                });
+            } else {
+                console.log(something);
+            }
+        },
+        info(someInfo) {
+            if (options.visual) {
+                this.$snackbar.open({
+                    message: someInfo,
+                    type: 'is-primary',
+                    position: 'is-bottom-right',
+                    duration: 5000,
+                    queue: true
+                });
+            } else { 
+                console.info(someInfo);
+            }
+        },
+        error(someError) {
+            if (options.visual) {
+                this.$snackbar.open({
+                    message: someError,
+                    type: 'is-danger',
+                    position: 'is-bottom-right',
+                    indefinite: true,
+                    queue: true
+                });
+            } else { 
+                console.error(someError);
+            }
+        }
+    }
+}
+
 // I18N PLUGIN - Allows access to Wordpress translation file.
 export const I18NPlugin = {};
 I18NPlugin.install = function (Vue, options = {}) {
diff --git a/src/admin/pages/lists/items-page.vue b/src/admin/pages/lists/items-page.vue
index 8e0cae4e1..0f1835aa5 100644
--- a/src/admin/pages/lists/items-page.vue
+++ b/src/admin/pages/lists/items-page.vue
@@ -143,12 +143,12 @@ export default {
             
 
             // for (let currentField of this.prefTableFields)
-            //     console.log(currentField.slug, currentField.visible);
+            //     this.$console.log(currentField.slug, currentField.visible);
             
 
 
             // for (let oldField of prevValue)
-            //     console.log(oldField.slug, oldField.visible);
+            //     this.$console.log(oldField.slug, oldField.visible);
 
             //this.$userPrefs.set('table_columns_' + this.collectionId, this.prefTableFields, prevValue);
         },

From f0f1805e055790410d45e4968a3c660208c5ece4 Mon Sep 17 00:00:00 2001
From: mateuswetah <mateus.m.luna@gmail.com>
Date: Fri, 23 Mar 2018 13:18:13 -0300
Subject: [PATCH 05/16] MOAR LINTERS BABY. BRACE YOURSELVES.

---
 .eslintrc.js                                  |   6 +-
 src/admin/admin.vue                           |  10 +-
 .../edition/category-edition-form.vue         |  38 ++--
 .../edition/collection-edition-form.vue       | 109 ++++++-----
 .../components/edition/field-edition-form.vue | 168 +++++++++--------
 .../edition/filter-edition-form.vue           | 110 ++++++-----
 .../components/edition/item-edition-form.vue  |  95 ++++++----
 .../components/lists/categories-list.vue      |  30 ++-
 .../components/lists/collections-list.vue     |  99 +++++++---
 src/admin/components/lists/fields-list.vue    | 137 ++++++++------
 .../components/lists/filters-items-list.vue   |   4 +-
 src/admin/components/lists/filters-list.vue   | 176 ++++++++++--------
 src/admin/components/lists/items-list.vue     |  72 ++++---
 .../components/navigation/primary-menu.vue    |  93 ++++++---
 .../components/navigation/secondary-menu.vue  |  53 ++++--
 .../components/navigation/tainacan-header.vue |  29 ++-
 src/admin/components/other/grip-icon.vue      |  43 ++++-
 src/admin/components/other/help-button.vue    |  12 +-
 src/admin/pages/lists/categories-page.vue     |  30 +--
 src/admin/pages/lists/collections-page.vue    |  34 ++--
 src/admin/pages/lists/fields-page.vue         |   2 +-
 src/admin/pages/lists/filters-page.vue        |   2 +-
 src/admin/pages/lists/items-page.vue          |  67 ++++---
 src/admin/pages/singles/collection-page.vue   |   4 +-
 src/admin/pages/singles/item-page.vue         |  23 ++-
 .../field-types/category/AddNewTerm.vue       |  18 +-
 src/classes/field-types/category/Category.vue |   6 +-
 .../field-types/category/CategoryCheckbox.vue |   2 +-
 .../field-types/category/CategoryRadio.vue    |   2 +-
 .../category/CategorySelectbox.vue            |   5 +-
 .../field-types/category/CategoryTaginput.vue |   5 +-
 .../field-types/category/FormCategory.vue     |  26 ++-
 src/classes/field-types/date/Date.vue         |   2 +-
 src/classes/field-types/numeric/Numeric.vue   |   2 +-
 .../relationship/FormRelationship.vue         |  22 +--
 .../field-types/relationship/Relationship.vue |   3 +-
 .../field-types/selectbox/FormSelectbox.vue   |  14 +-
 .../field-types/tainacan-form-item.vue        |  48 +++--
 src/classes/field-types/text/Text.vue         |   8 +-
 src/classes/field-types/textarea/Textarea.vue |   2 +-
 .../autocomplete/Autocomplete.vue             |  19 +-
 .../custom-interval/CustomInterval.vue        |  21 +--
 .../filter-types/taginput/Taginput.vue        |   3 +-
 .../filter-types/tainacan-filters-list.vue    |  13 +-
 webpack.config.js                             |   5 +-
 45 files changed, 1013 insertions(+), 659 deletions(-)

diff --git a/.eslintrc.js b/.eslintrc.js
index 511ca2732..b09c636ba 100644
--- a/.eslintrc.js
+++ b/.eslintrc.js
@@ -2,7 +2,7 @@ module.exports = {
   extends: [
     // add more generic rulesets here, such as:
     'eslint:recommended',
-    'plugin:vue/essential'
+    'plugin:vue/strongly-recommended'
   ],
   rules: {
     // override/add rules settings here, such as:
@@ -10,7 +10,7 @@ module.exports = {
     "no-console": "warn",
     "no-unused-vars": "warn",
     "no-undef": "warn",
-    "vue/no-side-effects-in-computed-properties": "warn",
-    "vue/return-in-computed-property": "warn"
+    "vue/html-indent": "off",
+    "vue/require-default-prop": "off", // https://github.com/vuejs/eslint-plugin-vue/blob/master/docs/rules/require-default-prop.md
   }
 }
\ No newline at end of file
diff --git a/src/admin/admin.vue b/src/admin/admin.vue
index 84cea3977..13dc0eac3 100644
--- a/src/admin/admin.vue
+++ b/src/admin/admin.vue
@@ -1,9 +1,11 @@
 <template>
-    <div id="tainacan-admin-app" class="columns is-fullheight">
-        <primary-menu></primary-menu>
-        <tainacan-header></tainacan-header>
+    <div 
+            id="tainacan-admin-app" 
+            class="columns is-fullheight">
+        <primary-menu/>
+        <tainacan-header/>
         <div class="column is-main-content">  
-            <router-view></router-view> 
+            <router-view/> 
         </div>
     </div>
 </template>
diff --git a/src/admin/components/edition/category-edition-form.vue b/src/admin/components/edition/category-edition-form.vue
index 958c80393..43c975c16 100644
--- a/src/admin/components/edition/category-edition-form.vue
+++ b/src/admin/components/edition/category-edition-form.vue
@@ -1,8 +1,14 @@
 <template>
     <div>
         <div class="page-container primary-page">
-            <b-tag v-if="category != null && category != undefined" :type="'is-' + getStatusColor(category.status)" v-text="category.status"></b-tag>
-            <form v-if="category != null && category != undefined" class="tainacan-form" label-width="120px">
+            <b-tag
+                    v-if="category != null && category != undefined" 
+                    :type="'is-' + getStatusColor(category.status)" 
+                    v-text="category.status"/>
+            <form 
+                    v-if="category != null && category != undefined" 
+                    class="tainacan-form" 
+                    label-width="120px">
 
                 <!-- Name -------------------------------- -->
                 <b-field
@@ -12,14 +18,12 @@
                         :message="editFormErrors['name'] != undefined ? editFormErrors['name'] : ''">
                     <help-button 
                             :title="$i18n.getHelperTitle('categories', 'name')" 
-                            :message="$i18n.getHelperMessage('categories', 'name')">
-                    </help-button>
+                            :message="$i18n.getHelperMessage('categories', 'name')"/>
                     <b-input
                             id="tainacan-text-name"
                             v-model="form.name"
                             @focus="clearErrors('name')"
-                            @blur="updateSlug()">
-                    </b-input>
+                            @blur="updateSlug()"/>
                 </b-field>
 
                 <!-- Description -------------------------------- -->
@@ -30,14 +34,12 @@
                         :message="editFormErrors['description'] != undefined ? editFormErrors['description'] : ''">
                     <help-button 
                             :title="$i18n.getHelperTitle('categories', 'description')" 
-                            :message="$i18n.getHelperMessage('categories', 'description')">
-                    </help-button>
+                            :message="$i18n.getHelperMessage('categories', 'description')"/>
                     <b-input
                             id="tainacan-text-description"
                             type="textarea"
                             v-model="form.description"
-                            @focus="clearErrors('description')">
-                    </b-input>
+                            @focus="clearErrors('description')"/>
                 </b-field>
 
                 <!-- Status -------------------------------- -->
@@ -48,8 +50,7 @@
                         :message="editFormErrors['status'] != undefined ? editFormErrors['status'] : ''">
                     <help-button 
                             :title="$i18n.getHelperTitle('categories', 'status')" 
-                            :message="$i18n.getHelperMessage('categories', 'status')">
-                    </help-button>
+                            :message="$i18n.getHelperMessage('categories', 'status')"/>
                     <b-select
                             id="tainacan-select-status"
                             v-model="form.status"
@@ -72,14 +73,12 @@
                         :message="editFormErrors['slug'] != undefined ? editFormErrors['slug'] : ''">
                     <help-button 
                             :title="$i18n.getHelperTitle('categories', 'slug')" 
-                            :message="$i18n.getHelperMessage('categories', 'slug')">
-                    </help-button>
+                            :message="$i18n.getHelperMessage('categories', 'slug')"/>
                     <b-input
                             id="tainacan-text-slug"
                             v-model="form.slug"
                             @focus="clearErrors('slug')"
-                            :disabled="isUpdatingSlug">
-                    </b-input>
+                            :disabled="isUpdatingSlug"/>
                 </b-field>
 
                 <!-- Allow Insert -->
@@ -88,8 +87,7 @@
                         :label="$i18n.get('label_category_allow_new_terms')">
                     <help-button 
                         :title="$i18n.getHelperTitle('categories', 'allow_insert')" 
-                        :message="$i18n.getHelperMessage('categories', 'allow_insert')">
-                    </help-button>
+                        :message="$i18n.getHelperMessage('categories', 'allow_insert')"/>
                     <div class="block" >
                         <b-checkbox
                                 v-model="form.allowInsert"
@@ -115,12 +113,12 @@
                                 class="button is-success">{{ $i18n.get('save') }}</button>
                     </div>
                 </div>
-                <p class="help is-danger">{{formErrorMessage}}</p>
+                <p class="help is-danger">{{ formErrorMessage }}</p>
             </form>
 
             <b-loading 
                     :active.sync="isLoading" 
-                    :canCancel="false"></b-loading>
+                    :can-cancel="false"/>
         </div>
     </div>
 </template>
diff --git a/src/admin/components/edition/collection-edition-form.vue b/src/admin/components/edition/collection-edition-form.vue
index 9d76927b7..1f6a4a2f4 100644
--- a/src/admin/components/edition/collection-edition-form.vue
+++ b/src/admin/components/edition/collection-edition-form.vue
@@ -1,7 +1,15 @@
 <template>
-    <div class="page-container" :class="{'primary-page' : isNewCollection }">
-        <b-tag v-if="collection != null && collection != undefined" :type="'is-' + getStatusColor(collection.status)" v-text="collection.status"></b-tag>
-        <form v-if="collection != null && collection != undefined" class="tainacan-form" label-width="120px">
+    <div 
+            class="page-container" 
+            :class="{'primary-page' : isNewCollection }">
+        <b-tag 
+                v-if="collection != null && collection != undefined" 
+                :type="'is-' + getStatusColor(collection.status)" 
+                v-text="collection.status"/>
+        <form 
+                v-if="collection != null && collection != undefined" 
+                class="tainacan-form" 
+                label-width="120px">
             
             <!-- Name -------------------------------- --> 
             <b-field 
@@ -11,13 +19,11 @@
                 :message="editFormErrors['name'] != undefined ? editFormErrors['name'] : ''">
                 <help-button 
                     :title="$i18n.getHelperTitle('collections', 'name')" 
-                    :message="$i18n.getHelperMessage('collections', 'name')">
-                </help-button>
+                    :message="$i18n.getHelperMessage('collections', 'name')"/>
                 <b-input
                     id="tainacan-text-name"
                     v-model="form.name"
-                    @focus="clearErrors('name')">
-                </b-input>  
+                    @focus="clearErrors('name')"/>  
             </b-field>
 
             <!-- Thumbnail -------------------------------- --> 
@@ -33,23 +39,29 @@
                         <div class="content has-text-centered">
                             <p>
                             <b-icon
-                                icon="upload">
-                            </b-icon>
+                                icon="upload"/>
                             </p>
                             <p>{{ $i18n.get('instruction_image_upload_box') }}</p>
                         </div>
                     </b-upload>
                     <div v-else> 
                         <figure class="image is-128x128">
-                            <img :alt="$i18n.get('label_thumbnail')" :src="collection.featured_image"/>
+                            <img 
+                                    :alt="$i18n.get('label_thumbnail')" 
+                                    :src="collection.featured_image">
                         </figure>
                         <div class="thumbnail-buttons-row">
                             <b-upload 
-                                model="thumbnail"
-                                @input="uploadThumbnail($event)">
-                                <a id="button-edit" :aria-label="$i18n.get('label_button_edit_thumb')"><b-icon icon="pencil"></b-icon></a>
+                                    model="thumbnail"
+                                    @input="uploadThumbnail($event)">
+                                <a 
+                                        id="button-edit" 
+                                        :aria-label="$i18n.get('label_button_edit_thumb')"><b-icon icon="pencil"/></a>
                             </b-upload>
-                            <a id="button-delete" :aria-label="$i18n.get('label_button_delete_thumb')" @click="deleteThumbnail()"><b-icon icon="delete"></b-icon></a>
+                            <a 
+                                    id="button-delete" 
+                                    :aria-label="$i18n.get('label_button_delete_thumb')" 
+                                    @click="deleteThumbnail()"><b-icon icon="delete"/></a>
                         </div>
                     </div> 
                 </div>
@@ -57,32 +69,29 @@
                   
             <!-- Description -------------------------------- --> 
             <b-field
-                :addons="false" 
-                :label="$i18n.get('label_description')"
-                :type="editFormErrors['description'] != undefined ? 'is-danger' : ''" 
-                :message="editFormErrors['description'] != undefined ? editFormErrors['description'] : ''">
+                    :addons="false" 
+                    :label="$i18n.get('label_description')"
+                    :type="editFormErrors['description'] != undefined ? 'is-danger' : ''" 
+                    :message="editFormErrors['description'] != undefined ? editFormErrors['description'] : ''">
                 <help-button 
-                    :title="$i18n.getHelperTitle('collections', 'description')" 
-                    :message="$i18n.getHelperMessage('collections', 'description')">
-                </help-button>
+                        :title="$i18n.getHelperTitle('collections', 'description')" 
+                        :message="$i18n.getHelperMessage('collections', 'description')"/>
                 <b-input
                         id="tainacan-text-description"
                         type="textarea"
                         v-model="form.description"
-                        @focus="clearErrors('description')">
-                </b-input>
+                        @focus="clearErrors('description')"/>
             </b-field>
 
              <!-- Status -------------------------------- --> 
             <b-field
-                :addons="false" 
-                :label="$i18n.get('label_status')"
-                :type="editFormErrors['status'] != undefined ? 'is-danger' : ''" 
-                :message="editFormErrors['status'] != undefined ? editFormErrors['status'] : ''">
+                    :addons="false" 
+                    :label="$i18n.get('label_status')"
+                    :type="editFormErrors['status'] != undefined ? 'is-danger' : ''" 
+                    :message="editFormErrors['status'] != undefined ? editFormErrors['status'] : ''">
                 <help-button 
-                    :title="$i18n.getHelperTitle('collections', 'status')" 
-                    :message="$i18n.getHelperMessage('collections', 'status')">
-                </help-button>
+                        :title="$i18n.getHelperTitle('collections', 'status')" 
+                        :message="$i18n.getHelperMessage('collections', 'status')"/>
                 <b-select
                         id="tainacan-select-status"
                         v-model="form.status"
@@ -99,39 +108,39 @@
 
             <!-- Slug -------------------------------- --> 
             <b-field
-                :addons="false" 
-                :label="$i18n.get('label_slug')"
-                :type="editFormErrors['slug'] != undefined ? 'is-danger' : ''" 
-                :message="editFormErrors['slug'] != undefined ? editFormErrors['slug'] : ''">
+                    :addons="false" 
+                    :label="$i18n.get('label_slug')"
+                    :type="editFormErrors['slug'] != undefined ? 'is-danger' : ''" 
+                    :message="editFormErrors['slug'] != undefined ? editFormErrors['slug'] : ''">
                 <help-button 
-                    :title="$i18n.getHelperTitle('collections', 'slug')" 
-                    :message="$i18n.getHelperMessage('collections', 'slug')">
-                </help-button>
+                        :title="$i18n.getHelperTitle('collections', 'slug')" 
+                        :message="$i18n.getHelperMessage('collections', 'slug')"/>
                 <b-input
-                    id="tainacan-text-slug"
-                    v-model="form.slug"
-                    @focus="clearErrors('slug')">
-                </b-input>
+                        id="tainacan-text-slug"
+                        v-model="form.slug"
+                        @focus="clearErrors('slug')"/>
             </b-field>
             <div class="field is-grouped form-submit">
                 <div class="control">
                     <button
-                        id="button-cancel-collection-creation"
-                        class="button is-outlined"
-                        type="button"
-                        @click="cancelBack">{{ $i18n.get('cancel') }}</button>
+                            id="button-cancel-collection-creation"
+                            class="button is-outlined"
+                            type="button"
+                            @click="cancelBack">{{ $i18n.get('cancel') }}</button>
                 </div>
                 <div class="control">
                     <button
-                        id="button-submit-collection-creation"
-                        @click.prevent="onSubmit"
-                        class="button is-success">{{ $i18n.get('save') }}</button>
+                            id="button-submit-collection-creation"
+                            @click.prevent="onSubmit"
+                            class="button is-success">{{ $i18n.get('save') }}</button>
                 </div>
             </div>
-            <p class="help is-danger">{{formErrorMessage}}</p> 
+            <p class="help is-danger">{{ formErrorMessage }}</p> 
         </form>
 
-        <b-loading :active.sync="isLoading" :canCancel="false"></b-loading>
+        <b-loading 
+:active.sync="isLoading" 
+:can-cancel="false"/>
     </div>
 </template>
 
diff --git a/src/admin/components/edition/field-edition-form.vue b/src/admin/components/edition/field-edition-form.vue
index 51331f2e3..88979f591 100644
--- a/src/admin/components/edition/field-edition-form.vue
+++ b/src/admin/components/edition/field-edition-form.vue
@@ -1,140 +1,152 @@
 <template>
-    <form id="fieldEditForm" class="tainacan-form" v-on:submit.prevent="saveEdition(editForm)">    
+    <form 
+            id="fieldEditForm" 
+            class="tainacan-form" 
+            @submit.prevent="saveEdition(editForm)">    
         
         <b-field 
-            :addons="false"
-            :type="formErrors['name'] != undefined ? 'is-danger' : ''" 
-            :message="formErrors['name'] != undefined ? formErrors['name'] : ''"> 
+                :addons="false"
+                :type="formErrors['name'] != undefined ? 'is-danger' : ''" 
+                :message="formErrors['name'] != undefined ? formErrors['name'] : ''"> 
             <label class="label">
-                {{$i18n.get('label_name')}} 
-                <span class="required-field-asterisk" :class="formErrors['name'] != undefined ? 'is-danger' : ''">*</span> 
+                {{ $i18n.get('label_name') }} 
+                <span 
+                        class="required-field-asterisk" 
+                        :class="formErrors['name'] != undefined ? 'is-danger' : ''">*</span> 
                 <help-button 
-                    :title="$i18n.getHelperTitle('fields', 'name')" 
-                    :message="$i18n.getHelperMessage('fields', 'name')">
-                </help-button>
+                        :title="$i18n.getHelperTitle('fields', 'name')" 
+                        :message="$i18n.getHelperMessage('fields', 'name')"/>
             </label>
-            <b-input v-model="editForm.name" name="name" @focus="clearErrors('name')"></b-input>
+            <b-input 
+                    v-model="editForm.name" 
+                    name="name" 
+                    @focus="clearErrors('name')"/>
         </b-field>
 
         <b-field
-            :addons="false"
-            :type="formErrors['description'] != undefined ? 'is-danger' : ''" 
-            :message="formErrors['description'] != undefined ? formErrors['description'] : ''">
+                :addons="false"
+                :type="formErrors['description'] != undefined ? 'is-danger' : ''" 
+                :message="formErrors['description'] != undefined ? formErrors['description'] : ''">
             <label class="label">
-                {{$i18n.get('label_description')}}
+                {{ $i18n.get('label_description') }}
                 <help-button 
-                    :title="$i18n.getHelperTitle('fields', 'description')" 
-                    :message="$i18n.getHelperMessage('fields', 'description')">
-                </help-button>
+                        :title="$i18n.getHelperTitle('fields', 'description')" 
+                        :message="$i18n.getHelperMessage('fields', 'description')"/>
             </label>
-            <b-input type="textarea" name="description" v-model="editForm.description" @focus="clearErrors('description')" ></b-input>
+            <b-input 
+                    type="textarea" 
+                    name="description" 
+                    v-model="editForm.description" 
+                    @focus="clearErrors('description')" />
         </b-field>
 
         <b-field 
-            :addons="false"
-            :type="formErrors['status'] != undefined ? 'is-danger' : ''" 
-            :message="formErrors['status'] != undefined ? formErrors['status'] : ''">
+                :addons="false"
+                :type="formErrors['status'] != undefined ? 'is-danger' : ''" 
+                :message="formErrors['status'] != undefined ? formErrors['status'] : ''">
             <label class="label">
-                {{$i18n.get('label_status')}} 
+                {{ $i18n.get('label_status') }} 
                 <help-button 
-                    :title="$i18n.getHelperTitle('fields', 'status')" 
-                    :message="$i18n.getHelperMessage('fields', 'status')">
-                </help-button>
+                        :title="$i18n.getHelperTitle('fields', 'status')" 
+                        :message="$i18n.getHelperMessage('fields', 'status')"/>
             </label>
             <div class="inline-block">
                 <b-radio 
-                    @focus="clearErrors('label_status')"
-                    id="tainacan-select-status-publish"
-                    name="status" 
-                    v-model="editForm.status"
-                    native-value="publish">
+                        @focus="clearErrors('label_status')"
+                        id="tainacan-select-status-publish"
+                        name="status" 
+                        v-model="editForm.status"
+                        native-value="publish">
                     {{ $i18n.get('publish_visibility') }}
                 </b-radio>
                 <br>
                 <b-radio 
-                    @focus="clearErrors('label_status')"
-                    id="tainacan-select-status-private"
-                    name="status" 
-                    v-model="editForm.status"
-                    native-value="private">
+                        @focus="clearErrors('label_status')"
+                        id="tainacan-select-status-private"
+                        name="status" 
+                        v-model="editForm.status"
+                        native-value="private">
                     {{ $i18n.get('private_visibility') }}
                 </b-radio>
             </div>
         </b-field>
         <br>
         <b-field 
-            :addons="false"
-            :label="$i18n.get('label_options')">
+                :addons="false"
+                :label="$i18n.get('label_options')">
             <b-field
-                :type="formErrors['required'] != undefined ? 'is-danger' : ''" 
-                :message="formErrors['required'] != undefined ? formErrors['required'] : ''">
+                    :type="formErrors['required'] != undefined ? 'is-danger' : ''" 
+                    :message="formErrors['required'] != undefined ? formErrors['required'] : ''">
                 <b-checkbox
-                    @input="clearErrors('required')"
-                    v-model="editForm.required"
-                    true-value="yes" 
-                    false-value="no"
-                    name="required">
+                        @input="clearErrors('required')"
+                        v-model="editForm.required"
+                        true-value="yes" 
+                        false-value="no"
+                        name="required">
                     {{ $i18n.get('label_required') }}
                 </b-checkbox>
                 <help-button 
-                    :title="$i18n.getHelperTitle('fields', 'required')" 
-                    :message="$i18n.getHelperMessage('fields', 'required')">
-                </help-button>
+                        :title="$i18n.getHelperTitle('fields', 'required')" 
+                        :message="$i18n.getHelperMessage('fields', 'required')"/>
             </b-field>
 
             <b-field
-                :type="formErrors['multiple'] != undefined ? 'is-danger' : ''" 
-                :message="formErrors['multiple'] != undefined ? formErrors['multiple'] : ''">
+                    :type="formErrors['multiple'] != undefined ? 'is-danger' : ''" 
+                    :message="formErrors['multiple'] != undefined ? formErrors['multiple'] : ''">
                 <b-checkbox 
-                    @input="clearErrors('multiple')"
-                    v-model="editForm.multiple"
-                    true-value="yes" 
-                    false-value="no"
-                    name="multiple">
+                        @input="clearErrors('multiple')"
+                        v-model="editForm.multiple"
+                        true-value="yes" 
+                        false-value="no"
+                        name="multiple">
                     {{ $i18n.get('label_allow_multiple') }}
                 </b-checkbox>
                 <help-button 
-                    :title="$i18n.getHelperTitle('fields', 'multiple')" 
-                    :message="$i18n.getHelperMessage('fields', 'multiple')">
-                </help-button>
+                        :title="$i18n.getHelperTitle('fields', 'multiple')" 
+                        :message="$i18n.getHelperMessage('fields', 'multiple')"/>
             </b-field>
 
             <b-field 
-                :type="formErrors['unique'] != undefined ? 'is-danger' : ''" 
-                :message="formErrors['unique'] != undefined ? formErrors['unique'] : ''">
+                    :type="formErrors['unique'] != undefined ? 'is-danger' : ''" 
+                    :message="formErrors['unique'] != undefined ? formErrors['unique'] : ''">
                 <b-checkbox 
-                    @input="clearErrors('unique')"
-                    v-model="editForm.unique"
-                    true-value="yes" 
-                    false-value="no"
-                    name="collecion_key">
+                        @input="clearErrors('unique')"
+                        v-model="editForm.unique"
+                        true-value="yes" 
+                        false-value="no"
+                        name="collecion_key">
                     {{ $i18n.get('label_unique_value') }}
                 </b-checkbox>
                 <help-button 
                     :title="$i18n.getHelperTitle('fields', 'unique')" 
-                    :message="$i18n.getHelperMessage('fields', 'unique')">
-                </help-button>
+                    :message="$i18n.getHelperMessage('fields', 'unique')"/>
             </b-field>
         </b-field>
 
         <component
-            :errors="formErrors['field_type_options']"
-            v-if="(editForm.field_type_object && editForm.field_type_object.form_component) || editForm.edit_form == ''"
-            :is="editForm.field_type_object.form_component"
-            :field="editForm"
-            v-model="editForm.field_type_options">
-        </component>
-        <div v-html="editForm.edit_form" v-else></div>
+                :errors="formErrors['field_type_options']"
+                v-if="(editForm.field_type_object && editForm.field_type_object.form_component) || editForm.edit_form == ''"
+                :is="editForm.field_type_object.form_component"
+                :field="editForm"
+                v-model="editForm.field_type_options"/>
+        <div 
+                v-html="editForm.edit_form" 
+                v-else/>
 
         <div class="field is-grouped form-submit">  
             <div class="control">
-                <button class="button is-outlined" @click.prevent="cancelEdition()" slot="trigger">{{ $i18n.get('cancel')}}</button>
+                <button 
+                        class="button is-outlined" 
+                        @click.prevent="cancelEdition()" 
+                        slot="trigger">{{ $i18n.get('cancel') }}</button>
             </div>
             <div class="control">
-                <button class="button is-success" type="submit">{{ $i18n.get('save')}}</button>
+                <button 
+                        class="button is-success" 
+                        type="submit">{{ $i18n.get('save') }}</button>
             </div>
         </div>
-        <p class="help is-danger">{{formErrorMessage}}</p>
+        <p class="help is-danger">{{ formErrorMessage }}</p>
     </form>
 </template>
 
@@ -154,8 +166,8 @@ export default {
     }, 
     props: {
         index: '',
-        editedField: {},
-        originalField: '', 
+        editedField: Object,
+        originalField: Object, 
         isRepositoryLevel: false,
         collectionId: ''
     },
diff --git a/src/admin/components/edition/filter-edition-form.vue b/src/admin/components/edition/filter-edition-form.vue
index 0a9480382..89f064d99 100644
--- a/src/admin/components/edition/filter-edition-form.vue
+++ b/src/admin/components/edition/filter-edition-form.vue
@@ -1,85 +1,99 @@
 <template>
-    <form id="filterEditForm" class="tainacan-form" v-on:submit.prevent="saveEdition(editForm)">    
-        
+    <form 
+            id="filterEditForm" 
+            class="tainacan-form" 
+            @submit.prevent="saveEdition(editForm)">     
         <b-field 
-            :addons="false"
-            :type="formErrors['name'] != undefined ? 'is-danger' : ''" 
-            :message="formErrors['name'] != undefined ? formErrors['name'] : ''">
+                :addons="false"
+                :type="formErrors['name'] != undefined ? 'is-danger' : ''" 
+                :message="formErrors['name'] != undefined ? formErrors['name'] : ''">
             <label class="label">
-                {{$i18n.get('label_name')}} 
-                <span class="required-field-asterisk" :class="formErrors['name'] != undefined ? 'is-danger' : ''">*</span> 
+                {{ $i18n.get('label_name') }} 
+                <span 
+                        class="required-field-asterisk" 
+                        :class="formErrors['name'] != undefined ? 'is-danger' : ''">*</span> 
                 <help-button 
-                    :title="$i18n.getHelperTitle('filters', 'name')" 
-                    :message="$i18n.getHelperMessage('filters', 'name')">
-                </help-button>
+                        :title="$i18n.getHelperTitle('filters', 'name')" 
+                        :message="$i18n.getHelperMessage('filters', 'name')"/>
             </label>
-            <b-input v-model="editForm.name" name="name" @focus="clearErrors('name')"></b-input>
+            <b-input 
+                    v-model="editForm.name" 
+                    name="name" 
+                    @focus="clearErrors('name')"/>
         </b-field>
 
         <b-field
-            :addons="false" 
-            :type="formErrors['description'] != undefined ? 'is-danger' : ''" 
-            :message="formErrors['description'] != undefined ? formErrors['description'] : ''">
+                :addons="false" 
+                :type="formErrors['description'] != undefined ? 'is-danger' : ''" 
+                :message="formErrors['description'] != undefined ? formErrors['description'] : ''">
             <label class="label">
-                {{$i18n.get('label_description')}} 
+                {{ $i18n.get('label_description') }} 
                 <help-button 
-                    :title="$i18n.getHelperTitle('filters', 'description')" 
-                    :message="$i18n.getHelperMessage('filters', 'description')">
-                </help-button>    
+                        :title="$i18n.getHelperTitle('filters', 'description')" 
+                        :message="$i18n.getHelperMessage('filters', 'description')"/>    
             </label>
-            <b-input type="textarea" name="description" v-model="editForm.description" @focus="clearErrors('description')" ></b-input>
+            <b-input 
+                    type="textarea" 
+                    name="description" 
+                    v-model="editForm.description" 
+                    @focus="clearErrors('description')" />
         </b-field>
 
         <b-field 
-            :addons="false"
-            :type="formErrors['status'] != undefined ? 'is-danger' : ''" 
-            :message="formErrors['status'] != undefined ? formErrors['status'] : ''">
+                :addons="false"
+                :type="formErrors['status'] != undefined ? 'is-danger' : ''" 
+                :message="formErrors['status'] != undefined ? formErrors['status'] : ''">
             <label class="label">
-                {{$i18n.get('label_status')}} 
+                {{ $i18n.get('label_status') }} 
                 <help-button 
-                    :title="$i18n.getHelperTitle('filters', 'status')" 
-                    :message="$i18n.getHelperMessage('filters', 'status')">
-                </help-button>
+                        :title="$i18n.getHelperTitle('filters', 'status')" 
+                        :message="$i18n.getHelperMessage('filters', 'status')"/>
             </label>
             <div class="inline-block">
                 <b-radio 
-                    @focus="clearErrors('label_status')"
-                    id="tainacan-select-status-publish"
-                    name="status" 
-                    v-model="editForm.status"
-                    native-value="publish">
+                        @focus="clearErrors('label_status')"
+                        id="tainacan-select-status-publish"
+                        name="status" 
+                        v-model="editForm.status"
+                        native-value="publish">
                     {{ $i18n.get('publish_visibility') }}
                 </b-radio>
                 <br>
                 <b-radio 
-                    @focus="clearErrors('label_status')"
-                    id="tainacan-select-status-private"
-                    name="status" 
-                    v-model="editForm.status"
-                    native-value="private">
+                        @focus="clearErrors('label_status')"
+                        id="tainacan-select-status-private"
+                        name="status" 
+                        v-model="editForm.status"
+                        native-value="private">
                     {{ $i18n.get('private_visibility') }}
                 </b-radio>
             </div>
         </b-field>
 
         <component
-            :errors="formErrors['filter_type_options']"
-            v-if="(editForm.filter_type_object && editForm.filter_type_object.form_component) || editForm.edit_form == ''"
-            :is="editForm.filter_type_object.form_component"
-            :filter="editForm"
-            v-model="editForm.filter_type_options">
-        </component>
-        <div v-html="editForm.edit_form" v-else></div>
+                :errors="formErrors['filter_type_options']"
+                v-if="(editForm.filter_type_object && editForm.filter_type_object.form_component) || editForm.edit_form == ''"
+                :is="editForm.filter_type_object.form_component"
+                :filter="editForm"
+                v-model="editForm.filter_type_options"/>
+        <div 
+                v-html="editForm.edit_form" 
+                v-else/>
 
         <div class="field is-grouped form-submit">
             <div class="control">
-                <button class="button is-outlined" @click.prevent="cancelEdition()" slot="trigger">{{ $i18n.get('cancel')}}</button>
+                <button 
+                        class="button is-outlined" 
+                        @click.prevent="cancelEdition()" 
+                        slot="trigger">{{ $i18n.get('cancel') }}</button>
             </div>
             <div class="control">
-                <button class="button is-success" type="submit">{{ $i18n.get('save')}}</button>
+                <button 
+                        class="button is-success" 
+                        type="submit">{{ $i18n.get('save') }}</button>
             </div>
         </div>
-        <p class="help is-danger">{{formErrorMessage}}</p>
+        <p class="help is-danger">{{ formErrorMessage }}</p>
     </form>
 </template>
 
@@ -99,8 +113,8 @@ export default {
     }, 
     props: {
         index: '',
-        editedFilter: {},
-        originalFilter: {},
+        editedFilter: Object,
+        originalFilter: Object,
     },
     created() {
 
diff --git a/src/admin/components/edition/item-edition-form.vue b/src/admin/components/edition/item-edition-form.vue
index fc31c34bb..b3ec13ec5 100644
--- a/src/admin/components/edition/item-edition-form.vue
+++ b/src/admin/components/edition/item-edition-form.vue
@@ -1,14 +1,19 @@
 <template>
     <div class="page-container">
-        <b-tag v-if="!isLoading" :type="'is-' + getStatusColor(item.status)" v-text="item.status"></b-tag>
-        <form  v-if="!isLoading" class="tainacan-form" label-width="120px">
+        <b-tag 
+                v-if="!isLoading" 
+                :type="'is-' + getStatusColor(item.status)" 
+                v-text="item.status"/>
+        <form 
+                v-if="!isLoading" 
+                class="tainacan-form" 
+                label-width="120px">
             <b-field 
-                :addons="false"
-                :label="$i18n.get('label_status')">
+                    :addons="false"
+                    :label="$i18n.get('label_status')">
                 <help-button 
-                    :title="$i18n.getHelperTitle('items', 'status')" 
-                    :message="$i18n.getHelperMessage('items', 'status')">
-                </help-button>
+                        :title="$i18n.getHelperTitle('items', 'status')" 
+                        :message="$i18n.getHelperMessage('items', 'status')"/>
                 <b-select 
                         id="status-select"
                         v-model="form.status"
@@ -27,30 +32,36 @@
             <b-field :label="$i18n.get('label_image')">
                 <div class="thumbnail-field">
                     <b-upload 
-                        v-if="item.featured_image == undefined || item.featured_image == false"
-                        v-model="thumbnail"
-                        drag-drop
-                        @input="uploadThumbnail($event)">
+                            v-if="item.featured_image == undefined || item.featured_image == false"
+                            v-model="thumbnail"
+                            drag-drop
+                            @input="uploadThumbnail($event)">
                         <div class="content has-text-centered">
                             <p>
                             <b-icon
-                                icon="upload">
-                            </b-icon>
+                                icon="upload"/>
                             </p>
                             <p>{{ $i18n.get('instruction_image_upload_box') }}</p>
                         </div>
                     </b-upload>
                     <div v-else> 
                         <figure class="image is-128x128">
-                            <img :alt="$i18n.get('label_thumbnail')" :src="item.featured_image"/>
+                            <img 
+                                    :alt="$i18n.get('label_thumbnail')" 
+                                    :src="item.featured_image">
                         </figure>
                         <div class="thumbnail-buttons-row">
                             <b-upload 
-                                model="thumbnail"
-                                @input="uploadThumbnail($event)">
-                                <a id="button-edit" :aria-label="$i18n.get('label_button_edit_thumb')"><b-icon icon="pencil"></a>
+                                    model="thumbnail"
+                                    @input="uploadThumbnail($event)">
+                                <a 
+                                        id="button-edit" 
+                                        :aria-label="$i18n.get('label_button_edit_thumb')"><b-icon icon="pencil"/></a>
                             </b-upload>
-                            <a id="button-delete" :aria-label="$i18n.get('label_button_delete_thumb')" @click="deleteThumbnail()"><b-icon icon="delete"></a>
+                            <a 
+                                    id="button-delete" 
+                                    :aria-label="$i18n.get('label_button_delete_thumb')" 
+                                    @click="deleteThumbnail()"><b-icon icon="delete"/></a>
                         </div>
                     </div> 
                 </div>
@@ -59,14 +70,15 @@
             <!-- Fields from Collection-------------------------------- -->   
             <tainacan-form-item                 
                 v-for="(field, index) in fieldList"
-                v-bind:key="index"
-                :field="field"></tainacan-form-item>  
+                :key="index"
+                :field="field"/>  
 
             <!-- Attachments ------------------------------------------ -->
             <div class="columns is-multiline">
                 <div class="column is-4">
                     <b-field :label="$i18n.get('label_image')">
-                        <b-upload v-model="form.files"
+                        <b-upload 
+                                v-model="form.files"
                                 multiple
                                 drag-drop
                                 @input="uploadAttachment($event)">
@@ -75,8 +87,7 @@
                                     <p>
                                         <b-icon
                                                 icon="upload"
-                                                size="is-large">
-                                        </b-icon>
+                                                size="is-large"/>
                                     </p>
                                     <p>{{ $i18n.get('instruction_image_upload_box') }}</p>
                                 </div>
@@ -84,48 +95,52 @@
                         </b-upload>
                     </b-field>
                     <div class="uploaded-files">
-                        <div v-for="(file, index) in form.files"
-                            :key="index">
+                        <div 
+                                v-for="(file, index) in form.files"
+                                :key="index">
                             <span class="tag is-primary">
                                 {{ file.name }}
-                                <button class="delete is-small"
+                                <button 
+                                    class="delete is-small"
                                     type="button"
-                                    @click="deleteFile(index)">
-                                </button>
+                                    @click="deleteFile(index)"/>
                             </span>
                             <!-- <progress class="progress is-secondary" value="15" max="100">30%</progress> -->
                         </div>
                     </div>     
                 </div>
-                <div class="column is-narrow"
+                <div 
+                        class="column is-narrow"
                         v-for="(attachment, index) of item.attachments" 
                         :key="index">
                     <figure class="image is-128x128">
                         <img 
-                            :alt="attachment.title"
-                            :src="attachment.url"/>
+                                :alt="attachment.title"
+                                :src="attachment.url">
                     </figure>
                 </div>  
             </div>
             <div class="field is-grouped form-submit">
                 <div class="control">     
                     <button
-                        id="button-cancel-item-creation"
-                        class="button is-outlined"
-                        type="button"
-                        @click="cancelBack">{{ $i18n.get('cancel') }}</button>
+                            id="button-cancel-item-creation"
+                            class="button is-outlined"
+                            type="button"
+                            @click="cancelBack">{{ $i18n.get('cancel') }}</button>
                 </div>
                 <div class="control">
                     <button
-                        id="button-submit-item-creation"
-                        @click.prevent="onSubmit"
-                        class="button is-success" :disabled="formHasErrors">{{ $i18n.get('save') }}</button> 
+                            id="button-submit-item-creation"
+                            @click.prevent="onSubmit"
+                            class="button is-success" 
+                            :disabled="formHasErrors">{{ $i18n.get('save') }}</button> 
                 </div>
             </div>
         </form>
 
-        <b-loading :active.sync="isLoading" :canCancel="false">
-    </div>
+        <b-loading 
+                :active.sync="isLoading" 
+                :can-cancel="false"/></div>
 </template>
 
 <script>
diff --git a/src/admin/components/lists/categories-list.vue b/src/admin/components/lists/categories-list.vue
index bc86bf622..d95ae5af8 100644
--- a/src/admin/components/lists/categories-list.vue
+++ b/src/admin/components/lists/categories-list.vue
@@ -1,12 +1,14 @@
 <template>
     <div>
-        <b-field grouped group-multiline>
+        <b-field 
+                grouped 
+                group-multiline>
             <button
                     v-if="selectedCategories.length > 0"
                     class="button field is-danger"
                     @click="deleteSelectedCategories()">
                 <span>{{ $i18n.get('instruction_delete_selected_categories') }} </span>
-                <b-icon icon="delete"></b-icon>
+                <b-icon icon="delete"/>
             </button>
         </b-field>
 
@@ -43,7 +45,10 @@
                         property="description"
                         show-overflow-tooltip
                         field="props.row.description">
-                    <router-link class="clickable-row" tag="span" :to="{path: $routerHelper.getCategoryPath(props.row.id)}">
+                    <router-link 
+                            class="clickable-row" 
+                            tag="span" 
+                            :to="{path: $routerHelper.getCategoryPath(props.row.id)}">
                         {{ props.row.description }}
                     </router-link>
                 </b-table-column>
@@ -58,13 +63,17 @@
                             id="button-edit"
                             :aria-label="$i18n.getFrom('categories','edit_item')"
                             @click.prevent.stop="goToCategoryEditPage(props.row.id)">
-                        <b-icon type="is-gray" icon="pencil" ></b-icon>
+                        <b-icon 
+                                type="is-gray" 
+                                icon="pencil" />
                     </a>
                     <a
                             id="button-delete"
                             :aria-label="$i18n.get('label_button_delete')"
                             @click.prevent.stop="deleteOneCategory(props.row.id)">
-                        <b-icon type="is-gray" icon="delete" ></b-icon>
+                        <b-icon 
+                                type="is-gray" 
+                                icon="delete" />
                     </a>
                 </b-table-column>
             </template>
@@ -77,12 +86,13 @@
                     <p>
                         <b-icon
                                 icon="inbox"
-                                size="is-large">
-                        </b-icon>
+                                size="is-large"/>
                     </p>
                     <p>{{ $i18n.get('info_no_category_created') }}</p>
-                    <router-link tag="button" class="button is-secondary"
-                                 :to="{ path: $routerHelper.getNewCategoryPath() }">
+                    <router-link 
+                            tag="button" 
+                            class="button is-secondary"
+                            :to="{ path: $routerHelper.getNewCategoryPath() }">
                         {{ $i18n.get('new') + ' ' + $i18n.get('category') }}
                     </router-link>
                 </div>
@@ -101,7 +111,7 @@
             totalCategories: 0,
             page: 1,
             categoriesPerPage: 12,
-            categories: []
+            categories: Array
         },
         data() {
             return {
diff --git a/src/admin/components/lists/collections-list.vue b/src/admin/components/lists/collections-list.vue
index 487f7800e..af690fe8a 100644
--- a/src/admin/components/lists/collections-list.vue
+++ b/src/admin/components/lists/collections-list.vue
@@ -1,7 +1,12 @@
 <template>
     <div>     
-        <b-field grouped group-multiline>
-            <button v-if="selectedCollections.length > 0" class="button field is-danger" @click="deleteSelectedCollections()"><span>{{$i18n.get('instruction_delete_selected_collections')}} </span><b-icon icon="delete"></b-icon></button>
+        <b-field 
+                grouped 
+                group-multiline>
+            <button 
+                    v-if="selectedCollections.length > 0" 
+                    class="button field is-danger" 
+                    @click="deleteSelectedCollections()"><span>{{ $i18n.get('instruction_delete_selected_collections') }} </span><b-icon icon="delete"/></button>
         </b-field>
         <b-table
                 ref="collectionTable"
@@ -15,33 +20,84 @@
                 backend-sorting>
             <template slot-scope="props">
                 
-                <b-table-column tabindex="0" :label="$i18n.get('label_thumbnail')" :aria-label="$i18n.get('label_thumbnail')" field="featured_image" width="55">
-                    <template v-if="props.row.featured_image" slot-scope="scope">
-                        <router-link tag="img" :to="{path: $routerHelper.getCollectionPath(props.row.id)}" class="table-thumb clickable-row" :src="`${props.row.featured_image}`"></router-link>
+                <b-table-column 
+                        tabindex="0" 
+                        :label="$i18n.get('label_thumbnail')" 
+                        :aria-label="$i18n.get('label_thumbnail')" 
+                        field="featured_image" 
+                        width="55">
+                    <template 
+                            v-if="props.row.featured_image" 
+                            slot-scope="scope">
+                        <router-link 
+                                tag="img" 
+                                :to="{path: $routerHelper.getCollectionPath(props.row.id)}" 
+                                class="table-thumb clickable-row" 
+                                :src="`${props.row.featured_image}`"/>
                     </template>
                 </b-table-column>
 
-                <b-table-column tabindex="0" :label="$i18n.get('label_name')" :aria-label="$i18n.get('label_name')" field="props.row.name">
-                    <router-link class="clickable-row" tag="span" :to="{path: $routerHelper.getCollectionPath(props.row.id)}">
+                <b-table-column 
+                        tabindex="0" 
+                        :label="$i18n.get('label_name')" 
+                        :aria-label="$i18n.get('label_name')" 
+                        field="props.row.name">
+                    <router-link 
+                            class="clickable-row" 
+                            tag="span" 
+                            :to="{path: $routerHelper.getCollectionPath(props.row.id)}">
                     {{ props.row.name }}
                     </router-link>
                 </b-table-column>
 
-                <b-table-column tabindex="0" :aria-label="$i18n.get('label_description')" :label="$i18n.get('label_description')" property="description" show-overflow-tooltip field="props.row.description">
-                    <router-link class="clickable-row" tag="span" :to="{path: $routerHelper.getCollectionPath(props.row.id)}">
+                <b-table-column 
+                        tabindex="0" 
+                        :aria-label="$i18n.get('label_description')" 
+                        :label="$i18n.get('label_description')" 
+                        property="description" 
+                        show-overflow-tooltip 
+                        field="props.row.description">
+                    <router-link 
+                            class="clickable-row" 
+                            tag="span" 
+                            :to="{path: $routerHelper.getCollectionPath(props.row.id)}">
                     {{ props.row.description }}
                     </router-link>
                 </b-table-column>
 
-                <b-table-column class="row-creation" tabindex="0" :aria-label="$i18n.get('label_creation') + ': ' + props.row.creation" :label="$i18n.get('label_creation')" property="creation" show-overflow-tooltip field="props.row.creation">
-                    <router-link class="clickable-row" v-html="props.row.creation" tag="span" :to="{path: $routerHelper.getCollectionPath(props.row.id)}">
-                    </router-link>
+                <b-table-column 
+                        class="row-creation" 
+                        tabindex="0" 
+                        :aria-label="$i18n.get('label_creation') + ': ' + props.row.creation" 
+                        :label="$i18n.get('label_creation')" 
+                        property="creation" 
+                        show-overflow-tooltip 
+                        field="props.row.creation">
+                    <router-link 
+                            class="clickable-row" 
+                            v-html="props.row.creation" 
+                            tag="span" 
+                            :to="{path: $routerHelper.getCollectionPath(props.row.id)}"/>
                 </b-table-column>
 
-                <b-table-column tabindex="0" :label="$i18n.get('label_actions')" width="78" :aria-label="$i18n.get('label_actions')">
+                <b-table-column 
+                        tabindex="0" 
+                        :label="$i18n.get('label_actions')" 
+                        width="78" 
+                        :aria-label="$i18n.get('label_actions')">
                     <!-- <a id="button-view" :aria-label="$i18n.get('label_button_view')" @click.prevent.stop="goToCollectionPage(props.row.id)"><b-icon icon="eye"></a> -->
-                    <a id="button-edit" :aria-label="$i18n.getFrom('collections','edit_item')" @click.prevent.stop="goToCollectionEditPage(props.row.id)"><b-icon type="is-gray" icon="pencil"></a>
-                    <a id="button-delete" :aria-label="$i18n.get('label_button_delete')" @click.prevent.stop="deleteOneCollection(props.row.id)"><b-icon type="is-gray" icon="delete"></a>
+                    <a 
+                            id="button-edit" 
+                            :aria-label="$i18n.getFrom('collections','edit_item')" 
+                            @click.prevent.stop="goToCollectionEditPage(props.row.id)"><b-icon 
+                            type="is-gray" 
+                            icon="pencil"/></a>
+                    <a 
+                            id="button-delete" 
+                            :aria-label="$i18n.get('label_button_delete')" 
+                            @click.prevent.stop="deleteOneCollection(props.row.id)"><b-icon 
+                            type="is-gray" 
+                            icon="delete"/></a>
                 </b-table-column>
             </template>
 
@@ -52,12 +108,13 @@
                         <p>
                             <b-icon
                                 icon="inbox"
-                                size="is-large">
-                            </b-icon>
+                                size="is-large"/>
                         </p>
-                        <p>{{$i18n.get('info_no_collection_created')}}</p>
-                        <router-link tag="button" class="button is-primary"
-                                    :to="{ path: $routerHelper.getNewCollectionPath() }">
+                        <p>{{ $i18n.get('info_no_collection_created') }}</p>
+                        <router-link 
+                                tag="button" 
+                                class="button is-primary"
+                                :to="{ path: $routerHelper.getNewCollectionPath() }">
                             {{ $i18n.getFrom('collections', 'new_item') }}
                         </router-link>
                     </div>
@@ -83,7 +140,7 @@ export default {
         totalCollections: 0,
         page: 1,
         collectionsPerPage: 12,
-        collections: []
+        collections: Array
     },
     methods: {
         ...mapActions('collection', [
diff --git a/src/admin/components/lists/fields-list.vue b/src/admin/components/lists/fields-list.vue
index 809648a83..a18e5c653 100644
--- a/src/admin/components/lists/fields-list.vue
+++ b/src/admin/components/lists/fields-list.vue
@@ -1,77 +1,94 @@
 <template>
     <div>
-        <b-loading :active.sync="isLoadingFieldTypes"></b-loading>
+        <b-loading :active.sync="isLoadingFieldTypes"/>
         <div class="page-title">
-            <h2>{{ isRepositoryLevel ? $i18n.get('instruction_dragndrop_fields_repository') : $i18n.get('instruction_dragndrop_fields_collection')}}</h2>
+            <h2>{{ isRepositoryLevel ? $i18n.get('instruction_dragndrop_fields_repository') : $i18n.get('instruction_dragndrop_fields_collection') }}</h2>
         </div>
         <div class="columns">
             <div class="column">        
                 <draggable 
-                    class="active-fields-area"
-                    @change="handleChange"
-                    :class="{'fields-area-receive': isDraggingFromAvailable}" 
-                    :list="activeFieldList" 
-                    :options="{ 
-                            group: { name:'fields', pull: false, put: true }, 
-                            sort: openedFieldId == '' || openedFieldId == undefined, 
-                            disabled: openedFieldId != '' && openedFieldId != undefined,
-                            handle: '.handle', 
-                            ghostClass: 'sortable-ghost',
-                            filter: 'not-sortable-item', 
-                            animation: '250'}">
+                        class="active-fields-area"
+                        @change="handleChange"
+                        :class="{'fields-area-receive': isDraggingFromAvailable}" 
+                        :list="activeFieldList" 
+                        :options="{ 
+                                group: { name:'fields', pull: false, put: true }, 
+                                sort: openedFieldId == '' || openedFieldId == undefined, 
+                                disabled: openedFieldId != '' && openedFieldId != undefined,
+                                handle: '.handle', 
+                                ghostClass: 'sortable-ghost',
+                                filter: 'not-sortable-item', 
+                                animation: '250'}">
                     <div  
-                        class="active-field-item"
-                        :class="{
-                            'not-sortable-item': field.id == undefined || openedFieldId != '' , 
-                            'not-focusable-item': openedFieldId == field.id, 
-                            'disabled-field': field.enabled == false}" 
-                        v-for="(field, index) in activeFieldList" :key="index">
+                            class="active-field-item"
+                            :class="{
+                                'not-sortable-item': field.id == undefined || openedFieldId != '' , 
+                                'not-focusable-item': openedFieldId == field.id, 
+                                'disabled-field': field.enabled == false
+                            }" 
+                            v-for="(field, index) in activeFieldList" 
+                            :key="index">
                         <div class="handle">
-                            <grip-icon></grip-icon>
+                            <grip-icon/>
                             <span 
-                                class="field-name" 
-                                :class="{'is-danger': formWithErrors == field.id }">
-                                {{ field.name }}
+                                    class="field-name" 
+                                    :class="{'is-danger': formWithErrors == field.id }">
+                                    {{ field.name }}
                             </span>
                             <span   
-                                v-if="field.id != undefined"
-                                class="label-details">  
-                                  ({{ $i18n.get(field.field_type_object.component) }})  
-                                    <span class="not-saved" v-if="(editForms[field.id] != undefined && editForms[field.id].saved != true) || field.status == 'auto-draft'"> 
+                                    v-if="field.id != undefined"
+                                    class="label-details">  
+                                 ({{ $i18n.get(field.field_type_object.component) }})  
+                                    <span 
+                                        class="not-saved" 
+                                        v-if="(editForms[field.id] != undefined && editForms[field.id].saved != true) || field.status == 'auto-draft'"> 
                                       {{ $i18n.get('info_not_saved') }}
                                     </span>
                             </span>
-                            <span class="loading-spinner" v-if="field.id == undefined"></span>
-                            <span class="controls" v-if="field.id !== undefined">
-                                <b-switch size="is-small" v-model="field.enabled" @input="onChangeEnable($event, index)"></b-switch>
-                                <a  :style="{ visibility: 
+                            <span 
+                                    class="loading-spinner" 
+                                    v-if="field.id == undefined"/>
+                            <span 
+                                    class="controls" 
+                                    v-if="field.id !== undefined">
+                                <b-switch 
+                                        size="is-small" 
+                                        v-model="field.enabled" 
+                                        @input="onChangeEnable($event, index)"/>
+                                <a 
+                                        :style="{ visibility: 
                                                 field.collection_id != collectionId 
                                                 ? 'hidden' : 'visible'
                                             }" 
-                                    @click.prevent="editField(field)">
-                                    <b-icon type="is-gray" icon="pencil"></b-icon>
+                                        @click.prevent="editField(field)">
+                                    <b-icon 
+                                            type="is-gray" 
+                                            icon="pencil"/>
                                 </a>
-                                <a  :style="{ visibility: 
+                                <a 
+                                        :style="{ visibility: 
                                                 field.collection_id != collectionId || 
                                                 field.field_type == 'Tainacan\\Field_Types\\Core_Title' || 
                                                 field.field_type == 'Tainacan\\Field_Types\\Core_Description' 
                                                 ? 'hidden' : 'visible'
                                             }" 
-                                    @click.prevent="removeField(field)">
-                                    <b-icon type="is-gray" icon="delete"></b-icon>
+                                        @click.prevent="removeField(field)">
+                                    <b-icon 
+                                            type="is-gray" 
+                                            icon="delete"/>
                                 </a>
                             </span>
                         </div>
                         <div v-if="openedFieldId == field.id">
                             <field-edition-form   
-                                :collectionId="collectionId"
-                                :isRepositoryLevel="isRepositoryLevel"
-                                @onEditionFinished="onEditionFinished()"
-                                @onEditionCanceled="onEditionCanceled()"
-                                @onErrorFound="formWithErrors = field.id"
-                                :index="index"
-                                :originalField="field"
-                                :editedField="editForms[field.id]"></field-edition-form>
+                                    :collection-id="collectionId"
+                                    :is-repository-level="isRepositoryLevel"
+                                    @onEditionFinished="onEditionFinished()"
+                                    @onEditionCanceled="onEditionCanceled()"
+                                    @onErrorFound="formWithErrors = field.id"
+                                    :index="index"
+                                    :original-field="field"
+                                    :edited-field="editForms[field.id]"/>
                         </div>
                     </div>
                 </draggable> 
@@ -79,23 +96,25 @@
           
             <div class="column available-fields-area" >
                 <div class="field">
-                    <h3 class="label">{{ $i18n.get('label_available_field_types')}}</h3>
+                    <h3 class="label">{{ $i18n.get('label_available_field_types') }}</h3>
                     <draggable 
-                        :list="availableFieldList" 
-                        :options="{ 
-                            sort: false, 
-                            group: { name:'fields', pull: 'clone', put: false, revertClone: true },
-                            dragClass: 'sortable-drag'
-                        }">
+                            :list="availableFieldList" 
+                            :options="{ 
+                                sort: false, 
+                                group: { name:'fields', pull: 'clone', put: false, revertClone: true },
+                                dragClass: 'sortable-drag'
+                            }">
                         <div 
-                            @click.prevent="addFieldViaButton(field)" 
-                            class="available-field-item"
-                            :class="{ 'hightlighted-field' : hightlightedField == field.name }" 
-                            v-for="(field, index) in availableFieldList" 
-                            :key="index">
-                           <grip-icon></grip-icon>  
+                                @click.prevent="addFieldViaButton(field)" 
+                                class="available-field-item"
+                                :class="{ 'hightlighted-field' : hightlightedField == field.name }" 
+                                v-for="(field, index) in availableFieldList" 
+                                :key="index">
+                           <grip-icon/>  
                              <span class="field-name">{{ field.name }}</span> 
-                             <span class="loading-spinner" v-if="hightlightedField == field.name"></span>   
+                             <span 
+                                    class="loading-spinner" 
+                                    v-if="hightlightedField == field.name"/>   
                         </div>
                     </draggable>
                 </div>
diff --git a/src/admin/components/lists/filters-items-list.vue b/src/admin/components/lists/filters-items-list.vue
index 42f083913..557716ca1 100644
--- a/src/admin/components/lists/filters-items-list.vue
+++ b/src/admin/components/lists/filters-items-list.vue
@@ -3,8 +3,8 @@
         <tainacan-filters-list
                 :query="getPostQuery()"
                 v-for="(filter, index) in filters"
-                v-bind:key="index"
-                :filter="filter"></tainacan-filters-list>
+                :key="index"
+                :filter="filter"/>
     </div>
 </template>
 <script>
diff --git a/src/admin/components/lists/filters-list.vue b/src/admin/components/lists/filters-list.vue
index a00a94f9a..895153eb2 100644
--- a/src/admin/components/lists/filters-list.vue
+++ b/src/admin/components/lists/filters-list.vue
@@ -1,120 +1,136 @@
 <template>
     <div>
-        <b-loading :active.sync="isLoadingFieldTypes"></b-loading>
+        <b-loading :active.sync="isLoadingFieldTypes"/>
         <div class="page-title">
             <h2>{{ isRepositoryLevel ? $i18n.get('instruction_dragndrop_filters_collection') : $i18n.get('instruction_dragndrop_filters_collection') }}</h2>
         </div>
         <div class="columns">
             <div class="column">         
                 <draggable 
-                    class="active-filters-area"
-                    @change="handleChange"
-                    :class="{'filters-area-receive': isDraggingFromAvailable}" 
-                    :list="activeFilterList" 
-                    :options="{
-                        group: { name:'filters', pull: false, put: true }, 
-                        sort: openedFilterId == '' || openedFilterId == undefined, 
-                        disabled: openedFilterId != '' && openedFilterId != undefined,
-                        handle: '.handle', 
-                        ghostClass: 'sortable-ghost',
-                        filter: 'not-sortable-item', 
-                        animation: '250'}">
+                        class="active-filters-area"
+                        @change="handleChange"
+                        :class="{'filters-area-receive': isDraggingFromAvailable}" 
+                        :list="activeFilterList" 
+                        :options="{
+                            group: { name:'filters', pull: false, put: true }, 
+                            sort: openedFilterId == '' || openedFilterId == undefined, 
+                            disabled: openedFilterId != '' && openedFilterId != undefined,
+                            handle: '.handle', 
+                            ghostClass: 'sortable-ghost',
+                            filter: 'not-sortable-item', 
+                            animation: '250'}">
                     <div  
-                        class="active-filter-item" 
-                        :class="{
-                            'not-sortable-item': filter.id == undefined || openedFilterId != '' || choosenField.name == filter.name, 
-                            'not-focusable-item': openedFilterId == filter.id, 
-                            'disabled-filter': filter.enabled == false
-                        }" 
-                        v-for="(filter, index) in activeFilterList" :key="index">
-                            <div class="handle">
-                                <grip-icon></grip-icon>
-                                <span 
+                            class="active-filter-item" 
+                            :class="{
+                                'not-sortable-item': filter.id == undefined || openedFilterId != '' || choosenField.name == filter.name, 
+                                'not-focusable-item': openedFilterId == filter.id, 
+                                'disabled-filter': filter.enabled == false
+                            }" 
+                            v-for="(filter, index) in activeFilterList" 
+                            :key="index">
+                        <div class="handle">
+                            <grip-icon/>
+                            <span 
                                     class="filter-name"
                                     :class="{'is-danger': formWithErrors == filter.id }">
                                     {{ filter.name }}
-                                </span>
-                                <span   
-                                    v-if="filter.filter_type_object != undefined"
-                                    class="label-details">  
-                                    ({{ $i18n.get(filter.filter_type_object.component) }})  
-                                        <span class="not-saved" v-if="(editForms[filter.id] != undefined && editForms[filter.id].saved != true) ||filter.status == 'auto-draft'"> 
+                            </span>
+                            <span   
+                                v-if="filter.filter_type_object != undefined"
+                                class="label-details">  
+                                ({{ $i18n.get(filter.filter_type_object.component) }})  
+                                    <span 
+                                            class="not-saved" 
+                                            v-if="(editForms[filter.id] != undefined && editForms[filter.id].saved != true) ||filter.status == 'auto-draft'"> 
                                         {{ $i18n.get('info_not_saved') }}
-                                        </span>
-                                </span> 
-                                <span class="loading-spinner" v-if="filter.id == undefined"></span>
-                                <span class="controls" v-if="filter.filter_type != undefined">
-                                    <b-switch size="is-small" v-model="filter.enabled" @input="onChangeEnable($event, index)"></b-switch>
-                                    <a  :style="{ visibility: filter.collection_id != collectionId ? 'hidden' : 'visible' }" 
+                                    </span>
+                            </span> 
+                            <span 
+                                    class="loading-spinner" 
+                                    v-if="filter.id == undefined"/>
+                            <span 
+                                    class="controls" 
+                                    v-if="filter.filter_type != undefined">
+                                <b-switch 
+                                        size="is-small" 
+                                        v-model="filter.enabled" 
+                                        @input="onChangeEnable($event, index)"/>
+                                <a 
+                                        :style="{ visibility: filter.collection_id != collectionId ? 'hidden' : 'visible' }" 
                                         @click.prevent="editFilter(filter)">
-                                        <b-icon type="is-gray" icon="pencil"></b-icon>
-                                    </a>
-                                    <a :style="{ visibility: filter.collection_id != collectionId ? 'hidden' : 'visible' }" 
+                                    <b-icon 
+                                            type="is-gray" 
+                                            icon="pencil"/>
+                                </a>
+                                <a 
+                                        :style="{ visibility: filter.collection_id != collectionId ? 'hidden' : 'visible' }" 
                                         @click.prevent="removeFilter(filter)">
-                                        <b-icon type="is-gray" icon="delete"></b-icon>
-                                    </a>
-                                </span>
-                            </div>
-                            <div v-if="choosenField.name == filter.name && openedFilterId == ''">
-                                <form class="tainacan-form">
-                                    <b-field :label="$i18n.get('label_filter_type')">
-                                        <b-select
-                                                v-model="selectedFilterType"
-                                                :placeholder="$i18n.get('instruction_select_a_filter_type')">
-                                            <option 
+                                    <b-icon 
+                                            type="is-gray" 
+                                            icon="delete"/>
+                                </a>
+                            </span>
+                        </div>
+                        <div v-if="choosenField.name == filter.name && openedFilterId == ''">
+                            <form class="tainacan-form">
+                                <b-field :label="$i18n.get('label_filter_type')">
+                                    <b-select
+                                            v-model="selectedFilterType"
+                                            :placeholder="$i18n.get('instruction_select_a_filter_type')">
+                                        <option 
                                                 v-for="(filterType, index) in allowedFilterTypes" 
                                                 :key="index"
                                                 :selected="index == 0"
                                                 :value="filterType">
                                                 {{ filterType.name }}</option>  
-                                        </b-select>
-                                    </b-field>
-                                    <div class="field is-grouped form-submit">
-                                        <div class="control"> 
-                                            <button 
+                                    </b-select>
+                                </b-field>
+                                <div class="field is-grouped form-submit">
+                                    <div class="control"> 
+                                        <button 
                                                 class="button is-outlined" 
                                                 @click.prevent="cancelFilterTypeSelection()" 
-                                                slot="trigger">{{ $i18n.get('cancel')}}</button>
-                                        </div>
-                                        <div class="control">
-                                            <button 
+                                                slot="trigger">{{ $i18n.get('cancel') }}</button>
+                                    </div>
+                                    <div class="control">
+                                        <button 
                                                 class="button is-success" 
                                                 type="submit" 
                                                 :disabled="Object.keys(selectedFilterType).length == 0"
-                                                @click.prevent="confirmSelectedFilterType()">{{ $i18n.get('next')}}</button>
-                                        </div>
-                                        
+                                                @click.prevent="confirmSelectedFilterType()">{{ $i18n.get('next') }}</button>
                                     </div>
-                                </form>
-                            </div>
-                            <b-field v-if="openedFilterId == filter.id">
-                                <filter-edition-form
+                                    
+                                </div>
+                            </form>
+                        </div>
+                        <b-field v-if="openedFilterId == filter.id">
+                            <filter-edition-form
                                     @onEditionFinished="onEditionFinished()"
                                     @onEditionCanceled="onEditionCanceled()"
                                     @onErrorFound="formWithErrors = filter.id"
                                     :index="index"
-                                    :originalFilter="filter"
-                                    :editedFilter="editForms[openedFilterId]"></filter-edition-form>
-                            </b-field>
-                        </div>
+                                    :original-filter="filter"
+                                    :edited-filter="editForms[openedFilterId]"/>
+                        </b-field>
+                    </div>
                 </draggable> 
             </div>
             <div class="column available-fields-area">
                 <div class="field">
                     <h3 class="label"> {{ $i18n.get('label_available_field_types') }}</h3>
                     <draggable 
-                        :list="availableFieldList" 
-                        :options="{ 
-                            sort: false, 
-                            group: { name:'filters', pull: true, put: false, revertClone: true },
-                            dragClass: 'sortable-drag'
-                        }">
+                            :list="availableFieldList" 
+                            :options="{ 
+                                sort: false, 
+                                group: { name:'filters', pull: true, put: false, revertClone: true },
+                                dragClass: 'sortable-drag'
+                            }">
                         <div 
-                            class="available-field-item"
-                            v-for="(field, index) in availableFieldList" 
-                            :key="index"
-                            @click.prevent="addFieldViaButton(field, index)">  
-                            <grip-icon></grip-icon> 
+                                class="available-field-item"
+                                v-for="(field, index) in availableFieldList" 
+                                :key="index"
+                                @click.prevent="addFieldViaButton(field, index)">  
+                            <grip-icon/> 
                               <span class="field-name">{{ field.name }}</span>
                         </div>
                     </draggable>   
diff --git a/src/admin/components/lists/items-list.vue b/src/admin/components/lists/items-list.vue
index 73f3b655f..b1a569e77 100644
--- a/src/admin/components/lists/items-list.vue
+++ b/src/admin/components/lists/items-list.vue
@@ -1,7 +1,14 @@
 <template>
     <div>
-        <b-field grouped group-multiline>
-            <button v-if="selectedItems.length > 0" class="button field is-danger" @click="deleteSelectedItems()"><span>{{$i18n.get('instruction_delete_selected_items')}} </span><b-icon icon="delete"></b-icon></button>
+        <b-field 
+                grouped 
+                group-multiline>
+                        <button 
+                                v-if="selectedItems.length > 0" 
+                                class="button field is-danger" 
+                                @click="deleteSelectedItems()">
+                            <span>{{ $i18n.get('instruction_delete_selected_items') }} </span><b-icon icon="delete"/>
+                        </button>
         </b-field>
         <b-table 
                 ref="itemsTable"
@@ -15,27 +22,44 @@
                 selectable
                 backend-sorting>
             <template slot-scope="props">
-
-                <b-table-column v-for="(column, index) in tableFields"
-                    :key="index"
-                    :label="column.label"
-                    :visible="column.visible"
-                    :width="column.field == 'row_actions' ? 78 : column.field == 'featured_image' ? 55 : undefined ">
-                    
-                    <router-link tag="span" class="clickable-row" :to="{path: $routerHelper.getItemPath(collectionId, props.row.id)}">
+                <b-table-column 
+                        v-for="(column, index) in tableFields"
+                        :key="index"
+                        :label="column.label"
+                        :visible="column.visible"
+                        :width="column.field == 'row_actions' ? 78 : column.field == 'featured_image' ? 55 : undefined ">
+                        
+                    <router-link 
+                            tag="span" 
+                            class="clickable-row" 
+                            :to="{path: $routerHelper.getItemPath(collectionId, props.row.id)}">
                         <template v-if="column.field != 'featured_image' && column.field != 'row_actions'">
-                            {{  showValue( props.row.metadata[column.slug] ) }}
+                            {{ showValue( props.row.metadata[column.slug] ) }}
                         </template>
                     </router-link>
                     
                     <template v-if="column.field == 'featured_image'">
-                        <router-link tag="img" class="table-thumb clickable-row" :to="{path: $routerHelper.getItemPath(collectionId, props.row.id)}" :src="props.row[column.slug]"></router-link>
+                        <router-link 
+                                tag="img" 
+                                class="table-thumb clickable-row" 
+                                :to="{path: $routerHelper.getItemPath(collectionId, props.row.id)}" 
+                                :src="props.row[column.slug]"/>
                     </template>
                          
                     <template v-if="column.field == 'row_actions'">
                         <!-- <a id="button-view" @click.prevent.stop="goToItemPage(props.row.id)"><b-icon icon="eye"></a> -->
-                        <a id="button-edit" :aria-label="$i18n.getFrom('items','edit_item')" @click="goToItemEditPage(props.row.id)"><b-icon type="is-gray" icon="pencil"></a>
-                        <a id="button-delete" :aria-label="$i18n.get('label_button_delete')" @click="deleteOneItem(props.row.id)"><b-icon type="is-gray" icon="delete"></a>
+                        <a 
+                                id="button-edit" 
+                                :aria-label="$i18n.getFrom('items','edit_item')" 
+                                @click="goToItemEditPage(props.row.id)"><b-icon 
+                                type="is-gray" 
+                                icon="pencil"/></a>
+                        <a 
+                                id="button-delete" 
+                                :aria-label="$i18n.get('label_button_delete')" 
+                                @click="deleteOneItem(props.row.id)"><b-icon 
+                                type="is-gray" 
+                                icon="delete"/></a>
                     </template>
                 </b-table-column>
 
@@ -46,15 +70,15 @@
                     <div class="content has-text-grey has-text-centered">
                         <p>
                             <b-icon
-                                icon="inbox"
-                                size="is-large">
-                            </b-icon>
+                                    icon="inbox"
+                                    size="is-large"/>
                         </p>
-                        <p>{{$i18n.get('info_no_item_created')}}</p>
+                        <p>{{ $i18n.get('info_no_item_created') }}</p>
                         <router-link
-                                    id="button-create" 
-                                    tag="button" class="button is-primary"
-                                    :to="{ path: $routerHelper.getNewItemPath(collectionId) }">
+                                id="button-create" 
+                                tag="button" 
+                                class="button is-primary"
+                                :to="{ path: $routerHelper.getNewItemPath(collectionId) }">
                             {{ $i18n.getFrom('items', 'new_item') }}
                         </router-link>
                     </div>
@@ -76,12 +100,12 @@ export default {
     },
     props: {
         collectionId: Number,
-        tableFields: [],
-        prefTableFields: [],
+        tableFields: Array,
+        prefTableFields: Array,
         totalItems: 0,
         page: 1,
         itemsPerPage: 12,
-        items: [],
+        items: Array,
         isLoading: false
     },
     methods: {
diff --git a/src/admin/components/navigation/primary-menu.vue b/src/admin/components/navigation/primary-menu.vue
index b28e0ef09..a6e006da8 100644
--- a/src/admin/components/navigation/primary-menu.vue
+++ b/src/admin/components/navigation/primary-menu.vue
@@ -1,11 +1,25 @@
 <template>
-    <nav id="primary-menu" :class="isCompressed ? 'is-compressed' : ''" role="navigation" :aria-label="$i18n.get('label_main_menu')" class="column is-sidebar-menu">
+    <nav 
+            id="primary-menu" 
+            :class="isCompressed ? 'is-compressed' : ''" 
+            role="navigation" 
+            :aria-label="$i18n.get('label_main_menu')" 
+            class="column is-sidebar-menu">
         <aside class="menu">
             <div class="menu-header">
-                <ul class="menu-list"><li><router-link tag="a" to="/">
-                    <b-icon size="is-medium" icon="chevron-left"></b-icon>
-                    <img class="tainacan-logo" alt="Tainacan Logo" :src="logoHeader"/>
-                </router-link></li></ul> 
+                <ul class="menu-list"><li>
+                    <router-link 
+                            tag="a" 
+                            to="/">
+                        <b-icon 
+                                size="is-medium" 
+                                icon="chevron-left"/>
+                        <img 
+                                class="tainacan-logo" 
+                                alt="Tainacan Logo" 
+                                :src="logoHeader">
+                    </router-link>
+                </li></ul> 
             </div>
             
             <ul class="menu-list">
@@ -15,32 +29,65 @@
                             :placeholder="$i18n.get('search')"
                             type="search"
                             size="is-small"
-                            icon="magnify">
-                        </b-input>
+                            icon="magnify"/>
                     </b-field>
-                    <router-link tag="a" to="">
-                        <b-icon size="is-small" icon="magnify"></b-icon> <span class="menu-text">{{ $i18n.get('advanced_search')}}</span>
+                    <router-link 
+                            tag="a" 
+                            to="">
+                        <b-icon 
+                                size="is-small" 
+                                icon="magnify"/> <span class="menu-text">{{ $i18n.get('advanced_search') }}</span>
                     </router-link>
                 </li>
-                <li class="separator"></li>
-                <li><router-link tag="a" to="/collections" :class="activeRoute == 'CollectionsPage' || isCompressed ? 'is-active':''">
-                    <b-icon size="is-small" icon="folder-multiple"></b-icon> <span class="menu-text">{{ $i18n.getFrom('collections', 'name') }}</span>
+                <li class="separator"/>
+                <li><router-link 
+                        tag="a" 
+                        to="/collections" 
+                        :class="activeRoute == 'CollectionsPage' || isCompressed ? 'is-active':''">
+                    <b-icon 
+                            size="is-small" 
+                            icon="folder-multiple"/> <span class="menu-text">{{ $i18n.getFrom('collections', 'name') }}</span>
                 </router-link></li>
-                <li><router-link tag="a" to="/items" :class="activeRoute == 'ItemsPage' ? 'is-active':''">
-                    <b-icon size="is-small" icon="file-multiple"></b-icon> <span class="menu-text">{{ $i18n.getFrom('items', 'name') }}</span>
+                <li><router-link 
+                        tag="a" 
+                        to="/items" 
+                        :class="activeRoute == 'ItemsPage' ? 'is-active':''">
+                    <b-icon 
+                            size="is-small" 
+                            icon="file-multiple"/> <span class="menu-text">{{ $i18n.getFrom('items', 'name') }}</span>
                 </router-link></li>
-                <li class="separator"></li>
-                <li><router-link tag="a" to="/fields" :class="activeRoute == 'FieldsPage' ? 'is-active':''">
-                    <b-icon size="is-small" icon="format-list-checks"></b-icon> <span class="menu-text">{{ $i18n.getFrom('fields', 'name') }}</span>
+                <li class="separator"/>
+                <li><router-link 
+                        tag="a" 
+                        to="/fields" 
+                        :class="activeRoute == 'FieldsPage' ? 'is-active':''">
+                    <b-icon 
+                            size="is-small" 
+                            icon="format-list-checks"/> <span class="menu-text">{{ $i18n.getFrom('fields', 'name') }}</span>
                 </router-link></li>
-                <li><router-link tag="a" to="/filters" :class="activeRoute == 'FiltersPage' ? 'is-active':''">
-                    <b-icon size="is-small" icon="filter"></b-icon> <span class="menu-text">{{ $i18n.getFrom('filters', 'name') }}</span>
+                <li><router-link 
+                        tag="a" 
+                        to="/filters" 
+                        :class="activeRoute == 'FiltersPage' ? 'is-active':''">
+                    <b-icon 
+                            size="is-small" 
+                            icon="filter"/> <span class="menu-text">{{ $i18n.getFrom('filters', 'name') }}</span>
                 </router-link></li>
-                <li><router-link tag="a" to="/categories" :class="activeRoute == 'CategoriesPage' ? 'is-active':''">
-                    <b-icon size="is-small" icon="shape"></b-icon> <span class="menu-text">{{ $i18n.getFrom('categories', 'name') }}</span>
+                <li><router-link 
+                        tag="a" 
+                        to="/categories" 
+                        :class="activeRoute == 'CategoriesPage' ? 'is-active':''">
+                    <b-icon 
+                        size="is-small" 
+                        icon="shape"/> <span class="menu-text">{{ $i18n.getFrom('categories', 'name') }}</span>
                 </router-link></li>
-                <li><router-link tag="a" to="/events" :class="activeRoute == 'EventsPage' ? 'is-active':''">
-                    <b-icon size="is-small" icon="bell"></b-icon> <span class="menu-text">{{ $i18n.get('events') }}</span>
+                <li><router-link 
+                        tag="a" 
+                        to="/events" 
+                        :class="activeRoute == 'EventsPage' ? 'is-active':''">
+                    <b-icon 
+                            size="is-small" 
+                            icon="bell"/> <span class="menu-text">{{ $i18n.get('events') }}</span>
                 </router-link></li>
             </ul>
         </aside>
diff --git a/src/admin/components/navigation/secondary-menu.vue b/src/admin/components/navigation/secondary-menu.vue
index c3b02f0e1..872fb1edf 100644
--- a/src/admin/components/navigation/secondary-menu.vue
+++ b/src/admin/components/navigation/secondary-menu.vue
@@ -1,11 +1,25 @@
 <template>
-    <nav id="secondary-menu" role="navigation" :aria-label="$i18n.get('label_collection_menu')" class="column is-sidebar-menu">
+    <nav 
+            id="secondary-menu" 
+            role="navigation" 
+            :aria-label="$i18n.get('label_collection_menu')" 
+            class="column is-sidebar-menu">
         <aside class="menu">
             <div class="menu-header">
-                <ul class="menu-list"><li><router-link tag="a" to="/" target='_blank'>
-                    <b-icon size="is-medium" icon="chevron-left"></b-icon>
-                    <img class="tainacan-logo"  alt="Tainacan Logo" :src="logoHeader"/>
-                </router-link></li></ul> 
+                <ul class="menu-list"><li>
+                    <router-link 
+                            tag="a" 
+                            to="/" 
+                            target='_blank'>
+                        <b-icon 
+                                size="is-medium" 
+                                icon="chevron-left"/>
+                        <img 
+                                class="tainacan-logo" 
+                                alt="Tainacan Logo" 
+                                :src="logoHeader">
+                    </router-link>
+                </li></ul> 
             </div>
 
             <ul class="menu-list">
@@ -15,41 +29,52 @@
                             :placeholder="$i18n.getFrom('items', 'search_items')"
                             type="search"
                             size="is-small"
-                            icon="magnify">
-                        </b-input>
+                            icon="magnify"/>
                     </b-field>
-                    <router-link tag="a" to="">
-                        <b-icon size="is-small" icon="magnify"></b-icon> <span class="menu-text">{{ $i18n.get('advanced_search')}}</span>
+                    <router-link 
+                            tag="a" 
+                            to="">
+                        <b-icon 
+                                size="is-small" 
+                                icon="magnify"/> <span class="menu-text">{{ $i18n.get('advanced_search') }}</span>
                     </router-link>
                 </li>
-                <li class="separator"></li>
+                <li class="separator"/>
                 <li><router-link  
                         tag="a" 
                         :to="{ path: $routerHelper.getCollectionItemsPath(id, '') }" 
                         :class="activeRoute == 'ItemPage' || activeRoute == 'CollectionItemsPage' || activeRoute == 'ItemEditionForm' || activeRoute == 'ItemCreatePage' ? 'is-active':''" 
                         :aria-label="$i18n.get('label_collection_fields')">
-                    <b-icon size="is-small" icon="file-multiple"></b-icon> <span class="menu-text">{{ $i18n.getFrom('items', 'name') }}</span>
+                    <b-icon 
+                            size="is-small" 
+                            icon="file-multiple"/> <span class="menu-text">{{ $i18n.getFrom('items', 'name') }}</span>
                 </router-link></li>
                 <li><router-link 
                         tag="a" 
                         :to="{ path: $routerHelper.getCollectionEditPath(id) }" 
                         :class="activeRoute == 'CollectionEditionForm' ? 'is-active':''" 
                         :aria-label="$i18n.getFrom('collections','edit_item')">
-                    <b-icon size="is-small" icon="pencil"></b-icon> <span class="menu-text">{{ $i18n.get('edit') }}</span>
+                    <b-icon 
+                            size="is-small" 
+                            icon="pencil"/> <span class="menu-text">{{ $i18n.get('edit') }}</span>
                 </router-link></li>
                 <li><router-link 
                         tag="a" 
                         :to="{ path: $routerHelper.getCollectionFieldsPath(id) }" 
                         :class="activeRoute == 'FieldsList' ? 'is-active':''" 
                         :aria-label="$i18n.get('label_collection_fields')">
-                    <b-icon size="is-small" icon="format-list-checks"></b-icon> <span class="menu-text">{{ $i18n.getFrom('fields', 'name') }}</span>
+                    <b-icon 
+                        size="is-small" 
+                        icon="format-list-checks"/> <span class="menu-text">{{ $i18n.getFrom('fields', 'name') }}</span>
                 </router-link></li>
                 <li><router-link 
                         tag="a" 
                         :to="{ path: $routerHelper.getCollectionFiltersPath(id) }" 
                         :class="activeRoute == 'FiltersList' ? 'is-active':''" 
                         :aria-label="$i18n.get('label_collection_filters')">
-                    <b-icon size="is-small" icon="filter"></b-icon> <span class="menu-text">{{ $i18n.getFrom('filters', 'name') }}</span>
+                    <b-icon 
+                            size="is-small" 
+                            icon="filter"/> <span class="menu-text">{{ $i18n.getFrom('filters', 'name') }}</span>
                 </router-link></li>
             </ul>
         </aside>
diff --git a/src/admin/components/navigation/tainacan-header.vue b/src/admin/components/navigation/tainacan-header.vue
index 2ad1581ad..04c55f7a1 100644
--- a/src/admin/components/navigation/tainacan-header.vue
+++ b/src/admin/components/navigation/tainacan-header.vue
@@ -1,15 +1,24 @@
 <template>
-    <div id="tainacan-header" class="level" :class="{'secondary-page': onSecondaryPage}">
+    <div
+            id="tainacan-header" 
+            class="level" 
+            :class="{'secondary-page': onSecondaryPage}">
         <div class="level-left">
             <div class="level-item">
-                <h1 class="has-text-weight-bold is-uppercase has-text-primary"><b-icon size="is-small" :icon="currentIcon"></b-icon>{{pageTitle}}</h1>
+                <h1 class="has-text-weight-bold is-uppercase has-text-primary"><b-icon 
+                        size="is-small" 
+                        :icon="currentIcon"/>{{ pageTitle }}</h1>
                 <nav class="breadcrumbs">
-                    <router-link tag="a" :to="$routerHelper.getCollectionsPath()">{{ $i18n.get('repository') }}</router-link> > 
-                    <span v-for="(pathItem, index) in arrayRealPath" :key="index">
-                        <router-link 
+                    <router-link 
                             tag="a" 
-                            :to="'/' + arrayRealPath.slice(0, index + 1).join('/')">
-                                {{ arrayViewPath[index] }}
+                            :to="$routerHelper.getCollectionsPath()">{{ $i18n.get('repository') }}</router-link> > 
+                    <span 
+                            v-for="(pathItem, index) in arrayRealPath" 
+                            :key="index">
+                        <router-link 
+                                tag="a" 
+                                :to="'/' + arrayRealPath.slice(0, index + 1).join('/')">
+                            {{ arrayViewPath[index] }}
                         </router-link>
                         <span v-if="index != arrayRealPath.length - 1"> > </span>
                     </span>   
@@ -17,8 +26,10 @@
             </div>
         </div>
         <div class="level-right">
-            <a class="level-item" :href="wordpressAdmin">
-                <b-icon icon="close"></b-icon>
+            <a 
+                    class="level-item" 
+                    :href="wordpressAdmin">
+                <b-icon icon="close"/>
             </a>
         </div>
     </div>
diff --git a/src/admin/components/other/grip-icon.vue b/src/admin/components/other/grip-icon.vue
index 6a93dae9e..85fce6f6b 100644
--- a/src/admin/components/other/grip-icon.vue
+++ b/src/admin/components/other/grip-icon.vue
@@ -1,5 +1,46 @@
 <template>
-<svg xmlns="http://www.w3.org/2000/svg" width="13" height="13" viewBox="0 0 12.8 12.8" class="grip-icon"><circle cx="1.5" cy="1.5" r="1.5" class="undefined"/><circle cx="6.4" cy="1.5" r="1.5" class="undefined"/><circle cx="11.3" cy="1.5" r="1.5" class="undefined"/><circle cx="1.5" cy="6.4" r="1.5" class="undefined"/><circle cx="6.4" cy="6.4" r="1.5" class="undefined"/><circle cx="11.3" cy="6.4" r="1.5" class="undefined"/><circle cx="1.5" cy="11.3" r="1.5" class="undefined"/><circle cx="6.4" cy="11.3" r="1.5" class="undefined"/><circle cx="11.3" cy="11.3" r="1.5" class="undefined"/></svg>
+<svg 
+xmlns="http://www.w3.org/2000/svg" 
+width="13" 
+height="13" 
+viewBox="0 0 12.8 12.8" 
+class="grip-icon"><circle 
+cx="1.5" 
+cy="1.5" 
+r="1.5" 
+class="undefined"/><circle 
+cx="6.4" 
+cy="1.5" 
+r="1.5" 
+class="undefined"/><circle 
+cx="11.3" 
+cy="1.5" 
+r="1.5" 
+class="undefined"/><circle 
+cx="1.5" 
+cy="6.4" 
+r="1.5" 
+class="undefined"/><circle 
+cx="6.4" 
+cy="6.4" 
+r="1.5" 
+class="undefined"/><circle 
+cx="11.3" 
+cy="6.4" 
+r="1.5" 
+class="undefined"/><circle 
+cx="1.5" 
+cy="11.3" 
+r="1.5" 
+class="undefined"/><circle 
+cx="6.4" 
+cy="11.3" 
+r="1.5" 
+class="undefined"/><circle 
+cx="11.3" 
+cy="11.3" 
+r="1.5" 
+class="undefined"/></svg>
 </template>
 
 <script>
diff --git a/src/admin/components/other/help-button.vue b/src/admin/components/other/help-button.vue
index a831185fb..fe676504b 100644
--- a/src/admin/components/other/help-button.vue
+++ b/src/admin/components/other/help-button.vue
@@ -1,9 +1,15 @@
 <template>
     <span class="help-wrapper">
-        <a class="help-button" @click="isOpened = !isOpened"><b-icon size="is-small" icon="help-circle-outline"></b-icon></a>
-        <div class="help-tooltip" :class="{ 'opened': isOpened }">
+        <a 
+                class="help-button" 
+                @click="isOpened = !isOpened"><b-icon 
+                size="is-small" 
+                icon="help-circle-outline"/></a>
+        <div 
+                class="help-tooltip" 
+                :class="{ 'opened': isOpened }">
             <div class="help-tooltip-header">
-                <h5>{{ title }}</h5><a @click="isOpened = false"><b-icon icon="close"></b-icon></a>
+                <h5>{{ title }}</h5><a @click="isOpened = false"><b-icon icon="close"/></a>
             </div>
             <div class="help-tooltip-body">
                 <p>{{ (message != '' && message != undefined) ? message : $i18n.get('info_no_description_provided') }}</p>
diff --git a/src/admin/pages/lists/categories-page.vue b/src/admin/pages/lists/categories-page.vue
index 75f787a04..8dd61a226 100644
--- a/src/admin/pages/lists/categories-page.vue
+++ b/src/admin/pages/lists/categories-page.vue
@@ -1,10 +1,14 @@
 <template>
     <div>
         <div class="primary-page page-container-small">
-            <div class="sub-header" v-if="totalCategories > 0">
+            <div 
+                    class="sub-header" 
+                    v-if="totalCategories > 0">
                 <div class="header-item">
-                    <router-link tag="button" class="button is-secondary"
-                                 :to="{ path: $routerHelper.getNewCategoryPath() }">
+                    <router-link 
+                            tag="button" 
+                            class="button is-secondary"
+                            :to="{ path: $routerHelper.getNewCategoryPath() }">
                         {{ $i18n.get('new') + ' ' + $i18n.get('category') }}
                     </router-link>
                 </div>
@@ -13,14 +17,15 @@
             <div class="columns above-subheader">
                 <div class="column table-container">
                     <categories-list
-                            :isLoading="isLoading"
-                            :totalCategories="totalCategories"
+                            :is-loading="isLoading"
+                            :total-categories="totalCategories"
                             :page="page"
-                            :categoriesPerPage="categoriesPerPage"
-                            :categories="categories">
-                    </categories-list>
+                            :categories-per-page="categoriesPerPage"
+                            :categories="categories"/>
                     <!-- Footer -->
-                    <div class="table-footer" v-if="totalCategories > 0">
+                    <div 
+                            class="table-footer" 
+                            v-if="totalCategories > 0">
                         <div class="shown-items">
                             {{
                                 $i18n.get('info_showing_categories') +
@@ -31,7 +36,9 @@
                             }}
                         </div>
                         <div class="items-per-page">
-                            <b-field horizontal :label="$i18n.get('label_categories_per_page')">
+                            <b-field 
+                                    horizontal 
+                                    :label="$i18n.get('label_categories_per_page')">
                                 <b-select
                                         :value="categoriesPerPage"
                                         @input="onChangeCategoriesPerPage"
@@ -50,8 +57,7 @@
                                     :current.sync="page"
                                     order="is-centered"
                                     size="is-small"
-                                    :per-page="categoriesPerPage">
-                            </b-pagination>
+                                    :per-page="categoriesPerPage"/>
                         </div>
                     </div>
                 </div>
diff --git a/src/admin/pages/lists/collections-page.vue b/src/admin/pages/lists/collections-page.vue
index 031308a02..f3937f1ac 100644
--- a/src/admin/pages/lists/collections-page.vue
+++ b/src/admin/pages/lists/collections-page.vue
@@ -2,8 +2,10 @@
     <div class="primary-page page-container-small">
         <div class="sub-header">
             <div class="header-item">
-                <router-link tag="button" class="button is-secondary"
-                            :to="{ path: $routerHelper.getNewCollectionPath() }">
+                <router-link 
+                        tag="button" 
+                        class="button is-secondary"
+                        :to="{ path: $routerHelper.getNewCollectionPath() }">
                     {{ $i18n.getFrom('collections', 'new_item') }}
                 </router-link>
             </div>
@@ -14,12 +16,11 @@
             </aside>
             <div class="column table-container">
                 <collections-list
-                    :isLoading="isLoading"
-                    :totalCollections="totalCollections"
-                    :page="page"
-                    :collectionsPerPage="collectionsPerPage"
-                    :collections="collections">
-                </collections-list>  
+                        :is-loading="isLoading"
+                        :total-collections="totalCollections"
+                        :page="page"
+                        :collections-per-page="collectionsPerPage"
+                        :collections="collections"/>  
                 <!-- Footer -->
                 <div class="table-footer">
                     <div class="shown-items"> 
@@ -32,7 +33,9 @@
                         }} 
                     </div> 
                     <div class="items-per-page">
-                        <b-field horizontal :label="$i18n.get('label_collections_per_page')"> 
+                        <b-field 
+                                horizontal 
+                                :label="$i18n.get('label_collections_per_page')"> 
                             <b-select 
                                     :value="collectionsPerPage"
                                     @input="onChangeCollectionsPerPage" 
@@ -46,13 +49,12 @@
                     </div>
                     <div class="pagination"> 
                         <b-pagination
-                            @change="onPageChange"
-                            :total="totalCollections"
-                            :current.sync="page"
-                            order="is-centered"
-                            size="is-small"
-                            :per-page="collectionsPerPage">
-                        </b-pagination> 
+                                @change="onPageChange"
+                                :total="totalCollections"
+                                :current.sync="page"
+                                order="is-centered"
+                                size="is-small"
+                                :per-page="collectionsPerPage"/> 
                     </div>
                 </div>    
             </div> 
diff --git a/src/admin/pages/lists/fields-page.vue b/src/admin/pages/lists/fields-page.vue
index eabecacf4..a6b316219 100644
--- a/src/admin/pages/lists/fields-page.vue
+++ b/src/admin/pages/lists/fields-page.vue
@@ -1,6 +1,6 @@
 <template>
         <div class="primary-page page-container">
-            <fields-list></fields-list>    
+            <fields-list/>    
         </div>
 </template>
 
diff --git a/src/admin/pages/lists/filters-page.vue b/src/admin/pages/lists/filters-page.vue
index 3991d3202..b36b48cde 100644
--- a/src/admin/pages/lists/filters-page.vue
+++ b/src/admin/pages/lists/filters-page.vue
@@ -1,6 +1,6 @@
 <template>
     <div class="primary-page page-container">
-        <filters-list></filters-list>
+        <filters-list/>
     </div>
 </template>
 
diff --git a/src/admin/pages/lists/items-page.vue b/src/admin/pages/lists/items-page.vue
index 0f1835aa5..2998ba6a6 100644
--- a/src/admin/pages/lists/items-page.vue
+++ b/src/admin/pages/lists/items-page.vue
@@ -1,25 +1,34 @@
 <template>  
-    <div class="page-container-small" :class="{'primary-page': isRepositoryLevel}">
+    <div 
+            class="page-container-small" 
+            :class="{'primary-page': isRepositoryLevel}">
         <div class="sub-header">
             <div class="header-item">
-                <router-link tag="button" class="button is-secondary"
+                <router-link 
+                        tag="button" 
+                        class="button is-secondary"
                         :to="{ path: $routerHelper.getNewItemPath(collectionId) }">
                     {{ $i18n.getFrom('items', 'new_item') }}
                 </router-link>
             </div>
             <div class="header-item">
                 <b-dropdown>
-                    <button class="button" slot="trigger" :disabled="items.length <= 0">
-                        <span>{{$i18n.get('label_table_fields')}}</span>
-                        <b-icon icon="menu-down"></b-icon>
+                    <button 
+                            class="button" 
+                            slot="trigger" 
+                            :disabled="items.length <= 0">
+                        <span>{{ $i18n.get('label_table_fields') }}</span>
+                        <b-icon icon="menu-down"/>
                     </button>
-                    <b-dropdown-item v-for="(column, index) in tableFields" 
-                        :key="index"
-                        class="control" custom>
+                    <b-dropdown-item 
+                            v-for="(column, index) in tableFields" 
+                            :key="index"
+                            class="control" 
+                            custom>
                         <b-checkbox
-                            @input="onChangeTableFields(column)"
-                            v-model="column.visible" 
-                            :native-value="column.field">
+                                @input="onChangeTableFields(column)"
+                                v-model="column.visible" 
+                                :native-value="column.field">
                             {{ column.label }}
                         </b-checkbox>
                     </b-dropdown-item>
@@ -29,19 +38,18 @@
         <div class="columns above-subheader">
             <aside class="column filters-menu">
                 <h3>{{ $i18n.get('filters') }}</h3>
-                <filters-items-list></filters-items-list>
+                <filters-items-list/>
             </aside>
             <div class="column table-container">
                 <items-list
-                    :collection-id="collectionId"
-                    :tableFields="tableFields"
-                    :prefTableFields="prefTableFields"
-                    :totalItems="totalItems"
-                    :page="page"
-                    :items="items" 
-                    :isLoading="isLoading"
-                    :itemsPerPage="itemsPerPage">
-                </items-list>
+                        :collection-id="collectionId"
+                        :table-fields="tableFields"
+                        :pref-table-fields="prefTableFields"
+                        :total-items="totalItems"
+                        :page="page"
+                        :items="items" 
+                        :is-loading="isLoading"
+                        :items-per-page="itemsPerPage"/>
                 <!-- Footer -->
                 <div class="table-footer">
                     <div class="shown-items">
@@ -54,7 +62,9 @@
                         }} 
                     </div> 
                     <div class="items-per-page">
-                        <b-field horizontal :label="$i18n.get('label_items_per_page')"> 
+                        <b-field 
+                                horizontal 
+                                :label="$i18n.get('label_items_per_page')"> 
                             <b-select 
                                     :value="itemsPerPage"
                                     @input="onChangeItemsPerPage" 
@@ -68,13 +78,12 @@
                     </div>
                     <div class="pagination"> 
                         <b-pagination
-                            @change="onPageChange"
-                            :total="totalItems"
-                            :current.sync="page"
-                            order="is-centered"
-                            size="is-small"
-                            :per-page="itemsPerPage">
-                        </b-pagination> 
+                                @change="onPageChange"
+                                :total="totalItems"
+                                :current.sync="page"
+                                order="is-centered"
+                                size="is-small"
+                                :per-page="itemsPerPage"/> 
                     </div>
                 </div>
             </div>
diff --git a/src/admin/pages/singles/collection-page.vue b/src/admin/pages/singles/collection-page.vue
index 60251e387..e9df795dd 100644
--- a/src/admin/pages/singles/collection-page.vue
+++ b/src/admin/pages/singles/collection-page.vue
@@ -1,8 +1,8 @@
 <template>
     <div class="columns is-fullheight">
-        <secondary-menu :id="collectionId"></secondary-menu>
+        <secondary-menu :id="collectionId"/>
         <section class="column is-secondary-content">
-            <router-view class="page-container"></router-view>
+            <router-view class="page-container"/>
         </section>
     </div>
 </template>
diff --git a/src/admin/pages/singles/item-page.vue b/src/admin/pages/singles/item-page.vue
index 24683c6bd..06203e5a1 100644
--- a/src/admin/pages/singles/item-page.vue
+++ b/src/admin/pages/singles/item-page.vue
@@ -1,12 +1,17 @@
 <template>
     <div>
-        <b-loading :active.sync="isLoading" :canCancel="false">
-
-        </b-loading>
+        <b-loading 
+                :active.sync="isLoading" 
+                :can-cancel="false"/>
         <div class="card">
-            <div class="card-image" v-if="item.featured_image">
+            <div 
+                    class="card-image" 
+                    v-if="item.featured_image">
                 <figure class="image is-4by3">
-                    <img :src="item.featured_image" class="image" :alt="item.title">
+                    <img 
+                            :src="item.featured_image" 
+                            class="image" 
+                            :alt="item.title">
                 </figure>
             </div>
             <div class="card-content">
@@ -18,16 +23,18 @@
                 </div>
 
                 <div class="content">
-                    {{item.description}}
+                    {{ item.description }}
                 </div>
             </div>
             <footer class="card-footer">
                 <router-link
-                        class="card-footer-item" :to="{ path: $routerHelper.getCollectionPath(collectionId)}">
+                        class="card-footer-item" 
+                        :to="{ path: $routerHelper.getCollectionPath(collectionId)}">
                     {{ $i18n.get('see') + ' ' + $i18n.get('collection') }}
                 </router-link>
                 <router-link
-                        class="card-footer-item" :to="{ path: $routerHelper.getItemEditPath(collectionId, itemId)}">
+                        class="card-footer-item" 
+                        :to="{ path: $routerHelper.getItemEditPath(collectionId, itemId)}">
                     {{ $i18n.get('edit') + ' ' + $i18n.get('item') }}
                 </router-link>
             </footer>
diff --git a/src/classes/field-types/category/AddNewTerm.vue b/src/classes/field-types/category/AddNewTerm.vue
index 0c47ac694..057053854 100644
--- a/src/classes/field-types/category/AddNewTerm.vue
+++ b/src/classes/field-types/category/AddNewTerm.vue
@@ -2,8 +2,10 @@
     <div>
          <span>
              <a
-                 class="button"
-                 @click="showForm = !showForm"><b-icon size="is-small" icon="plus"></b-icon>&nbsp;{{ $i18n.get('label_add_new_term') }}</a>
+                class="button"
+                @click="showForm = !showForm"><b-icon 
+                size="is-small" 
+                icon="plus"/>&nbsp;{{ $i18n.get('label_add_new_term') }}</a>
          </span>
         <div class="columns">
             <transition name="fade">
@@ -14,24 +16,26 @@
                         style="padding-left: 0px;">
 
                     <b-field :label="$i18n.get('label_name')">
-                        <b-input v-model="name"></b-input>
+                        <b-input v-model="name"/>
                     </b-field>
 
                     <b-field :label="$i18n.get('label_parent_term')">
                         <b-select
                                 v-model="parent">
-                            <option :value="0" selected> ---{{ $i18n.get('label_parent_term') }}--- </option>
+                            <option 
+                                    :value="0" 
+                                    selected> ---{{ $i18n.get('label_parent_term') }}--- </option>
                             <option
                                     v-for="(option,index) in options"
                                     :key="index"
                                     :value="option.term_id"
-                                    v-html="setSpaces( option.level ) + option.name"></option>
+                                    v-html="setSpaces( option.level ) + option.name"/>
                         </b-select>
                     </b-field>
 
                     <a
-                        class="button is-primary"
-                        @click="save">{{ $i18n.get('save') }}</a>
+                            class="button is-primary"
+                            @click="save">{{ $i18n.get('save') }}</a>
                 </section>
 
             </transition>
diff --git a/src/classes/field-types/category/Category.vue b/src/classes/field-types/category/Category.vue
index 1da5d2d58..c38491509 100644
--- a/src/classes/field-types/category/Category.vue
+++ b/src/classes/field-types/category/Category.vue
@@ -3,9 +3,9 @@
         <component
                 :is="getComponent()"
                 v-model="valueComponent"
-                :allowNew="allowNew"
+                :allow-new="allowNew"
                 :terms="terms"
-                :options="getOptions(0)"></component>
+                :options="getOptions(0)"/>
         <add-new-term
                 class="add-new-term"
                 v-if="getComponent() !== 'tainacan-category-tag-input' && allowNew"
@@ -14,7 +14,7 @@
                 :item_id="field.item.id"
                 :value="valueComponent"
                 :options="getOptions(0)"
-                @newTerm="reload"></add-new-term>
+                @newTerm="reload"/>
     </div>
 </template>
 <script>
diff --git a/src/classes/field-types/category/CategoryCheckbox.vue b/src/classes/field-types/category/CategoryCheckbox.vue
index 6d6cab197..b81057ec6 100644
--- a/src/classes/field-types/category/CategoryCheckbox.vue
+++ b/src/classes/field-types/category/CategoryCheckbox.vue
@@ -5,7 +5,7 @@
                 :key="index">
             <b-checkbox
                     :id="id"
-                    :style="{ paddingLeft: (option.level * 30)  + 'px' }"
+                    :style="{ paddingLeft: (option.level * 30) + 'px' }"
                     :key="index"
                     v-model="checked"
                     @input="onChecked(option)"
diff --git a/src/classes/field-types/category/CategoryRadio.vue b/src/classes/field-types/category/CategoryRadio.vue
index ecdf6ea04..3f35b852e 100644
--- a/src/classes/field-types/category/CategoryRadio.vue
+++ b/src/classes/field-types/category/CategoryRadio.vue
@@ -5,7 +5,7 @@
                 :key="index">
             <b-radio
                     :id="id"
-                    :style="{ paddingLeft: (option.level * 30)  + 'px' }"
+                    :style="{ paddingLeft: (option.level * 30) + 'px' }"
                     :key="index"
                     v-model="checked"
                     @input="onChecked(option)"
diff --git a/src/classes/field-types/category/CategorySelectbox.vue b/src/classes/field-types/category/CategorySelectbox.vue
index 5fc70dff4..de75c5b83 100644
--- a/src/classes/field-types/category/CategorySelectbox.vue
+++ b/src/classes/field-types/category/CategorySelectbox.vue
@@ -5,12 +5,13 @@
                     :id="id"
                     v-model="selected"
                     @input="emitChange()"
-                    :placeholder="$i18n.get('label_select_category')" expanded>
+                    :placeholder="$i18n.get('label_select_category')" 
+                    expanded>
                 <option
                         v-for="(option, index) in options"
                         :key="index"
                         :value="option.term_id"
-                        v-html="setSpaces( option.level ) + option.name"></option>
+                        v-html="setSpaces( option.level ) + option.name"/>
             </b-select>
         </div>
     </div>
diff --git a/src/classes/field-types/category/CategoryTaginput.vue b/src/classes/field-types/category/CategoryTaginput.vue
index 96c2daf0a..e4db4d565 100644
--- a/src/classes/field-types/category/CategoryTaginput.vue
+++ b/src/classes/field-types/category/CategoryTaginput.vue
@@ -4,14 +4,13 @@
                 size="is-small"
                 rounded
                 icon="magnify"
-                :allowNew="allowNew"
+                :allow-new="allowNew"
                 @input="emitChange"
                 v-model="selected"
                 :data="labels"
                 field="label"
                 autocomplete
-                @typing="search">
-        </b-taginput>
+                @typing="search"/>
     </div>
 </template>
 <script>
diff --git a/src/classes/field-types/category/FormCategory.vue b/src/classes/field-types/category/FormCategory.vue
index 3d6ee889f..08d678181 100644
--- a/src/classes/field-types/category/FormCategory.vue
+++ b/src/classes/field-types/category/FormCategory.vue
@@ -2,16 +2,15 @@
     <section
             v-if="isReady"
             :listen="setError">
-        <b-field :addons="false"
-                 :type="taxonomyType"
-                 :message="taxonomyMessage"
-        >
+        <b-field 
+                :addons="false"
+                :type="taxonomyType"
+                :message="taxonomyMessage">
             <label class="label">
                 {{ $i18n.get('label_select_category') }}<span :class="taxonomyType" >&nbsp;*&nbsp;</span>
                 <help-button
                         :title="$i18n.getHelperTitle('tainacan-category', 'taxonomy_id')"
-                        :message="$i18n.getHelperMessage('tainacan-category', 'taxonomy_id')">
-                </help-button>
+                        :message="$i18n.getHelperMessage('tainacan-category', 'taxonomy_id')"/>
             </label>
             <b-select
                     name="field_type_options[taxonomy_id]"
@@ -35,8 +34,7 @@
                 {{ $i18n.get('label_select_category_input_type') }}
                 <help-button
                         :title="$i18n.getHelperTitle('tainacan-category', 'input_type')"
-                        :message="$i18n.getHelperMessage('tainacan-category', 'input_type')">
-                </help-button>
+                        :message="$i18n.getHelperMessage('tainacan-category', 'input_type')"/>
             </label>
             <b-select
                     v-if="listInputType"
@@ -74,14 +72,14 @@
                 {{ $i18n.get('label_category_allow_new_terms') }}
                 <help-button
                         :title="$i18n.getHelperTitle('tainacan-category', 'allow_new_terms')"
-                        :message="$i18n.getHelperMessage('tainacan-category', 'allow_new_terms')">
-                </help-button>
+                        :message="$i18n.getHelperMessage('tainacan-category', 'allow_new_terms')"/>
             </label>
             <div class="block">
-                <b-checkbox v-model="allow_new_terms"
-                          @input="emitValues()"
-                          true-value="yes"
-                          false-value="no">
+                <b-checkbox 
+                        v-model="allow_new_terms"
+                        @input="emitValues()"
+                        true-value="yes"
+                        false-value="no">
                     {{ labelNewTerms() }}
                 </b-checkbox>
             </div>
diff --git a/src/classes/field-types/date/Date.vue b/src/classes/field-types/date/Date.vue
index c10a3771d..059879d8e 100644
--- a/src/classes/field-types/date/Date.vue
+++ b/src/classes/field-types/date/Date.vue
@@ -2,7 +2,7 @@
     <b-datepicker
             :id="id"
             v-model="dateValue"
-            @input="onInput($event)"></b-datepicker>
+            @input="onInput($event)"/>
 </template>
 
 <script>
diff --git a/src/classes/field-types/numeric/Numeric.vue b/src/classes/field-types/numeric/Numeric.vue
index 0524d666f..022e88f38 100644
--- a/src/classes/field-types/numeric/Numeric.vue
+++ b/src/classes/field-types/numeric/Numeric.vue
@@ -6,7 +6,7 @@
             step="0.01"
             @blur="onBlur"
             @change="onBlur"
-            @input="onInput($event)"></b-input>
+            @input="onInput($event)"/>
 </template>
 
 <script>
diff --git a/src/classes/field-types/relationship/FormRelationship.vue b/src/classes/field-types/relationship/FormRelationship.vue
index eaa2b87c2..65deb83df 100644
--- a/src/classes/field-types/relationship/FormRelationship.vue
+++ b/src/classes/field-types/relationship/FormRelationship.vue
@@ -9,8 +9,7 @@
                 {{ $i18n.get('label_collection_related') }}<span :class="collectionType" >&nbsp;*&nbsp;</span>
                 <help-button
                         :title="$i18n.getHelperTitle('tainacan-relationship', 'collection_id')"
-                        :message="$i18n.getHelperMessage('tainacan-relationship', 'collection_id')">
-                </help-button>
+                        :message="$i18n.getHelperMessage('tainacan-relationship', 'collection_id')"/>
             </label>
             <b-select
                     name="field_type_relationship[collection_id]"
@@ -32,7 +31,7 @@
         <transition name="fade">
             <div
                 v-if="loadingFields"
-                class="loading-spinner"></div>
+                class="loading-spinner"/>
             <b-field
                     v-if="hasFields"
                     :addons="false">
@@ -40,8 +39,7 @@
                     {{ $i18n.get('label_fields_for_search') }}
                     <help-button
                             :title="$i18n.getHelperTitle('tainacan-relationship', 'search')"
-                            :message="$i18n.getHelperMessage('tainacan-relationship', 'search')">
-                    </help-button>
+                            :message="$i18n.getHelperMessage('tainacan-relationship', 'search')"/>
                 </label>
                 <div class="block">
                     <div
@@ -66,15 +64,15 @@
                 {{ $i18n.get('label_allow_repeated_items') }}
                 <help-button
                         :title="$i18n.getHelperTitle('tainacan-relationship', 'repeated')"
-                        :message="$i18n.getHelperMessage('tainacan-relationship', 'repeated')">
-                </help-button>
+                        :message="$i18n.getHelperMessage('tainacan-relationship', 'repeated')"/>
             </label>
             <div class="block">
-                <b-checkbox v-model="modelRepeated"
-                          @input="emitValues()"
-                          true-value="yes"
-                          false-value="no">
-                        {{ labelRepeated() }}
+                <b-checkbox 
+                        v-model="modelRepeated"
+                        @input="emitValues()"
+                        true-value="yes"
+                        false-value="no">
+                    {{ labelRepeated() }}
                 </b-checkbox>
             </div>
         </b-field>
diff --git a/src/classes/field-types/relationship/Relationship.vue b/src/classes/field-types/relationship/Relationship.vue
index 47f9425ea..22c2ff300 100644
--- a/src/classes/field-types/relationship/Relationship.vue
+++ b/src/classes/field-types/relationship/Relationship.vue
@@ -7,8 +7,7 @@
                 autocomplete
                 :loading="loading"
                 field="label"
-                @typing="search">
-        </b-taginput>
+                @typing="search"/>
     </div>
 </template>
 
diff --git a/src/classes/field-types/selectbox/FormSelectbox.vue b/src/classes/field-types/selectbox/FormSelectbox.vue
index 8bdfcc285..afce69ea5 100644
--- a/src/classes/field-types/selectbox/FormSelectbox.vue
+++ b/src/classes/field-types/selectbox/FormSelectbox.vue
@@ -1,24 +1,22 @@
 <template>
     <section
             :listen="setError">
-        <b-field :addons="false"
-                 :type="optionType"
-                 :message="optionMessage"
-        >
+        <b-field 
+                :addons="false"
+                :type="optionType"
+                :message="optionMessage">
             <label class="label">
                 {{ $i18n.getHelperTitle('tainacan-selectbox', 'options') }}<span :class="optionType" >&nbsp;*&nbsp;</span>
                 <help-button
                         :title="$i18n.getHelperTitle('tainacan-selectbox', 'options')"
-                        :message="$i18n.getHelperMessage('tainacan-selectbox', 'options')">
-                </help-button>
+                        :message="$i18n.getHelperMessage('tainacan-selectbox', 'options')"/>
             </label>
             <b-taginput
                     v-model="options"
                     @input="emitValues()"
                     @focus="clear()"
                     icon="label"
-                    :placeholder="$i18n.get('new')">
-            </b-taginput>
+                    :placeholder="$i18n.get('new')"/>
         </b-field>
     </section>
 </template>
diff --git a/src/classes/field-types/tainacan-form-item.vue b/src/classes/field-types/tainacan-form-item.vue
index 2879d6853..a6559debe 100644
--- a/src/classes/field-types/tainacan-form-item.vue
+++ b/src/classes/field-types/tainacan-form-item.vue
@@ -1,27 +1,47 @@
 <template>
     <b-field
-        :addons="false"
-        :label="field.field.name"
-        :message="getErrorMessage"
-        :type="fieldTypeMessage">
+            :addons="false"
+            :label="field.field.name"
+            :message="getErrorMessage"
+            :type="fieldTypeMessage">
         <help-button 
-            :title="field.field.name" 
-            :message="field.field.description">
-        </help-button>
+                :title="field.field.name" 
+                :message="field.field.description"/>
         <div v-if="isTextInputComponent( field.field.field_type_object.component )">
-            <component :id="field.field.field_type_object.component + '-' + field.field.slug" :is="field.field.field_type_object.component" v-model="inputs[0]" :field="field" @blur="changeValue()"></component>
+            <component 
+                    :id="field.field.field_type_object.component + '-' + field.field.slug" 
+                    :is="field.field.field_type_object.component" 
+                    v-model="inputs[0]" 
+                    :field="field" 
+                    @blur="changeValue()"/>
             <div v-if="field.field.multiple == 'yes'">
-                <div v-if="index > 0" v-for="(input, index) in inputsList " v-bind:key="index" class="multiple-inputs">
-                    <component :id="field.field.field_type_object.component + '-' + field.field.slug" :is="field.field.field_type_object.component" v-model="inputs[index]" :field="field" @blur="changeValue()"></component><a class="button" v-if="index > 0" @click="removeInput(index)">-</a>
+                <div 
+                        v-if="index > 0" 
+                        v-for="(input, index) in inputsList " 
+                        :key="index" 
+                        class="multiple-inputs">
+                    <component 
+                            :id="field.field.field_type_object.component + '-' + field.field.slug" 
+                            :is="field.field.field_type_object.component" 
+                            v-model="inputs[index]" 
+                            :field="field" 
+                            @blur="changeValue()"/><a 
+                            class="button" 
+                            v-if="index > 0" 
+                            @click="removeInput(index)">-</a>
                 </div>
-                <a class="button" @click="addInput">+</a>
+                <a 
+                        class="button" 
+                        @click="addInput">+</a>
             </div>
         </div>
         <div v-else>
             <component
                     :id="field.field.field_type_object.component + '-' + field.field.slug"
-                    :is="field.field.field_type_object.component" v-model="inputs"
-                    :field="field" @blur="changeValue()"></component>
+                    :is="field.field.field_type_object.component" 
+                    v-model="inputs"
+                    :field="field" 
+                    @blur="changeValue()"/>
         </div>
     </b-field>
 </template>
@@ -32,7 +52,7 @@
     export default {
         name: 'TainacanFormItem',
         props: {
-            field: {}
+            field: Object
         },
         data(){
             return {
diff --git a/src/classes/field-types/text/Text.vue b/src/classes/field-types/text/Text.vue
index c1a6b0851..17621e9ae 100644
--- a/src/classes/field-types/text/Text.vue
+++ b/src/classes/field-types/text/Text.vue
@@ -1,9 +1,9 @@
 <template>
     <b-input
-    :id="id"
-    :value="inputValue"
-    @blur="onBlur"
-    @input="onInput($event)"></b-input>
+            :id="id"
+            :value="inputValue"
+            @blur="onBlur"
+            @input="onInput($event)"/>
 </template>
 
 <script>
diff --git a/src/classes/field-types/textarea/Textarea.vue b/src/classes/field-types/textarea/Textarea.vue
index 0df6c15c3..53e86529a 100644
--- a/src/classes/field-types/textarea/Textarea.vue
+++ b/src/classes/field-types/textarea/Textarea.vue
@@ -4,7 +4,7 @@
             type="textarea"
             :value="inputValue"
             @blur="onBlur"
-            @input="onInput($event)"></b-input>
+            @input="onInput($event)"/>
 </template>
 
 <script>
diff --git a/src/classes/filter-types/autocomplete/Autocomplete.vue b/src/classes/filter-types/autocomplete/Autocomplete.vue
index 103c6928a..e5f14f259 100644
--- a/src/classes/filter-types/autocomplete/Autocomplete.vue
+++ b/src/classes/filter-types/autocomplete/Autocomplete.vue
@@ -12,8 +12,12 @@
                 @select="option => setResults(option) ">
             <template slot-scope="props">
                 <div class="media">
-                    <div class="media-left" v-if="props.option.img">
-                        <img width="32" :src="`${props.option.img}`">
+                    <div 
+                            class="media-left" 
+                            v-if="props.option.img">
+                        <img 
+                                width="32" 
+                                :src="`${props.option.img}`">
                     </div>
                     <div class="media-content">
                         {{ props.option.label }}
@@ -23,11 +27,12 @@
         </b-autocomplete>
         <br>
         <div class="field has-text-centered">
-            <b-tag v-if="results !== ''"
-                   type="is-primary"
-                   size="is-small"
-                   closable
-                   @close="clearSearch()">
+            <b-tag 
+                    v-if="results !== ''"
+                    type="is-primary"
+                    size="is-small"
+                    closable
+                    @close="clearSearch()">
                 {{ results }}
             </b-tag>
         </div>
diff --git a/src/classes/filter-types/custom-interval/CustomInterval.vue b/src/classes/filter-types/custom-interval/CustomInterval.vue
index 537e8cea5..b93756822 100644
--- a/src/classes/filter-types/custom-interval/CustomInterval.vue
+++ b/src/classes/filter-types/custom-interval/CustomInterval.vue
@@ -5,37 +5,36 @@
                     size="is-small"
                     v-model="date_init"
                     @input="validate_values()"
-                    icon="calendar-today">
-            </b-datepicker>
+                    icon="calendar-today"/>
             <br>
             <b-datepicker
                     size="is-small"
                     v-model="date_end"
                     @input="validate_values()"
                     @focus="isTouched = true"
-                    icon="calendar-today">
-            </b-datepicker>
+                    icon="calendar-today"/>
             <br>
         </div>
-        <div class="columns" v-else>
+        <div 
+                class="columns" 
+                v-else>
             <b-input
                     size="is-small"
                     type="number"
                     @input="validate_values()"
                     class="column"
-                    v-model="value_init">
-            </b-input>
+                    v-model="value_init"/>
             <b-input
                     size="is-small"
                     type="number"
                     @input="validate_values()"
                     @focus="isTouched = true"
                     class="column"
-                    v-model="value_end">
-            </b-input>
+                    v-model="value_end"/>
         </div>
         <div class="field has-text-centered">
-            <b-tag v-if="isValid && !clear"
+            <b-tag 
+                    v-if="isValid && !clear"
                    type="is-primary"
                    size="is-small"
                    closable
@@ -91,7 +90,7 @@
             field_id: [Number], // not required, but overrides the filter field id if is set
             collection_id: [Number], // not required, but overrides the filter field id if is set
             id: '',
-            query: {}
+            query: Object
         },
         methods: {
             // only validate if the first value is higher than first
diff --git a/src/classes/filter-types/taginput/Taginput.vue b/src/classes/filter-types/taginput/Taginput.vue
index f9d5b7f43..f2e7c8ed1 100644
--- a/src/classes/filter-types/taginput/Taginput.vue
+++ b/src/classes/filter-types/taginput/Taginput.vue
@@ -9,8 +9,7 @@
                 autocomplete
                 :loading="loading"
                 field="label"
-                @typing="search">
-        </b-taginput>
+                @typing="search"/>
     </div>
 </template>
 
diff --git a/src/classes/filter-types/tainacan-filters-list.vue b/src/classes/filter-types/tainacan-filters-list.vue
index 1754b704e..39e1db140 100644
--- a/src/classes/filter-types/tainacan-filters-list.vue
+++ b/src/classes/filter-types/tainacan-filters-list.vue
@@ -1,14 +1,15 @@
 <template>
-    <b-field :label="filter.name"
-             :message="getErrorMessage"
-             :type="filterTypeMessage">
+    <b-field 
+            :label="filter.name"
+            :message="getErrorMessage"
+            :type="filterTypeMessage">
         <div>
             <component
                     :id="filter.filter_type_object.component + '-' + filter.slug"
                     :is="filter.filter_type_object.component"
                     :filter="getFilter"
                     :query="query"
-                    @input="listen( $event )"></component>
+                    @input="listen( $event )"/>
         </div>
     </b-field>
 </template>
@@ -21,8 +22,8 @@
     export default {
         name: 'TainacanFiltersList',
         props: {
-            filter: {},
-            query: {}
+            filter: Object,
+            query: Object
         },
         data(){
             return {
diff --git a/webpack.config.js b/webpack.config.js
index 3912b926b..dc7c40c8a 100644
--- a/webpack.config.js
+++ b/webpack.config.js
@@ -18,7 +18,10 @@ module.exports = {
                 enforce: "pre",
                 test: /\.vue$/,
                 exclude: /node_modules/,
-                loader: "eslint-loader"
+                loader: "eslint-loader",
+                options: {
+                    fix: false,
+                },
             },
             {
                 test: /\.vue$/,

From 429f8509e9718e33fa6d5742fa8bc42de3de08df Mon Sep 17 00:00:00 2001
From: Eduardo humberto <eduardo.humberto1992@gmail.com>
Date: Fri, 23 Mar 2018 13:52:58 -0300
Subject: [PATCH 06/16] field and filter types alter console log

---
 src/classes/field-types/category/Category.vue             | 2 +-
 src/classes/field-types/category/FormCategory.vue         | 2 +-
 src/classes/field-types/relationship/FormRelationship.vue | 2 +-
 src/classes/field-types/relationship/Relationship.vue     | 4 ++--
 src/classes/filter-types/autocomplete/Autocomplete.vue    | 8 ++++----
 src/classes/filter-types/checkbox/Checkbox.vue            | 4 ++--
 .../filter-types/custom-interval/CustomInterval.vue       | 2 +-
 src/classes/filter-types/selectbox/Selectbox.vue          | 4 ++--
 src/classes/filter-types/taginput/Taginput.vue            | 6 +++---
 9 files changed, 17 insertions(+), 17 deletions(-)

diff --git a/src/classes/field-types/category/Category.vue b/src/classes/field-types/category/Category.vue
index c38491509..1505e34d9 100644
--- a/src/classes/field-types/category/Category.vue
+++ b/src/classes/field-types/category/Category.vue
@@ -88,7 +88,7 @@
                     }
                 })
                 .catch(error => {
-                    console.log(error);
+                    this.$console.log(error);
                 });
             },
             getOptions( parent, level = 0 ){ // retrieve only ids
diff --git a/src/classes/field-types/category/FormCategory.vue b/src/classes/field-types/category/FormCategory.vue
index 08d678181..21c839306 100644
--- a/src/classes/field-types/category/FormCategory.vue
+++ b/src/classes/field-types/category/FormCategory.vue
@@ -175,7 +175,7 @@
                         }
                     })
                     .catch(error => {
-                        console.log(error);
+                        this.$console.log(error);
                     });
             },
             labelNewTerms(){
diff --git a/src/classes/field-types/relationship/FormRelationship.vue b/src/classes/field-types/relationship/FormRelationship.vue
index 65deb83df..dbf6fd271 100644
--- a/src/classes/field-types/relationship/FormRelationship.vue
+++ b/src/classes/field-types/relationship/FormRelationship.vue
@@ -165,7 +165,7 @@
                         }
                     })
                     .catch(error => {
-                        console.log(error);
+                        this.$console.log(error);
                     });
             },
             fetchFieldsFromCollection( value ){
diff --git a/src/classes/field-types/relationship/Relationship.vue b/src/classes/field-types/relationship/Relationship.vue
index 22c2ff300..e74f4f269 100644
--- a/src/classes/field-types/relationship/Relationship.vue
+++ b/src/classes/field-types/relationship/Relationship.vue
@@ -28,7 +28,7 @@
                         }
                     })
                     .catch(error => {
-                        console.log(error);
+                        this.$console.log(error);
                     });
             }
         },
@@ -91,7 +91,7 @@
                         }
                     })
                     .catch(error => {
-                        console.log(error);
+                        this.$console.log(error);
                     });
                 } else {
                     this.options = [];
diff --git a/src/classes/filter-types/autocomplete/Autocomplete.vue b/src/classes/filter-types/autocomplete/Autocomplete.vue
index e5f14f259..80c5db77d 100644
--- a/src/classes/filter-types/autocomplete/Autocomplete.vue
+++ b/src/classes/filter-types/autocomplete/Autocomplete.vue
@@ -59,7 +59,7 @@
                     }
                 })
                 .catch(error => {
-                    console.log(error);
+                    this.$console.log(error);
                 });
         },
         data(){
@@ -104,7 +104,7 @@
                 promise.then( () => {
                     this.isLoading = false;
                 }).catch( error => {
-                    console.log('error select', error );
+                    this.$console.log('error select', error );
                     this.isLoading = false;
                 });
             },
@@ -127,12 +127,12 @@
                             .then( res => {
                                 for (let item of res.data) {
                                    // instance.selected.push({ label: item.title, value: item.id, img: '' });
-                                    console.log(item.title);
+                                    this.$console.log(item.title);
                                     instance.results = item.title;
                                 }
                             })
                             .catch(error => {
-                                console.log(error);
+                                this.$console.log(error);
                             });
                     } else {
                         instance.results = metadata.value;
diff --git a/src/classes/filter-types/checkbox/Checkbox.vue b/src/classes/filter-types/checkbox/Checkbox.vue
index 6c1a0b81a..5e8a0bbb5 100644
--- a/src/classes/filter-types/checkbox/Checkbox.vue
+++ b/src/classes/filter-types/checkbox/Checkbox.vue
@@ -31,7 +31,7 @@
                     }
                 })
                 .catch(error => {
-                    console.log(error);
+                    this.$console.log(error);
                 });
         },
         data(){
@@ -72,7 +72,7 @@
                     this.selectedValues()
                 })
                 .catch( error => {
-                    console.log('error select', error );
+                    this.$console.log('error select', error );
                     this.isLoading = false;
                 });
             },
diff --git a/src/classes/filter-types/custom-interval/CustomInterval.vue b/src/classes/filter-types/custom-interval/CustomInterval.vue
index b93756822..27d817871 100644
--- a/src/classes/filter-types/custom-interval/CustomInterval.vue
+++ b/src/classes/filter-types/custom-interval/CustomInterval.vue
@@ -65,7 +65,7 @@
                     }
                 })
                 .catch(error => {
-                    console.log(error);
+                    this.$console.log(error);
                 });
         },
         data(){
diff --git a/src/classes/filter-types/selectbox/Selectbox.vue b/src/classes/filter-types/selectbox/Selectbox.vue
index 26fdcc104..71e1b5af7 100644
--- a/src/classes/filter-types/selectbox/Selectbox.vue
+++ b/src/classes/filter-types/selectbox/Selectbox.vue
@@ -36,7 +36,7 @@
                     }
                 })
                 .catch(error => {
-                    console.log(error);
+                    this.$console.log(error);
                 });
         },
         data(){
@@ -71,7 +71,7 @@
                     instance.selectedValues();
                 })
                 .catch( error => {
-                    console.log('error select', error );
+                    this.$console.log('error select', error );
                     this.isLoading = false;
                 });
             },
diff --git a/src/classes/filter-types/taginput/Taginput.vue b/src/classes/filter-types/taginput/Taginput.vue
index f2e7c8ed1..bc83214ef 100644
--- a/src/classes/filter-types/taginput/Taginput.vue
+++ b/src/classes/filter-types/taginput/Taginput.vue
@@ -33,7 +33,7 @@
                     }
                 })
                 .catch(error => {
-                    console.log(error);
+                    this.$console.log(error);
                 });
         },
         data(){
@@ -83,7 +83,7 @@
                 promise.then(() => {
                     this.isLoading = false;
                 }).catch( error => {
-                    console.log('error select', error );
+                    this.$console.log('error select', error );
                     this.isLoading = false;
                 });
             },
@@ -109,7 +109,7 @@
                                 }
                             })
                             .catch(error => {
-                                console.log(error);
+                                this.$console.log(error);
                             });
                     } else {
                         for (let item of metadata.value) {

From fb2874783a6e2dca3c05dc248cbe71e4c5fd5d5c Mon Sep 17 00:00:00 2001
From: weryques <weryques@outlook.com>
Date: Fri, 23 Mar 2018 15:44:00 -0300
Subject: [PATCH 07/16] Slug

---
 package-lock.json                             | 175 +++++++++++++++++-
 package.json                                  |   4 +
 src/admin/class-tainacan-admin.php            |  18 +-
 .../edition/category-edition-form.vue         |  42 ++---
 src/admin/js/mixins.js                        |  28 +++
 webpack.config.js                             |   3 +
 6 files changed, 233 insertions(+), 37 deletions(-)
 create mode 100644 src/admin/js/mixins.js

diff --git a/package-lock.json b/package-lock.json
index 801522907..e81fb1ab6 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1388,8 +1388,7 @@
     "bluebird": {
       "version": "3.5.1",
       "resolved": "https://registry.npmjs.org/bluebird/-/bluebird-3.5.1.tgz",
-      "integrity": "sha512-MKiLiV+I1AA596t9w1sQJ8jkiSr5+ZKi0WKrYGUn6d1Fx+Ij4tIj+m2WMQSGczs5jZVxV339chE8iwk6F64wjA==",
-      "dev": true
+      "integrity": "sha512-MKiLiV+I1AA596t9w1sQJ8jkiSr5+ZKi0WKrYGUn6d1Fx+Ij4tIj+m2WMQSGczs5jZVxV339chE8iwk6F64wjA=="
     },
     "bn.js": {
       "version": "4.11.8",
@@ -1429,6 +1428,11 @@
         "multicast-dns-service-types": "1.1.0"
       }
     },
+    "boolbase": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/boolbase/-/boolbase-1.0.0.tgz",
+      "integrity": "sha1-aN/1++YMUes3cl6p4+0xDcwed24="
+    },
     "boom": {
       "version": "2.10.1",
       "resolved": "https://registry.npmjs.org/boom/-/boom-2.10.1.tgz",
@@ -1727,6 +1731,25 @@
       "integrity": "sha1-FCD/sQ/URNz8ebQ4kbv//TKoRgA=",
       "dev": true
     },
+    "cheerio": {
+      "version": "0.19.0",
+      "resolved": "https://registry.npmjs.org/cheerio/-/cheerio-0.19.0.tgz",
+      "integrity": "sha1-dy5wFfLuKZZQltcepBdbdas1SSU=",
+      "requires": {
+        "css-select": "1.0.0",
+        "dom-serializer": "0.1.0",
+        "entities": "1.1.1",
+        "htmlparser2": "3.8.3",
+        "lodash": "3.10.1"
+      },
+      "dependencies": {
+        "lodash": {
+          "version": "3.10.1",
+          "resolved": "https://registry.npmjs.org/lodash/-/lodash-3.10.1.tgz",
+          "integrity": "sha1-W/Rejkm6QYnhfUgnid/RW9FAt7Y="
+        }
+      }
+    },
     "chokidar": {
       "version": "1.7.0",
       "resolved": "https://registry.npmjs.org/chokidar/-/chokidar-1.7.0.tgz",
@@ -2313,6 +2336,17 @@
         "source-list-map": "0.1.8"
       }
     },
+    "css-select": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/css-select/-/css-select-1.0.0.tgz",
+      "integrity": "sha1-sRIcpRhI3SZOIkTQWM7iVN7rRLA=",
+      "requires": {
+        "boolbase": "1.0.0",
+        "css-what": "1.0.0",
+        "domutils": "1.4.3",
+        "nth-check": "1.0.1"
+      }
+    },
     "css-selector-tokenizer": {
       "version": "0.6.0",
       "resolved": "https://registry.npmjs.org/css-selector-tokenizer/-/css-selector-tokenizer-0.6.0.tgz",
@@ -2337,6 +2371,11 @@
         }
       }
     },
+    "css-what": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/css-what/-/css-what-1.0.0.tgz",
+      "integrity": "sha1-18wt9FGAZm+Z0rFEYmOUaeAPc2w="
+    },
     "cssesc": {
       "version": "0.1.0",
       "resolved": "https://registry.npmjs.org/cssesc/-/cssesc-0.1.0.tgz",
@@ -2839,12 +2878,49 @@
       "integrity": "sha512-qAoWcNm1zW3LVO0KSblYISM0oLQzlNtns2gd1O/YS3QvFYFidG6lF73fC98fIbfPQkws698L0/URrtmN8+ADbQ==",
       "dev": true
     },
+    "dom-serializer": {
+      "version": "0.1.0",
+      "resolved": "https://registry.npmjs.org/dom-serializer/-/dom-serializer-0.1.0.tgz",
+      "integrity": "sha1-BzxpdUbOB4DOI75KKOKT5AvDDII=",
+      "requires": {
+        "domelementtype": "1.1.3",
+        "entities": "1.1.1"
+      },
+      "dependencies": {
+        "domelementtype": {
+          "version": "1.1.3",
+          "resolved": "https://registry.npmjs.org/domelementtype/-/domelementtype-1.1.3.tgz",
+          "integrity": "sha1-vSh3PiZCiBrsUVRJJCmcXNgiGFs="
+        }
+      }
+    },
     "domain-browser": {
       "version": "1.2.0",
       "resolved": "https://registry.npmjs.org/domain-browser/-/domain-browser-1.2.0.tgz",
       "integrity": "sha512-jnjyiM6eRyZl2H+W8Q/zLMA481hzi0eszAaBUzIVnmYVDBbnLxVNnfu1HgEBvCbL+71FrxMl3E6lpKH7Ge3OXA==",
       "dev": true
     },
+    "domelementtype": {
+      "version": "1.3.0",
+      "resolved": "https://registry.npmjs.org/domelementtype/-/domelementtype-1.3.0.tgz",
+      "integrity": "sha1-sXrtguirWeUt2cGbF1bg/BhyBMI="
+    },
+    "domhandler": {
+      "version": "2.3.0",
+      "resolved": "https://registry.npmjs.org/domhandler/-/domhandler-2.3.0.tgz",
+      "integrity": "sha1-LeWaCCLVAn+r/28DLCsloqir5zg=",
+      "requires": {
+        "domelementtype": "1.3.0"
+      }
+    },
+    "domutils": {
+      "version": "1.4.3",
+      "resolved": "https://registry.npmjs.org/domutils/-/domutils-1.4.3.tgz",
+      "integrity": "sha1-CGVRN5bGswYDGFDhdVFrr4C3Km8=",
+      "requires": {
+        "domelementtype": "1.3.0"
+      }
+    },
     "ecc-jsbn": {
       "version": "0.1.1",
       "resolved": "https://registry.npmjs.org/ecc-jsbn/-/ecc-jsbn-0.1.1.tgz",
@@ -2928,6 +3004,11 @@
         "tapable": "0.2.8"
       }
     },
+    "entities": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/entities/-/entities-1.1.1.tgz",
+      "integrity": "sha1-blwtClYhtdra7O+AuQ7ftc13cvA="
+    },
     "errno": {
       "version": "0.1.4",
       "resolved": "https://registry.npmjs.org/errno/-/errno-0.1.4.tgz",
@@ -3771,6 +3852,11 @@
       "integrity": "sha1-PYyt2Q2XZWn6g1qx+OSyOhBWBac=",
       "dev": true
     },
+    "fs": {
+      "version": "0.0.1-security",
+      "resolved": "https://registry.npmjs.org/fs/-/fs-0.0.1-security.tgz",
+      "integrity": "sha1-invTcYa23d84E/I4WLV+yq9eQdQ="
+    },
     "fs-extra": {
       "version": "4.0.1",
       "resolved": "https://registry.npmjs.org/fs-extra/-/fs-extra-4.0.1.tgz",
@@ -5100,6 +5186,73 @@
       "integrity": "sha1-DfKTUfByEWNRXfueVUPl9u7VFi8=",
       "dev": true
     },
+    "html-to-json": {
+      "version": "0.6.0",
+      "resolved": "https://registry.npmjs.org/html-to-json/-/html-to-json-0.6.0.tgz",
+      "integrity": "sha1-cY2ylfPeCpJi1FKPrBqFg35uBrE=",
+      "requires": {
+        "bluebird": "3.5.1",
+        "cheerio": "0.19.0",
+        "lodash": "3.10.1",
+        "request": "2.79.0"
+      },
+      "dependencies": {
+        "lodash": {
+          "version": "3.10.1",
+          "resolved": "https://registry.npmjs.org/lodash/-/lodash-3.10.1.tgz",
+          "integrity": "sha1-W/Rejkm6QYnhfUgnid/RW9FAt7Y="
+        }
+      }
+    },
+    "htmlparser2": {
+      "version": "3.8.3",
+      "resolved": "https://registry.npmjs.org/htmlparser2/-/htmlparser2-3.8.3.tgz",
+      "integrity": "sha1-mWwosZFRaovoZQGn15dX5ccMEGg=",
+      "requires": {
+        "domelementtype": "1.3.0",
+        "domhandler": "2.3.0",
+        "domutils": "1.5.1",
+        "entities": "1.0.0",
+        "readable-stream": "1.1.14"
+      },
+      "dependencies": {
+        "domutils": {
+          "version": "1.5.1",
+          "resolved": "https://registry.npmjs.org/domutils/-/domutils-1.5.1.tgz",
+          "integrity": "sha1-3NhIiib1Y9YQeeSMn3t+Mjc2gs8=",
+          "requires": {
+            "dom-serializer": "0.1.0",
+            "domelementtype": "1.3.0"
+          }
+        },
+        "entities": {
+          "version": "1.0.0",
+          "resolved": "https://registry.npmjs.org/entities/-/entities-1.0.0.tgz",
+          "integrity": "sha1-sph6o4ITR/zeZCsk/fyeT7cSvyY="
+        },
+        "isarray": {
+          "version": "0.0.1",
+          "resolved": "https://registry.npmjs.org/isarray/-/isarray-0.0.1.tgz",
+          "integrity": "sha1-ihis/Kmo9Bd+Cav8YDiTmwXR7t8="
+        },
+        "readable-stream": {
+          "version": "1.1.14",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-1.1.14.tgz",
+          "integrity": "sha1-fPTFTvZI44EwhMY23SB54WbAgdk=",
+          "requires": {
+            "core-util-is": "1.0.2",
+            "inherits": "2.0.3",
+            "isarray": "0.0.1",
+            "string_decoder": "0.10.31"
+          }
+        },
+        "string_decoder": {
+          "version": "0.10.31",
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-0.10.31.tgz",
+          "integrity": "sha1-YuIDvEF2bGwoyfyEMB2rHFMQ+pQ="
+        }
+      }
+    },
     "http-deceiver": {
       "version": "1.2.7",
       "resolved": "https://registry.npmjs.org/http-deceiver/-/http-deceiver-1.2.7.tgz",
@@ -6646,6 +6799,11 @@
       "integrity": "sha1-KzJxhOiZIQEXeyhWP7XnECrNDKk=",
       "dev": true
     },
+    "net": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/net/-/net-1.0.2.tgz",
+      "integrity": "sha1-0XV+yaf7I3HYPPR1XOPifhCCk4g="
+    },
     "node-forge": {
       "version": "0.6.33",
       "resolved": "https://registry.npmjs.org/node-forge/-/node-forge-0.6.33.tgz",
@@ -6813,6 +6971,14 @@
         "set-blocking": "2.0.0"
       }
     },
+    "nth-check": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/nth-check/-/nth-check-1.0.1.tgz",
+      "integrity": "sha1-mSms32KPwsQQmN6rgqxYDPFJquQ=",
+      "requires": {
+        "boolbase": "1.0.0"
+      }
+    },
     "num2fraction": {
       "version": "1.2.2",
       "resolved": "https://registry.npmjs.org/num2fraction/-/num2fraction-1.2.2.tgz",
@@ -9719,6 +9885,11 @@
       "dev": true,
       "optional": true
     },
+    "tls": {
+      "version": "0.0.1",
+      "resolved": "https://registry.npmjs.org/tls/-/tls-0.0.1.tgz",
+      "integrity": "sha1-CrK/WWjXHfL4wOFRXSSiJAuYqsg="
+    },
     "tmp": {
       "version": "0.0.31",
       "resolved": "https://registry.npmjs.org/tmp/-/tmp-0.0.31.tgz",
diff --git a/package.json b/package.json
index 753a33d6a..57fffb2af 100644
--- a/package.json
+++ b/package.json
@@ -11,11 +11,15 @@
     "axios": "^0.17.1",
     "buefy": "^0.6.3",
     "bulma": "^0.6.2",
+    "fs": "0.0.1-security",
+    "html-to-json": "^0.6.0",
     "mdi": "^2.1.99",
     "moment": "^2.21.0",
+    "net": "^1.0.2",
     "node-sass": "^4.7.2",
     "qs": "^6.5.1",
     "sass-loader": "^6.0.6",
+    "tls": "0.0.1",
     "vue": "^2.5.13",
     "vuedraggable": "^2.16.0",
     "vuex": "^3.0.1"
diff --git a/src/admin/class-tainacan-admin.php b/src/admin/class-tainacan-admin.php
index be0c8340c..4c80a58cc 100644
--- a/src/admin/class-tainacan-admin.php
+++ b/src/admin/class-tainacan-admin.php
@@ -143,14 +143,16 @@ class Admin {
 		}
 
 		$settings = [
-			'root'        => esc_url_raw( rest_url() ) . 'tainacan/v2',
-			'root_wp_api' => esc_url_raw( rest_url() ) . 'wp/v2/',
-			'nonce'       => wp_create_nonce( 'wp_rest' ),
-			'components'  => $components,
-			'i18n'        => $tainacan_admin_i18n,
-			'user_caps'   => $user_caps,
-			'user_prefs'  => $prefs,
-			'base_url'    => $TAINACAN_BASE_URL
+			'root'                   => esc_url_raw( rest_url() ) . 'tainacan/v2',
+			'root_wp_api'            => esc_url_raw( rest_url() ) . 'wp/v2/',
+			'wp_ajax_url'            => admin_url( 'admin-ajax.php' ),
+			'nonce'                  => wp_create_nonce( 'wp_rest' ),
+			'sample_permalink_nonce' => wp_create_nonce( 'samplepermalink' ),
+			'components'             => $components,
+			'i18n'                   => $tainacan_admin_i18n,
+			'user_caps'              => $user_caps,
+			'user_prefs'             => $prefs,
+			'base_url'               => $TAINACAN_BASE_URL
 		];
 
 		$maps = [
diff --git a/src/admin/components/edition/category-edition-form.vue b/src/admin/components/edition/category-edition-form.vue
index 958c80393..aaa0b279c 100644
--- a/src/admin/components/edition/category-edition-form.vue
+++ b/src/admin/components/edition/category-edition-form.vue
@@ -126,10 +126,13 @@
 </template>
 
 <script>
-    import { mapActions, mapGetters } from 'vuex'
+    import { wpAjax } from "../../js/mixins";
+    import { mapActions, mapGetters } from 'vuex';
+    import htmlToJSON from 'html-to-json';
 
     export default {
         name: 'CategoryEditionForm',
+        mixins: [ wpAjax ],
         data(){
             return {
                 categoryId: Number,
@@ -218,40 +221,25 @@
 
                 this.isUpdatingSlug = true;
 
-                let data = {
-                    categoryId: this.categoryId,
-                    name: this.form.name,
-                    description: this.form.description,
-                    //slug: '',
-                    status: 'private',
-                    allowInsert: this.form.allowInsert
-                };
-                this.$console.log(data);
+                this.getSamplePermalink(this.categoryId, this.form.name, this.form.slug)
+                    .then(samplePermalink => {
 
-                this.updateCategory(data)
-                    .then(updatedCategory => {
-                        this.category = updatedCategory;
+                        let promise = htmlToJSON.parse(samplePermalink, {
+                            permalink($doc, $) {
+                                return $doc.find('#editable-post-name-full').text();
+                            }
+                        });
 
-                        this.$console.info(this.category);
-
-                        // Fill this.form data with current data.
-                        this.form.name = this.category.name;
-                        this.form.slug = this.category.slug;
-                        this.form.description = this.category.description;
-                        this.form.status = this.category.status;
-                        this.allowInsert = this.category.allow_insert;
+                        promise.done((result) => {
+                            this.form.slug = result.permalink;
+                        });
 
                         this.isUpdatingSlug = false;
                         this.formErrorMessage = '';
                         this.editFormErrors = {};
                     })
                     .catch(errors => {
-                        for (let error of errors.errors) {
-                            for (let attribute of Object.keys(error)) {
-                                this.editFormErrors[attribute] = error[attribute];
-                            }
-                        }
-                        this.formErrorMessage = errors.error_message;
+                        this.$console.error(errors);
 
                         this.isLoading = false;
                     });
diff --git a/src/admin/js/mixins.js b/src/admin/js/mixins.js
new file mode 100644
index 000000000..0e7a6b650
--- /dev/null
+++ b/src/admin/js/mixins.js
@@ -0,0 +1,28 @@
+import axios from 'axios';
+import qs from  'qs';
+
+export const wpAjax = {
+    methods: {
+        getSamplePermalink(id, newTitle, newSlug){
+            let axiosWPAjax = axios.create({
+                baseURL: tainacan_plugin.wp_ajax_url,
+            });
+
+            return new Promise((resolve, reject) => {
+                axiosWPAjax.post('', qs.stringify({
+                    action: 'sample-permalink',
+                    post_id: id,
+                    new_title: newTitle,
+                    new_slug: newSlug,
+                    samplepermalinknonce: tainacan_plugin.sample_permalink_nonce,
+                }))
+                   .then(res => {
+                       resolve(res.data);
+                   })
+                   .catch(error => {
+                       reject(error)
+                   })
+            });
+        }
+    }
+};
\ No newline at end of file
diff --git a/webpack.config.js b/webpack.config.js
index 3912b926b..8b14ce52e 100644
--- a/webpack.config.js
+++ b/webpack.config.js
@@ -59,6 +59,9 @@ module.exports = {
         historyApiFallback: true,
         noInfo: true
     },
+    node: {
+        fs: 'empty'
+    },
 }
 
 if (process.env.NODE_ENV === 'production') {

From ab5348d5a1a35d0c56daf547e341d3a574aedeb4 Mon Sep 17 00:00:00 2001
From: weryques <weryques@outlook.com>
Date: Fri, 23 Mar 2018 15:49:11 -0300
Subject: [PATCH 08/16] Eslint suggestions

---
 src/admin/components/edition/category-edition-form.vue | 2 +-
 src/admin/components/lists/categories-list.vue         | 4 ++--
 2 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/src/admin/components/edition/category-edition-form.vue b/src/admin/components/edition/category-edition-form.vue
index b36fcd530..6d7422845 100644
--- a/src/admin/components/edition/category-edition-form.vue
+++ b/src/admin/components/edition/category-edition-form.vue
@@ -223,7 +223,7 @@
                     .then(samplePermalink => {
 
                         let promise = htmlToJSON.parse(samplePermalink, {
-                            permalink($doc, $) {
+                            permalink($doc) {
                                 return $doc.find('#editable-post-name-full').text();
                             }
                         });
diff --git a/src/admin/components/lists/categories-list.vue b/src/admin/components/lists/categories-list.vue
index d95ae5af8..e30740e32 100644
--- a/src/admin/components/lists/categories-list.vue
+++ b/src/admin/components/lists/categories-list.vue
@@ -127,7 +127,7 @@
                     message: this.$i18n.get('info_warning_category_delete'),
                     onConfirm: () => {
                         this.deleteCategory(categoryId)
-                            .then((res) => {
+                            .then(() => {
                                 this.$toast.open({
                                     duration: 3000,
                                     message: this.$i18n.get('info_category_deleted'),
@@ -140,7 +140,7 @@
                                         this.selectedCategories.splice(i, 1);
                                 }
                             })
-                            .catch((error) => {
+                            .catch(() => {
                                 this.$toast.open({
                                     duration: 3000,
                                     message: this.$i18n.get('info_error_deleting_category'),

From c9695b537ffd67cf5eef4f2274c23b508e089357 Mon Sep 17 00:00:00 2001
From: weryques <weryques@outlook.com>
Date: Fri, 23 Mar 2018 16:04:05 -0300
Subject: [PATCH 09/16] Better mixin

---
 src/admin/js/mixins.js | 16 +++++++++++-----
 1 file changed, 11 insertions(+), 5 deletions(-)

diff --git a/src/admin/js/mixins.js b/src/admin/js/mixins.js
index 0e7a6b650..693ee42e8 100644
--- a/src/admin/js/mixins.js
+++ b/src/admin/js/mixins.js
@@ -2,14 +2,20 @@ import axios from 'axios';
 import qs from  'qs';
 
 export const wpAjax = {
+    data(){
+      return {
+          axiosWPAjax: {},
+      }
+    },
+    created(){
+        this.axiosWPAjax = axios.create({
+            baseURL: tainacan_plugin.wp_ajax_url,
+        });
+    },
     methods: {
         getSamplePermalink(id, newTitle, newSlug){
-            let axiosWPAjax = axios.create({
-                baseURL: tainacan_plugin.wp_ajax_url,
-            });
-
             return new Promise((resolve, reject) => {
-                axiosWPAjax.post('', qs.stringify({
+                this.axiosWPAjax.post('', qs.stringify({
                     action: 'sample-permalink',
                     post_id: id,
                     new_title: newTitle,

From dad2bf180f8a39e4e89c305a93c945eaa326c323 Mon Sep 17 00:00:00 2001
From: Eduardo humberto <eduardo.humberto1992@gmail.com>
Date: Fri, 23 Mar 2018 18:09:55 -0300
Subject: [PATCH 10/16] begin structure of field type Relationship search

---
 src/admin/tainacan-admin-i18n.php             |  4 +
 .../field-types/relationship/Relationship.vue | 94 ++++++++++++++++++-
 .../search-components/list-items.vue          | 77 +++++++++++++++
 3 files changed, 173 insertions(+), 2 deletions(-)
 create mode 100644 src/classes/field-types/relationship/search-components/list-items.vue

diff --git a/src/admin/tainacan-admin-i18n.php b/src/admin/tainacan-admin-i18n.php
index 292652f9b..d7840aeab 100644
--- a/src/admin/tainacan-admin-i18n.php
+++ b/src/admin/tainacan-admin-i18n.php
@@ -67,6 +67,10 @@ return [
 	'title_collection_fields_edition'          => __( 'Collection Fields Edition Page', 'tainacan' ),
 
 	// Labels (used mainly on Aria Labels and Inputs)
+    'label_clean'                              => __( 'Clear', 'tainacan' ),
+    'label_selected'                           => __( 'Selected', 'tainacan' ),
+    'label_relationship_new_search'            => __( 'New Search', 'tainacan' ),
+    'label_relationship_items_found'           => __( 'Items found', 'tainacan' ),
 	'label_menu'                               => __( 'Menu', 'tainacan' ),
 	'label_main_menu'                          => __( 'Main Menu', 'tainacan' ),
 	'label_collection_menu'                    => __( 'Collection Menu', 'tainacan' ),
diff --git a/src/classes/field-types/relationship/Relationship.vue b/src/classes/field-types/relationship/Relationship.vue
index e74f4f269..de1b7b704 100644
--- a/src/classes/field-types/relationship/Relationship.vue
+++ b/src/classes/field-types/relationship/Relationship.vue
@@ -1,6 +1,7 @@
 <template>
     <div>
         <b-taginput
+                v-if="this.searchFields.length === 0"
                 :id="id"
                 v-model="selected"
                 :data="options"
@@ -8,17 +9,49 @@
                 :loading="loading"
                 field="label"
                 @typing="search"/>
+        <div
+            v-else>
+            <div
+                v-if="itemsFound.length === 0"
+                class="box">
+                <b-field
+                        v-for="(field,index) in searchFields"
+                        :key="index"
+                        :label="field.name">
+                    <component
+                            @input="setQuery( $event, field )"
+                            :is="getComponentSearch( field )"/>
+                </b-field>
+                <button
+                        type="button"
+
+                        @click="doSearch"
+                        class="button">
+                    <b-icon icon="magnify" />
+                    <span> {{ $i18n.get('search') }}</span>
+                </button>
+            </div>
+
+            <list-found-items
+                    class="box"
+                    @input="listenSelectedItems"
+                    @clearSearch="clearSearch"
+                    :items="itemsFound"
+                    v-else/>
+        </div>
+
     </div>
 </template>
 
 <script>
     import { tainacan as axios } from '../../../js/axios/axios'
+    import ListFoundItems from './search-components/list-items.vue';
     import qs from 'qs';
 
     export default {
         created(){
+            let collectionId = ( this.field && this.field.field.field_type_options.collection_id ) ? this.field.field.field_type_options.collection_id : this.collection_id;
             if( this.field.value ){
-                let collectionId = ( this.field && this.field.field.field_type_options.collection_id ) ? this.field.field.field_type_options.collection_id : this.collection_id;
                 let query = qs.stringify({ postin: ( Array.isArray( this.field.value ) ) ? this.field.value : [ this.field.value ]  });
 
                 axios.get('/collection/'+collectionId+'/items?' + query)
@@ -31,6 +64,20 @@
                         this.$console.log(error);
                     });
             }
+
+            if( this.field.field.field_type_options
+                    && this.field.field.field_type_options.search.length > 0){
+                axios.get('/collection/'+ collectionId +'/fields?context=edit')
+                    .then( res => {
+                        for (let item of res.data) {
+                            if( this.field.field.field_type_options.search.indexOf( item.id ) >= 0 )
+                                this.searchFields.push( item );
+                        }
+                    })
+                    .catch(error => {
+                        this.$console.log(error);
+                    });
+            }
         },
         data(){
             return {
@@ -39,7 +86,10 @@
                 options: [],
                 loading: false,
                 collectionId: 0,
-                inputValue: null
+                inputValue: null,
+                searchFields: [],
+                queryObject: {},
+                itemsFound: []
             }
         },
         props: {
@@ -63,6 +113,9 @@
                 this.onInput( values );
             }
         },
+        components: {
+            ListFoundItems
+        },
         methods: {
             setResults(option){
                 if(!option)
@@ -96,6 +149,43 @@
                 } else {
                     this.options = [];
                 }
+            },
+            getComponentSearch( field ){
+                return field.field_type_object.component;
+            },
+            setQuery( event, field ){
+                if( field.field_type.indexOf( 'Core_Title' ) >= 0 ){
+                    this.queryObject['search'] = event;
+                } else if( field.field_type.indexOf( 'Core_Description' ) >= 0 ){
+                    this.queryObject['search'] = event;
+                }
+            },
+            doSearch(){
+                let collectionId = ( this.field && this.field.field.field_type_options.collection_id ) ? this.field.field.field_type_options.collection_id : this.collection_id;
+                axios.get('/collection/' + collectionId + '/items?' + qs.stringify( this.queryObject ))
+                    .then(res => {
+                        let items = res.data;
+                        if( items.length > 0 ){
+                            this.itemsFound = items;
+                        }
+                    })
+                    .catch(error => {
+                        this.$console.log( error )
+                    });
+            },
+            clearSearch(){
+                this.itemsFound = [];
+            },
+            listenSelectedItems( event ){
+                let results = [];
+
+                if( event && event.length > 0 ){
+                    for( let item of event ){
+                        results.push( item.id );
+                    }
+                }
+
+                this.onInput( results );
             }
         }
     }
diff --git a/src/classes/field-types/relationship/search-components/list-items.vue b/src/classes/field-types/relationship/search-components/list-items.vue
new file mode 100644
index 000000000..756ea4727
--- /dev/null
+++ b/src/classes/field-types/relationship/search-components/list-items.vue
@@ -0,0 +1,77 @@
+<template>
+    <section>
+        <button
+                type="button"
+                @click="clearSearch"
+                class="button field is-info">
+            <b-icon icon="magnify"/>
+            <span>{{ $i18n.get('label_relationship_new_search') }}</span>
+        </button>
+
+        <b-tabs>
+            <b-tab-item :label="$i18n.get('label_relationship_items_found')">
+                <b-table
+                        :data="data"
+                        :columns="columns"
+                        :checked-rows.sync="checkedRows"
+                        :is-row-checkable="(row) => row.id !== 3"
+                        checkable>
+
+                    <template slot="bottom-left">
+                        <b>Total</b>: {{ checkedRows.length }}
+                    </template>
+                </b-table>
+            </b-tab-item>
+
+            <b-tab-item :label="$i18n.get('label_selected')">
+                <button
+                        class="button field is-danger"
+                        @click="checkedRows = []"
+                        :disabled="!checkedRows.length">
+                    <b-icon icon="close"/>
+                    <span>{{ $i18n.get('label_clean') }}</span>
+                </button>
+                <pre>{{ checkedRows }}</pre>
+            </b-tab-item>
+        </b-tabs>
+    </section>
+</template>
+
+<script>
+    export default {
+        data() {
+            return {
+                data: this.items,
+                checkedRows: [],
+                columns: [
+                    {
+                        field: 'title',
+                        label: this.$i18n.get('label_title'),
+                    },
+                    {
+                        field: 'description',
+                        label: this.$i18n.get('label_description'),
+                    }
+                ]
+            }
+        },
+        watch: {
+            checkedRows( val ){
+                this.checkedRows = val;
+                this.$emit('input', val );
+            }
+        },
+        props: {
+            collectionId: Number,
+            totalItems: 0,
+            page: 1,
+            itemsPerPage: 12,
+            items: Array,
+        },
+        methods: {
+            clearSearch(){
+                this.$emit('clearSearch', true );
+            }
+        }
+    }
+</script>
\ No newline at end of file

From de439c82460a771d916c4457b70f59ea8562aa17 Mon Sep 17 00:00:00 2001
From: mateuswetah <mateus.m.luna@gmail.com>
Date: Mon, 26 Mar 2018 09:38:01 -0300
Subject: [PATCH 11/16] Now we can see Snackbars notifications instead of
 console.logs passing visual: true in main.js configuration for ConsolePlugin.

---
 src/admin/js/main.js               | 11 +++++------
 src/admin/js/utilities.js          | 16 ++++++++--------
 src/admin/scss/tainacan-admin.scss |  4 ++--
 3 files changed, 15 insertions(+), 16 deletions(-)

diff --git a/src/admin/js/main.js b/src/admin/js/main.js
index f0d8ca29f..7a82fd3b8 100644
--- a/src/admin/js/main.js
+++ b/src/admin/js/main.js
@@ -37,13 +37,14 @@ router.beforeEach((to, from, next) => {
     document.title = to.meta.title
     next()
 });
-Vue.use(Buefy); 
+Vue.use(Buefy);
 Vue.use(I18NPlugin);
 Vue.use(UserPrefsPlugin);
 Vue.use(RouterHelperPlugin);
 Vue.use(ConsolePlugin, {visual: false});
 
 // Register Components
+/* Fields */
 Vue.component('tainacan-text', Text);
 Vue.component('tainacan-textarea', Textarea);
 Vue.component('tainacan-selectbox', Selectbox);
@@ -55,20 +56,18 @@ Vue.component('tainacan-category', Category);
 Vue.component('tainacan-form-relationship', FormRelationship);
 Vue.component('tainacan-form-category', FormCategory);
 Vue.component('tainacan-form-selectbox', FormSelectbox);
-
 Vue.component('tainacan-form-item', TaincanFormItem);
 Vue.component('tainacan-filters-list', TaincanFiltersList);
 
-Vue.component('help-button', HelpButton);
-Vue.component('draggable', draggable);
-
 /* Filters */
-
 Vue.component('tainacan-filter-custom-interval', FilterCustomInterval);
 Vue.component('tainacan-filter-selectbox', FilterSelectbox);
 Vue.component('tainacan-filter-autocomplete', FilterAutocomplete);
 Vue.component('tainacan-filter-checkbox', FilterCheckbox);
 Vue.component('tainacan-filter-taginput', FilterTaginput);
+/* Others */
+Vue.component('help-button', HelpButton);
+Vue.component('draggable', draggable);
 
 new Vue({
     el: '#tainacan-admin-app',
diff --git a/src/admin/js/utilities.js b/src/admin/js/utilities.js
index 6f5ccef13..4eafa67e4 100644
--- a/src/admin/js/utilities.js
+++ b/src/admin/js/utilities.js
@@ -7,19 +7,19 @@ const wpApi = axios.create({
 
 wpApi.defaults.headers.common['X-WP-Nonce'] = tainacan_plugin.nonce;
 
-// I18N PLUGIN - Allows access to Wordpress translation file.
+// CONSOLE PLUGIN - Allows custom use of console functions and avoids eslint warnings.
 export const ConsolePlugin = {};
 ConsolePlugin.install = function (Vue, options = { visual: false }) {
-
+    
     Vue.prototype.$console = {
         log(something) {
             if (options.visual) {
-                this.$snackbar.open({
+                Vue.prototype.$snackbar.open({
                     message: something,
                     type: 'is-secondary',
                     position: 'is-bottom-right',
                     indefinite: true,
-                    queue: true
+                    queue: false
                 });
             } else {
                 console.log(something);
@@ -27,12 +27,12 @@ ConsolePlugin.install = function (Vue, options = { visual: false }) {
         },
         info(someInfo) {
             if (options.visual) {
-                this.$snackbar.open({
+                Vue.prototype.$snackbar.open({
                     message: someInfo,
                     type: 'is-primary',
                     position: 'is-bottom-right',
                     duration: 5000,
-                    queue: true
+                    queue: false
                 });
             } else { 
                 console.info(someInfo);
@@ -40,12 +40,12 @@ ConsolePlugin.install = function (Vue, options = { visual: false }) {
         },
         error(someError) {
             if (options.visual) {
-                this.$snackbar.open({
+                Vue.prototype.$snackbar.open({
                     message: someError,
                     type: 'is-danger',
                     position: 'is-bottom-right',
                     indefinite: true,
-                    queue: true
+                    queue: false
                 });
             } else { 
                 console.error(someError);
diff --git a/src/admin/scss/tainacan-admin.scss b/src/admin/scss/tainacan-admin.scss
index 78adada7a..b194d28fe 100644
--- a/src/admin/scss/tainacan-admin.scss
+++ b/src/admin/scss/tainacan-admin.scss
@@ -70,9 +70,9 @@ html {
     }
 }
 
-// Buefy notices (toast)
+// Buefy notices (toast, snackbar...)
 .notices {
-    z-index: 99999999 !important;
+    z-index: 99999999999999 !important;
 }
 
 // Input components used in forms are gray in Tainacan

From ca912bf74c2953bc6b4f4790aabf1c8a59048eb4 Mon Sep 17 00:00:00 2001
From: eduardohumberto <eduardo.humberto1992@gmail.com>
Date: Mon, 26 Mar 2018 11:16:05 -0300
Subject: [PATCH 12/16] Relationship field type: search in different fields

---
 .../field-types/relationship/Relationship.vue | 85 ++++---------------
 .../search-components/list-items.vue          | 77 -----------------
 2 files changed, 16 insertions(+), 146 deletions(-)
 delete mode 100644 src/classes/field-types/relationship/search-components/list-items.vue

diff --git a/src/classes/field-types/relationship/Relationship.vue b/src/classes/field-types/relationship/Relationship.vue
index de1b7b704..9b24359a0 100644
--- a/src/classes/field-types/relationship/Relationship.vue
+++ b/src/classes/field-types/relationship/Relationship.vue
@@ -1,7 +1,6 @@
 <template>
     <div>
         <b-taginput
-                v-if="this.searchFields.length === 0"
                 :id="id"
                 v-model="selected"
                 :data="options"
@@ -9,43 +8,12 @@
                 :loading="loading"
                 field="label"
                 @typing="search"/>
-        <div
-            v-else>
-            <div
-                v-if="itemsFound.length === 0"
-                class="box">
-                <b-field
-                        v-for="(field,index) in searchFields"
-                        :key="index"
-                        :label="field.name">
-                    <component
-                            @input="setQuery( $event, field )"
-                            :is="getComponentSearch( field )"/>
-                </b-field>
-                <button
-                        type="button"
-
-                        @click="doSearch"
-                        class="button">
-                    <b-icon icon="magnify" />
-                    <span> {{ $i18n.get('search') }}</span>
-                </button>
-            </div>
-
-            <list-found-items
-                    class="box"
-                    @input="listenSelectedItems"
-                    @clearSearch="clearSearch"
-                    :items="itemsFound"
-                    v-else/>
-        </div>
 
     </div>
 </template>
 
 <script>
     import { tainacan as axios } from '../../../js/axios/axios'
-    import ListFoundItems from './search-components/list-items.vue';
     import qs from 'qs';
 
     export default {
@@ -113,9 +81,6 @@
                 this.onInput( values );
             }
         },
-        components: {
-            ListFoundItems
-        },
         methods: {
             setResults(option){
                 if(!option)
@@ -132,10 +97,11 @@
                 }
 
                 if (query !== '') {
+                    let metaquery = this.mountQuery( query );
                     this.loading = true;
                     this.options = [];
                     let collectionId = ( this.field && this.field.field.field_type_options.collection_id ) ? this.field.field.field_type_options.collection_id : this.collection_id;
-                    axios.get('/collection/'+collectionId+'/items?search=' + query)
+                    axios.get('/collection/'+collectionId+'/items?' + qs.stringify( metaquery ))
                     .then( res => {
                         this.loading = false;
                         let result = res.data;
@@ -150,42 +116,23 @@
                     this.options = [];
                 }
             },
-            getComponentSearch( field ){
-                return field.field_type_object.component;
-            },
-            setQuery( event, field ){
-                if( field.field_type.indexOf( 'Core_Title' ) >= 0 ){
-                    this.queryObject['search'] = event;
-                } else if( field.field_type.indexOf( 'Core_Description' ) >= 0 ){
-                    this.queryObject['search'] = event;
-                }
-            },
-            doSearch(){
-                let collectionId = ( this.field && this.field.field.field_type_options.collection_id ) ? this.field.field.field_type_options.collection_id : this.collection_id;
-                axios.get('/collection/' + collectionId + '/items?' + qs.stringify( this.queryObject ))
-                    .then(res => {
-                        let items = res.data;
-                        if( items.length > 0 ){
-                            this.itemsFound = items;
+            mountQuery( search ){
+                let query = []
+                query['search'] = search;
+                if( this.searchFields.length > 0){
+                    query['metaquery'] = [];
+                    const metaquery = query['metaquery'];
+                    metaquery['relation'] = 'OR'
+                    for( let index in this.searchFields ){
+                        metaquery[index] = {
+                            key: this.searchFields[index].id,
+                            value: search
                         }
-                    })
-                    .catch(error => {
-                        this.$console.log( error )
-                    });
-            },
-            clearSearch(){
-                this.itemsFound = [];
-            },
-            listenSelectedItems( event ){
-                let results = [];
-
-                if( event && event.length > 0 ){
-                    for( let item of event ){
-                        results.push( item.id );
                     }
-                }
 
-                this.onInput( results );
+                    query['metaquery'] = metaquery;
+                }
+                return query;
             }
         }
     }
diff --git a/src/classes/field-types/relationship/search-components/list-items.vue b/src/classes/field-types/relationship/search-components/list-items.vue
deleted file mode 100644
index 756ea4727..000000000
--- a/src/classes/field-types/relationship/search-components/list-items.vue
+++ /dev/null
@@ -1,77 +0,0 @@
-<template>
-    <section>
-        <button
-                type="button"
-                @click="clearSearch"
-                class="button field is-info">
-            <b-icon icon="magnify"/>
-            <span>{{ $i18n.get('label_relationship_new_search') }}</span>
-        </button>
-
-        <b-tabs>
-            <b-tab-item :label="$i18n.get('label_relationship_items_found')">
-                <b-table
-                        :data="data"
-                        :columns="columns"
-                        :checked-rows.sync="checkedRows"
-                        :is-row-checkable="(row) => row.id !== 3"
-                        checkable>
-
-                    <template slot="bottom-left">
-                        <b>Total</b>: {{ checkedRows.length }}
-                    </template>
-                </b-table>
-            </b-tab-item>
-
-            <b-tab-item :label="$i18n.get('label_selected')">
-                <button
-                        class="button field is-danger"
-                        @click="checkedRows = []"
-                        :disabled="!checkedRows.length">
-                    <b-icon icon="close"/>
-                    <span>{{ $i18n.get('label_clean') }}</span>
-                </button>
-                <pre>{{ checkedRows }}</pre>
-            </b-tab-item>
-        </b-tabs>
-    </section>
-</template>
-
-<script>
-    export default {
-        data() {
-            return {
-                data: this.items,
-                checkedRows: [],
-                columns: [
-                    {
-                        field: 'title',
-                        label: this.$i18n.get('label_title'),
-                    },
-                    {
-                        field: 'description',
-                        label: this.$i18n.get('label_description'),
-                    }
-                ]
-            }
-        },
-        watch: {
-            checkedRows( val ){
-                this.checkedRows = val;
-                this.$emit('input', val );
-            }
-        },
-        props: {
-            collectionId: Number,
-            totalItems: 0,
-            page: 1,
-            itemsPerPage: 12,
-            items: Array,
-        },
-        methods: {
-            clearSearch(){
-                this.$emit('clearSearch', true );
-            }
-        }
-    }
-</script>
\ No newline at end of file

From 16b751818265df5c07a6e47abec4155a849d809a Mon Sep 17 00:00:00 2001
From: weryques <weryques@outlook.com>
Date: Mon, 26 Mar 2018 11:27:51 -0300
Subject: [PATCH 13/16] mapping relation

---
 src/api/class-tainacan-rest-controller.php | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/src/api/class-tainacan-rest-controller.php b/src/api/class-tainacan-rest-controller.php
index 99313232f..388b7e413 100644
--- a/src/api/class-tainacan-rest-controller.php
+++ b/src/api/class-tainacan-rest-controller.php
@@ -95,7 +95,8 @@ class TAINACAN_REST_Controller extends WP_REST_Controller {
 			'hideempty'    => 'hide_empty',
 			'perpage'      => 'posts_per_page',
 			'paged'        => 'paged',
-			'postin'       => 'post__in'
+			'postin'       => 'post__in',
+			'relation'     => 'relation'
 		];
 
 		$meta_query = [

From 7e07f4f6110d96e406c8067201d5feffc8fedb92 Mon Sep 17 00:00:00 2001
From: weryques <weryques@outlook.com>
Date: Mon, 26 Mar 2018 13:02:52 -0300
Subject: [PATCH 14/16] update slug at input (with some problems)

---
 package-lock.json                             | 48 +++++++++++--------
 .../edition/category-edition-form.vue         |  3 ++
 src/admin/pages/singles/category-page.vue     |  3 ++
 3 files changed, 33 insertions(+), 21 deletions(-)

diff --git a/package-lock.json b/package-lock.json
index e81fb1ab6..858bc7092 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -352,7 +352,7 @@
       "resolved": "https://registry.npmjs.org/async/-/async-2.6.0.tgz",
       "integrity": "sha512-xAfGg1/NTLBBKlHFmnd7PlmUW9KhVQIUuSrYem9xzFUZy13ScvtyGGejaae9iAVRiRq9+Cx7DPFaAAhCpyxyPw==",
       "requires": {
-        "lodash": "4.17.4"
+        "lodash": "4.17.5"
       }
     },
     "async-each": {
@@ -530,7 +530,7 @@
         "convert-source-map": "1.5.1",
         "debug": "2.6.9",
         "json5": "0.5.1",
-        "lodash": "4.17.4",
+        "lodash": "4.17.5",
         "minimatch": "3.0.4",
         "path-is-absolute": "1.0.1",
         "private": "0.1.8",
@@ -549,7 +549,7 @@
         "babel-types": "6.26.0",
         "detect-indent": "4.0.0",
         "jsesc": "1.3.0",
-        "lodash": "4.17.4",
+        "lodash": "4.17.5",
         "source-map": "0.5.7",
         "trim-right": "1.0.1"
       }
@@ -597,7 +597,7 @@
         "babel-helper-function-name": "6.24.1",
         "babel-runtime": "6.26.0",
         "babel-types": "6.26.0",
-        "lodash": "4.17.4"
+        "lodash": "4.17.5"
       }
     },
     "babel-helper-explode-assignable-expression": {
@@ -674,7 +674,7 @@
       "requires": {
         "babel-runtime": "6.26.0",
         "babel-types": "6.26.0",
-        "lodash": "4.17.4"
+        "lodash": "4.17.5"
       }
     },
     "babel-helper-remap-async-to-generator": {
@@ -885,7 +885,7 @@
         "babel-template": "6.26.0",
         "babel-traverse": "6.26.0",
         "babel-types": "6.26.0",
-        "lodash": "4.17.4"
+        "lodash": "4.17.5"
       }
     },
     "babel-plugin-transform-es2015-classes": {
@@ -1254,7 +1254,7 @@
         "babel-runtime": "6.26.0",
         "core-js": "2.5.1",
         "home-or-tmp": "2.0.0",
-        "lodash": "4.17.4",
+        "lodash": "4.17.5",
         "mkdirp": "0.5.1",
         "source-map-support": "0.4.18"
       }
@@ -1279,7 +1279,7 @@
         "babel-traverse": "6.26.0",
         "babel-types": "6.26.0",
         "babylon": "6.18.0",
-        "lodash": "4.17.4"
+        "lodash": "4.17.5"
       }
     },
     "babel-traverse": {
@@ -1296,7 +1296,7 @@
         "debug": "2.6.9",
         "globals": "9.18.0",
         "invariant": "2.2.2",
-        "lodash": "4.17.4"
+        "lodash": "4.17.5"
       }
     },
     "babel-types": {
@@ -1307,7 +1307,7 @@
       "requires": {
         "babel-runtime": "6.26.0",
         "esutils": "2.0.2",
-        "lodash": "4.17.4",
+        "lodash": "4.17.5",
         "to-fast-properties": "1.0.3"
       }
     },
@@ -2584,6 +2584,12 @@
           "integrity": "sha1-6CB68cx7MNRGzHC3NLXovhj4jVE=",
           "dev": true
         },
+        "lodash": {
+          "version": "4.17.4",
+          "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.4.tgz",
+          "integrity": "sha1-eCA6TRwyiuHYbcpkYONptX9AVa4=",
+          "dev": true
+        },
         "minimist": {
           "version": "1.2.0",
           "resolved": "https://registry.npmjs.org/minimist/-/minimist-1.2.0.tgz",
@@ -3178,7 +3184,7 @@
         "js-yaml": "3.11.0",
         "json-stable-stringify-without-jsonify": "1.0.1",
         "levn": "0.3.0",
-        "lodash": "4.17.4",
+        "lodash": "4.17.5",
         "minimatch": "3.0.4",
         "mkdirp": "0.5.1",
         "natural-compare": "1.4.0",
@@ -4873,7 +4879,7 @@
           "integrity": "sha1-LSFgx3iAMuTdbL4lAvH5osj2zeQ=",
           "dev": true,
           "requires": {
-            "lodash": "4.17.4"
+            "lodash": "4.17.5"
           }
         }
       }
@@ -4959,7 +4965,7 @@
       "integrity": "sha1-HcScaCLdnoovoAuiopUAboZkvQk=",
       "requires": {
         "glob": "7.1.2",
-        "lodash": "4.17.4",
+        "lodash": "4.17.5",
         "minimatch": "3.0.4"
       }
     },
@@ -5309,7 +5315,7 @@
       "requires": {
         "http-proxy": "1.16.2",
         "is-glob": "3.1.0",
-        "lodash": "4.17.4",
+        "lodash": "4.17.5",
         "micromatch": "2.3.11"
       },
       "dependencies": {
@@ -5463,7 +5469,7 @@
         "cli-width": "2.2.0",
         "external-editor": "2.1.0",
         "figures": "2.0.0",
-        "lodash": "4.17.4",
+        "lodash": "4.17.5",
         "mute-stream": "0.0.7",
         "run-async": "2.3.0",
         "rx-lite": "4.0.8",
@@ -6305,9 +6311,9 @@
       }
     },
     "lodash": {
-      "version": "4.17.4",
-      "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.4.tgz",
-      "integrity": "sha1-eCA6TRwyiuHYbcpkYONptX9AVa4="
+      "version": "4.17.5",
+      "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.5.tgz",
+      "integrity": "sha512-svL3uiZf1RwhH+cWrfZn3A4+U58wbP0tGVTLQPbjplZxZ8ROD9VLuNgsRniTlLe7OlSqR79RUehXgpBW/s0IQw=="
     },
     "lodash._createcompounder": {
       "version": "3.0.0",
@@ -8832,7 +8838,7 @@
       "integrity": "sha1-E/vWPNHK8JCLn9k0dq1DpR0eC0k=",
       "requires": {
         "glob": "7.1.2",
-        "lodash": "4.17.4",
+        "lodash": "4.17.5",
         "scss-tokenizer": "0.2.3",
         "yargs": "7.1.0"
       },
@@ -9735,7 +9741,7 @@
         "ajv": "5.5.2",
         "ajv-keywords": "2.1.1",
         "chalk": "2.3.2",
-        "lodash": "4.17.4",
+        "lodash": "4.17.5",
         "slice-ansi": "1.0.0",
         "string-width": "2.1.1"
       },
@@ -10507,7 +10513,7 @@
         "eslint-visitor-keys": "1.0.0",
         "espree": "3.5.4",
         "esquery": "1.0.0",
-        "lodash": "4.17.4"
+        "lodash": "4.17.5"
       },
       "dependencies": {
         "debug": {
diff --git a/src/admin/components/edition/category-edition-form.vue b/src/admin/components/edition/category-edition-form.vue
index 6d7422845..af5f673d4 100644
--- a/src/admin/components/edition/category-edition-form.vue
+++ b/src/admin/components/edition/category-edition-form.vue
@@ -74,7 +74,9 @@
                     <help-button 
                             :title="$i18n.getHelperTitle('categories', 'slug')" 
                             :message="$i18n.getHelperMessage('categories', 'slug')"/>
+                    <b-icon :class="{'is-loading': isUpdatingSlug}"/>
                     <b-input
+                            @input="updateSlug()"
                             id="tainacan-text-slug"
                             v-model="form.slug"
                             @focus="clearErrors('slug')"
@@ -230,6 +232,7 @@
 
                         promise.done((result) => {
                             this.form.slug = result.permalink;
+                            this.$console.info(this.form.slug);
                         });
 
                         this.isUpdatingSlug = false;
diff --git a/src/admin/pages/singles/category-page.vue b/src/admin/pages/singles/category-page.vue
index 4b7a15481..432637ca5 100644
--- a/src/admin/pages/singles/category-page.vue
+++ b/src/admin/pages/singles/category-page.vue
@@ -16,6 +16,9 @@
                             :to="{ path: $routerHelper.getCategoryEditPath(categoryId)}">
                         {{ $i18n.get('edit') + ' ' + $i18n.get('category') }}
                     </router-link>
+                    <a class="card-footer-item">
+                        Edit terms
+                    </a>
                 </footer>
             </div>
         </div>

From 39dd23b0f1c2e782984072710191e69621ddd98d Mon Sep 17 00:00:00 2001
From: mateuswetah <mateus.m.luna@gmail.com>
Date: Mon, 26 Mar 2018 13:12:22 -0300
Subject: [PATCH 15/16] Begins TermsEditionPage.

---
 cypress/fixtures/example.json                 |   5 +
 .../edition/category-edition-form.vue         | 108 ++++++++-
 .../edition/collection-edition-form.vue       |   5 +-
 .../components/edition/term-edition-form.vue  | 219 ++++++++++++++++++
 src/admin/tainacan-admin-i18n.php             |   2 +
 5 files changed, 324 insertions(+), 15 deletions(-)
 create mode 100644 cypress/fixtures/example.json
 create mode 100644 src/admin/components/edition/term-edition-form.vue

diff --git a/cypress/fixtures/example.json b/cypress/fixtures/example.json
new file mode 100644
index 000000000..da18d9352
--- /dev/null
+++ b/cypress/fixtures/example.json
@@ -0,0 +1,5 @@
+{
+  "name": "Using fixtures to represent data",
+  "email": "hello@cypress.io",
+  "body": "Fixtures are a great way to mock data for responses to routes"
+}
\ No newline at end of file
diff --git a/src/admin/components/edition/category-edition-form.vue b/src/admin/components/edition/category-edition-form.vue
index 6d7422845..31ddf74a5 100644
--- a/src/admin/components/edition/category-edition-form.vue
+++ b/src/admin/components/edition/category-edition-form.vue
@@ -98,6 +98,49 @@
                     </div>
                 </b-field>
 
+                <!-- Terms -->
+                <b-field
+                        :addons="false"
+                        :label="$i18n.get('label_category_terms')">
+                    <button
+                            class="button is-secondary"
+                            type="button"
+                            @click="addNewTerm()">
+                        {{ $i18n.get('label_add_new_term') }}
+                    </button>    
+                    
+                    <div 
+                            v-for="(term, index) in termsList" 
+                            :key="index">
+                        
+                        <span 
+                                class="field-name" 
+                                :class="{'is-danger': formWithErrors == term.id }">
+                                {{ term.name }}
+                        </span>
+                        <span 
+                                class="loading-spinner" 
+                                v-if="term.id == undefined"/>
+                        <span 
+                                class="controls" 
+                                v-if="term.id !== undefined">
+    
+                            <a @click.prevent="editTerm(term)">
+                                <b-icon 
+                                        type="is-gray" 
+                                        icon="pencil"/>
+                            </a>
+                            <a @click.prevent="removeTerm(term)">
+                                <b-icon 
+                                        type="is-gray" 
+                                        icon="delete"/>
+                            </a>
+                        </span>
+                    </div>
+
+                </b-field>
+
+                <!-- Submit -->
                 <div class="field is-grouped form-submit">
                     <div class="control">
                         <button
@@ -135,14 +178,15 @@
             return {
                 categoryId: Number,
                 category: null,
-                isLoading: false,
+                isLoadingCategory: false,
+                isLoadingTerms: false,
                 isUpdatingSlug: false,
                 form: {
                     name: String,
                     status: String,
                     description: String,
                     slug: String,
-                    allowInsert: String,
+                    allowInsert: String
                 },
                 statusOptions: [{
                     value: 'publish',
@@ -161,18 +205,28 @@
                 formErrorMessage: '',
             }
         },
+        computed: {
+            termsList() {
+                return this.getCategoryTerms();
+            }
+        },
         methods: {
             ...mapActions('category', [
                 'createCategory',
                 'updateCategory',
                 'fetchCategory',
                 'fetchOnlySlug',
+                'fetchCategoryTerms',
+                'sendTerm',
+                'updateTerm',
+                'deleteTerm'
             ]),
             ...mapGetters('category',[
-                'getCategory'
+                'getCategory',
+                'getCategoryTerms'
             ]),
             onSubmit() {
-                this.isLoading = true;
+                this.isLoadingCategory = true;
 
                 let data = {
                     categoryId: this.categoryId,
@@ -195,7 +249,7 @@
                         this.form.status = this.category.status;
                         this.allowInsert = this.category.allow_insert;
 
-                        this.isLoading = false;
+                        this.isLoadingCategory = false;
                         this.formErrorMessage = '';
                         this.editFormErrors = {};
 
@@ -209,7 +263,7 @@
                         }
                         this.formErrorMessage = errors.error_message;
 
-                        this.isLoading = false;
+                        this.isLoadingCategory = false;
                     });
             },
             updateSlug(){
@@ -239,7 +293,7 @@
                     .catch(errors => {
                         this.$console.error(errors);
 
-                        this.isLoading = false;
+                        this.isUpdatingSlug = false;
                     });
 
             },
@@ -259,7 +313,7 @@
             },
             createNewCategory() {
                 // Puts loading on Draft Category creation
-                this.isLoading = true;
+                this.isLoadingCategory = true;
 
                 // Creates draft Category
                 let data = {
@@ -285,7 +339,7 @@
                         // Pre-fill status with publish to incentivate it
                         this.form.status = 'publish';
 
-                        this.isLoading = false;
+                        this.isLoadingCategory = false;
 
                     }
                 )
@@ -300,6 +354,31 @@
             labelNewTerms(){
                 return ( this.form.allowInsert === 'yes' ) ? this.$i18n.get('label_yes') : this.$i18n.get('label_no');
             },
+            addNewTerm() {
+                this.$console.log("CREATING NEW TERM");
+
+                this.sendTerm({category: this.categoryId, status: 'auto-draft'})
+                .then(() => {
+
+                })
+                .catch(() => {
+
+                });
+            },
+            editTerm(term) {
+                this.$console.log(term);
+            },
+            removeTerm(term) {
+                this.$console.log(term);
+                
+                this.deleteTerm(term.id)
+                .then(() => {
+
+                })
+                .catch(() => {
+
+                });
+            }
         },
         created(){
 
@@ -307,7 +386,8 @@
                 this.createNewCategory();
             } else if (this.$route.fullPath.split("/").pop() === "edit") {
 
-                this.isLoading = true;
+                this.isLoadingCategory = true;
+                this.isLoadingTerms = true;
 
                 // Obtains current category ID from URL
                 this.pathArray = this.$route.fullPath.split("/").reverse();
@@ -323,7 +403,13 @@
                     this.form.status = this.category.status;
                     this.form.allowInsert = this.category.allow_insert;
 
-                    this.isLoading = false;
+                    this.isLoadingCategory = false;
+                });
+
+                this.fetchTerms(this.categoryId)
+                .then(() => {
+                    // Fill this.form data with current data.
+                    this.isLoadingCategory = false;
                 });
             }
         }
diff --git a/src/admin/components/edition/collection-edition-form.vue b/src/admin/components/edition/collection-edition-form.vue
index 1f6a4a2f4..28e91fc11 100644
--- a/src/admin/components/edition/collection-edition-form.vue
+++ b/src/admin/components/edition/collection-edition-form.vue
@@ -145,7 +145,7 @@
 </template>
 
 <script>
-import { mapActions, mapGetters } from 'vuex'
+import { mapActions } from 'vuex'
 
 export default {
     name: 'CollectionEditionForm',
@@ -190,9 +190,6 @@ export default {
             'sendAttachment',
             'updateThumbnail'
         ]),
-        ...mapGetters('collection',[
-            'getCollection'
-        ]),
         onSubmit() {
             // Puts loading on Draft Collection creation
             this.isLoading = true;
diff --git a/src/admin/components/edition/term-edition-form.vue b/src/admin/components/edition/term-edition-form.vue
new file mode 100644
index 000000000..ad775906f
--- /dev/null
+++ b/src/admin/components/edition/term-edition-form.vue
@@ -0,0 +1,219 @@
+<template>
+    <form 
+            id="termEditForm" 
+            class="tainacan-form" 
+            @submit.prevent="saveEdition(editForm)">    
+        
+        <b-field 
+                :addons="false"
+                :type="formErrors['name'] != undefined ? 'is-danger' : ''" 
+                :message="formErrors['name'] != undefined ? formErrors['name'] : ''"> 
+            <label class="label">
+                {{ $i18n.get('label_name') }} 
+                <span 
+                        class="required-term-asterisk" 
+                        :class="formErrors['name'] != undefined ? 'is-danger' : ''">*</span> 
+                <help-button 
+                        :title="$i18n.getHelperTitle('terms', 'name')" 
+                        :message="$i18n.getHelperMessage('terms', 'name')"/>
+            </label>
+            <b-input 
+                    v-model="editForm.name" 
+                    name="name" 
+                    @focus="clearErrors('name')"/>
+        </b-field>
+
+        <b-field
+                :addons="false"
+                :type="formErrors['description'] != undefined ? 'is-danger' : ''" 
+                :message="formErrors['description'] != undefined ? formErrors['description'] : ''">
+            <label class="label">
+                {{ $i18n.get('label_description') }}
+                <help-button 
+                        :title="$i18n.getHelperTitle('terms', 'description')" 
+                        :message="$i18n.getHelperMessage('terms', 'description')"/>
+            </label>
+            <b-input 
+                    type="textarea" 
+                    name="description" 
+                    v-model="editForm.description" 
+                    @focus="clearErrors('description')" />
+        </b-field>
+
+        <!-- <b-field 
+                :addons="false"
+                :type="formErrors['status'] != undefined ? 'is-danger' : ''" 
+                :message="formErrors['status'] != undefined ? formErrors['status'] : ''">
+            <label class="label">
+                {{ $i18n.get('label_status') }} 
+                <help-button 
+                        :title="$i18n.getHelperTitle('terms', 'status')" 
+                        :message="$i18n.getHelperMessage('terms', 'status')"/>
+            </label>
+            <div class="inline-block">
+                <b-radio 
+                        @focus="clearErrors('label_status')"
+                        id="tainacan-select-status-publish"
+                        name="status" 
+                        v-model="editForm.status"
+                        native-value="publish">
+                    {{ $i18n.get('publish_visibility') }}
+                </b-radio>
+                <br>
+                <b-radio 
+                        @focus="clearErrors('label_status')"
+                        id="tainacan-select-status-private"
+                        name="status" 
+                        v-model="editForm.status"
+                        native-value="private">
+                    {{ $i18n.get('private_visibility') }}
+                </b-radio>
+            </div>
+        </b-field> -->
+        <br>
+       
+       <b-field 
+                :addons="false"
+                :type="formErrors['parent_term'] != undefined ? 'is-danger' : ''" 
+                :message="formErrors['parent_term'] != undefined ? formErrors['parent_term'] : ''">
+            <label class="label">
+                {{ $i18n.get('label_parent_term') }} 
+                <help-button 
+                        :title="$i18n.getHelperTitle('terms', 'parent_term')" 
+                        :message="$i18n.getHelperMessage('terms', 'parent_term')"/>
+            </label>
+            <b-select
+                id="parent_term_select"
+                v-model="editForm.parent_term"
+                :placeholder="$i18n.get('instruction_select_a_parent_term')">
+                <option
+                        @focus="clearErrors('label_parent_term')"
+                        id="tainacan-select-parent-term"
+                        v-for="(parentTerm, index) in parentTermsList"
+                        :key="index"
+                        :value="editForm.parent_term.id">
+                    {{ parentTerm.name }}
+                </option>
+            </b-select>
+        </b-field>
+
+        <div class="term is-grouped form-submit">  
+            <div class="control">
+                <button 
+                        class="button is-outlined" 
+                        @click.prevent="cancelEdition()" 
+                        slot="trigger">
+                    {{ $i18n.get('cancel') }}
+                </button>
+            </div>
+            <div class="control">
+                <button 
+                        class="button is-success" 
+                        type="submit">
+                    {{ $i18n.get('save') }}
+                </button>
+            </div>
+        </div>
+        <p class="help is-danger">{{ formErrorMessage }}</p>
+    </form>
+</template>
+
+<script>
+import { mapActions, mapGetters } from 'vuex';
+
+export default {
+    name: 'TermEditionForm',
+    data(){
+        return {
+            editForm: {},
+            oldForm: {},
+            formErrors: {},
+            formErrorMessage: '',
+            closedByForm: false
+        }
+    }, 
+    props: {
+        index: '',
+        editedTerm: Object,
+        originalTerm: Object, 
+        categoryId: ''
+    },
+    computed: {
+        parentTermsList() {
+            return this.getTerms();
+        }
+    },
+    created() {
+        
+        this.editForm = this.editedTerm;
+        this.formErrors = this.editForm.formErrors != undefined ? this.editForm.formErrors : {};
+        this.formErrorMessage = this.editForm.formErrors != undefined ? this.editForm.formErrorMessage : ''; 
+        
+        this.oldForm = JSON.parse(JSON.stringify(this.originalTerm));
+
+    },
+    beforeDestroy() {
+        if (this.closedByForm) {
+            this.editedTerm.saved = true;
+        } else {
+            this.oldForm.saved = this.editForm.saved;
+            if (JSON.stringify(this.editForm) != JSON.stringify(this.oldForm)) 
+                this.editedTerm.saved = false;
+            else    
+                this.editedTerm.saved = true;
+        }
+    },
+    methods: {
+        ...mapActions('category', [
+            'updateTerm'
+        ]),
+        ...mapGetters('category', [
+            'getTerms'
+        ]),
+        saveEdition(term) {
+
+            this.updateTerm({repositoryId: this.repositoryId, termId: term.id, index: this.index, options: this.editForm})
+                .then(() => {
+                    this.editForm = {};
+                    this.formErrors = {};
+                    this.formErrorMessage = '';
+                    this.closedByForm = true;
+                    this.$emit('onEditionFinished');
+                })
+                .catch((errors) => {
+                    for (let error of errors.errors) {     
+                        for (let attribute of Object.keys(error))
+                            this.formErrors[attribute] = error[attribute];
+                    }
+                    this.formErrorMessage = errors.error_message;
+                    this.$emit('onErrorFound');
+
+                    this.editForm.formErrors = this.formErrors;
+                    this.editForm.formErrorMessage = this.formErrorMessage;
+                });
+        },
+        clearErrors(attribute) {
+            this.formErrors[attribute] = undefined;
+        },
+        cancelEdition() {
+            this.closedByForm = true;
+            this.$emit('onEditionCanceled');
+        },
+    }
+}
+</script>
+
+<style lang="scss" scoped>
+
+    @import "../../scss/_variables.scss";
+ 
+    form {
+        padding: 1.0em 2.0em;
+        border-top: 1px solid $draggable-border-color;
+        border-bottom: 1px solid $draggable-border-color;
+        margin-top: 1.0em;
+    }
+
+</style>
+
+
diff --git a/src/admin/tainacan-admin-i18n.php b/src/admin/tainacan-admin-i18n.php
index d7840aeab..d6d9d2dab 100644
--- a/src/admin/tainacan-admin-i18n.php
+++ b/src/admin/tainacan-admin-i18n.php
@@ -122,6 +122,7 @@ return [
 	'label_collection_filters'                 => __( 'Collection Filters', 'tainacan' ),
 	'label_parent_term'                        => __( 'Parent Term', 'tainacan' ),
 	'label_add_new_term'                       => __( 'Add New Term', 'tainacan' ),
+	'label_category_terms'                     => __( 'Category Terms', 'tainacan' ),
 
 	// Instructions. More complex sentences to guide user and placeholders
 	'instruction_dragndrop_fields_collection'  => __( 'Drag and drop Fields here to Collection.', 'tainacan' ),
@@ -134,6 +135,7 @@ return [
 	'instruction_image_upload_box'             => __( 'Drop an image here or click to upload.', 'tainacan' ),
 	'instruction_select_a_status'              => __( 'Select a status:', 'tainacan' ),
 	'instruction_select_a_filter_type'         => __( 'Select a filter type:', 'tainacan' ),
+	'instruction_select_a_parent_term'         => __( 'Select a parent term:', 'tainacan' ),
 
 	// Info. Other feedback to user.
 	'info_name_is_required'                    => __( 'Name is required.', 'tainacan' ),

From 6daccd8a3174ef94fcbb5d3989637c8a3e292253 Mon Sep 17 00:00:00 2001
From: mateuswetah <mateus.m.luna@gmail.com>
Date: Mon, 26 Mar 2018 17:08:32 -0300
Subject: [PATCH 16/16] Adds basic Terms CRUD in CategoryEditionForm. Still
 needs improvements and fixes!

---
 .../edition/category-edition-form.vue         | 259 +++++++++++++++---
 .../components/edition/term-edition-form.vue  | 105 ++++---
 src/admin/components/lists/fields-list.vue    |   1 -
 src/admin/tainacan-admin-i18n.php             |   3 +-
 src/js/store/modules/category/actions.js      |  68 ++++-
 src/js/store/modules/category/getters.js      |   4 +
 src/js/store/modules/category/index.js        |   1 +
 src/js/store/modules/category/mutations.js    |  24 ++
 8 files changed, 378 insertions(+), 87 deletions(-)

diff --git a/src/admin/components/edition/category-edition-form.vue b/src/admin/components/edition/category-edition-form.vue
index aa36f43d1..7ba72478e 100644
--- a/src/admin/components/edition/category-edition-form.vue
+++ b/src/admin/components/edition/category-edition-form.vue
@@ -100,32 +100,45 @@
                     </div>
                 </b-field>
 
-                <!-- Terms -->
+                <!-- Terms List -->
                 <b-field
                         :addons="false"
                         :label="$i18n.get('label_category_terms')">
                     <button
-                            class="button is-secondary"
+                            class="button is-secondary is-small"
                             type="button"
                             @click="addNewTerm()">
-                        {{ $i18n.get('label_add_new_term') }}
+                        {{ $i18n.get('label_new_term') }}
                     </button>    
-                    
-                    <div 
+                    <!-- Term item -->
+                    <div    
+                            class="term-item"
+                            :class="{
+                                'not-sortable-item': term.term_id == 'new' || term.term_id == undefined || openedTermId != '' , 
+                                'not-focusable-item': openedTermId == term.term_id
+                            }" 
                             v-for="(term, index) in termsList" 
                             :key="index">
-                        
                         <span 
-                                class="field-name" 
-                                :class="{'is-danger': formWithErrors == term.id }">
-                                {{ term.name }}
+                                class="term-name" 
+                                :class="{'is-danger': formWithErrors == term.term_id }">
+                            {{ term.name }}
+                        </span>
+                        <span   
+                                v-if="term.term_id != undefined"
+                                class="label-details">
+                            <span 
+                                    class="not-saved" 
+                                    v-if="(editForms[term.term_id] != undefined && editForms[term.term_id].saved != true) || term.term_id == 'new'"> 
+                                {{ $i18n.get('info_not_saved') }}
+                            </span>
                         </span>
                         <span 
                                 class="loading-spinner" 
-                                v-if="term.id == undefined"/>
+                                v-if="term.term_id == undefined"/>
                         <span 
                                 class="controls" 
-                                v-if="term.id !== undefined">
+                                v-if="term.term_id !== undefined || term.term_id !== 'new'">
     
                             <a @click.prevent="editTerm(term)">
                                 <b-icon 
@@ -138,6 +151,17 @@
                                         icon="delete"/>
                             </a>
                         </span>
+                        <div v-if="openedTermId == term.term_id">
+                            <term-edition-form   
+                                    :category-id="categoryId"
+                                    @onEditionFinished="onTermEditionFinished()"
+                                    @onEditionCanceled="onTermEditionCanceled()"
+                                    @onErrorFound="formWithErrors = term.term_id"
+                                    :index="index"
+                                    :original-term="term"
+                                    :edited-term="editForms[term.term_id]"/>
+
+                        </div>
                     </div>
 
                 </b-field>
@@ -171,6 +195,7 @@
 <script>
     import { wpAjax } from "../../js/mixins";
     import { mapActions, mapGetters } from 'vuex';
+    import TermEditionForm from './term-edition-form.vue'
     import htmlToJSON from 'html-to-json';
 
     export default {
@@ -181,7 +206,6 @@
                 categoryId: Number,
                 category: null,
                 isLoadingCategory: false,
-                isLoadingTerms: false,
                 isUpdatingSlug: false,
                 form: {
                     name: String,
@@ -205,29 +229,40 @@
                 }],
                 editFormErrors: {},
                 formErrorMessage: '',
+                // Terms related
+                isLoadingTerms: false,
+                formWithErrors: '',
+                openedTermId: '',
+                editForms: [],
+                orderedTermsList: []
             }
         },
         computed: {
             termsList() {
-                return this.getCategoryTerms();
+                //this.orderedTermsList = new Array();
+                //this.buildOrderedTermsList(0, 0); 
+                return this.getTerms();
             }
         },
+        components: {
+            TermEditionForm
+        },
         methods: {
             ...mapActions('category', [
                 'createCategory',
                 'updateCategory',
                 'fetchCategory',
                 'fetchOnlySlug',
-                'fetchCategoryTerms',
-                'sendTerm',
+                'fetchTerms',
                 'updateTerm',
                 'deleteTerm'
             ]),
             ...mapGetters('category',[
                 'getCategory',
-                'getCategoryTerms'
+                'getTerms'
             ]),
             onSubmit() {
+
                 this.isLoadingCategory = true;
 
                 let data = {
@@ -358,30 +393,71 @@
                 return ( this.form.allowInsert === 'yes' ) ? this.$i18n.get('label_yes') : this.$i18n.get('label_no');
             },
             addNewTerm() {
-                this.$console.log("CREATING NEW TERM");
-
-                this.sendTerm({category: this.categoryId, status: 'auto-draft'})
-                .then(() => {
-
-                })
-                .catch(() => {
-
-                });
+                let newTerm = {
+                    categoryId: this.categoryId,
+                    name: '',
+                    description: '',
+                    parent: 0,
+                    term_id: 'new'
+                }
+                this.termsList.push(newTerm);
+                this.editTerm(newTerm);
             },
             editTerm(term) {
-                this.$console.log(term);
+
+                // Closing collapse
+                if (this.openedTermId == term.term_id) {    
+                    this.openedTermId = '';
+
+                // Opening collapse
+                } else {
+
+                    this.openedTermId = term.term_id;
+                    // First time opening
+                    if (this.editForms[this.openedTermId] == undefined) {
+                        this.editForms[this.openedTermId] = JSON.parse(JSON.stringify(term));
+                        this.editForms[this.openedTermId].saved = true;
+                        
+                        if (term.term_id == 'new')
+                            this.editForms[this.openedTermId].saved = false;
+                    }     
+                }
             },
             removeTerm(term) {
                 this.$console.log(term);
                 
-                this.deleteTerm(term.id)
+                this.deleteTerm({categoryId: this.categoryId, termId: term.term_id})
                 .then(() => {
 
                 })
-                .catch(() => {
-
+                .catch((error) => {
+                    this.$console.log(error);
                 });
-            }
+            },
+            onTermEditionFinished() {
+                this.formWithErrors = '';
+                delete this.editForms[this.openedTermId];
+                this.openedTermId = '';
+            },
+            onTermEditionCanceled() {
+                this.formWithErrors = '';
+                delete this.editForms[this.openedTermId];
+                this.openedTermId = '';
+            },
+            buildOrderedTermsList(parentId, termDepth) {
+    
+                for (let term of this.termsList) {
+
+                    if (term['parent'] != parentId ) {    
+                        continue;
+                    } 
+                    
+                    term.depth = termDepth;
+                    this.orderedTermsList.push(term);
+
+                    this.buildOrderedTermsList(term.term_id, termDepth + 1);
+                }
+            },
         },
         created(){
 
@@ -413,15 +489,40 @@
                 .then(() => {
                     // Fill this.form data with current data.
                     this.isLoadingCategory = false;
+                })
+                .catch((error) => {
+                    this.$console.log(error);
                 });
             }
+        },
+        beforeRouteLeave ( to, from, next ) {
+            let hasUnsavedForms = false;
+            for (let editForm in this.editForms) {
+                if (!this.editForms[editForm].saved) 
+                    hasUnsavedForms = true;
+            }
+            if ((this.openedTermId != '' && this.openedTermId != undefined) || hasUnsavedForms ) {
+                this.$dialog.confirm({
+                    message: this.$i18n.get('info_warning_terms_not_saved'),
+                        onConfirm: () => {
+                            this.onEditionCanceled();
+                            next();
+                        },
+                        cancelText: this.$i18n.get('cancel'),
+                        confirmText: this.$i18n.get('continue'),
+                        type: 'is-secondary'
+                    });  
+            } else {
+                next()
+            }  
         }
-
     }
 </script>
 
 <style lang="scss" scoped>
 
+    @import "../../scss/_variables.scss";
+
     .thumbnail-field {
         width: 128px;
         height: 128px;
@@ -452,6 +553,102 @@
         }
     }
 
+    .loading-spinner {
+        animation: spinAround 500ms infinite linear;
+        border: 2px solid #dbdbdb;
+        border-radius: 290486px;
+        border-right-color: transparent;
+        border-top-color: transparent;
+        content: "";
+        display: inline-block;
+        height: 1em; 
+        width: 1em;
+    }
+
+    .term-item {
+        background-color: white;
+        padding: 0.7em 0.9em;
+        margin: 4px;
+        min-height: 40px;
+        display: block; 
+        position: relative;
+        cursor: grab;
+        
+        .handle {
+            padding-right: 6em;
+        }
+        .grip-icon { 
+            fill: $gray; 
+            top: 2px;
+            position: relative;
+        }
+        .term-name {
+            text-overflow: ellipsis;
+            overflow-x: hidden;
+            white-space: nowrap;
+            font-weight: bold;
+            margin-left: 0.4em;
+            margin-right: 0.4em;
+
+            &.is-danger {
+                color: $danger !important;
+            }
+        }
+        .label-details {
+            font-weight: normal;
+            color: $gray;
+        }
+        .not-saved {
+            font-style: italic;
+            font-weight: bold;
+            color: $danger;
+        }
+        .controls { 
+            position: absolute;
+            right: 5px;
+            top: 10px;
+
+            .icon {
+                bottom: 1px;   
+                position: relative;
+                i, i:before { font-size: 20px; }
+            }
+        }
+
+        &.not-sortable-item, &.not-sortable-item:hover {
+            cursor: default;
+            background-color: white !important;
+
+            .handle .label-details, .handle .icon {
+                color: $gray !important;
+            }
+        } 
+        &.not-focusable-item, &.not-focusable-item:hover {
+            cursor: default;
+            
+            .term-name {
+                color: $primary;
+            }
+            .handle .label-details, .handle .icon {
+                color: $gray !important;
+            }
+        }
+  
+    }
+    .term-item:hover:not(.not-sortable-item) {
+        background-color: $secondary;
+        border-color: $secondary;
+        color: white !important;
+
+        .label-details, .icon, .not-saved {
+            color: white !important;
+        }
+
+        .grip-icon { 
+            fill: white; 
+        }
+    }
+
 </style>
 
 
diff --git a/src/admin/components/edition/term-edition-form.vue b/src/admin/components/edition/term-edition-form.vue
index ad775906f..eae0023ab 100644
--- a/src/admin/components/edition/term-edition-form.vue
+++ b/src/admin/components/edition/term-edition-form.vue
@@ -39,38 +39,6 @@
                     v-model="editForm.description" 
                     @focus="clearErrors('description')" />
         </b-field>
-
-        <!-- <b-field 
-                :addons="false"
-                :type="formErrors['status'] != undefined ? 'is-danger' : ''" 
-                :message="formErrors['status'] != undefined ? formErrors['status'] : ''">
-            <label class="label">
-                {{ $i18n.get('label_status') }} 
-                <help-button 
-                        :title="$i18n.getHelperTitle('terms', 'status')" 
-                        :message="$i18n.getHelperMessage('terms', 'status')"/>
-            </label>
-            <div class="inline-block">
-                <b-radio 
-                        @focus="clearErrors('label_status')"
-                        id="tainacan-select-status-publish"
-                        name="status" 
-                        v-model="editForm.status"
-                        native-value="publish">
-                    {{ $i18n.get('publish_visibility') }}
-                </b-radio>
-                <br>
-                <b-radio 
-                        @focus="clearErrors('label_status')"
-                        id="tainacan-select-status-private"
-                        name="status" 
-                        v-model="editForm.status"
-                        native-value="private">
-                    {{ $i18n.get('private_visibility') }}
-                </b-radio>
-            </div>
-        </b-field> -->
-        <br>
        
        <b-field 
                 :addons="false"
@@ -84,20 +52,20 @@
             </label>
             <b-select
                 id="parent_term_select"
-                v-model="editForm.parent_term"
+                v-model="editForm.parent"
                 :placeholder="$i18n.get('instruction_select_a_parent_term')">
                 <option
                         @focus="clearErrors('label_parent_term')"
                         id="tainacan-select-parent-term"
                         v-for="(parentTerm, index) in parentTermsList"
                         :key="index"
-                        :value="editForm.parent_term.id">
+                        :value="editForm.parent.id">
                     {{ parentTerm.name }}
                 </option>
             </b-select>
         </b-field>
 
-        <div class="term is-grouped form-submit">  
+        <div class="field is-grouped form-submit">  
             <div class="control">
                 <button 
                         class="button is-outlined" 
@@ -165,6 +133,7 @@ export default {
     },
     methods: {
         ...mapActions('category', [
+            'sendTerm',
             'updateTerm'
         ]),
         ...mapGetters('category', [
@@ -172,25 +141,55 @@ export default {
         ]),
         saveEdition(term) {
 
-            this.updateTerm({repositoryId: this.repositoryId, termId: term.id, index: this.index, options: this.editForm})
-                .then(() => {
-                    this.editForm = {};
-                    this.formErrors = {};
-                    this.formErrorMessage = '';
-                    this.closedByForm = true;
-                    this.$emit('onEditionFinished');
-                })
-                .catch((errors) => {
-                    for (let error of errors.errors) {     
-                        for (let attribute of Object.keys(error))
-                            this.formErrors[attribute] = error[attribute];
-                    }
-                    this.formErrorMessage = errors.error_message;
-                    this.$emit('onErrorFound');
+            if (term.term_id == 'new') {
+                this.sendTerm({
+                    categoryId: this.categoryId, 
+                    index: this.index, 
+                    name: this.editForm.name,
+                    description: this.editForm.description,
+                    parent: this.editForm.parent
+                    })
+                    .then(() => {
+                        this.editForm = {};
+                        this.formErrors = {};
+                        this.formErrorMessage = '';
+                        this.closedByForm = true;
+                        this.$emit('onEditionFinished');
+                    })
+                    .catch((error) => {
+                        // for (let error of errors.errors) {     
+                        //     for (let attribute of Object.keys(error))
+                        //         this.formErrors[attribute] = error[attribute];
+                        // }
+                        // this.formErrorMessage = errors.error_message;
+                        this.$emit('onErrorFound');
+                        this.$console.log(error);
+                        // this.editForm.formErrors = this.formErrors;
+                        // this.editForm.formErrorMessage = this.formErrorMessage;
+                    });
 
-                    this.editForm.formErrors = this.formErrors;
-                    this.editForm.formErrorMessage = this.formErrorMessage;
-                });
+            } else {
+  
+                this.updateTerm({categoryId: this.categoryId, termId: term.term_id, index: this.index, options: this.editForm})
+                    .then(() => {
+                        this.editForm = {};
+                        this.formErrors = {};
+                        this.formErrorMessage = '';
+                        this.closedByForm = true;
+                        this.$emit('onEditionFinished');
+                    })
+                    .catch((error) => {
+                        // for (let error of errors.errors) {     
+                        //     for (let attribute of Object.keys(error))
+                        //         this.formErrors[attribute] = error[attribute];
+                        // }
+                        // this.formErrorMessage = errors.error_message;
+                        this.$emit('onErrorFound');
+                        this.$console.log(error);
+                        // this.editForm.formErrors = this.formErrors;
+                        // this.editForm.formErrorMessage = this.formErrorMessage;
+                    });
+            }
         },
         clearErrors(attribute) {
             this.formErrors[attribute] = undefined;
diff --git a/src/admin/components/lists/fields-list.vue b/src/admin/components/lists/fields-list.vue
index a18e5c653..a44af8345 100644
--- a/src/admin/components/lists/fields-list.vue
+++ b/src/admin/components/lists/fields-list.vue
@@ -274,7 +274,6 @@ export default {
             delete this.editForms[this.openedFieldId];
             this.openedFieldId = '';
         }
-
     },
     computed: {
         availableFieldList() {
diff --git a/src/admin/tainacan-admin-i18n.php b/src/admin/tainacan-admin-i18n.php
index d6d9d2dab..c2740cf64 100644
--- a/src/admin/tainacan-admin-i18n.php
+++ b/src/admin/tainacan-admin-i18n.php
@@ -121,7 +121,7 @@ return [
 	'label_collection_fields'                  => __( 'Collection Fields', 'tainacan' ),
 	'label_collection_filters'                 => __( 'Collection Filters', 'tainacan' ),
 	'label_parent_term'                        => __( 'Parent Term', 'tainacan' ),
-	'label_add_new_term'                       => __( 'Add New Term', 'tainacan' ),
+	'label_new_term'                       	   => __( 'New Term', 'tainacan' ),
 	'label_category_terms'                     => __( 'Category Terms', 'tainacan' ),
 
 	// Instructions. More complex sentences to guide user and placeholders
@@ -165,6 +165,7 @@ return [
 	'info_warning_fields_not_saved'            => __('Are you sure? There are fields not saved, changes will be lost.', 'tainacan'),
     'info_warning_filters_not_saved'           => __('Are you sure? There are filters not saved, changes will be lost.', 'tainacan'),
     'info_no_description_provided'             => __('No description provided.', 'tainacan'),
+    'info_warning_terms_not_saved'             => __('Are you sure? There are terms not saved, changes will be lost.', 'tainacan'),
 
 	// Tainacan Field Types
 	'tainacan-text'                            => __( 'Text', 'tainacan' ),
diff --git a/src/js/store/modules/category/actions.js b/src/js/store/modules/category/actions.js
index 887c330b0..01ae5732a 100644
--- a/src/js/store/modules/category/actions.js
+++ b/src/js/store/modules/category/actions.js
@@ -1,5 +1,6 @@
 import axios from '../../../axios/axios'
 
+// CATEGORIES
 export const createCategory = ({commit}, category) => {
     return new Promise(( resolve, reject ) => {
         axios.tainacan.post('/taxonomies', {
@@ -114,4 +115,69 @@ export const fetchCategoryName = ({ commit }, categoryId) => {
                 reject(error)
             })
     });
-};
\ No newline at end of file
+};
+
+// CATEGORY TERMS
+export const sendTerm = ({commit}, { categoryId, index, name, description, parent }) => {
+    return new Promise(( resolve, reject ) => {
+        axios.tainacan.post('/taxonomy/' + categoryId + '/terms/', {
+            name: name,
+            description: description,
+            parent: parent
+        })
+            .then( res => {
+                let term = res.data;
+                commit('setSingleTerm', term);
+                resolve( term );
+            })
+            .catch(error => {
+                console.log(error);
+                reject( error );
+            });
+    });
+};
+
+export const deleteTerm = ({ commit }, { categoryId, termId }) => {
+    return new Promise(( resolve, reject ) => {
+        axios.tainacan.delete(`/taxonomy/${categoryId}/terms/${termId}?permanently=${true}`)
+            .then(res => {
+                let term = res.data;
+                commit('deleteTerm', term);
+                resolve( term );
+            })
+            .catch(error => {
+                reject( error )
+            });
+    });
+};
+
+export const updateTerm = ({ commit }, { categoryId, termId, index, options }) => {
+    return new Promise(( resolve, reject ) => {
+        axios.tainacan.patch('/taxonomy/' + categoryId + '/terms/' + termId, options)
+            .then( res => {
+                let term = res.data;
+                console.log(term);
+                commit('setSingleTerm', term);
+                resolve( term );
+            })
+            .catch(error => {
+                console.log(error);
+                reject(error)
+                //reject({ error_message: error['response']['data'].error_message, errors: error['response']['data'].errors });
+            });
+    });
+};
+
+export const fetchTerms = ({ commit }, categoryId ) => {
+    return new Promise((resolve, reject) => {
+        axios.tainacan.get(`/taxonomy/${categoryId}/terms/`)
+            .then(res => {
+                let terms = res.data;
+                commit('setTerms', terms);
+                resolve( terms );
+            })
+            .catch(error => {
+                reject( error );
+            });
+    });
+};
diff --git a/src/js/store/modules/category/getters.js b/src/js/store/modules/category/getters.js
index c4cbe39c1..3a399a74d 100644
--- a/src/js/store/modules/category/getters.js
+++ b/src/js/store/modules/category/getters.js
@@ -8,4 +8,8 @@ export const getCategories = state => {
 
 export const getCategoryName = state => {
   return state.categoryName;
+};
+
+export const getTerms = state => {
+  return state.terms;
 };
\ No newline at end of file
diff --git a/src/js/store/modules/category/index.js b/src/js/store/modules/category/index.js
index 3863f310d..2691a67f1 100644
--- a/src/js/store/modules/category/index.js
+++ b/src/js/store/modules/category/index.js
@@ -6,6 +6,7 @@ const state = {
     categories: [],
     category: {},
     categoryName: String,
+    terms: []
 };
 
 export default {
diff --git a/src/js/store/modules/category/mutations.js b/src/js/store/modules/category/mutations.js
index 686659651..f6241307d 100644
--- a/src/js/store/modules/category/mutations.js
+++ b/src/js/store/modules/category/mutations.js
@@ -1,3 +1,4 @@
+// CATEGORIES
 export const setCategory = (state, category) => {
     state.category = category;
 };
@@ -16,4 +17,27 @@ export const deleteCategory = ( state, category ) => {
     if (index >= 0) {
         state.categories.splice(index, 1);
     }
+};
+
+// CATEGORY TERMS
+export const setSingleTerm = (state, term) => {
+
+    let index = state.terms.findIndex(updatedTerm => updatedTerm.id === term.id);
+    if ( index >= 0){
+        Vue.set( state.terms, index, term );
+    } else {
+        state.terms.push( term );
+    }
+};
+
+export const setTerms = (state, terms) => {
+    state.terms = terms;
+};
+
+export const deleteTerm = ( state, term ) => {
+    let index = state.terms.findIndex(deletedTerm => deletedTerm.id === term.id);
+
+    if (index >= 0) {
+        state.terms.splice(index, 1);
+    }
 };
\ No newline at end of file