From ac868ef79704d01d67c0208d67fef58ef9ff6a02 Mon Sep 17 00:00:00 2001 From: Noley Holland Date: Thu, 5 Mar 2026 13:20:20 -0800 Subject: [PATCH 1/4] Convert vuex dialog to pinia with unit tests & setup alias for stores import --- .eslintrc | 17 +- frontend/src/components/DevicesBrowser.vue | 4 +- .../AddDeviceToGroupDialog.vue | 7 +- .../components/device-list.vue | 7 +- frontend/src/mixins/Dialog.js | 17 +- frontend/src/store/modules/account/index.js | 4 +- frontend/src/store/modules/ux/dialog/index.js | 101 - frontend/src/store/modules/ux/index.js | 3 +- frontend/src/stores/index.js | 1 + frontend/src/stores/ux-dialog.js | 61 + frontend/src/stores/ux-dialog.spec.js | 57 + package-lock.json | 2136 ++++++++++++----- package.json | 1 + 13 files changed, 1749 insertions(+), 667 deletions(-) delete mode 100644 frontend/src/store/modules/ux/dialog/index.js create mode 100644 frontend/src/stores/ux-dialog.js create mode 100644 frontend/src/stores/ux-dialog.spec.js diff --git a/.eslintrc b/.eslintrc index 26c824b8d6..0a22db3eac 100644 --- a/.eslintrc +++ b/.eslintrc @@ -74,6 +74,16 @@ "ecmaVersion": 2022, "sourceType": "module" }, + "settings": { + "import/resolver": { + "webpack": { + "config": "config/webpack.config.js" + }, + "node": { + "extensions": [".js", ".vue"] + } + } + }, "rules": { // plugin:vue "vue/html-indent": ["warn", 4], @@ -85,7 +95,12 @@ "vue/component-definition-name-casing": "off", // plugin:promise - "promise/always-return": "off" // common Vue.js pattern + "promise/always-return": "off", // common Vue.js pattern + + // Frontend runs through webpack, not Node — n's Node.js-based resolution + // does not understand webpack aliases (@/) or .vue file resolution + "n/no-missing-import": "off", + "n/no-missing-require": "off" } }, diff --git a/frontend/src/components/DevicesBrowser.vue b/frontend/src/components/DevicesBrowser.vue index a1ed2e354e..756c276d56 100644 --- a/frontend/src/components/DevicesBrowser.vue +++ b/frontend/src/components/DevicesBrowser.vue @@ -385,6 +385,8 @@ import DevicesStatusBar from './charts/DeviceStatusBar.vue' import AddDeviceToGroupDialog from './dialogs/device-group-management/AddDeviceToGroupDialog.vue' import RemoveDeviceFromGroupDialog from './dialogs/device-group-management/RemoveDeviceFromGroupDialog.vue' +import { useUxDialogStore } from '@/stores/ux-dialog.js' + const POLL_TIME = 10000 export default { @@ -459,8 +461,8 @@ export default { computed: { ...mapState('account', ['team', 'teamMembership']), ...mapState('ux/tours', ['tours']), - ...mapState('ux/dialog', ['dialog']), ...mapGetters('account', ['featuresCheck']), + dialog () { return useUxDialogStore().dialog }, columns () { const columns = [ { label: 'Remote Instance', key: 'name', sortable: !this.moreThanOnePage, component: { is: markRaw(DeviceLink) } }, diff --git a/frontend/src/components/dialogs/device-group-management/AddDeviceToGroupDialog.vue b/frontend/src/components/dialogs/device-group-management/AddDeviceToGroupDialog.vue index d43b69f55b..4af79fff9b 100644 --- a/frontend/src/components/dialogs/device-group-management/AddDeviceToGroupDialog.vue +++ b/frontend/src/components/dialogs/device-group-management/AddDeviceToGroupDialog.vue @@ -79,9 +79,8 @@