mirror of
https://github.com/lingble/chatwoot.git
synced 2025-11-01 19:48:08 +00:00
# Pull Request Template ## Description This PR will replace the usage of `conversation/labelMixin` with a composable Fixes https://linear.app/chatwoot/issue/CW-3439/rewrite-conversationlabelmixin-mixin-to-a-composable ## Type of change - [x] New feature (non-breaking change which adds functionality) ## How Has This Been Tested? **Test cases** 1. Add/remove labels from conversation sidebar 2. See labels are showing up dynamically 3. Check add/remove labels working fine with CMD bar 4. Check card labels in conversation card and SLA reports table. ## Checklist: - [x] My code follows the style guidelines of this project - [x] I have performed a self-review of my code - [x] 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
102 lines
2.8 KiB
JavaScript
102 lines
2.8 KiB
JavaScript
import { computed } from 'vue';
|
|
import { useStore, useStoreGetters } from 'dashboard/composables/store';
|
|
|
|
/**
|
|
* Composable for managing conversation labels
|
|
* @returns {Object} An object containing methods and computed properties for conversation labels
|
|
*/
|
|
export function useConversationLabels() {
|
|
const store = useStore();
|
|
const getters = useStoreGetters();
|
|
|
|
/**
|
|
* The currently selected chat
|
|
* @type {import('vue').ComputedRef<Object>}
|
|
*/
|
|
const currentChat = computed(() => getters.getSelectedChat.value);
|
|
|
|
/**
|
|
* The ID of the current conversation
|
|
* @type {import('vue').ComputedRef<number|null>}
|
|
*/
|
|
const conversationId = computed(() => currentChat.value?.id);
|
|
|
|
/**
|
|
* All labels available for the account
|
|
* @type {import('vue').ComputedRef<Array>}
|
|
*/
|
|
const accountLabels = computed(() => getters['labels/getLabels'].value);
|
|
|
|
/**
|
|
* Labels currently saved to the conversation
|
|
* @type {import('vue').ComputedRef<Array>}
|
|
*/
|
|
const savedLabels = computed(() => {
|
|
return store.getters['conversationLabels/getConversationLabels'](
|
|
conversationId.value
|
|
);
|
|
});
|
|
|
|
/**
|
|
* Labels currently active on the conversation
|
|
* @type {import('vue').ComputedRef<Array>}
|
|
*/
|
|
const activeLabels = computed(() =>
|
|
accountLabels.value.filter(({ title }) => savedLabels.value.includes(title))
|
|
);
|
|
|
|
/**
|
|
* Labels available but not active on the conversation
|
|
* @type {import('vue').ComputedRef<Array>}
|
|
*/
|
|
const inactiveLabels = computed(() =>
|
|
accountLabels.value.filter(
|
|
({ title }) => !savedLabels.value.includes(title)
|
|
)
|
|
);
|
|
|
|
/**
|
|
* Updates the labels for the current conversation
|
|
* @param {string[]} selectedLabels - Array of label titles to be set for the conversation
|
|
* @returns {Promise<void>}
|
|
*/
|
|
const onUpdateLabels = async selectedLabels => {
|
|
await store.dispatch('conversationLabels/update', {
|
|
conversationId: conversationId.value,
|
|
labels: selectedLabels,
|
|
});
|
|
};
|
|
|
|
/**
|
|
* Adds a label to the current conversation
|
|
* @param {Object} value - The label object to be added
|
|
* @param {string} value.title - The title of the label to be added
|
|
*/
|
|
const addLabelToConversation = value => {
|
|
const result = activeLabels.value.map(item => item.title);
|
|
result.push(value.title);
|
|
onUpdateLabels(result);
|
|
};
|
|
|
|
/**
|
|
* Removes a label from the current conversation
|
|
* @param {string} value - The title of the label to be removed
|
|
*/
|
|
const removeLabelFromConversation = value => {
|
|
const result = activeLabels.value
|
|
.map(label => label.title)
|
|
.filter(label => label !== value);
|
|
onUpdateLabels(result);
|
|
};
|
|
|
|
return {
|
|
accountLabels,
|
|
savedLabels,
|
|
activeLabels,
|
|
inactiveLabels,
|
|
addLabelToConversation,
|
|
removeLabelFromConversation,
|
|
onUpdateLabels,
|
|
};
|
|
}
|