diff --git a/modules/cloud_service_providers/aws_cloud/aws_cloud.libraries.yml b/modules/cloud_service_providers/aws_cloud/aws_cloud.libraries.yml
index 01be145d0be0253fc62a51f2ed64dcf4bfdd6fff..75780703874476dcd245b30cecd07b810707dacf 100644
--- a/modules/cloud_service_providers/aws_cloud/aws_cloud.libraries.yml
+++ b/modules/cloud_service_providers/aws_cloud/aws_cloud.libraries.yml
@@ -48,8 +48,7 @@ aws_cloud_image_import:
     theme:
       css/aws_cloud_image_import.css: {}
   dependencies:
-    - core/jquery
-    - cloud/select2
+    - cloud/tom-select
 
 aws_cloud_instance_monitor:
   version: 5.x-dev
diff --git a/modules/cloud_service_providers/aws_cloud/css/aws_cloud_image_import.css b/modules/cloud_service_providers/aws_cloud/css/aws_cloud_image_import.css
index 8e25061ce270aeb624fe2421cd0f2a5c50ca5db7..b917d97b5db4004c11b9815194e224f75f406524 100644
--- a/modules/cloud_service_providers/aws_cloud/css/aws_cloud_image_import.css
+++ b/modules/cloud_service_providers/aws_cloud/css/aws_cloud_image_import.css
@@ -1,7 +1,7 @@
-.select2-selection__arrow {
-  display: none;
+select#edit-name+.ts-wrapper {
+  padding: 5px 30px 5px 5px;
 }
 
-select[name=name] {
-  min-width: 500px;
+.plugin-dropdown_input.focus.dropdown-active .ts-control {
+  border: none;
 }
diff --git a/modules/cloud_service_providers/aws_cloud/js/aws_cloud_image_import.js b/modules/cloud_service_providers/aws_cloud/js/aws_cloud_image_import.js
index 2591c4e46b0c174d81980240c190c3c7248f9bce..2dc8c3c1634f5c5249fd92cd099229813398bb9a 100644
--- a/modules/cloud_service_providers/aws_cloud/js/aws_cloud_image_import.js
+++ b/modules/cloud_service_providers/aws_cloud/js/aws_cloud_image_import.js
@@ -1,28 +1,40 @@
-(function ($) {
+(function () {
   'use strict';
 
-  $('#edit-name').select2({
-    ajax: {
-      url: 'search',
-      dataType: 'json',
-      type: 'GET',
-      delay: 1000,
-      data: function (params) {
-        return {
-          q: params.term
-        };
-      },
-      processResults: function (data) {
-        let res = data.map(function (item) {
-          return {id: item.id, text: item.name};
-        });
-        return {
-          results: res
-        };
+  const mySelect = new TomSelect('#edit-name', {
+    valueField: 'id',
+    labelField: 'name',
+    searchField: [],
+    placeholder: 'Search for images',
+    shouldLoad: function (query, callback) {
+      if (query.length > 3) {//if search has at least 4 chars
+        return true;
       }
     },
-    minimumInputLength: 4,
-    placeholder: 'Search for images'
+    // fetch remote data
+    load: function (query, callback) {
+      // Clear existing options before adding new ones
+      mySelect.clearOptions();
+      const url = 'search?q=' + encodeURIComponent(query);
+      fetch(url)
+        .then(response => response.json())
+        .then(json => {
+          callback(json);
+        }).catch(() => {
+          callback();
+        });
+
+    },
+    render: {
+      option: function (item, escape) {
+        return `<div><div style="font-weight: bold;">${escape(item.name)}</div></div>`;
+      },
+
+      item: function (item, escape) {
+        return '<div title="' + item.name + '">' + item.name + '</div>';
+      }
+    }
+
   });
 
-})(jQuery);
+})();