mirror of https://github.com/rancher/dashboard.git
Vue 3 Nuxtism Removal (#10533)
* Removing everything related to scrollTrigger.
The latest vue router seems to behave exactly as it does with the modified scrollBehavior so it can all be removed.
* Removing unused $nuxt.{suffixes} that I found
- routeChanged (didn't find any watches of this event)
- nbFetching (The only place reading this was a computed property which wasn't used anywhere)
* Replace the use of Vue[installKey]
* Removing some ssr rehydration code since we're not doing ssr
* Remove the remaining $nuxt.$on,$off,$emit and replace with the use of our primary store which already had related code
* Replacing usages of the .$nuxt on vue instances with globalApp references
* Removing SSR dead code
* Fixing an issue where extensions could still be referencing window.$nuxt. This now provides a deprecation warning.
* Migrating another $nuxt over to the window.$globalApp
* Removed the usage of Vue.config.$nux
* Removed the usage of Vue.util.defineReactive
- Saw that the Nuxt component wasn't needed any longer so I removed it instead of trying to work around Vue.util.defineReactive
* Re-run missing check
---------
Co-authored-by: cnotv <giuseppe.leo@suse.com>
This commit is contained in:
codyrancher
GitHub
parent
beddcb2866
commit
b0d2dcbeb4
|
|
@ -47,11 +47,11 @@ export default {
|
|||
|
||||
const currentCluster = this.$store.getters['management/all'](MANAGEMENT.CLUSTER).find((x) => x.id === neu);
|
||||
|
||||
this.$nuxt.$loading.start();
|
||||
window.$globalApp.$loading.start();
|
||||
|
||||
const kubeconfigContent = await currentCluster.generateKubeConfig();
|
||||
|
||||
this.$nuxt.$loading.finish();
|
||||
window.$globalApp.$loading.finish();
|
||||
|
||||
this.value.setData('kubeconfigContent', kubeconfigContent);
|
||||
},
|
||||
|
|
|
|||
|
|
@ -20,8 +20,6 @@ import { getApplicableExtensionEnhancements } from '@shell/core/plugin-helpers';
|
|||
import IconOrSvg from '@shell/components/IconOrSvg';
|
||||
import { wait } from '@shell/utils/async';
|
||||
|
||||
const PAGE_HEADER_ACTION = 'page-action';
|
||||
|
||||
export default {
|
||||
|
||||
components: {
|
||||
|
|
@ -117,7 +115,7 @@ export default {
|
|||
},
|
||||
|
||||
showPageActions() {
|
||||
return !this.featureRancherDesktop && this.pageActions?.length;
|
||||
return !this.featureRancherDesktop && this.pageActions && this.pageActions.length;
|
||||
},
|
||||
|
||||
showUserMenu() {
|
||||
|
|
@ -274,7 +272,7 @@ export default {
|
|||
},
|
||||
|
||||
pageAction(action) {
|
||||
this.$nuxt.$emit(PAGE_HEADER_ACTION, action);
|
||||
this.$store.dispatch('handlePageAction', action);
|
||||
},
|
||||
|
||||
checkClusterName() {
|
||||
|
|
|
|||
|
|
@ -30,13 +30,8 @@ export default {
|
|||
|
||||
const listeners = {}
|
||||
|
||||
// Add triggerScroll event on beforeEnter (fix #1376)
|
||||
const beforeEnter = listeners.beforeEnter
|
||||
listeners.beforeEnter = (el) => {
|
||||
// Ensure to trigger scroll event after calling scrollBehavior
|
||||
window.$nuxt.$nextTick(() => {
|
||||
window.$nuxt.$emit('triggerScroll')
|
||||
})
|
||||
if (beforeEnter) {
|
||||
return beforeEnter.call(_parent, el)
|
||||
}
|
||||
|
|
|
|||
|
|
@ -68,7 +68,7 @@ export default {
|
|||
},
|
||||
canPrefetch () {
|
||||
const conn = navigator.connection
|
||||
const hasBadConnection = this.$nuxt.isOffline || (conn && ((conn.effectiveType || '').includes('2g') || conn.saveData))
|
||||
const hasBadConnection = window.$globalApp.isOffline || (conn && ((conn.effectiveType || '').includes('2g') || conn.saveData))
|
||||
|
||||
return !hasBadConnection
|
||||
},
|
||||
|
|
|
|||
|
|
@ -1,101 +0,0 @@
|
|||
import Vue from 'vue'
|
||||
import { compile } from '../../utils/nuxt'
|
||||
|
||||
import NuxtError from '../../components/templates/error.vue'
|
||||
|
||||
import NuxtChild from './nuxt-child'
|
||||
|
||||
export default {
|
||||
name: 'Nuxt',
|
||||
components: {
|
||||
NuxtChild,
|
||||
NuxtError
|
||||
},
|
||||
props: {
|
||||
nuxtChildKey: {
|
||||
type: String,
|
||||
default: undefined
|
||||
},
|
||||
keepAlive: Boolean,
|
||||
keepAliveProps: {
|
||||
type: Object,
|
||||
default: undefined
|
||||
},
|
||||
name: {
|
||||
type: String,
|
||||
default: 'default'
|
||||
}
|
||||
},
|
||||
errorCaptured (error) {
|
||||
// if we receive and error while showing the NuxtError component
|
||||
// capture the error and force an immediate update so we re-render
|
||||
// without the NuxtError component
|
||||
if (this.displayingNuxtError) {
|
||||
this.errorFromNuxtError = error
|
||||
this.$forceUpdate()
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
routerViewKey () {
|
||||
// If nuxtChildKey prop is given or current route has children
|
||||
if (typeof this.nuxtChildKey !== 'undefined' || this.$route.matched.length > 1) {
|
||||
return this.nuxtChildKey || compile(this.$route.matched[0].path)(this.$route.params)
|
||||
}
|
||||
|
||||
const [matchedRoute] = this.$route.matched
|
||||
|
||||
if (!matchedRoute) {
|
||||
return this.$route.path
|
||||
}
|
||||
|
||||
const Component = matchedRoute.components.default
|
||||
|
||||
if (Component && Component.options) {
|
||||
const { options } = Component
|
||||
|
||||
if (options.key) {
|
||||
return (typeof options.key === 'function' ? options.key(this.$route) : options.key)
|
||||
}
|
||||
}
|
||||
|
||||
const strict = /\/$/.test(matchedRoute.path)
|
||||
return strict ? this.$route.path : this.$route.path.replace(/\/$/, '')
|
||||
}
|
||||
},
|
||||
beforeCreate () {
|
||||
Vue.util.defineReactive(this, 'nuxt', this.$root.$options.nuxt)
|
||||
},
|
||||
render (h) {
|
||||
// if there is no error
|
||||
if (!this.nuxt.err) {
|
||||
// Directly return nuxt child
|
||||
return h('NuxtChild', {
|
||||
key: this.routerViewKey,
|
||||
props: this.$props
|
||||
})
|
||||
}
|
||||
|
||||
// if an error occurred within NuxtError show a simple
|
||||
// error message instead to prevent looping
|
||||
if (this.errorFromNuxtError) {
|
||||
this.$nextTick(() => (this.errorFromNuxtError = false))
|
||||
|
||||
return h('div', {}, [
|
||||
h('h2', 'An error occurred while showing the error page'),
|
||||
h('p', 'Unfortunately an error occurred and while showing the error page another error occurred'),
|
||||
h('p', `Error details: ${this.errorFromNuxtError.toString()}`),
|
||||
h('nuxt-link', { props: { to: '/' } }, 'Go back to home')
|
||||
])
|
||||
}
|
||||
|
||||
// track if we are showing the NuxtError component
|
||||
this.displayingNuxtError = true
|
||||
this.$nextTick(() => (this.displayingNuxtError = false))
|
||||
|
||||
return h(NuxtError, {
|
||||
props: {
|
||||
error: this.nuxt.err
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
|
|
@ -12,7 +12,7 @@ export default {
|
|||
|
||||
computed: {
|
||||
error() {
|
||||
return window.$nuxt.nuxt.err || {};
|
||||
return window.$globalApp.nuxt.err || {};
|
||||
},
|
||||
statusCode() {
|
||||
return (this.error && this.error.statusCode) || 599;
|
||||
|
|
|
|||
|
|
@ -2,7 +2,6 @@ import Vue from 'vue';
|
|||
import Router from 'vue-router';
|
||||
import { normalizeURL } from 'ufo';
|
||||
import { interopDefault } from '../utils/nuxt';
|
||||
import scrollBehavior from '../utils/router.scrollBehavior.js';
|
||||
|
||||
const emptyFn = () => {};
|
||||
|
||||
|
|
@ -12,7 +11,6 @@ export const routerOptions = {
|
|||
mode: 'history',
|
||||
// Note: router base comes from the ROUTER_BASE env var
|
||||
base: process.env.routerBase || '/',
|
||||
scrollBehavior,
|
||||
|
||||
routes: [
|
||||
{
|
||||
|
|
|
|||
|
|
@ -66,7 +66,7 @@ let store = {};
|
|||
// Update `root.modules` with the latest definitions.
|
||||
updateModules();
|
||||
// Trigger a hot update in the store.
|
||||
window.$nuxt.$store.hotUpdate(store);
|
||||
window.$globalApp.$store.hotUpdate(store);
|
||||
});
|
||||
}
|
||||
})();
|
||||
|
|
|
|||
|
|
@ -30,19 +30,18 @@ export default {
|
|||
isOnline: true,
|
||||
|
||||
showErrorPage: false,
|
||||
|
||||
nbFetching: 0
|
||||
}),
|
||||
|
||||
beforeCreate() {
|
||||
Vue.util.defineReactive(this, 'nuxt', this.$options.nuxt);
|
||||
},
|
||||
created() {
|
||||
// Add this.$nuxt in child instances
|
||||
this.$root.$options.$nuxt = this;
|
||||
|
||||
// add to window so we can listen when ready
|
||||
window.$nuxt = this;
|
||||
window.$globalApp = this;
|
||||
Object.defineProperty(window, '$nuxt', {
|
||||
get() {
|
||||
console.warn('window.$nuxt is deprecated. It would be best to stop using globalState all together. For an alternative you can use window.$globalApp.'); // eslint-disable-line no-console
|
||||
|
||||
return window.$globalApp;
|
||||
}
|
||||
});
|
||||
|
||||
this.refreshOnlineStatus();
|
||||
// Setup the listeners
|
||||
|
|
@ -50,7 +49,7 @@ export default {
|
|||
window.addEventListener('offline', this.refreshOnlineStatus);
|
||||
|
||||
// Add $nuxt.error()
|
||||
this.error = this.nuxt.error;
|
||||
this.error = this.$options.nuxt.error;
|
||||
// Add $nuxt.context
|
||||
this.context = this.$options.context;
|
||||
},
|
||||
|
|
@ -65,10 +64,6 @@ export default {
|
|||
isOffline() {
|
||||
return !this.isOnline;
|
||||
},
|
||||
|
||||
isFetching() {
|
||||
return this.nbFetching > 0;
|
||||
},
|
||||
},
|
||||
|
||||
methods: {
|
||||
|
|
@ -131,10 +126,10 @@ export default {
|
|||
this.$loading.finish();
|
||||
},
|
||||
errorChanged() {
|
||||
if (this.nuxt.err) {
|
||||
if (this.$options.nuxt.err) {
|
||||
if (this.$loading) {
|
||||
if (this.$loading.fail) {
|
||||
this.$loading.fail(this.nuxt.err);
|
||||
this.$loading.fail(this.$options.nuxt.err);
|
||||
}
|
||||
if (this.$loading.finish) {
|
||||
this.$loading.finish();
|
||||
|
|
|
|||
|
|
@ -30,10 +30,7 @@ const isDev = process.env.dev;
|
|||
const debug = isDev;
|
||||
|
||||
// Fetch mixin
|
||||
if (!Vue.__nuxt__fetch__mixin__) {
|
||||
Vue.mixin(fetchMixin);
|
||||
Vue.__nuxt__fetch__mixin__ = true;
|
||||
}
|
||||
Vue.mixin(fetchMixin);
|
||||
|
||||
// Component: <NuxtLink>
|
||||
Vue.component(NuxtLink.name, NuxtLink);
|
||||
|
|
@ -48,8 +45,7 @@ let _lastPaths = [];
|
|||
let app;
|
||||
let router;
|
||||
|
||||
// Try to rehydrate SSR data from window
|
||||
const NUXT = window.__NUXT__ || {};
|
||||
const NUXT = {};
|
||||
|
||||
const $config = nuxt.publicRuntimeConfig || {}; // eslint-disable-line no-undef
|
||||
|
||||
|
|
@ -60,19 +56,6 @@ if ($config._app) {
|
|||
Object.assign(Vue.config, { silent: false, performance: true });
|
||||
|
||||
if (debug) {
|
||||
const logs = NUXT.logs || [];
|
||||
|
||||
if (logs.length > 0) {
|
||||
const ssrLogStyle = 'background: #2E495E;border-radius: 0.5em;color: white;font-weight: bold;padding: 2px 0.5em;';
|
||||
|
||||
console.group && console.group('%cNuxt SSR', ssrLogStyle); // eslint-disable-line no-console
|
||||
logs.forEach((logObj) => (console[logObj.type] || console.log)(...logObj.args)); // eslint-disable-line no-console
|
||||
delete NUXT.logs;
|
||||
console.groupEnd && console.groupEnd(); // eslint-disable-line no-console
|
||||
}
|
||||
|
||||
// Setup global Vue error handler
|
||||
if (!Vue.config.$nuxt) {
|
||||
const defaultErrorHandler = Vue.config.errorHandler;
|
||||
|
||||
Vue.config.errorHandler = async(err, vm, info, ...rest) => {
|
||||
|
|
@ -87,7 +70,7 @@ if (debug) {
|
|||
}
|
||||
|
||||
if (vm && vm.$root) {
|
||||
const nuxtApp = Object.keys(Vue.config.$nuxt)
|
||||
const nuxtApp = Object.keys(window.$globalApp)
|
||||
.find((nuxtInstance) => vm.$root[nuxtInstance]);
|
||||
|
||||
// Show Nuxt Error Page
|
||||
|
|
@ -109,9 +92,6 @@ if (debug) {
|
|||
console.error(err.message || err); // eslint-disable-line no-console
|
||||
}
|
||||
};
|
||||
Vue.config.$nuxt = {};
|
||||
}
|
||||
Vue.config.$nuxt.$nuxt = true;
|
||||
}
|
||||
|
||||
const errorHandler = Vue.config.errorHandler || console.error; // eslint-disable-line no-console
|
||||
|
|
@ -173,7 +153,6 @@ async function loadAsyncComponents(to, from, next) {
|
|||
}
|
||||
|
||||
this.error({ statusCode, message });
|
||||
this.$nuxt.$emit('routeChanged', to, from, err);
|
||||
next();
|
||||
}
|
||||
}
|
||||
|
|
@ -444,15 +423,11 @@ async function render(to, from, next) {
|
|||
} catch (err) {
|
||||
const error = err || {};
|
||||
|
||||
if (error.message === 'ERR_REDIRECT') {
|
||||
return this.$nuxt.$emit('routeChanged', to, from, error);
|
||||
}
|
||||
_lastPaths = [];
|
||||
|
||||
globalHandleError(error);
|
||||
|
||||
this.error(error);
|
||||
this.$nuxt.$emit('routeChanged', to, from, error);
|
||||
next();
|
||||
}
|
||||
}
|
||||
|
|
@ -488,8 +463,6 @@ function fixPrepatch(to, ___) {
|
|||
const instances = getMatchedComponentsInstances(to);
|
||||
const Components = getMatchedComponents(to);
|
||||
|
||||
let triggerScroll = false;
|
||||
|
||||
Vue.nextTick(() => {
|
||||
instances.forEach((instance, i) => {
|
||||
if (!instance || instance._isDestroyed) {
|
||||
|
|
@ -507,18 +480,9 @@ function fixPrepatch(to, ___) {
|
|||
for (const key in newData) {
|
||||
Vue.set(instance.$data, key, newData[key]);
|
||||
}
|
||||
|
||||
triggerScroll = true;
|
||||
}
|
||||
});
|
||||
|
||||
if (triggerScroll) {
|
||||
// Ensure to trigger scroll event after calling scrollBehavior
|
||||
window.$nuxt.$nextTick(() => {
|
||||
window.$nuxt.$emit('triggerScroll');
|
||||
});
|
||||
}
|
||||
|
||||
checkForErrors(this);
|
||||
|
||||
// Hot reloading
|
||||
|
|
@ -538,11 +502,6 @@ function nuxtReady(_app) {
|
|||
if (typeof window._onNuxtLoaded === 'function') {
|
||||
window._onNuxtLoaded(_app);
|
||||
}
|
||||
// Add router hooks
|
||||
router.afterEach((to, from) => {
|
||||
// Wait for fixPrepatch + $data updates
|
||||
Vue.nextTick(() => _app.$nuxt.$emit('routeChanged', to, from));
|
||||
});
|
||||
}
|
||||
|
||||
const noopData = () => {
|
||||
|
|
@ -569,7 +528,7 @@ function hotReloadAPI(_app) {
|
|||
return;
|
||||
}
|
||||
|
||||
const $components = getNuxtChildComponents(_app.$nuxt, []);
|
||||
const $components = getNuxtChildComponents(window.$globalApp, []);
|
||||
|
||||
$components.forEach(addHotReload.bind(_app));
|
||||
}
|
||||
|
|
|
|||
|
|
@ -4,7 +4,6 @@
|
|||
import Vue from 'vue';
|
||||
import { createRouter } from '../config/router.js';
|
||||
import NuxtChild from '../components/nuxt/nuxt-child.js';
|
||||
import Nuxt from '../components/nuxt/nuxt.js';
|
||||
import App from './App.js';
|
||||
import { setContext, getLocation, getRouteData, normalizeError } from '../utils/nuxt';
|
||||
import { createStore } from '../config/store.js';
|
||||
|
|
@ -68,24 +67,6 @@ loadDirectives();
|
|||
Vue.component(NuxtChild.name, NuxtChild);
|
||||
Vue.component('NChild', NuxtChild);
|
||||
|
||||
// Component NuxtLink is imported in server.js or client.js
|
||||
|
||||
// Component: <Nuxt>
|
||||
Vue.component(Nuxt.name, Nuxt);
|
||||
|
||||
Object.defineProperty(Vue.prototype, '$nuxt', {
|
||||
get() {
|
||||
const globalNuxt = this.$root.$options.$nuxt;
|
||||
|
||||
if (!globalNuxt && typeof window !== 'undefined') {
|
||||
return window.$nuxt;
|
||||
}
|
||||
|
||||
return globalNuxt;
|
||||
},
|
||||
configurable: true
|
||||
});
|
||||
|
||||
async function createApp(config = {}) {
|
||||
const router = await createRouter(config);
|
||||
|
||||
|
|
@ -164,10 +145,12 @@ async function createApp(config = {}) {
|
|||
// Check if plugin not already installed
|
||||
const installKey = `__nuxt_${ key }_installed__`;
|
||||
|
||||
if (Vue[installKey]) {
|
||||
window.installedPlugins = window.installedPlugins || {};
|
||||
|
||||
if (window.installedPlugins[installKey]) {
|
||||
return;
|
||||
}
|
||||
Vue[installKey] = true;
|
||||
window[window.installedPlugins] = true;
|
||||
// Call Vue.use() to install the plugin into vm
|
||||
Vue.use(() => {
|
||||
if (!Object.prototype.hasOwnProperty.call(Vue.prototype, key)) {
|
||||
|
|
@ -183,11 +166,6 @@ async function createApp(config = {}) {
|
|||
// Inject runtime config as $config
|
||||
inject('config', config);
|
||||
|
||||
// Replace store state before plugins execution
|
||||
if (window.__NUXT__ && window.__NUXT__.state) {
|
||||
store.replaceState(window.__NUXT__.state);
|
||||
}
|
||||
|
||||
// Plugin execution
|
||||
if (typeof cookieUniversalNuxt === 'function') {
|
||||
await cookieUniversalNuxt(app.context, inject);
|
||||
|
|
|
|||
|
|
@ -1,9 +1,5 @@
|
|||
import Vue from 'vue';
|
||||
import { hasFetch, normalizeError, addLifecycleHook } from '../utils/nuxt';
|
||||
|
||||
const isSsrHydration = (vm) => vm.$vnode && vm.$vnode.elm && vm.$vnode.elm.dataset && vm.$vnode.elm.dataset.fetchKey;
|
||||
const nuxtState = window.__NUXT__;
|
||||
|
||||
export default {
|
||||
beforeCreate() {
|
||||
if (!hasFetch(this)) {
|
||||
|
|
@ -12,15 +8,24 @@ export default {
|
|||
|
||||
this._fetchDelay = typeof this.$options.fetchDelay === 'number' ? this.$options.fetchDelay : 200;
|
||||
|
||||
Vue.util.defineReactive(this, '$fetchState', {
|
||||
this.$fetch = $fetch.bind(this);
|
||||
addLifecycleHook(this, 'beforeMount', beforeMount);
|
||||
},
|
||||
|
||||
data() {
|
||||
return {
|
||||
state: {
|
||||
pending: false,
|
||||
error: null,
|
||||
timestamp: Date.now()
|
||||
});
|
||||
}
|
||||
};
|
||||
},
|
||||
|
||||
this.$fetch = $fetch.bind(this);
|
||||
addLifecycleHook(this, 'created', created);
|
||||
addLifecycleHook(this, 'beforeMount', beforeMount);
|
||||
computed: {
|
||||
$fetchState() {
|
||||
return this.state;
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
|
|
@ -30,29 +35,6 @@ function beforeMount() {
|
|||
}
|
||||
}
|
||||
|
||||
function created() {
|
||||
if (!isSsrHydration(this)) {
|
||||
return;
|
||||
}
|
||||
|
||||
// Hydrate component
|
||||
this._hydrated = true;
|
||||
this._fetchKey = this.$vnode.elm.dataset.fetchKey;
|
||||
const data = nuxtState.fetch[this._fetchKey];
|
||||
|
||||
// If fetch error
|
||||
if (data && data._error) {
|
||||
this.$fetchState.error = data._error;
|
||||
|
||||
return;
|
||||
}
|
||||
|
||||
// Merge data
|
||||
for (const key in data) {
|
||||
Vue.set(this.$data, key, data[key]);
|
||||
}
|
||||
}
|
||||
|
||||
function $fetch() {
|
||||
if (!this._fetchPromise) {
|
||||
this._fetchPromise = $_fetch.call(this)
|
||||
|
|
@ -65,9 +47,8 @@ function $fetch() {
|
|||
}
|
||||
|
||||
async function $_fetch() { // eslint-disable-line camelcase
|
||||
this.$nuxt.nbFetching++;
|
||||
this.$fetchState.pending = true;
|
||||
this.$fetchState.error = null;
|
||||
this.state.pending = true;
|
||||
this.state.error = null;
|
||||
this._hydrated = false;
|
||||
let error = null;
|
||||
const startTime = Date.now();
|
||||
|
|
@ -87,9 +68,7 @@ async function $_fetch() { // eslint-disable-line camelcase
|
|||
await new Promise((resolve) => setTimeout(resolve, delayLeft));
|
||||
}
|
||||
|
||||
this.$fetchState.error = error;
|
||||
this.$fetchState.pending = false;
|
||||
this.$fetchState.timestamp = Date.now();
|
||||
|
||||
this.$nextTick(() => this.$nuxt.nbFetching--);
|
||||
this.state.error = error;
|
||||
this.state.pending = false;
|
||||
this.state.timestamp = Date.now();
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,21 +1,23 @@
|
|||
const PAGE_ACTION = 'page-action';
|
||||
const STORE_PAGE_ACTIONS = 'pageActions';
|
||||
|
||||
export default {
|
||||
created() {
|
||||
this.updatePageActions();
|
||||
this.$nuxt.$on(PAGE_ACTION, (action) => {
|
||||
|
||||
const pageActionHandler = (action) => {
|
||||
if (this.handlePageAction) {
|
||||
this.handlePageAction(action);
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
this.$store.commit('pageActionHandler', pageActionHandler);
|
||||
},
|
||||
|
||||
beforeDestroy() {
|
||||
unmounted() {
|
||||
if (this.pageActions) {
|
||||
this.$store.commit(STORE_PAGE_ACTIONS, []);
|
||||
}
|
||||
this.$nuxt.$off(PAGE_ACTION);
|
||||
this.$store.commit('clearPageActionHandler');
|
||||
},
|
||||
|
||||
methods: {
|
||||
|
|
|
|||
|
|
@ -19,12 +19,6 @@ export default {
|
|||
// Ensure we re-evaluate the redirect in case this auth provider has been disabled
|
||||
const authProvs = await authProvidersInfo(this.$store);
|
||||
|
||||
// Nuxt does not remove it's loading indicator - if we are not changing route, then hide it
|
||||
// https://nuxtjs.org/docs/features/loading/
|
||||
if (authProvs.enabledLocation) {
|
||||
this.$nuxt.$loading.finish();
|
||||
}
|
||||
|
||||
next(!authProvs.enabledLocation);
|
||||
} else {
|
||||
next();
|
||||
|
|
|
|||
|
|
@ -1,7 +1,3 @@
|
|||
import Vue from 'vue';
|
||||
|
||||
import { isArray } from '@shell/utils/array';
|
||||
import { classify } from '@shell/plugins/dashboard-store/classify';
|
||||
import actions from './actions';
|
||||
import getters from './getters';
|
||||
import mutations from './mutations';
|
||||
|
|
@ -37,7 +33,6 @@ export default (vuexModule, config, init) => {
|
|||
store.commit(`${ namespace }/applyConfig`, config);
|
||||
|
||||
const module = store._modules.root._children[namespace];
|
||||
const fromServer = window.__NUXT__;
|
||||
|
||||
const ctx = new Proxy(module.context, {
|
||||
get(obj, key) {
|
||||
|
|
@ -52,99 +47,5 @@ export default (vuexModule, config, init) => {
|
|||
if (init) {
|
||||
init(store, ctx);
|
||||
}
|
||||
|
||||
// Turn all the objects in the store from the server into proxies
|
||||
const state = fromServer?.state?.[namespace];
|
||||
|
||||
if ( state ) {
|
||||
Object.keys(state.types).forEach((type) => {
|
||||
const keyField = store.getters[`${ namespace }/keyFieldForType`](type);
|
||||
const cache = state.types[type];
|
||||
const map = new Map();
|
||||
|
||||
for ( let i = 0 ; i < cache.list.length ; i++ ) {
|
||||
const proxy = classify(ctx, cache.list[i]);
|
||||
|
||||
cache.list[i] = proxy;
|
||||
map.set(proxy[keyField], proxy);
|
||||
}
|
||||
|
||||
Vue.set(cache, 'map', map);
|
||||
Vue.set(state.types, type, state.types[type]);
|
||||
});
|
||||
}
|
||||
|
||||
// Turn all the objects in data from the server into the object from the store;
|
||||
if ( state && fromServer?.data ) {
|
||||
fromServer.data = recurse(fromServer.data);
|
||||
}
|
||||
|
||||
if ( state && fromServer?.fetch ) {
|
||||
fromServer.fetch = recurse(fromServer.fetch);
|
||||
}
|
||||
|
||||
function recurse(obj, parent, key) {
|
||||
if ( isArray(obj) ) {
|
||||
const rehydrateKey = `__rehydrateAll__${ key }`;
|
||||
|
||||
if ( parent && key && parent[rehydrateKey] ) {
|
||||
const [ns, type] = parent[rehydrateKey].split('/', 2);
|
||||
|
||||
if ( ns === namespace ) {
|
||||
// Don't delete the key, so that all the stores go through this path,
|
||||
// and then do nothing if they are not for this namespace,
|
||||
// instead of doing the else obj.map()
|
||||
// and breaking the "live" reference to the cache.list array
|
||||
// delete parent[rehydrateKey];
|
||||
|
||||
const cache = state.types[type];
|
||||
|
||||
if ( cache ) {
|
||||
return cache.list;
|
||||
}
|
||||
}
|
||||
} else {
|
||||
return obj.map((x) => recurse(x));
|
||||
}
|
||||
} else if ( obj && typeof obj === 'object' ) {
|
||||
if ( obj.__rehydrate ) {
|
||||
if ( obj.__rehydrate !== namespace ) {
|
||||
// Ignore types that are for another vuex namespace
|
||||
return obj;
|
||||
}
|
||||
|
||||
const type = obj.type;
|
||||
const cache = state.types[type];
|
||||
|
||||
if ( cache && !obj.__clone ) {
|
||||
const map = cache.map;
|
||||
const keyField = store.getters[`${ namespace }/keyFieldForType`](type);
|
||||
const entry = map.get(obj[keyField]);
|
||||
|
||||
// Map the object to the same instance in the store if possible
|
||||
if ( entry ) {
|
||||
return entry;
|
||||
}
|
||||
}
|
||||
|
||||
// Or just return a proxied object
|
||||
delete obj.__rehydrate;
|
||||
|
||||
return classify(ctx, obj);
|
||||
} else {
|
||||
for ( const k of Object.keys(obj) ) {
|
||||
if ( k.startsWith('__rehydrateAll__') ) {
|
||||
continue;
|
||||
}
|
||||
|
||||
if ( isArray(obj[k]) || typeof obj[k] === 'object' ) {
|
||||
obj[k] = recurse(obj[k], obj, k);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
return obj;
|
||||
}
|
||||
};
|
||||
};
|
||||
|
|
|
|||
|
|
@ -1244,11 +1244,11 @@ export default class Resource {
|
|||
// ------------------------------------------------------------------
|
||||
|
||||
currentRoute() {
|
||||
return window.$nuxt.$route;
|
||||
return window.$globalApp.$route;
|
||||
}
|
||||
|
||||
currentRouter() {
|
||||
return window.$nuxt.$router;
|
||||
return window.$globalApp.$router;
|
||||
}
|
||||
|
||||
get listLocation() {
|
||||
|
|
|
|||
|
|
@ -240,6 +240,7 @@ export const state = () => {
|
|||
error: null,
|
||||
cameFromError: false,
|
||||
pageActions: [],
|
||||
pageActionHandler: null,
|
||||
serverVersion: null,
|
||||
systemNamespaces: [],
|
||||
isSingleProduct: undefined,
|
||||
|
|
@ -594,6 +595,14 @@ export const getters = {
|
|||
};
|
||||
|
||||
export const mutations = {
|
||||
pageActionHandler(state, handler) {
|
||||
if (handler && typeof handler === 'function') {
|
||||
state.pageActionHandler = handler;
|
||||
}
|
||||
},
|
||||
clearPageActionHandler(state) {
|
||||
state.pageActionHandler = null;
|
||||
},
|
||||
managementChanged(state, { ready, isRancher }) {
|
||||
state.managementReady = ready;
|
||||
state.isRancher = isRancher;
|
||||
|
|
@ -691,6 +700,11 @@ export const mutations = {
|
|||
};
|
||||
|
||||
export const actions = {
|
||||
handlePageAction({ state }, action) {
|
||||
if (state.pageActionHandler) {
|
||||
state.pageActionHandler(action);
|
||||
}
|
||||
},
|
||||
async loadManagement({
|
||||
getters, state, commit, dispatch, rootGetters
|
||||
}) {
|
||||
|
|
|
|||
|
|
@ -84,9 +84,9 @@ const setupProgress = (axios) => {
|
|||
};
|
||||
|
||||
const $loading = () => {
|
||||
const $nuxt = typeof window !== 'undefined' && window['$nuxt'];
|
||||
const $globalApp = window.$globalApp;
|
||||
|
||||
return ($nuxt && $nuxt.$loading && $nuxt.$loading.set) ? $nuxt.$loading : noopLoading;
|
||||
return ($globalApp && $globalApp.$loading && $globalApp.$loading.set) ? $globalApp.$loading : noopLoading;
|
||||
};
|
||||
|
||||
let currentRequests = 0;
|
||||
|
|
|
|||
|
|
@ -258,8 +258,6 @@ export async function setContext(app, context) {
|
|||
throw new Error('ERR_REDIRECT');
|
||||
}
|
||||
};
|
||||
|
||||
app.context.nuxtState = window.__NUXT__;
|
||||
}
|
||||
|
||||
// Dynamic keys
|
||||
|
|
|
|||
|
|
@ -1,78 +0,0 @@
|
|||
import { getMatchedComponents, setScrollRestoration } from './nuxt';
|
||||
|
||||
if ('scrollRestoration' in window.history) {
|
||||
setScrollRestoration('manual');
|
||||
|
||||
// reset scrollRestoration to auto when leaving page, allowing page reload
|
||||
// and back-navigation from other pages to use the browser to restore the
|
||||
// scrolling position.
|
||||
window.addEventListener('beforeunload', () => {
|
||||
setScrollRestoration('auto');
|
||||
});
|
||||
|
||||
// Setting scrollRestoration to manual again when returning to this page.
|
||||
window.addEventListener('load', () => {
|
||||
setScrollRestoration('manual');
|
||||
});
|
||||
}
|
||||
|
||||
function shouldScrollToTop(route) {
|
||||
const Pages = getMatchedComponents(route);
|
||||
|
||||
if (Pages.length === 1) {
|
||||
const { options = {} } = Pages[0];
|
||||
|
||||
return options.scrollToTop !== false;
|
||||
}
|
||||
|
||||
return Pages.some(({ options }) => options && options.scrollToTop);
|
||||
}
|
||||
|
||||
export default function(to, from, savedPosition) {
|
||||
// If the returned position is falsy or an empty object, will retain current scroll position
|
||||
let position = false;
|
||||
const isRouteChanged = to !== from;
|
||||
|
||||
// savedPosition is only available for popstate navigations (back button)
|
||||
if (savedPosition) {
|
||||
position = savedPosition;
|
||||
} else if (isRouteChanged && shouldScrollToTop(to)) {
|
||||
position = { x: 0, y: 0 };
|
||||
}
|
||||
|
||||
const nuxt = window.$nuxt;
|
||||
|
||||
if (
|
||||
// Initial load (vuejs/vue-router#3199)
|
||||
!isRouteChanged ||
|
||||
// Route hash changes
|
||||
(to.path === from.path && to.hash !== from.hash)
|
||||
) {
|
||||
nuxt.$nextTick(() => nuxt.$emit('triggerScroll'));
|
||||
}
|
||||
|
||||
return new Promise((resolve) => {
|
||||
// wait for the out transition to complete (if necessary)
|
||||
nuxt.$once('triggerScroll', () => {
|
||||
// coords will be used if no selector is provided,
|
||||
// or if the selector didn't match any element.
|
||||
if (to.hash) {
|
||||
let hash = to.hash;
|
||||
|
||||
// CSS.escape() is not supported with IE and Edge.
|
||||
if (typeof window.CSS !== 'undefined' && typeof window.CSS.escape !== 'undefined') {
|
||||
hash = `#${ window.CSS.escape(hash.substr(1)) }`;
|
||||
}
|
||||
try {
|
||||
if (document.querySelector(hash)) {
|
||||
// scroll to anchor by returning the selector
|
||||
position = { selector: hash };
|
||||
}
|
||||
} catch (e) {
|
||||
console.warn('Failed to save scroll position. Please add CSS.escape() polyfill (https://github.com/mathiasbynens/CSS.escape).'); // eslint-disable-line no-console
|
||||
}
|
||||
}
|
||||
resolve(position);
|
||||
});
|
||||
});
|
||||
}
|
||||
Loading…
Reference in New Issue