KumiSystems/Chatwoot
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

chore: Upgrade vue-i18n to 8.x (#1383)

Browse source 
Co-authored-by: Pranav Raj S <pranav@thoughtwoot.com>
This commit is contained in:
Muhsin Keloth 2020-12-11 22:38:36 -08:00 committed by GitHub
parent 7f2f984bea
commit f9bd447912
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
15 changed files with 75 additions and 38 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

1
app/controllers/api/v1/widget/base_controller.rb
View file

@ -3,7 +3,6 @@ class Api::V1::Widget::BaseController < ApplicationController
before_action :set_web_widget
before_action :set_contact
around_action :switch_locale_using_account_locale
private

3
app/javascript/dashboard/App.vue
View file

@ -8,7 +8,6 @@
</template>
<script>
import Vue from 'vue';
import { mapGetters } from 'vuex';
import WootSnackbarBox from './components/SnackbarContainer';
import { accountIdFromPathname } from './helper/URLHelper';
@ -34,7 +33,7 @@ export default {
methods: {
setLocale(locale) {
Vue.config.lang = locale;
this.$root.$i18n.locale = locale;
},
async initializeAccount() {

7
app/javascript/dashboard/components/layout/specs/AvailabilityStatus.spec.js
View file

@ -8,7 +8,11 @@ import i18n from 'dashboard/i18n';
const localVue = createLocalVue();
localVue.use(Vuex);
localVue.use(VueI18n);
localVue.locale('en', i18n.en);
const i18nConfig = new VueI18n({
locale: 'en',
messages: i18n,
});
describe('AvailabilityStatus', () => {
const currentUser = { availability_status: 'online' };
@ -40,6 +44,7 @@ describe('AvailabilityStatus', () => {
availabilityStatus = mount(AvailabilityStatus, {
store,
localVue,
i18n: i18nConfig,
});
});

9
app/javascript/dashboard/components/widgets/conversation/specs/MoreActions.spec.js
View file

@ -10,9 +10,14 @@ import MoreActions from '../MoreActions';
const localVue = createLocalVue();
localVue.use(Vuex);
localVue.use(VueI18n);
localVue.locale('en', i18n.en);
localVue.component('woot-button', Button);
const i18nConfig = new VueI18n({
locale: 'en',
messages: i18n,
});
describe('MoveActions', () => {
let currentChat = { id: 8, muted: false };
let state = null;
@ -55,7 +60,7 @@ describe('MoveActions', () => {
getters,
});
moreActions = mount(MoreActions, { store, localVue });
moreActions = mount(MoreActions, { store, localVue, i18n: i18nConfig });
});
it('opens the menu when user clicks "more"', async () => {

9
app/javascript/dashboard/routes/dashboard/settings/account/Index.vue
View file

@ -1,8 +1,8 @@
<template>
<div class="columns profile--settings ">
<div class="columns profile--settings">
<form v-if="!uiFlags.isFetchingItem" @submit.prevent="updateAccount">
<div class="small-12 row profile--settings--row">
<div class="columns small-3 ">
<div class="columns small-3">
<h4 class="block-title">
{{ $t('GENERAL_SETTINGS.FORM.GENERAL_SECTION.TITLE') }}
</h4>
@ -95,7 +95,6 @@
</template>
<script>
import Vue from 'vue';
import { required, minValue } from 'vuelidate/lib/validators';
import { mapGetters } from 'vuex';
import alertMixin from 'shared/mixins/alertMixin';
@ -170,7 +169,7 @@ export default {
auto_resolve_duration,
} = this.getAccount(this.accountId);
Vue.config.lang = locale;
this.$root.$i18n.locale = locale;
this.name = name;
this.locale = locale;
this.id = id;
@ -198,7 +197,7 @@ export default {
support_email: this.supportEmail,
auto_resolve_duration: this.autoResolveDuration,
});
Vue.config.lang = this.locale;
this.$root.$i18n.locale = this.locale;
this.showAlert(this.$t('GENERAL_SETTINGS.UPDATE.SUCCESS'));
} catch (error) {
this.showAlert(this.$t('GENERAL_SETTINGS.UPDATE.ERROR'));

7
app/javascript/packs/application.js
View file

@ -42,11 +42,11 @@ Vue.component('multiselect', Multiselect);
Vue.component('woot-switch', WootSwitch);
Vue.component('woot-wizard', WootWizard);
Object.keys(i18n).forEach(lang => {
Vue.locale(lang, i18n[lang]);
const i18nConfig = new VueI18n({
locale: 'en',
messages: i18n,
});
Vue.config.lang = 'en';
sync(store, router);
// load common helpers into js
commonHelpers();
@ -58,6 +58,7 @@ window.onload = () => {
window.WOOT = new Vue({
router,
store,
i18n: i18nConfig,
components: { App },
template: '<App/>',
}).$mount('#app');

7
app/javascript/packs/widget.js
View file

@ -9,9 +9,9 @@ import i18n from '../widget/i18n';
Vue.use(VueI18n);
Vue.use(Vuelidate);
Vue.config.lang = 'en';
Object.keys(i18n).forEach(lang => {
Vue.locale(lang, i18n[lang]);
const i18nConfig = new VueI18n({
locale: 'en',
messages: i18n,
});
// Event Bus
@ -22,6 +22,7 @@ Vue.config.productionTip = false;
window.onload = () => {
window.WOOT_WIDGET = new Vue({
store,
i18n: i18nConfig,
render: h => h(App),
}).$mount('#app');

3
app/javascript/widget/App.vue
View file

@ -16,7 +16,6 @@
</template>
<script>
import Vue from 'vue';
import { mapGetters, mapActions } from 'vuex';
import { setHeader } from 'widget/helpers/axios';
import { IFrameHelper } from 'widget/helpers/utils';
@ -91,7 +90,7 @@ export default {
setLocale(locale) {
const { enabledLanguages } = window.chatwootWebChannel;
if (enabledLanguages.some(lang => lang.iso_639_1_code === locale)) {
Vue.config.lang = locale;
this.$root.$i18n.locale = locale;
}
},
setPosition(position) {

19
app/javascript/widget/api/specs/endPoints.spec.js
View file

@ -1,14 +1,26 @@
import endPoints from '../endPoints';
jest.mock('vue', () => ({ config: { lang: 'ar' } }));
describe('#sendMessage', () => {
it('returns correct payload', () => {
const spy = jest.spyOn(global, 'Date').mockImplementation(() => ({
toString: () => 'mock date',
}));
const windowSpy = jest.spyOn(window, 'window', 'get');
windowSpy.mockImplementation(() => ({
WOOT_WIDGET: {
$root: {
$i18n: {
locale: 'ar',
},
},
},
location: {
search: '?param=1',
},
}));
expect(endPoints.sendMessage('hello')).toEqual({
url: `/api/v1/widget/messages?locale=ar`,
url: `/api/v1/widget/messages?param=1&locale=ar`,
params: {
message: {
content: 'hello',
@ -17,6 +29,7 @@ describe('#sendMessage', () => {
},
},
});
windowSpy.mockRestore();
spy.mockRestore();
});
});

3
app/javascript/widget/components/HeaderActions.vue
View file

@ -15,7 +15,6 @@
<script>
import { IFrameHelper } from 'widget/helpers/utils';
import { buildPopoutURL } from '../helpers/urlParamsHelper';
import Vue from 'vue';
export default {
name: 'HeaderActions',
@ -42,7 +41,7 @@ export default {
const popoutWindowURL = buildPopoutURL({
origin,
websiteToken,
locale: Vue.config.lang,
locale: this.$root.$i18n.locale,
conversationCookie: authToken,
});
const popoutWindow = window.open(

17
app/javascript/widget/helpers/specs/urlParamsHelper.spec.js
View file

@ -4,18 +4,23 @@ import {
buildPopoutURL,
} from '../urlParamsHelper';
jest.mock('vue', () => ({
config: {
lang: 'el',
},
}));
describe('#buildSearchParamsWithLocale', () => {
it('returns correct search params', () => {
let windowSpy = jest.spyOn(window, 'window', 'get');
windowSpy.mockImplementation(() => ({
WOOT_WIDGET: {
$root: {
$i18n: {
locale: 'el',
},
},
},
}));
expect(buildSearchParamsWithLocale('?test=1234')).toEqual(
'?test=1234&locale=el'
);
expect(buildSearchParamsWithLocale('')).toEqual('?locale=el');
windowSpy.mockRestore();
});
});

4
app/javascript/widget/helpers/urlParamsHelper.js
View file

@ -1,7 +1,5 @@
import Vue from 'vue';
export const buildSearchParamsWithLocale = search => {
const locale = Vue.config.lang;
const locale = window.WOOT_WIDGET.$root.$i18n.locale;
if (search) {
search = `${search}&locale=${locale}`;
} else {

14
app/javascript/widget/store/modules/specs/conversation/actions.spec.js
View file

@ -49,8 +49,22 @@ describe('#actions', () => {
const mockDate = new Date(1466424490000);
getUuid.mockImplementationOnce(() => '1111');
const spy = jest.spyOn(global, 'Date').mockImplementation(() => mockDate);
const windowSpy = jest.spyOn(window, 'window', 'get');
windowSpy.mockImplementation(() => ({
WOOT_WIDGET: {
$root: {
$i18n: {
locale: 'ar',
},
},
},
location: {
search: '?param=1',
},
}));
actions.sendMessage({ commit }, { content: 'hello' });
spy.mockRestore();
windowSpy.mockRestore();
expect(commit).toBeCalledWith('pushMessageToConversation', {
id: '1111',
content: 'hello',

2
package.json
View file

@ -40,7 +40,7 @@
"vue-chartjs": "^3.4.2",
"vue-clickaway": "~2.1.0",
"vue-color": "^2.7.1",
"vue-i18n": "~5.0.3",
"vue-i18n": "^8.22.1",
"vue-loader": "^15.7.0",
"vue-multiselect": "~2.1.6",
"vue-router": "~2.2.0",

8
yarn.lock
View file

@ -11049,10 +11049,10 @@ vue-hot-reload-api@^2.3.0:
resolved "https://registry.yarnpkg.com/vue-hot-reload-api/-/vue-hot-reload-api-2.3.4.tgz#532955cc1eb208a3d990b3a9f9a70574657e08f2"
integrity sha512-BXq3jwIagosjgNVae6tkHzzIk6a8MHFtzAdwhnV5VlvPTFxDCvIttgSiHWjdGoTJvXtmRu5HacExfdarRcFhog==
vue-i18n@~5.0.3:
version "5.0.3"
resolved "https://registry.yarnpkg.com/vue-i18n/-/vue-i18n-5.0.3.tgz#b6d96cc832604237e6139de471e0d4c820aedbed"
integrity sha1-ttlsyDJgQjfmE53kceDUyCCu2+0=
vue-i18n@^8.22.1:
version "8.22.1"
resolved "https://registry.yarnpkg.com/vue-i18n/-/vue-i18n-8.22.1.tgz#b9dd098a17e1f5adb91bdf9611f0385310da7cb1"
integrity sha512-JNgiEJ5a8YPfk5y2lKyfOAGLmkpAVfhaUi+T4wGpSppRYZ3XSyawSDDketY5KV2CsAiBLAGEIO6jO+0l2hQubg==
vue-jest@^3.0.5:
version "3.0.5"