Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Removing the i18n middleware from the application #10923

Merged
merged 1 commit into from
May 3, 2024
Merged

Removing the i18n middleware from the application #10923

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion jest.setup.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -14,7 +14,7 @@ global.TextEncoder = TextEncoder;
global.TextDecoder = TextDecoder;

Vue.config.productionTip = false;
Vue.use(i18n);
Vue.use(i18n, { store: { dispatch() {} } });
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Should dispatch be mocked with jest.fn()?

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I think it could actually just be entirely omitted now that I access it using the optional operator. If not, yeah we should mock it.

I'll address it in my next PR.

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

If we mock the dispatch, then we should mock everything else too.
In both cases we are not that strict though, as we do not test the i18n, we just want to not break it.

Vue.use(VTooltip);
Vue.use(VCleanTooltip);
Vue.component('v-select', vSelect);
Expand Down
3 changes: 0 additions & 3 deletions shell/config/middleware.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,4 @@ const middleware = {};
middleware['authenticated'] = require('../middleware/authenticated.js');
middleware['authenticated'] = middleware['authenticated'].default || middleware['authenticated'];

middleware['i18n'] = require('../middleware/i18n.js');
middleware['i18n'] = middleware['i18n'].default || middleware['i18n'];

export default middleware;
8 changes: 4 additions & 4 deletions shell/initialize/App.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,11 +1,11 @@
// Taken from @nuxt/vue-app/template/App.js
import {
getMatchedComponentsInstances, getChildrenComponentInstancesUsingFetch, promisify, globalHandleError, sanitizeComponent
} from '../utils/nuxt';
import NuxtError from '../components/templates/error.vue';
import NuxtLoading from '../components/nav/GlobalLoading.vue';
} from '@shell/utils/nuxt';
import NuxtError from '@shell/components/templates/error.vue';
import NuxtLoading from '@shell/components/nav/GlobalLoading.vue';

import '../assets/styles/app.scss';
import '@shell/assets/styles/app.scss';

export default {
render(h) {
Expand Down
2 changes: 1 addition & 1 deletion shell/initialize/client.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -90,7 +90,7 @@ const errorHandler = Vue.config.errorHandler || console.error; // eslint-disable
createApp(nuxt.publicRuntimeConfig).then(mountApp).catch(errorHandler); // eslint-disable-line no-undef

function callMiddleware(Components, context) {
let midd = ['i18n'];
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This was the only place I found it. If you can find it elsewhere let me know.

let midd = [];
let unknownMiddleware = false;

Components.forEach((Component) => {
Expand Down
5 changes: 3 additions & 2 deletions shell/initialize/plugins.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -29,8 +29,6 @@ import version from '@shell/plugins/version';
import emberCookie from '@shell/plugins/ember-cookie';

export async function installPlugins(app, inject, Vue) {
Vue.use(i18n);

const pluginDefinitions = [cookieUniversalNuxt, axios, plugins, pluginsLoader, axiosShell, intNumber, positiveIntNumber, nuxtClientInit, replaceAll, backButton, plugin, codeMirror, version, steveCreateWorker, emberCookie];

const installations = pluginDefinitions.map(async(pluginDefinition) => {
Expand All @@ -40,4 +38,7 @@ export async function installPlugins(app, inject, Vue) {
});

await Promise.all(installations);

// Order matters here. This is coming after the other plugins specifically so $cookies can be installed. i18n/init relies on prefs/get which relies on $cookies.
Vue.use(i18n, { store: app.store });
}
10 changes: 0 additions & 10 deletions shell/middleware/i18n.js
View file
Open in desktop

This file was deleted.

13 changes: 11 additions & 2 deletions shell/plugins/i18n.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -56,7 +56,10 @@ export function directiveSsr(vnode, binding) {
}

const i18n = {
name: 'i18n',
install: (Vue, _options) => {
_options?.store?.dispatch('i18n/init');

if (Vue.prototype.t && Vue.directive('t') && Vue.component('t')) {
// eslint-disable-next-line no-console
console.debug('Skipping i18n install. Directive, component, and option already exist.');
Expand Down Expand Up @@ -129,6 +132,12 @@ const i18n = {

export default i18n;

console.warn('The implicit addition of i18n options has been deprecated in Rancher Shell and will be removed in a future version. Make sure to invoke `Vue.use(i18n)` to maintain compatibility.');
// This is being done for backwards compatibility with our extensions that have written tests and didn't properly make use of Vue.use() when importing and mocking translations
// Example failing test https://github.com/rancher/dashboard/actions/runs/8927503474/job/24521022320?pr=10923
const isThisFileBeingExecutedInATest = process.env.NODE_ENV === 'test';

Vue.use(i18n);
if (isThisFileBeingExecutedInATest) {
// Go take a look at our jest.setup.js to see how we make use of Vue.use(i18n, ...)
console.warn('The implicit addition of i18n options has been deprecated in Rancher Shell and will be removed in a future version. Make sure to invoke `Vue.use(i18n)` to maintain compatibility.');
Vue.use(i18n);
}
1 change: 0 additions & 1 deletion shell/store/index.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -778,7 +778,6 @@ export const actions = {
}

res = await allHash(promises);
dispatch('i18n/init');
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

No point in having it here if we need it for every page and we're already making that call elsewhere.

const isMultiCluster = getters['isMultiCluster'];

// If the local cluster is a Harvester cluster and 'rancher-manager-support' is true, it means that the embedded Rancher is being used.
Expand Down
Loading