[Vue] convert sites manager single site template/controller to vue component (#18562)

* migrate select-on-focus directive and start migrating report-export directive

* finish migrating report export directive & popover component + create reusable function to create vue app and add globals to it

* rebuild vue

* remove angularjs files and move less contents to vue dir

* migrate sparkline component

* migrate progressbar component

* migrate content intro & content table directives

* rebuild vue

* migrate piwik-ajax-form component to vue

* migrate popover handler directive to service class

* migrate dropdownbutton directive though it does not seem to be in use

* migrate show sensitive data directive

* build vue

* built vue files

* fix function signature

* fix vue warning

* fix ajax request race condition

* rebuild vue

* add new notification type "help" so the help notification is not cleared when clearing transient notifications

* fix some bugs and tests

* update screenshot

* update screenshot & fix a test

* allow using unminified jquery ui + fix bug in last fix

* fix error when enrichedheadline is used in modal

* add polyfill min.js

* remove two todos

* fix widget url logic

* update some screenshots and fix sanitization/escape issue

* update screenshots

* rebuild vue

* fix url location updating regression in MatomoUrl.updateLocation use

* submodule

* update screenshots and fix possible error in json parse

* built vue files

* Merge branch 'vue-period-selector-regression' into vue-reporting-menu

* rebuild vue

* use correct variable

* rebuild vue

* fix widget url logic

* segment parameter can be undefined now for some reason

* fix ngmodel binding in siteselector adapter (for last time hopefully)

* the original site selector only set the first site to the first site in the initial sites query if there was only one site in the entire matomo instance

* fix sitesmanager ui test failure

* fix usersettings test failure

* rebuild vue

* more siteselector tweaks.

* build CoreHome

* more siteselector tweaks.

* another siteselector issue

* update screenshots

* update screenshot and try to fix random failure

* fix some issues in widget.vue when containerid is specified

* fix couple tests

* fix several test failures

* fix string concat

* fix test failure

* extra change

* fix last change and random failure

* styling fix

* fix last fix

* real fix this time

* fix stray request

* proper fix

* update build files

* try to fix random failure

* do not submit form

* check for api errors in promise chain in ajaxhelper.ts

* force a digest after a location change

* use proper abortcontroller method instead of promise hack, have to add new polyfill + try to fix random test failure

* some UI test fixes

* fix some report export issues

* several save button fixes + make replace approximation in createAngularJsAdapter better

* fix sparkline

* apply after manual click triggering in savebutton

* css fixes and piwik-content-table was never applied by angularjs in installtion

* rebuild vue

* add names to divs so they can still be queried as they were in angularjs

* rebuild vue

* rebuild vue

* now that format_metrics checkbox works, need to check it

* small delay before processing first popover

* fix dropdown class/directive name

* fix overlay test

* remove unintended changes

* remove unintended changes

* migrate archiving controller

* do not do a passthrough transpile of vue typescript, and fix many typescript errors in existing code

* more typescript fixes

* even more fixes

* workarounds to fix recursive typing issues

* get corehome to build w/ full typescript build and output type definitions to local dir

* get outputted typings to be used when compiling other plugins and fix typescript issues in CorePluginsAdmin

* readd corehome umd

* fix typescript errors in ExampleVue plugin

* fix feedback typescript errors

* rebuild

* migrate branding controller and get to build

* fix issues and get to work

* rebuild

* fix notification scroll

* migrate smtp settings controller in coreadminhome

* get to work

* migrate js tracking code generator and get to build

* migrate image tracking code generator and get to build

* get to work in UI

* get UI tests to pass locally

* forgot to add files + rebuild vue

* update screenshots

* Show a summary of new features (#18065)

* Added "What is new" notification display, populated by a new event

* Removed test example event hook

* Added support for applying a link attribute to menu items, fixes layout issue for mobile with html menu items

* Updated UI test screenshots

* Revert accidental edit

* Hide the "What's new" icon if there are no new features to show

* Changed to use changes.json, track user last viewed, added ui test

* Fix UserManager unit tests broken by new ts_changes_viewed user field

* Moved getChanges to separate helper class, added unit test, added user view access check

* Updated to add new changes table and populate only on plugin update/install

* Added missing fixture class, updated UI screenshots

* Updated matomo font to add ringing bell and new releases icons

* Fix for integration test

* Reworked class structure, removed unnecessary angular directive, merged templates, other tidy ups

* built vue files

* built vue files

* Added null user check, missing table exception handling, show plugin name in change title, better handling of missing change fields

* Added sample changes file, moved UserChanges db code to changes model, added return type hints, better db error code handling, various other improvements

* Revert accidental UI screenshot commit

* Fix for incorrect link name parameter in sample changes, switched back to using $db->query for INSERT IGNORE

* Integration test fix, UI screenshot updates

* Test fix

* Added link styling, show CoreHome changes without plugin prefix in title

* Update UI test screenshot

* Added styles to the popover, added event for filtering changes

* Test fix

* UI test screenshot updates

Co-authored-by: sgiehl <stefan@matomo.org>
Co-authored-by: bx80 <bx80@users.noreply.github.com>

* Update test translation (#18531)

update a test failed XML

* updates all submodules (#18541)

Co-authored-by: diosmosis <diosmosis@users.noreply.github.com>

* Translations update from Hosted Weblate (#18529)

* Translated using Weblate (Greek)

Currently translated at 100.0% (162 of 162 strings)

Translation: Matomo/Plugin CoreAdminHome
Translate-URL: https://hosted.weblate.org/projects/matomo/plugin-coreadminhome/el/

[ci skip]

Co-authored-by: Hosted Weblate <hosted@weblate.org>
Co-authored-by: Vasilis Lourdas <dev@lourdas.eu>

* Translated using Weblate (Chinese (Simplified))

Currently translated at 83.9% (136 of 162 strings)

Translation: Matomo/Plugin CoreAdminHome
Translate-URL: https://hosted.weblate.org/projects/matomo/plugin-coreadminhome/zh_Hans/

[ci skip]

Translated using Weblate (Chinese (Simplified))

Currently translated at 99.6% (620 of 622 strings)

Translation: Matomo/Matomo Base
Translate-URL: https://hosted.weblate.org/projects/matomo/matomo-base/zh_Hans/

[ci skip]

Co-authored-by: Hosted Weblate <hosted@weblate.org>
Co-authored-by: 刘韬 <lyuutau@outlook.com>

* Update translation files

Updated by "Squash Git commits" hook in Weblate.

Translation: Matomo/Plugin CoreAdminHome
Translate-URL: https://hosted.weblate.org/projects/matomo/plugin-coreadminhome/

[ci skip]

Co-authored-by: Vasilis Lourdas <dev@lourdas.eu>
Co-authored-by: 刘韬 <lyuutau@outlook.com>

* [Vue] migrate report export directive and popover (#18440)

* update files

* sidenav start

* make getRef a utility method

* tweak

* add return type

* finish converting side-nav directive

* starting on reporting menu conversion

* remove unused properties

* convert reporting pages service

* migrate report metadata store

* remove angularjs files

* migrating reporting pages store

* make store adapters more immutable

* get service adapters to work

* fix a UI test

* another html fix

* migrate most of reporting menu directive and model

* Use themed font family for input forms to override materialize.css styling

* rebuild vue

* add a missing div

* ui test fixes

* update styling

* get to build

* get to load in the UI w/o error

* clone result of functions

* fix compile issue

* migrate widget loader and get to load in UI

* rebuild vue

* migrate widgetcontainer

* migrate widget bydimension container

* migrate widget + add tooltips directive

* quick fix

* Updating version to 4.6.0

* loading in page

* update expected screenshot

* add wait just in case travis is slow

* fix ordering bug

* add another wait

* rebuild vue

* css tweak

* fix some bugs and tests

* undo screenshot changes

* Menus test passing locally

* [Vue] date picker viewDate property is not kept up to date (#18385)

* viewDate ref is not kept up to date

* rebuild corehome

* reporting menu subcategory items are meant to be normal links

* update some screenshots

* use innerText instead of text() since angularjs maintains newlines in HTML that vue does not add

* trigger angularjs digest after ajaxhelper request

* rebuild vue

* update screenshots, fix bug in link generation in reporting menu and allow syncing multiple screenshot regexes at a time

* undo box-shadow change for UI tests

* fix more issues & update more tests

* update some screenshots

* fix some tests

* rebuild CoreHome

* quick fix

* built vue files

* fix angularjs issue

* add comment

* update umd files

* 4.6.1-rc1

* 4.6.1

* fix field array title

* apply some pr feedback

* apply more pr feedback

* another fix

* tweak

* fix ng-change not executed before ng-model

* fix another set of issues

* fix another issue

* rebuild vue

* better ng-change/ng-model fix

* update some screenshots

* rebuild vue

* remove some TODOs

* initiate initial ng-change ONLY for site selectors where this behavior applies

* emit/broadcast on correct scope in wrapper

* rebuild vue

* fix some issues

* couple more fixes

* fix another title issue

* rebuild vue

* do not report on ajax errors in notifications if not logged in

* migrate reporting page and model

* rebuild vue

* create sites selector model adapter

* fix siteselector vue bug, initial site is only set if there is just one site available

* rebuild vue

* migrate plugin settings directive

* remove TODO

* migrate plugin filter directive

* migrate two more plugins directives

* migrate save button

* fix a bunch of bugs

* fix another widget bug

* allow change event name between angularjs and vue

* rebuild vue

* migrate plugin form directive

* get to work

* migrate select-on-focus directive and start migrating report-export directive

* finish migrating report export directive & popover component + create reusable function to create vue app and add globals to it

* rebuild vue

* remove angularjs files and move less contents to vue dir

* built vue files

* fix function signature

* fix vue warning

* fix ajax request race condition

* rebuild vue

* add new notification type "help" so the help notification is not cleared when clearing transient notifications

* fix some bugs and tests

* update screenshot

* update screenshot & fix a test

* allow using unminified jquery ui + fix bug in last fix

* fix error when enrichedheadline is used in modal

* add polyfill min.js

* remove two todos

* fix widget url logic

* update some screenshots and fix sanitization/escape issue

* update screenshots

* rebuild vue

* fix url location updating regression in MatomoUrl.updateLocation use

* submodule

* update screenshots and fix possible error in json parse

* built vue files

* Merge branch 'vue-period-selector-regression' into vue-reporting-menu

* rebuild vue

* use correct variable

* rebuild vue

* fix widget url logic

* segment parameter can be undefined now for some reason

* fix ngmodel binding in siteselector adapter (for last time hopefully)

* the original site selector only set the first site to the first site in the initial sites query if there was only one site in the entire matomo instance

* fix sitesmanager ui test failure

* fix usersettings test failure

* rebuild vue

* more siteselector tweaks.

* build CoreHome

* more siteselector tweaks.

* another siteselector issue

* update screenshots

* update screenshot and try to fix random failure

* fix some issues in widget.vue when containerid is specified

* fix couple tests

* fix several test failures

* fix string concat

* fix test failure

* extra change

* fix last change and random failure

* styling fix

* fix last fix

* real fix this time

* fix stray request

* proper fix

* update build files

* try to fix random failure

* do not submit form

* check for api errors in promise chain in ajaxhelper.ts

* force a digest after a location change

* use proper abortcontroller method instead of promise hack, have to add new polyfill + try to fix random test failure

* some UI test fixes

* fix some report export issues

* several save button fixes + make replace approximation in createAngularJsAdapter better

* apply after manual click triggering in savebutton

* add names to divs so they can still be queried as they were in angularjs

* rebuild vue

* now that format_metrics checkbox works, need to check it

* fix unintended changes

* updated expected screenshots

* update two more

* go back to previous format_metrics behavior in popover

Co-authored-by: Justin Velluppillai <justin@innocraft.com>
Co-authored-by: justinvelluppillai <justinvelluppillai@users.noreply.github.com>
Co-authored-by: Matthieu Aubry <mattab@users.noreply.github.com>

* [Vue] remove support in vue for FormField.allSettings (#18542)

* deprecate support in vue for FormField.allSettings since deep watching the property doesnt quite work

* built vue files

* update screenshots

* update screenshot

* Show a summary of new features (#18065)

* Added "What is new" notification display, populated by a new event

* Removed test example event hook

* Added support for applying a link attribute to menu items, fixes layout issue for mobile with html menu items

* Updated UI test screenshots

* Revert accidental edit

* Hide the "What's new" icon if there are no new features to show

* Changed to use changes.json, track user last viewed, added ui test

* Fix UserManager unit tests broken by new ts_changes_viewed user field

* Moved getChanges to separate helper class, added unit test, added user view access check

* Updated to add new changes table and populate only on plugin update/install

* Added missing fixture class, updated UI screenshots

* Updated matomo font to add ringing bell and new releases icons

* Fix for integration test

* Reworked class structure, removed unnecessary angular directive, merged templates, other tidy ups

* built vue files

* built vue files

* Added null user check, missing table exception handling, show plugin name in change title, better handling of missing change fields

* Added sample changes file, moved UserChanges db code to changes model, added return type hints, better db error code handling, various other improvements

* Revert accidental UI screenshot commit

* Fix for incorrect link name parameter in sample changes, switched back to using $db->query for INSERT IGNORE

* Integration test fix, UI screenshot updates

* Test fix

* Added link styling, show CoreHome changes without plugin prefix in title

* Update UI test screenshot

* Added styles to the popover, added event for filtering changes

* Test fix

* UI test screenshot updates

Co-authored-by: sgiehl <stefan@matomo.org>
Co-authored-by: bx80 <bx80@users.noreply.github.com>

* Update test translation (#18531)

update a test failed XML

* updates all submodules (#18541)

Co-authored-by: diosmosis <diosmosis@users.noreply.github.com>

* Translations update from Hosted Weblate (#18529)

* Translated using Weblate (Greek)

Currently translated at 100.0% (162 of 162 strings)

Translation: Matomo/Plugin CoreAdminHome
Translate-URL: https://hosted.weblate.org/projects/matomo/plugin-coreadminhome/el/

[ci skip]

Co-authored-by: Hosted Weblate <hosted@weblate.org>
Co-authored-by: Vasilis Lourdas <dev@lourdas.eu>

* Translated using Weblate (Chinese (Simplified))

Currently translated at 83.9% (136 of 162 strings)

Translation: Matomo/Plugin CoreAdminHome
Translate-URL: https://hosted.weblate.org/projects/matomo/plugin-coreadminhome/zh_Hans/

[ci skip]

Translated using Weblate (Chinese (Simplified))

Currently translated at 99.6% (620 of 622 strings)

Translation: Matomo/Matomo Base
Translate-URL: https://hosted.weblate.org/projects/matomo/matomo-base/zh_Hans/

[ci skip]

Co-authored-by: Hosted Weblate <hosted@weblate.org>
Co-authored-by: 刘韬 <lyuutau@outlook.com>

* Update translation files

Updated by "Squash Git commits" hook in Weblate.

Translation: Matomo/Plugin CoreAdminHome
Translate-URL: https://hosted.weblate.org/projects/matomo/plugin-coreadminhome/

[ci skip]

Co-authored-by: Vasilis Lourdas <dev@lourdas.eu>
Co-authored-by: 刘韬 <lyuutau@outlook.com>

* [Vue] migrate report export directive and popover (#18440)

* update files

* sidenav start

* make getRef a utility method

* tweak

* add return type

* finish converting side-nav directive

* starting on reporting menu conversion

* remove unused properties

* convert reporting pages service

* migrate report metadata store

* remove angularjs files

* migrating reporting pages store

* make store adapters more immutable

* get service adapters to work

* fix a UI test

* another html fix

* migrate most of reporting menu directive and model

* Use themed font family for input forms to override materialize.css styling

* rebuild vue

* add a missing div

* ui test fixes

* update styling

* get to build

* get to load in the UI w/o error

* clone result of functions

* fix compile issue

* migrate widget loader and get to load in UI

* rebuild vue

* migrate widgetcontainer

* migrate widget bydimension container

* migrate widget + add tooltips directive

* quick fix

* Updating version to 4.6.0

* loading in page

* update expected screenshot

* add wait just in case travis is slow

* fix ordering bug

* add another wait

* rebuild vue

* css tweak

* fix some bugs and tests

* undo screenshot changes

* Menus test passing locally

* [Vue] date picker viewDate property is not kept up to date (#18385)

* viewDate ref is not kept up to date

* rebuild corehome

* reporting menu subcategory items are meant to be normal links

* update some screenshots

* use innerText instead of text() since angularjs maintains newlines in HTML that vue does not add

* trigger angularjs digest after ajaxhelper request

* rebuild vue

* update screenshots, fix bug in link generation in reporting menu and allow syncing multiple screenshot regexes at a time

* undo box-shadow change for UI tests

* fix more issues & update more tests

* update some screenshots

* fix some tests

* rebuild CoreHome

* quick fix

* built vue files

* fix angularjs issue

* add comment

* update umd files

* 4.6.1-rc1

* 4.6.1

* fix field array title

* apply some pr feedback

* apply more pr feedback

* another fix

* tweak

* fix ng-change not executed before ng-model

* fix another set of issues

* fix another issue

* rebuild vue

* better ng-change/ng-model fix

* update some screenshots

* rebuild vue

* remove some TODOs

* initiate initial ng-change ONLY for site selectors where this behavior applies

* emit/broadcast on correct scope in wrapper

* rebuild vue

* fix some issues

* couple more fixes

* fix another title issue

* rebuild vue

* do not report on ajax errors in notifications if not logged in

* migrate reporting page and model

* rebuild vue

* create sites selector model adapter

* fix siteselector vue bug, initial site is only set if there is just one site available

* rebuild vue

* migrate plugin settings directive

* remove TODO

* migrate plugin filter directive

* migrate two more plugins directives

* migrate save button

* fix a bunch of bugs

* fix another widget bug

* allow change event name between angularjs and vue

* rebuild vue

* migrate plugin form directive

* get to work

* migrate select-on-focus directive and start migrating report-export directive

* finish migrating report export directive & popover component + create reusable function to create vue app and add globals to it

* rebuild vue

* remove angularjs files and move less contents to vue dir

* built vue files

* fix function signature

* fix vue warning

* fix ajax request race condition

* rebuild vue

* add new notification type "help" so the help notification is not cleared when clearing transient notifications

* fix some bugs and tests

* update screenshot

* update screenshot & fix a test

* allow using unminified jquery ui + fix bug in last fix

* fix error when enrichedheadline is used in modal

* add polyfill min.js

* remove two todos

* fix widget url logic

* update some screenshots and fix sanitization/escape issue

* update screenshots

* rebuild vue

* fix url location updating regression in MatomoUrl.updateLocation use

* submodule

* update screenshots and fix possible error in json parse

* built vue files

* Merge branch 'vue-period-selector-regression' into vue-reporting-menu

* rebuild vue

* use correct variable

* rebuild vue

* fix widget url logic

* segment parameter can be undefined now for some reason

* fix ngmodel binding in siteselector adapter (for last time hopefully)

* the original site selector only set the first site to the first site in the initial sites query if there was only one site in the entire matomo instance

* fix sitesmanager ui test failure

* fix usersettings test failure

* rebuild vue

* more siteselector tweaks.

* build CoreHome

* more siteselector tweaks.

* another siteselector issue

* update screenshots

* update screenshot and try to fix random failure

* fix some issues in widget.vue when containerid is specified

* fix couple tests

* fix several test failures

* fix string concat

* fix test failure

* extra change

* fix last change and random failure

* styling fix

* fix last fix

* real fix this time

* fix stray request

* proper fix

* update build files

* try to fix random failure

* do not submit form

* check for api errors in promise chain in ajaxhelper.ts

* force a digest after a location change

* use proper abortcontroller method instead of promise hack, have to add new polyfill + try to fix random test failure

* some UI test fixes

* fix some report export issues

* several save button fixes + make replace approximation in createAngularJsAdapter better

* apply after manual click triggering in savebutton

* add names to divs so they can still be queried as they were in angularjs

* rebuild vue

* now that format_metrics checkbox works, need to check it

* fix unintended changes

* updated expected screenshots

* update two more

* go back to previous format_metrics behavior in popover

Co-authored-by: Justin Velluppillai <justin@innocraft.com>
Co-authored-by: justinvelluppillai <justinvelluppillai@users.noreply.github.com>
Co-authored-by: Matthieu Aubry <mattab@users.noreply.github.com>

* [Vue] remove support in vue for FormField.allSettings (#18542)

* deprecate support in vue for FormField.allSettings since deep watching the property doesnt quite work

* built vue files

* update screenshots

* update screenshot

* fix tests

* rebuild

* rebuild

* order plugins by dependencies in vue:build and fix warning in corehome build

* built vue files

* built vue files

* remove unused imports

* built vue files

* remove multilinefield component, fieldtextareaarray does the same thing

* edit-trigger is not used anywhere

* migrate sitetypes model to store

* do not load nonexistant files

* remove reference nonexistant files

* start converting sitefields component

* more work on sitefields component

* undo submodule change

* rebuild

* get sitesmanager to build

* get SiteFields component to work in UI

* datepicker does not format times

* export other stores

* fix some typing issues and rebuild

* add more comma delimited props to list + remove controller JS

* rebuild

* remove TODOs

* fix bug and rebuild

* fix bug and rebuild

* fix issue

* fix issues and rebuild

* fix ui test

* fix UI test failure

* fixing some issues

* complete fixes

* fix some more issues

* fix ui test failures

* another fix

* fix delete dialog

* more fixes

* fix another ui test + update other UI tests

* in groupedsetting handle templateFile property for angularjs BC

* rebuild vue

* fix view tracking code link

Co-authored-by: Ben Burgess <88810029+bx80@users.noreply.github.com>
Co-authored-by: sgiehl <stefan@matomo.org>
Co-authored-by: bx80 <bx80@users.noreply.github.com>
Co-authored-by: Peter Zhang <peter@innocraft.com>
Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com>
Co-authored-by: Weblate (bot) <hosted@weblate.org>
Co-authored-by: Vasilis Lourdas <dev@lourdas.eu>
Co-authored-by: 刘韬 <lyuutau@outlook.com>
Co-authored-by: Justin Velluppillai <justin@innocraft.com>
Co-authored-by: justinvelluppillai <justinvelluppillai@users.noreply.github.com>
Co-authored-by: Matthieu Aubry <mattab@users.noreply.github.com>

7 files changed, 84 insertions, 39 deletions

diff --git a/plugins/CorePluginsAdmin/vue/dist/CorePluginsAdmin.umd.js b/plugins/CorePluginsAdmin/vue/dist/CorePluginsAdmin.umd.js
index e1dc60e54a..3a16347077 100644
--- a/plugins/CorePluginsAdmin/vue/dist/CorePluginsAdmin.umd.js
+++ b/plugins/CorePluginsAdmin/vue/dist/CorePluginsAdmin.umd.js
@@ -2483,29 +2483,29 @@ function handleJsonValue(value, varType, uiControl) {
     }
   }
 }));
-// CONCATENATED MODULE: ./node_modules/@vue/cli-plugin-babel/node_modules/cache-loader/dist/cjs.js??ref--12-0!./node_modules/@vue/cli-plugin-babel/node_modules/thread-loader/dist/cjs.js!./node_modules/babel-loader/lib!./node_modules/@vue/cli-service/node_modules/vue-loader-v16/dist/templateLoader.js??ref--6!./node_modules/@vue/cli-service/node_modules/cache-loader/dist/cjs.js??ref--0-0!./node_modules/@vue/cli-service/node_modules/vue-loader-v16/dist??ref--0-1!./plugins/CorePluginsAdmin/vue/src/PluginSettings/PluginSettings.vue?vue&type=template&id=79754e8b
+// CONCATENATED MODULE: ./node_modules/@vue/cli-plugin-babel/node_modules/cache-loader/dist/cjs.js??ref--12-0!./node_modules/@vue/cli-plugin-babel/node_modules/thread-loader/dist/cjs.js!./node_modules/babel-loader/lib!./node_modules/@vue/cli-service/node_modules/vue-loader-v16/dist/templateLoader.js??ref--6!./node_modules/@vue/cli-service/node_modules/cache-loader/dist/cjs.js??ref--0-0!./node_modules/@vue/cli-service/node_modules/vue-loader-v16/dist??ref--0-1!./plugins/CorePluginsAdmin/vue/src/PluginSettings/PluginSettings.vue?vue&type=template&id=a4ce6500
 
-var PluginSettingsvue_type_template_id_79754e8b_hoisted_1 = {
+var PluginSettingsvue_type_template_id_a4ce6500_hoisted_1 = {
   class: "pluginSettings",
   ref: "root"
 };
-var PluginSettingsvue_type_template_id_79754e8b_hoisted_2 = ["id"];
-var PluginSettingsvue_type_template_id_79754e8b_hoisted_3 = {
+var PluginSettingsvue_type_template_id_a4ce6500_hoisted_2 = ["id"];
+var PluginSettingsvue_type_template_id_a4ce6500_hoisted_3 = {
   class: "card-content"
 };
-var PluginSettingsvue_type_template_id_79754e8b_hoisted_4 = ["id"];
-var PluginSettingsvue_type_template_id_79754e8b_hoisted_5 = ["onClick", "disabled", "value"];
-var PluginSettingsvue_type_template_id_79754e8b_hoisted_6 = {
+var PluginSettingsvue_type_template_id_a4ce6500_hoisted_4 = ["id"];
+var PluginSettingsvue_type_template_id_a4ce6500_hoisted_5 = ["onClick", "disabled", "value"];
+var PluginSettingsvue_type_template_id_a4ce6500_hoisted_6 = {
   class: "confirm-password-modal modal"
 };
-var PluginSettingsvue_type_template_id_79754e8b_hoisted_7 = {
+var PluginSettingsvue_type_template_id_a4ce6500_hoisted_7 = {
   class: "modal-content"
 };
-var PluginSettingsvue_type_template_id_79754e8b_hoisted_8 = {
+var PluginSettingsvue_type_template_id_a4ce6500_hoisted_8 = {
   class: "modal-footer"
 };
-var PluginSettingsvue_type_template_id_79754e8b_hoisted_9 = ["disabled"];
-function PluginSettingsvue_type_template_id_79754e8b_render(_ctx, _cache, $props, $setup, $data, $options) {
+var PluginSettingsvue_type_template_id_a4ce6500_hoisted_9 = ["disabled"];
+function PluginSettingsvue_type_template_id_a4ce6500_render(_ctx, _cache, $props, $setup, $data, $options) {
   var _this = this;
 
   var _component_GroupedSettings = Object(external_commonjs_vue_commonjs2_vue_root_Vue_["resolveComponent"])("GroupedSettings");
@@ -2514,15 +2514,15 @@ function PluginSettingsvue_type_template_id_79754e8b_render(_ctx, _cache, $props
 
   var _component_Field = Object(external_commonjs_vue_commonjs2_vue_root_Vue_["resolveComponent"])("Field");
 
-  return Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementBlock"])("div", PluginSettingsvue_type_template_id_79754e8b_hoisted_1, [(Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(true), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementBlock"])(external_commonjs_vue_commonjs2_vue_root_Vue_["Fragment"], null, Object(external_commonjs_vue_commonjs2_vue_root_Vue_["renderList"])(_ctx.settingsPerPlugin, function (settings) {
+  return Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementBlock"])("div", PluginSettingsvue_type_template_id_a4ce6500_hoisted_1, [(Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(true), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementBlock"])(external_commonjs_vue_commonjs2_vue_root_Vue_["Fragment"], null, Object(external_commonjs_vue_commonjs2_vue_root_Vue_["renderList"])(_ctx.settingsPerPlugin, function (settings) {
     return Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementBlock"])("div", {
       class: "card",
       id: "".concat(settings.pluginName, "PluginSettings"),
       key: "".concat(settings.pluginName, "PluginSettings")
-    }, [Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("div", PluginSettingsvue_type_template_id_79754e8b_hoisted_3, [Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("h2", {
+    }, [Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("div", PluginSettingsvue_type_template_id_a4ce6500_hoisted_3, [Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("h2", {
       class: "card-title",
       id: settings.pluginName
-    }, Object(external_commonjs_vue_commonjs2_vue_root_Vue_["toDisplayString"])(settings.title), 9, PluginSettingsvue_type_template_id_79754e8b_hoisted_4), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createVNode"])(_component_GroupedSettings, {
+    }, Object(external_commonjs_vue_commonjs2_vue_root_Vue_["toDisplayString"])(settings.title), 9, PluginSettingsvue_type_template_id_a4ce6500_hoisted_4), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createVNode"])(_component_GroupedSettings, {
       "group-name": settings.pluginName,
       settings: settings.settings,
       "all-setting-values": _ctx.settingValues,
@@ -2537,10 +2537,10 @@ function PluginSettingsvue_type_template_id_79754e8b_render(_ctx, _cache, $props
       disabled: _ctx.isLoading,
       class: "pluginsSettingsSubmit btn",
       value: _ctx.translate('General_Save')
-    }, null, 8, PluginSettingsvue_type_template_id_79754e8b_hoisted_5), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createVNode"])(_component_ActivityIndicator, {
+    }, null, 8, PluginSettingsvue_type_template_id_a4ce6500_hoisted_5), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createVNode"])(_component_ActivityIndicator, {
       loading: _ctx.isLoading || _ctx.isSaving[settings.pluginName]
-    }, null, 8, ["loading"])])], 8, PluginSettingsvue_type_template_id_79754e8b_hoisted_2);
-  }), 128)), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("div", PluginSettingsvue_type_template_id_79754e8b_hoisted_6, [Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("div", PluginSettingsvue_type_template_id_79754e8b_hoisted_7, [Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("h2", null, Object(external_commonjs_vue_commonjs2_vue_root_Vue_["toDisplayString"])(_ctx.translate('UsersManager_ConfirmWithPassword')), 1), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("div", null, [Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createVNode"])(_component_Field, {
+    }, null, 8, ["loading"])])], 8, PluginSettingsvue_type_template_id_a4ce6500_hoisted_2);
+  }), 128)), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("div", PluginSettingsvue_type_template_id_a4ce6500_hoisted_6, [Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("div", PluginSettingsvue_type_template_id_a4ce6500_hoisted_7, [Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("h2", null, Object(external_commonjs_vue_commonjs2_vue_root_Vue_["toDisplayString"])(_ctx.translate('UsersManager_ConfirmWithPassword')), 1), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("div", null, [Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createVNode"])(_component_Field, {
     modelValue: _ctx.passwordConfirmation,
     "onUpdate:modelValue": _cache[0] || (_cache[0] = function ($event) {
       return _ctx.passwordConfirmation = $event;
@@ -2550,7 +2550,7 @@ function PluginSettingsvue_type_template_id_79754e8b_render(_ctx, _cache, $props
     autocomplete: false,
     "full-width": true,
     title: _ctx.translate('UsersManager_YourCurrentPassword')
-  }, null, 8, ["modelValue", "title"])])]), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("div", PluginSettingsvue_type_template_id_79754e8b_hoisted_8, [Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("a", {
+  }, null, 8, ["modelValue", "title"])])]), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("div", PluginSettingsvue_type_template_id_a4ce6500_hoisted_8, [Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("a", {
     href: "",
     class: "modal-action modal-close btn",
     disabled: !_ctx.passwordConfirmation ? 'disabled' : undefined,
@@ -2559,7 +2559,7 @@ function PluginSettingsvue_type_template_id_79754e8b_render(_ctx, _cache, $props
 
       _ctx.save(_this.settingsToSave);
     })
-  }, Object(external_commonjs_vue_commonjs2_vue_root_Vue_["toDisplayString"])(_ctx.translate('General_Yes')), 9, PluginSettingsvue_type_template_id_79754e8b_hoisted_9), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("a", {
+  }, Object(external_commonjs_vue_commonjs2_vue_root_Vue_["toDisplayString"])(_ctx.translate('General_Yes')), 9, PluginSettingsvue_type_template_id_a4ce6500_hoisted_9), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("a", {
     href: "",
     class: "modal-action modal-close modal-no",
     onClick: _cache[2] || (_cache[2] = function ($event) {
@@ -2567,7 +2567,7 @@ function PluginSettingsvue_type_template_id_79754e8b_render(_ctx, _cache, $props
     })
   }, Object(external_commonjs_vue_commonjs2_vue_root_Vue_["toDisplayString"])(_ctx.translate('General_No')), 1)])])], 512);
 }
-// CONCATENATED MODULE: ./plugins/CorePluginsAdmin/vue/src/PluginSettings/PluginSettings.vue?vue&type=template&id=79754e8b
+// CONCATENATED MODULE: ./plugins/CorePluginsAdmin/vue/src/PluginSettings/PluginSettings.vue?vue&type=template&id=a4ce6500
 
 // CONCATENATED MODULE: ./node_modules/@vue/cli-plugin-babel/node_modules/cache-loader/dist/cjs.js??ref--12-0!./node_modules/@vue/cli-plugin-babel/node_modules/thread-loader/dist/cjs.js!./node_modules/babel-loader/lib!./node_modules/@vue/cli-service/node_modules/vue-loader-v16/dist/templateLoader.js??ref--6!./node_modules/@vue/cli-service/node_modules/cache-loader/dist/cjs.js??ref--0-0!./node_modules/@vue/cli-service/node_modules/vue-loader-v16/dist??ref--0-1!./plugins/CorePluginsAdmin/vue/src/GroupedSettings/GroupedSettings.vue?vue&type=template&id=063fbf22
 
@@ -2592,9 +2592,9 @@ function GroupedSettingsvue_type_template_id_063fbf22_render(_ctx, _cache, $prop
 }
 // CONCATENATED MODULE: ./plugins/CorePluginsAdmin/vue/src/GroupedSettings/GroupedSettings.vue?vue&type=template&id=063fbf22
 
-// CONCATENATED MODULE: ./node_modules/@vue/cli-plugin-babel/node_modules/cache-loader/dist/cjs.js??ref--12-0!./node_modules/@vue/cli-plugin-babel/node_modules/thread-loader/dist/cjs.js!./node_modules/babel-loader/lib!./node_modules/@vue/cli-service/node_modules/vue-loader-v16/dist/templateLoader.js??ref--6!./node_modules/@vue/cli-service/node_modules/cache-loader/dist/cjs.js??ref--0-0!./node_modules/@vue/cli-service/node_modules/vue-loader-v16/dist??ref--0-1!./plugins/CorePluginsAdmin/vue/src/GroupedSettings/GroupedSetting.vue?vue&type=template&id=916027be
+// CONCATENATED MODULE: ./node_modules/@vue/cli-plugin-babel/node_modules/cache-loader/dist/cjs.js??ref--12-0!./node_modules/@vue/cli-plugin-babel/node_modules/thread-loader/dist/cjs.js!./node_modules/babel-loader/lib!./node_modules/@vue/cli-service/node_modules/vue-loader-v16/dist/templateLoader.js??ref--6!./node_modules/@vue/cli-service/node_modules/cache-loader/dist/cjs.js??ref--0-0!./node_modules/@vue/cli-service/node_modules/vue-loader-v16/dist??ref--0-1!./plugins/CorePluginsAdmin/vue/src/GroupedSettings/GroupedSetting.vue?vue&type=template&id=17c12cc8
 
-function GroupedSettingvue_type_template_id_916027be_render(_ctx, _cache, $props, $setup, $data, $options) {
+function GroupedSettingvue_type_template_id_17c12cc8_render(_ctx, _cache, $props, $setup, $data, $options) {
   var _component_FormField = Object(external_commonjs_vue_commonjs2_vue_root_Vue_["resolveComponent"])("FormField");
 
   return Object(external_commonjs_vue_commonjs2_vue_root_Vue_["withDirectives"])((Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementBlock"])("div", null, [Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createVNode"])(_component_FormField, {
@@ -2602,14 +2602,15 @@ function GroupedSettingvue_type_template_id_916027be_render(_ctx, _cache, $props
     "onUpdate:modelValue": _cache[0] || (_cache[0] = function ($event) {
       return _ctx.changeValue($event);
     }),
-    "form-field": _ctx.setting
+    "form-field": _ctx.settingWithComponent
   }, null, 8, ["model-value", "form-field"])], 512)), [[external_commonjs_vue_commonjs2_vue_root_Vue_["vShow"], _ctx.showField]]);
 }
-// CONCATENATED MODULE: ./plugins/CorePluginsAdmin/vue/src/GroupedSettings/GroupedSetting.vue?vue&type=template&id=916027be
+// CONCATENATED MODULE: ./plugins/CorePluginsAdmin/vue/src/GroupedSettings/GroupedSetting.vue?vue&type=template&id=17c12cc8
 
 // CONCATENATED MODULE: ./node_modules/@vue/cli-plugin-typescript/node_modules/cache-loader/dist/cjs.js??ref--14-0!./node_modules/babel-loader/lib!./node_modules/@vue/cli-plugin-typescript/node_modules/ts-loader??ref--14-2!./node_modules/@vue/cli-service/node_modules/cache-loader/dist/cjs.js??ref--0-0!./node_modules/@vue/cli-service/node_modules/vue-loader-v16/dist??ref--0-1!./plugins/CorePluginsAdmin/vue/src/GroupedSettings/GroupedSetting.vue?vue&type=script&lang=ts
 
 
+
  // TODO: have to use angularjs here until there's an expression evaluating alternative
 
 var conditionScope;
@@ -2630,6 +2631,16 @@ var conditionScope;
   },
   emits: ['update:modelValue'],
   computed: {
+    // bc for angularjs field that uses templateFile
+    settingWithComponent: function settingWithComponent() {
+      if (this.setting.templateFile) {
+        return Object.assign(Object.assign({}, this.setting), {}, {
+          component: FieldAngularJsTemplate
+        });
+      }
+
+      return this.setting;
+    },
     showField: function showField() {
       var condition = this.setting.condition;
 
@@ -2657,7 +2668,7 @@ var conditionScope;
 
 
 
-GroupedSettingvue_type_script_lang_ts.render = GroupedSettingvue_type_template_id_916027be_render
+GroupedSettingvue_type_script_lang_ts.render = GroupedSettingvue_type_template_id_17c12cc8_render
 
 /* harmony default export */ var GroupedSetting = (GroupedSettingvue_type_script_lang_ts);
 // CONCATENATED MODULE: ./node_modules/@vue/cli-plugin-typescript/node_modules/cache-loader/dist/cjs.js??ref--14-0!./node_modules/babel-loader/lib!./node_modules/@vue/cli-plugin-typescript/node_modules/ts-loader??ref--14-2!./node_modules/@vue/cli-service/node_modules/cache-loader/dist/cjs.js??ref--0-0!./node_modules/@vue/cli-service/node_modules/vue-loader-v16/dist??ref--0-1!./plugins/CorePluginsAdmin/vue/src/GroupedSettings/GroupedSettings.vue?vue&type=script&lang=ts
@@ -2927,7 +2938,7 @@ var _window = window,
 
 
 
-PluginSettingsvue_type_script_lang_ts.render = PluginSettingsvue_type_template_id_79754e8b_render
+PluginSettingsvue_type_script_lang_ts.render = PluginSettingsvue_type_template_id_a4ce6500_render
 
 /* harmony default export */ var PluginSettings = (PluginSettingsvue_type_script_lang_ts);
 // CONCATENATED MODULE: ./plugins/CorePluginsAdmin/vue/src/PluginSettings/PluginSettings.adapter.ts
diff --git a/plugins/CorePluginsAdmin/vue/dist/CorePluginsAdmin.umd.min.js b/plugins/CorePluginsAdmin/vue/dist/CorePluginsAdmin.umd.min.js
index 16dc26171d..45319f5778 100644
--- a/plugins/CorePluginsAdmin/vue/dist/CorePluginsAdmin.umd.min.js
+++ b/plugins/CorePluginsAdmin/vue/dist/CorePluginsAdmin.umd.min.js
@@ -16,7 +16,7 @@
  *
  * @link https://matomo.org
  * @license http://www.gnu.org/licenses/gpl-3.0.html GPL v3 or later
- */function Xt(e,t,n){if("string"===typeof e&&e&&("array"===t||"multituple"===n||"field-array"===n||"multiselect"===n||"site"===n)){var o=JSON.parse(e);return"site"===n&&(o.name=i["Matomo"].helper.htmlDecode(o.name)),o}return"checkbox"===n&&"array"!==t?Object(i["transformAngularJsBoolAttr"])(e):e}Object(i["createAngularJsAdapter"])({component:Qt,require:"?ngModel",scope:{uicontrol:{angularJsBind:"@"},name:{angularJsBind:"@"},value:{vue:"modelValue",angularJsBind:"@",transform:function(e,t,n){return Xt(e,n.varType,n.uicontrol)}},default:{vue:"defaultValue",angularJsBind:"@"},options:{angularJsBind:"="},description:{angularJsBind:"@"},introduction:{angularJsBind:"@"},title:{angularJsBind:"@"},inlineHelp:{angularJsBind:"@"},disabled:{angularJsBind:"=",transform:i["transformAngularJsBoolAttr"]},uiControlAttributes:{angularJsBind:"="},uiControlOptions:{angularJsBind:"="},autocomplete:{angularJsBind:"@",transform:i["transformAngularJsBoolAttr"]},condition:{angularJsBind:"@",transform:function(e,t,n){if(e)return function(t){return n.$eval(e,t)}}},varType:{angularJsBind:"@"},autofocus:{angularJsBind:"@",transform:i["transformAngularJsBoolAttr"]},tabindex:{angularJsBind:"@",transform:i["transformAngularJsIntAttr"]},fullWidth:{angularJsBind:"@",transform:i["transformAngularJsBoolAttr"]},maxlength:{angularJsBind:"@",transform:i["transformAngularJsIntAttr"]},required:{angularJsBind:"@",transform:i["transformAngularJsBoolAttr"]},placeholder:{angularJsBind:"@"},rows:{angularJsBind:"@",transform:i["transformAngularJsIntAttr"]},min:{angularJsBind:"@",transform:i["transformAngularJsIntAttr"]},max:{angularJsBind:"@",transform:i["transformAngularJsIntAttr"]},component:{angularJsBind:"<",transform:function(e,t,n){if(e){if(n.templateFile)return Object(l["shallowRef"])(qt);var o=e.plugin,r=e.name;if(!o||!r)throw new Error("Invalid component property given to piwik-field directive, must be {plugin: '...',name: '...'}");return Object(l["shallowRef"])(Object(i["useExternalPluginComponent"])(o,r))}}}},directiveName:"piwikField",$inject:["$timeout"],events:{"update:modelValue":function(e,t,n,o,r,i,l){var a=i?i.$viewValue:n.value;e!==a&&l((function(){i?(i.$setViewValue(e),i.$render()):n.value=e}))}},postCreate:function(e,t,n,o,r){var a=r;if(a){if(a.$render=function(){Object(l["nextTick"])((function(){e.modelValue=Object(i["removeAngularJsSpecificProperties"])(a.$viewValue)}))},"undefined"!==typeof t.value){var u=Xt(t.value,t.varType,t.uicontrol);a.$setViewValue(u)}else a.$setViewValue(e.modelValue);"site"===t.uicontrol&&a.$viewValue&&setTimeout((function(){a.$setViewValue(Object.assign({},a.$viewValue))}))}else t.$watch("value",(function(n){if(n!==e.modelValue){var o=Xt(n,t.varType,t.uicontrol);Object(l["nextTick"])((function(){e.modelValue=o}))}}))}});var en,tn={class:"pluginSettings",ref:"root"},nn=["id"],on={class:"card-content"},rn=["id"],ln=["onClick","disabled","value"],an={class:"confirm-password-modal modal"},un={class:"modal-content"},cn={class:"modal-footer"},sn=["disabled"];function dn(e,t,n,o,r,i){var a=this,u=Object(l["resolveComponent"])("GroupedSettings"),c=Object(l["resolveComponent"])("ActivityIndicator"),s=Object(l["resolveComponent"])("Field");return Object(l["openBlock"])(),Object(l["createElementBlock"])("div",tn,[(Object(l["openBlock"])(!0),Object(l["createElementBlock"])(l["Fragment"],null,Object(l["renderList"])(e.settingsPerPlugin,(function(t){return Object(l["openBlock"])(),Object(l["createElementBlock"])("div",{class:"card",id:"".concat(t.pluginName,"PluginSettings"),key:"".concat(t.pluginName,"PluginSettings")},[Object(l["createElementVNode"])("div",on,[Object(l["createElementVNode"])("h2",{class:"card-title",id:t.pluginName},Object(l["toDisplayString"])(t.title),9,rn),Object(l["createVNode"])(u,{"group-name":t.pluginName,settings:t.settings,"all-setting-values":e.settingValues,onChange:function(n){return e.settingValues["".concat(t.pluginName,".").concat(n.name)]=n.value}},null,8,["group-name","settings","all-setting-values","onChange"]),Object(l["createElementVNode"])("input",{type:"button",onClick:function(n){return e.saveSetting(t.pluginName)},disabled:e.isLoading,class:"pluginsSettingsSubmit btn",value:e.translate("General_Save")},null,8,ln),Object(l["createVNode"])(c,{loading:e.isLoading||e.isSaving[t.pluginName]},null,8,["loading"])])],8,nn)})),128)),Object(l["createElementVNode"])("div",an,[Object(l["createElementVNode"])("div",un,[Object(l["createElementVNode"])("h2",null,Object(l["toDisplayString"])(e.translate("UsersManager_ConfirmWithPassword")),1),Object(l["createElementVNode"])("div",null,[Object(l["createVNode"])(s,{modelValue:e.passwordConfirmation,"onUpdate:modelValue":t[0]||(t[0]=function(t){return e.passwordConfirmation=t}),uicontrol:"password",name:"currentUserPassword",autocomplete:!1,"full-width":!0,title:e.translate("UsersManager_YourCurrentPassword")},null,8,["modelValue","title"])])]),Object(l["createElementVNode"])("div",cn,[Object(l["createElementVNode"])("a",{href:"",class:"modal-action modal-close btn",disabled:e.passwordConfirmation?void 0:"disabled",onClick:t[1]||(t[1]=function(t){t.preventDefault(),e.save(a.settingsToSave)})},Object(l["toDisplayString"])(e.translate("General_Yes")),9,sn),Object(l["createElementVNode"])("a",{href:"",class:"modal-action modal-close modal-no",onClick:t[2]||(t[2]=function(e){return e.preventDefault()})},Object(l["toDisplayString"])(e.translate("General_No")),1)])])],512)}function mn(e,t,n,o,r,i){var a=Object(l["resolveComponent"])("GroupedSetting");return Object(l["openBlock"])(!0),Object(l["createElementBlock"])(l["Fragment"],null,Object(l["renderList"])(e.settings,(function(t){return Object(l["openBlock"])(),Object(l["createElementBlock"])("div",{key:"".concat(e.groupName,".").concat(t.name)},[Object(l["createVNode"])(a,{"model-value":e.allSettingValues["".concat(e.groupName,".").concat(t.name)],"onUpdate:modelValue":function(n){return e.$emit("change",{name:t.name,value:n})},setting:t,"condition-values":e.settingValues},null,8,["model-value","onUpdate:modelValue","setting","condition-values"])])})),128)}function fn(e,t,n,o,r,i){var a=Object(l["resolveComponent"])("FormField");return Object(l["withDirectives"])((Object(l["openBlock"])(),Object(l["createElementBlock"])("div",null,[Object(l["createVNode"])(a,{"model-value":e.modelValue,"onUpdate:modelValue":t[0]||(t[0]=function(t){return e.changeValue(t)}),"form-field":e.setting},null,8,["model-value","form-field"])],512)),[[l["vShow"],e.showField]])}var pn=Object(l["defineComponent"])({props:{setting:{type:Object,required:!0},modelValue:null,conditionValues:{type:Object,required:!0}},components:{FormField:It},emits:["update:modelValue"],computed:{showField:function(){var e=this.setting.condition;if(!e)return!0;if(!en){var t=i["Matomo"].helper.getAngularDependency("$rootScope");en=t.$new(!0)}return en.$eval(e,this.conditionValues)}},methods:{changeValue:function(e){this.$emit("update:modelValue",e)}}});pn.render=fn;var bn=pn;function vn(e,t){return jn(e)||yn(e,t)||gn(e,t)||hn()}function hn(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}function gn(e,t){if(e){if("string"===typeof e)return On(e,t);var n=Object.prototype.toString.call(e).slice(8,-1);return"Object"===n&&e.constructor&&(n=e.constructor.name),"Map"===n||"Set"===n?Array.from(e):"Arguments"===n||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)?On(e,t):void 0}}function On(e,t){(null==t||t>e.length)&&(t=e.length);for(var n=0,o=new Array(t);n<t;n++)o[n]=e[n];return o}function yn(e,t){var n=null==e?null:"undefined"!==typeof Symbol&&e[Symbol.iterator]||e["@@iterator"];if(null!=n){var o,r,i=[],l=!0,a=!1;try{for(n=n.call(e);!(l=(o=n.next()).done);l=!0)if(i.push(o.value),t&&i.length===t)break}catch(u){a=!0,r=u}finally{try{l||null==n["return"]||n["return"]()}finally{if(a)throw r}}return i}}function jn(e){if(Array.isArray(e))return e}var Vn=Object(l["defineComponent"])({props:{groupName:String,settings:{type:Array,required:!0},allSettingValues:{type:Object,required:!0}},emits:["change"],components:{GroupedSetting:bn},computed:{settingValues:function(){var e=this,t=Object.entries(this.allSettingValues).filter((function(t){var n=vn(t,1),o=n[0];if(e.groupName){var r=o.split("."),i=vn(r,1),l=i[0];if(l!==e.groupName)return!1}return!0})).map((function(t){var n=vn(t,2),o=n[0],r=n[1];return e.groupName?[o.split(".")[1],r]:[o,r]}));return Object.fromEntries(t)}}});Vn.render=mn;var wn=Vn;function Cn(e,t){return Bn(e)||Fn(e,t)||kn(e,t)||Sn()}function Sn(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}function kn(e,t){if(e){if("string"===typeof e)return An(e,t);var n=Object.prototype.toString.call(e).slice(8,-1);return"Object"===n&&e.constructor&&(n=e.constructor.name),"Map"===n||"Set"===n?Array.from(e):"Arguments"===n||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)?An(e,t):void 0}}function An(e,t){(null==t||t>e.length)&&(t=e.length);for(var n=0,o=new Array(t);n<t;n++)o[n]=e[n];return o}function Fn(e,t){var n=null==e?null:"undefined"!==typeof Symbol&&e[Symbol.iterator]||e["@@iterator"];if(null!=n){var o,r,i=[],l=!0,a=!1;try{for(n=n.call(e);!(l=(o=n.next()).done);l=!0)if(i.push(o.value),t&&i.length===t)break}catch(u){a=!0,r=u}finally{try{l||null==n["return"]||n["return"]()}finally{if(a)throw r}}return i}}function Bn(e){if(Array.isArray(e))return e}var En=window,xn=En.$,Nn=Object(l["defineComponent"])({props:{mode:String},components:{ActivityIndicator:i["ActivityIndicator"],Field:Qt,GroupedSettings:wn},data:function(){return{isLoading:!0,isSaving:{},passwordConfirmation:"",settingsToSave:null,settingsPerPlugin:[],settingValues:{}}},created:function(){var e=this;i["AjaxHelper"].fetch({method:this.apiMethod}).then((function(t){e.isLoading=!1,e.settingsPerPlugin=t,t.forEach((function(t){t.settings.forEach((function(n){e.settingValues["".concat(t.pluginName,".").concat(n.name)]=n.value}))})),window.anchorLinkFix.scrollToAnchorInUrl(),e.addSectionsToTableOfContents()})).catch((function(){e.isLoading=!1}))},computed:{apiMethod:function(){return"admin"===this.mode?"CorePluginsAdmin.getSystemSettings":"CorePluginsAdmin.getUserSettings"},saveApiMethod:function(){return"admin"===this.mode?"CorePluginsAdmin.setSystemSettings":"CorePluginsAdmin.setUserSettings"}},methods:{addSectionsToTableOfContents:function(){var e=xn("#generalSettingsTOC");if(e.length){var t=this.settingsPerPlugin;t.forEach((function(t){var n=t.pluginName,o=t.settings;n&&("CoreAdminHome"===n&&o?o.filter((function(e){return e.introduction})).forEach((function(t){e.append('<a href="#/'.concat(n,'PluginSettings">').concat(t.introduction,"</a> "))})):e.append('<a href="#/'.concat(n,'">').concat(n.replace(/([A-Z])/g," $1").trim(),"</a> ")))}))}},saveSetting:function(e){"admin"===this.mode?this.showPasswordConfirmModal(e):this.save(e)},showPasswordConfirmModal:function(e){var t=this;this.settingsToSave=e;var n=this.$refs.root,o=xn(n),r=function(n){var r=n.keyCode?n.keyCode:n.which;13===r&&(o.find(".confirm-password-modal").modal("close"),t.save(e))};o.find(".confirm-password-modal").modal({dismissible:!1,onOpenEnd:function(){var e=".modal.open #currentUserPassword";xn(e).focus(),xn(e).off("keypress").keypress(r)}}).modal("open")},save:function(e){var t=this,n=this.saveApiMethod;this.isSaving[e]=!0;var o=this.getValuesForPlugin(e);i["AjaxHelper"].post({method:n},{settingValues:o,passwordConfirmation:this.passwordConfirmation}).then((function(){t.isSaving[e]=!1;var n=i["NotificationsStore"].show({message:Object(i["translate"])("CoreAdminHome_PluginSettingsSaveSuccess"),id:"generalSettings",context:"success",type:"transient"});i["NotificationsStore"].scrollToNotification(n)})).catch((function(){t.isSaving[e]=!1})),this.passwordConfirmation="",this.settingsToSave=null},getValuesForPlugin:function(e){var t={};return t[e]||(t[e]=[]),Object.entries(this.settingValues).forEach((function(n){var o=Cn(n,2),r=o[0],i=o[1],l=r.split("."),a=Cn(l,2),u=a[0],c=a[1];if(u===e){var s=i;!1===s?s="0":!0===s&&(s="1"),t[u].push({name:c,value:s})}})),t}}});Nn.render=dn;var Tn=Nn,$n=(Object(i["createAngularJsAdapter"])({component:Tn,scope:{mode:{angularJsBind:"@"}},directiveName:"piwikPluginSettings"}),window),Mn=$n.$;
+ */function Xt(e,t,n){if("string"===typeof e&&e&&("array"===t||"multituple"===n||"field-array"===n||"multiselect"===n||"site"===n)){var o=JSON.parse(e);return"site"===n&&(o.name=i["Matomo"].helper.htmlDecode(o.name)),o}return"checkbox"===n&&"array"!==t?Object(i["transformAngularJsBoolAttr"])(e):e}Object(i["createAngularJsAdapter"])({component:Qt,require:"?ngModel",scope:{uicontrol:{angularJsBind:"@"},name:{angularJsBind:"@"},value:{vue:"modelValue",angularJsBind:"@",transform:function(e,t,n){return Xt(e,n.varType,n.uicontrol)}},default:{vue:"defaultValue",angularJsBind:"@"},options:{angularJsBind:"="},description:{angularJsBind:"@"},introduction:{angularJsBind:"@"},title:{angularJsBind:"@"},inlineHelp:{angularJsBind:"@"},disabled:{angularJsBind:"=",transform:i["transformAngularJsBoolAttr"]},uiControlAttributes:{angularJsBind:"="},uiControlOptions:{angularJsBind:"="},autocomplete:{angularJsBind:"@",transform:i["transformAngularJsBoolAttr"]},condition:{angularJsBind:"@",transform:function(e,t,n){if(e)return function(t){return n.$eval(e,t)}}},varType:{angularJsBind:"@"},autofocus:{angularJsBind:"@",transform:i["transformAngularJsBoolAttr"]},tabindex:{angularJsBind:"@",transform:i["transformAngularJsIntAttr"]},fullWidth:{angularJsBind:"@",transform:i["transformAngularJsBoolAttr"]},maxlength:{angularJsBind:"@",transform:i["transformAngularJsIntAttr"]},required:{angularJsBind:"@",transform:i["transformAngularJsBoolAttr"]},placeholder:{angularJsBind:"@"},rows:{angularJsBind:"@",transform:i["transformAngularJsIntAttr"]},min:{angularJsBind:"@",transform:i["transformAngularJsIntAttr"]},max:{angularJsBind:"@",transform:i["transformAngularJsIntAttr"]},component:{angularJsBind:"<",transform:function(e,t,n){if(e){if(n.templateFile)return Object(l["shallowRef"])(qt);var o=e.plugin,r=e.name;if(!o||!r)throw new Error("Invalid component property given to piwik-field directive, must be {plugin: '...',name: '...'}");return Object(l["shallowRef"])(Object(i["useExternalPluginComponent"])(o,r))}}}},directiveName:"piwikField",$inject:["$timeout"],events:{"update:modelValue":function(e,t,n,o,r,i,l){var a=i?i.$viewValue:n.value;e!==a&&l((function(){i?(i.$setViewValue(e),i.$render()):n.value=e}))}},postCreate:function(e,t,n,o,r){var a=r;if(a){if(a.$render=function(){Object(l["nextTick"])((function(){e.modelValue=Object(i["removeAngularJsSpecificProperties"])(a.$viewValue)}))},"undefined"!==typeof t.value){var u=Xt(t.value,t.varType,t.uicontrol);a.$setViewValue(u)}else a.$setViewValue(e.modelValue);"site"===t.uicontrol&&a.$viewValue&&setTimeout((function(){a.$setViewValue(Object.assign({},a.$viewValue))}))}else t.$watch("value",(function(n){if(n!==e.modelValue){var o=Xt(n,t.varType,t.uicontrol);Object(l["nextTick"])((function(){e.modelValue=o}))}}))}});var en,tn={class:"pluginSettings",ref:"root"},nn=["id"],on={class:"card-content"},rn=["id"],ln=["onClick","disabled","value"],an={class:"confirm-password-modal modal"},un={class:"modal-content"},cn={class:"modal-footer"},sn=["disabled"];function dn(e,t,n,o,r,i){var a=this,u=Object(l["resolveComponent"])("GroupedSettings"),c=Object(l["resolveComponent"])("ActivityIndicator"),s=Object(l["resolveComponent"])("Field");return Object(l["openBlock"])(),Object(l["createElementBlock"])("div",tn,[(Object(l["openBlock"])(!0),Object(l["createElementBlock"])(l["Fragment"],null,Object(l["renderList"])(e.settingsPerPlugin,(function(t){return Object(l["openBlock"])(),Object(l["createElementBlock"])("div",{class:"card",id:"".concat(t.pluginName,"PluginSettings"),key:"".concat(t.pluginName,"PluginSettings")},[Object(l["createElementVNode"])("div",on,[Object(l["createElementVNode"])("h2",{class:"card-title",id:t.pluginName},Object(l["toDisplayString"])(t.title),9,rn),Object(l["createVNode"])(u,{"group-name":t.pluginName,settings:t.settings,"all-setting-values":e.settingValues,onChange:function(n){return e.settingValues["".concat(t.pluginName,".").concat(n.name)]=n.value}},null,8,["group-name","settings","all-setting-values","onChange"]),Object(l["createElementVNode"])("input",{type:"button",onClick:function(n){return e.saveSetting(t.pluginName)},disabled:e.isLoading,class:"pluginsSettingsSubmit btn",value:e.translate("General_Save")},null,8,ln),Object(l["createVNode"])(c,{loading:e.isLoading||e.isSaving[t.pluginName]},null,8,["loading"])])],8,nn)})),128)),Object(l["createElementVNode"])("div",an,[Object(l["createElementVNode"])("div",un,[Object(l["createElementVNode"])("h2",null,Object(l["toDisplayString"])(e.translate("UsersManager_ConfirmWithPassword")),1),Object(l["createElementVNode"])("div",null,[Object(l["createVNode"])(s,{modelValue:e.passwordConfirmation,"onUpdate:modelValue":t[0]||(t[0]=function(t){return e.passwordConfirmation=t}),uicontrol:"password",name:"currentUserPassword",autocomplete:!1,"full-width":!0,title:e.translate("UsersManager_YourCurrentPassword")},null,8,["modelValue","title"])])]),Object(l["createElementVNode"])("div",cn,[Object(l["createElementVNode"])("a",{href:"",class:"modal-action modal-close btn",disabled:e.passwordConfirmation?void 0:"disabled",onClick:t[1]||(t[1]=function(t){t.preventDefault(),e.save(a.settingsToSave)})},Object(l["toDisplayString"])(e.translate("General_Yes")),9,sn),Object(l["createElementVNode"])("a",{href:"",class:"modal-action modal-close modal-no",onClick:t[2]||(t[2]=function(e){return e.preventDefault()})},Object(l["toDisplayString"])(e.translate("General_No")),1)])])],512)}function mn(e,t,n,o,r,i){var a=Object(l["resolveComponent"])("GroupedSetting");return Object(l["openBlock"])(!0),Object(l["createElementBlock"])(l["Fragment"],null,Object(l["renderList"])(e.settings,(function(t){return Object(l["openBlock"])(),Object(l["createElementBlock"])("div",{key:"".concat(e.groupName,".").concat(t.name)},[Object(l["createVNode"])(a,{"model-value":e.allSettingValues["".concat(e.groupName,".").concat(t.name)],"onUpdate:modelValue":function(n){return e.$emit("change",{name:t.name,value:n})},setting:t,"condition-values":e.settingValues},null,8,["model-value","onUpdate:modelValue","setting","condition-values"])])})),128)}function fn(e,t,n,o,r,i){var a=Object(l["resolveComponent"])("FormField");return Object(l["withDirectives"])((Object(l["openBlock"])(),Object(l["createElementBlock"])("div",null,[Object(l["createVNode"])(a,{"model-value":e.modelValue,"onUpdate:modelValue":t[0]||(t[0]=function(t){return e.changeValue(t)}),"form-field":e.settingWithComponent},null,8,["model-value","form-field"])],512)),[[l["vShow"],e.showField]])}var pn=Object(l["defineComponent"])({props:{setting:{type:Object,required:!0},modelValue:null,conditionValues:{type:Object,required:!0}},components:{FormField:It},emits:["update:modelValue"],computed:{settingWithComponent:function(){return this.setting.templateFile?Object.assign(Object.assign({},this.setting),{},{component:qt}):this.setting},showField:function(){var e=this.setting.condition;if(!e)return!0;if(!en){var t=i["Matomo"].helper.getAngularDependency("$rootScope");en=t.$new(!0)}return en.$eval(e,this.conditionValues)}},methods:{changeValue:function(e){this.$emit("update:modelValue",e)}}});pn.render=fn;var bn=pn;function vn(e,t){return jn(e)||yn(e,t)||gn(e,t)||hn()}function hn(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}function gn(e,t){if(e){if("string"===typeof e)return On(e,t);var n=Object.prototype.toString.call(e).slice(8,-1);return"Object"===n&&e.constructor&&(n=e.constructor.name),"Map"===n||"Set"===n?Array.from(e):"Arguments"===n||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)?On(e,t):void 0}}function On(e,t){(null==t||t>e.length)&&(t=e.length);for(var n=0,o=new Array(t);n<t;n++)o[n]=e[n];return o}function yn(e,t){var n=null==e?null:"undefined"!==typeof Symbol&&e[Symbol.iterator]||e["@@iterator"];if(null!=n){var o,r,i=[],l=!0,a=!1;try{for(n=n.call(e);!(l=(o=n.next()).done);l=!0)if(i.push(o.value),t&&i.length===t)break}catch(u){a=!0,r=u}finally{try{l||null==n["return"]||n["return"]()}finally{if(a)throw r}}return i}}function jn(e){if(Array.isArray(e))return e}var Vn=Object(l["defineComponent"])({props:{groupName:String,settings:{type:Array,required:!0},allSettingValues:{type:Object,required:!0}},emits:["change"],components:{GroupedSetting:bn},computed:{settingValues:function(){var e=this,t=Object.entries(this.allSettingValues).filter((function(t){var n=vn(t,1),o=n[0];if(e.groupName){var r=o.split("."),i=vn(r,1),l=i[0];if(l!==e.groupName)return!1}return!0})).map((function(t){var n=vn(t,2),o=n[0],r=n[1];return e.groupName?[o.split(".")[1],r]:[o,r]}));return Object.fromEntries(t)}}});Vn.render=mn;var wn=Vn;function Cn(e,t){return Bn(e)||Fn(e,t)||kn(e,t)||Sn()}function Sn(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}function kn(e,t){if(e){if("string"===typeof e)return An(e,t);var n=Object.prototype.toString.call(e).slice(8,-1);return"Object"===n&&e.constructor&&(n=e.constructor.name),"Map"===n||"Set"===n?Array.from(e):"Arguments"===n||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)?An(e,t):void 0}}function An(e,t){(null==t||t>e.length)&&(t=e.length);for(var n=0,o=new Array(t);n<t;n++)o[n]=e[n];return o}function Fn(e,t){var n=null==e?null:"undefined"!==typeof Symbol&&e[Symbol.iterator]||e["@@iterator"];if(null!=n){var o,r,i=[],l=!0,a=!1;try{for(n=n.call(e);!(l=(o=n.next()).done);l=!0)if(i.push(o.value),t&&i.length===t)break}catch(u){a=!0,r=u}finally{try{l||null==n["return"]||n["return"]()}finally{if(a)throw r}}return i}}function Bn(e){if(Array.isArray(e))return e}var En=window,xn=En.$,Nn=Object(l["defineComponent"])({props:{mode:String},components:{ActivityIndicator:i["ActivityIndicator"],Field:Qt,GroupedSettings:wn},data:function(){return{isLoading:!0,isSaving:{},passwordConfirmation:"",settingsToSave:null,settingsPerPlugin:[],settingValues:{}}},created:function(){var e=this;i["AjaxHelper"].fetch({method:this.apiMethod}).then((function(t){e.isLoading=!1,e.settingsPerPlugin=t,t.forEach((function(t){t.settings.forEach((function(n){e.settingValues["".concat(t.pluginName,".").concat(n.name)]=n.value}))})),window.anchorLinkFix.scrollToAnchorInUrl(),e.addSectionsToTableOfContents()})).catch((function(){e.isLoading=!1}))},computed:{apiMethod:function(){return"admin"===this.mode?"CorePluginsAdmin.getSystemSettings":"CorePluginsAdmin.getUserSettings"},saveApiMethod:function(){return"admin"===this.mode?"CorePluginsAdmin.setSystemSettings":"CorePluginsAdmin.setUserSettings"}},methods:{addSectionsToTableOfContents:function(){var e=xn("#generalSettingsTOC");if(e.length){var t=this.settingsPerPlugin;t.forEach((function(t){var n=t.pluginName,o=t.settings;n&&("CoreAdminHome"===n&&o?o.filter((function(e){return e.introduction})).forEach((function(t){e.append('<a href="#/'.concat(n,'PluginSettings">').concat(t.introduction,"</a> "))})):e.append('<a href="#/'.concat(n,'">').concat(n.replace(/([A-Z])/g," $1").trim(),"</a> ")))}))}},saveSetting:function(e){"admin"===this.mode?this.showPasswordConfirmModal(e):this.save(e)},showPasswordConfirmModal:function(e){var t=this;this.settingsToSave=e;var n=this.$refs.root,o=xn(n),r=function(n){var r=n.keyCode?n.keyCode:n.which;13===r&&(o.find(".confirm-password-modal").modal("close"),t.save(e))};o.find(".confirm-password-modal").modal({dismissible:!1,onOpenEnd:function(){var e=".modal.open #currentUserPassword";xn(e).focus(),xn(e).off("keypress").keypress(r)}}).modal("open")},save:function(e){var t=this,n=this.saveApiMethod;this.isSaving[e]=!0;var o=this.getValuesForPlugin(e);i["AjaxHelper"].post({method:n},{settingValues:o,passwordConfirmation:this.passwordConfirmation}).then((function(){t.isSaving[e]=!1;var n=i["NotificationsStore"].show({message:Object(i["translate"])("CoreAdminHome_PluginSettingsSaveSuccess"),id:"generalSettings",context:"success",type:"transient"});i["NotificationsStore"].scrollToNotification(n)})).catch((function(){t.isSaving[e]=!1})),this.passwordConfirmation="",this.settingsToSave=null},getValuesForPlugin:function(e){var t={};return t[e]||(t[e]=[]),Object.entries(this.settingValues).forEach((function(n){var o=Cn(n,2),r=o[0],i=o[1],l=r.split("."),a=Cn(l,2),u=a[0],c=a[1];if(u===e){var s=i;!1===s?s="0":!0===s&&(s="1"),t[u].push({name:c,value:s})}})),t}}});Nn.render=dn;var Tn=Nn,$n=(Object(i["createAngularJsAdapter"])({component:Tn,scope:{mode:{angularJsBind:"@"}},directiveName:"piwikPluginSettings"}),window),Mn=$n.$;
 /*!
  * Matomo - free/libre analytics platform
  *
diff --git a/plugins/CorePluginsAdmin/vue/src/GroupedSettings/GroupedSetting.vue b/plugins/CorePluginsAdmin/vue/src/GroupedSettings/GroupedSetting.vue
index d4e019c331..075903db2a 100644
--- a/plugins/CorePluginsAdmin/vue/src/GroupedSettings/GroupedSetting.vue
+++ b/plugins/CorePluginsAdmin/vue/src/GroupedSettings/GroupedSetting.vue
@@ -9,7 +9,7 @@
     <FormField
       :model-value="modelValue"
       @update:model-value="changeValue($event)"
-      :form-field="setting"
+      :form-field="settingWithComponent"
     />
   </div>
 </template>
@@ -19,6 +19,7 @@ import { defineComponent } from 'vue';
 import { IScope } from 'angular';
 import { Matomo } from 'CoreHome';
 import FormField from '../FormField/FormField.vue';
+import FieldAngularJsTemplate from '../FormField/FieldAngularJsTemplate.vue';
 
 // TODO: have to use angularjs here until there's an expression evaluating alternative
 let conditionScope: IScope;
@@ -40,6 +41,17 @@ export default defineComponent({
   },
   emits: ['update:modelValue'],
   computed: {
+    // bc for angularjs field that uses templateFile
+    settingWithComponent() {
+      if (this.setting.templateFile) {
+        return {
+          ...this.setting,
+          component: FieldAngularJsTemplate,
+        };
+      }
+
+      return this.setting;
+    },
     showField() {
       const condition = this.setting.condition as string;
       if (!condition) {
diff --git a/plugins/CorePluginsAdmin/vue/src/PluginSettings/PluginSettings.vue b/plugins/CorePluginsAdmin/vue/src/PluginSettings/PluginSettings.vue
index 2e5fa64203..8f35adae0b 100644
--- a/plugins/CorePluginsAdmin/vue/src/PluginSettings/PluginSettings.vue
+++ b/plugins/CorePluginsAdmin/vue/src/PluginSettings/PluginSettings.vue
@@ -77,21 +77,12 @@ import {
 } from 'CoreHome';
 import KeyPressEvent = JQuery.KeyPressEvent;
 import Field from '../Field/Field.vue';
+import Setting from './Setting';
+import SettingsForSinglePlugin from './SettingsForSinglePlugin';
 import GroupedSettings from '../GroupedSettings/GroupedSettings.vue';
 
 const { $ } = window;
 
-interface Setting {
-  name: string;
-  value: unknown;
-  introduction?: string;
-}
-
-interface SettingsForSinglePlugin {
-  pluginName: string;
-  settings: Setting[];
-}
-
 interface PluginSettingsState {
   isLoading: boolean;
   isSaving: Record<string, boolean>;
diff --git a/plugins/CorePluginsAdmin/vue/src/PluginSettings/Setting.ts b/plugins/CorePluginsAdmin/vue/src/PluginSettings/Setting.ts
new file mode 100644
index 0000000000..6f661eff41
--- /dev/null
+++ b/plugins/CorePluginsAdmin/vue/src/PluginSettings/Setting.ts
@@ -0,0 +1,14 @@
+/*!
+ * Matomo - free/libre analytics platform
+ *
+ * @link https://matomo.org
+ * @license http://www.gnu.org/licenses/gpl-3.0.html GPL v3 or later
+ */
+
+interface Setting {
+  name: string;
+  value: any; // eslint-disable-line
+  introduction?: string;
+}
+
+export default Setting;
diff --git a/plugins/CorePluginsAdmin/vue/src/PluginSettings/SettingsForSinglePlugin.ts b/plugins/CorePluginsAdmin/vue/src/PluginSettings/SettingsForSinglePlugin.ts
new file mode 100644
index 0000000000..515635709e
--- /dev/null
+++ b/plugins/CorePluginsAdmin/vue/src/PluginSettings/SettingsForSinglePlugin.ts
@@ -0,0 +1,15 @@
+/*!
+ * Matomo - free/libre analytics platform
+ *
+ * @link https://matomo.org
+ * @license http://www.gnu.org/licenses/gpl-3.0.html GPL v3 or later
+ */
+
+import Setting from './Setting';
+
+interface SettingsForSinglePlugin {
+  pluginName: string;
+  settings: Setting[];
+}
+
+export default SettingsForSinglePlugin;
diff --git a/plugins/CorePluginsAdmin/vue/src/index.ts b/plugins/CorePluginsAdmin/vue/src/index.ts
index 1c8330632b..69a0a88434 100644
--- a/plugins/CorePluginsAdmin/vue/src/index.ts
+++ b/plugins/CorePluginsAdmin/vue/src/index.ts
@@ -15,6 +15,8 @@ import './Form/Form.adapter';
 
 export { default as FormField } from './FormField/FormField.vue';
 export { default as Field } from './Field/Field.vue';
+export { default as Setting } from './PluginSettings/Setting';
+export { default as SettingsForSinglePlugin } from './PluginSettings/SettingsForSinglePlugin';
 export { default as PluginSettings } from './PluginSettings/PluginSettings.vue';
 export { default as PluginFilter } from './Plugins/PluginFilter';
 export { default as PluginManagement } from './Plugins/PluginManagement';