feat: Replace alertMixin usage with useAlert (#9793)
# Pull Request Template ## Description This PR will replace the usage of `alertMixin` from the code base with the `useAlert` composable. Fixes https://linear.app/chatwoot/issue/CW-3462/replace-alertmixin-usage-with-usealert ## Type of change - [x] Breaking change (fix or feature that would cause existing functionality not to work as expected) ## How Has This Been Tested? Please refer this issue description https://linear.app/chatwoot/issue/CW-3462/replace-alertmixin-usage-with-usealert ## Checklist: - [x] My code follows the style guidelines of this project - [x] I have performed a self-review of my code - [ ] I have commented on my code, particularly in hard-to-understand areas - [ ] I have made corresponding changes to the documentation - [x] My changes generate no new warnings - [x] I have added tests that prove my fix is effective or that my feature works - [x] New and existing unit tests pass locally with my changes - [ ] Any dependent changes have been merged and published in downstream modules --------- Co-authored-by: Sojan Jose <sojan@pepalo.com>
This commit is contained in:
@@ -1,6 +1,10 @@
|
||||
import { getCurrentInstance } from 'vue';
|
||||
import { emitter } from 'shared/helpers/mitt';
|
||||
|
||||
/**
|
||||
* Custom hook to track events
|
||||
* @returns {Function} The track function
|
||||
*/
|
||||
export const useTrack = () => {
|
||||
const vm = getCurrentInstance();
|
||||
if (!vm) throw new Error('must be called in setup');
|
||||
@@ -8,6 +12,11 @@ export const useTrack = () => {
|
||||
return vm.proxy.$track;
|
||||
};
|
||||
|
||||
export function useAlert(message, action) {
|
||||
emitter.emit('newToastMessage', message, action);
|
||||
}
|
||||
/**
|
||||
* Emits a toast message event using a global emitter.
|
||||
* @param {string} message - The message to be displayed in the toast.
|
||||
* @param {Object|null} action - Optional callback function or object to execute.
|
||||
*/
|
||||
export const useAlert = (message, action = null) => {
|
||||
emitter.emit('newToastMessage', { message, action });
|
||||
};
|
||||
|
||||
51
app/javascript/dashboard/composables/spec/index.spec.js
Normal file
51
app/javascript/dashboard/composables/spec/index.spec.js
Normal file
@@ -0,0 +1,51 @@
|
||||
import { getCurrentInstance } from 'vue';
|
||||
import { emitter } from 'shared/helpers/mitt';
|
||||
import { useTrack, useAlert } from '../index';
|
||||
|
||||
vi.mock('vue', () => ({
|
||||
getCurrentInstance: vi.fn(),
|
||||
}));
|
||||
vi.mock('shared/helpers/mitt', () => ({
|
||||
emitter: {
|
||||
emit: vi.fn(),
|
||||
},
|
||||
}));
|
||||
|
||||
describe('useTrack', () => {
|
||||
it('should return $track from the current instance proxy', () => {
|
||||
const mockProxy = { $track: vi.fn() };
|
||||
getCurrentInstance.mockReturnValue({ proxy: mockProxy });
|
||||
const track = useTrack();
|
||||
expect(track).toBe(mockProxy.$track);
|
||||
});
|
||||
|
||||
it('should throw an error if called outside of setup', () => {
|
||||
getCurrentInstance.mockReturnValue(null);
|
||||
expect(useTrack).toThrowError('must be called in setup');
|
||||
});
|
||||
});
|
||||
|
||||
describe('useAlert', () => {
|
||||
it('should emit a newToastMessage event with the provided message and action', () => {
|
||||
const message = 'Toast message';
|
||||
const action = {
|
||||
type: 'link',
|
||||
to: '/app/accounts/1/conversations/1',
|
||||
message: 'Navigate',
|
||||
};
|
||||
useAlert(message, action);
|
||||
expect(emitter.emit).toHaveBeenCalledWith('newToastMessage', {
|
||||
message,
|
||||
action,
|
||||
});
|
||||
});
|
||||
|
||||
it('should emit a newToastMessage event with the provided message and no action if action is null', () => {
|
||||
const message = 'Toast message';
|
||||
useAlert(message);
|
||||
expect(emitter.emit).toHaveBeenCalledWith('newToastMessage', {
|
||||
message,
|
||||
action: null,
|
||||
});
|
||||
});
|
||||
});
|
||||
52
app/javascript/dashboard/composables/spec/useAdmin.spec.js
Normal file
52
app/javascript/dashboard/composables/spec/useAdmin.spec.js
Normal file
@@ -0,0 +1,52 @@
|
||||
import { ref } from 'vue';
|
||||
import { useAdmin } from '../useAdmin';
|
||||
import { useStoreGetters } from 'dashboard/composables/store';
|
||||
|
||||
vi.mock('dashboard/composables/store');
|
||||
|
||||
describe('useAdmin', () => {
|
||||
it('returns true if the current user is an administrator', () => {
|
||||
useStoreGetters.mockReturnValue({
|
||||
getCurrentRole: ref('administrator'),
|
||||
});
|
||||
|
||||
const { isAdmin } = useAdmin();
|
||||
expect(isAdmin.value).toBe(true);
|
||||
});
|
||||
|
||||
it('returns false if the current user is not an administrator', () => {
|
||||
useStoreGetters.mockReturnValue({
|
||||
getCurrentRole: ref('user'),
|
||||
});
|
||||
|
||||
const { isAdmin } = useAdmin();
|
||||
expect(isAdmin.value).toBe(false);
|
||||
});
|
||||
|
||||
it('returns false if the current user role is null', () => {
|
||||
useStoreGetters.mockReturnValue({
|
||||
getCurrentRole: ref(null),
|
||||
});
|
||||
|
||||
const { isAdmin } = useAdmin();
|
||||
expect(isAdmin.value).toBe(false);
|
||||
});
|
||||
|
||||
it('returns false if the current user role is undefined', () => {
|
||||
useStoreGetters.mockReturnValue({
|
||||
getCurrentRole: ref(undefined),
|
||||
});
|
||||
|
||||
const { isAdmin } = useAdmin();
|
||||
expect(isAdmin.value).toBe(false);
|
||||
});
|
||||
|
||||
it('returns false if the current user role is an empty string', () => {
|
||||
useStoreGetters.mockReturnValue({
|
||||
getCurrentRole: ref(''),
|
||||
});
|
||||
|
||||
const { isAdmin } = useAdmin();
|
||||
expect(isAdmin.value).toBe(false);
|
||||
});
|
||||
});
|
||||
17
app/javascript/dashboard/composables/useAdmin.js
Normal file
17
app/javascript/dashboard/composables/useAdmin.js
Normal file
@@ -0,0 +1,17 @@
|
||||
import { computed } from 'vue';
|
||||
import { useStoreGetters } from 'dashboard/composables/store';
|
||||
|
||||
/**
|
||||
* Composable to determine if the current user is an administrator.
|
||||
* @returns {Boolean} - True if the current user is an administrator, false otherwise.
|
||||
*/
|
||||
export function useAdmin() {
|
||||
const getters = useStoreGetters();
|
||||
|
||||
const currentUserRole = computed(() => getters.getCurrentRole.value);
|
||||
const isAdmin = computed(() => currentUserRole.value === 'administrator');
|
||||
|
||||
return {
|
||||
isAdmin,
|
||||
};
|
||||
}
|
||||
Reference in New Issue
Block a user