1 files changed, 15 insertions, 43 deletions
diff --git a/plugins/CoreHome/vue/src/ActivityIndicator/ActivityIndicator.adapter.ts b/plugins/CoreHome/vue/src/ActivityIndicator/ActivityIndicator.adapter.ts
index 0ca0ac8241..84cb965fc6 100644
--- a/plugins/CoreHome/vue/src/ActivityIndicator/ActivityIndicator.adapter.ts
+++ b/plugins/CoreHome/vue/src/ActivityIndicator/ActivityIndicator.adapter.ts
@@ -5,51 +5,23 @@
  * @license http://www.gnu.org/licenses/gpl-3.0.html GPL v3 or later
  */
 
-import { createApp } from 'vue';
 import ActivityIndicator from './ActivityIndicator.vue';
 import translate from '../translate';
+import createAngularJsAdapter from '../createAngularJsAdapter';
 
-interface ActivityIndicatorAdapterScope extends ng.IScope {
-  loading: boolean;
-  loadingMessage: string;
-}
-
-export default function activityIndicatorAdapter(): ng.IDirective {
-  return {
-    restrict: 'A',
-    scope: {
-      loading: '<',
-      loadingMessage: '<',
+export default createAngularJsAdapter({
+  component: ActivityIndicator,
+  scope: {
+    loading: {
+      vue: 'loading',
+      angularJsBind: '<',
     },
-    template: '',
-    link: function activityIndicatorAdapterLink(
-      scope: ActivityIndicatorAdapterScope,
-      element: ng.IAugmentedJQuery,
-    ) {
-      const app = createApp({
-        template: '<activity-indicator :loading="loading" :loadingMessage="loadingMessage"/>',
-        data() {
-          return {
-            loading: scope.loading,
-            loadingMessage: scope.loadingMessage,
-          };
-        },
-      });
-      app.config.globalProperties.$sanitize = window.vueSanitize;
-      app.component('activity-indicator', ActivityIndicator);
-      const vm = app.mount(element[0]);
-
-      scope.$watch('loading', (newValue: boolean) => {
-        vm.loading = newValue;
-      });
-
-      scope.$watch('loadingMessage', (newValue: string) => {
-        vm.loadingMessage = newValue || translate('General_LoadingData');
-      });
+    loadingMessage: {
+      vue: 'loadingMessage',
+      angularJsBind: '<',
+      default: () => translate('General_LoadingData'),
     },
-  };
-}
-
-activityIndicatorAdapter.$inject = [];
-
-angular.module('piwikApp').directive('piwikActivityIndicator', activityIndicatorAdapter);
+  },
+  $inject: [],
+  directiveName: 'piwikActivityIndicator',
+});