Copy the Chatwoot (v4.14.0) frontend runnable subset into frontend/ for customization: - app/javascript/ (Vue SPA: dashboard, widget, sdk, portal, superadmin) - app/views/ (ERB templates for vite-plugin-ruby entrypoint resolution) - app/helpers/, app/assets/ (Rails view helpers, static assets) - enterprise/ (Enterprise edition frontend overlay) - config/vite.json, vite.config.ts, bin/vite (Vite-Rails toolchain) - package.json, pnpm-lock.yaml, tailwind/postcss/eslint configs - Gemfile, Gemfile.lock (vite_rails gem for bin/vite binstub) Excluded Rails backend: controllers, models, services, jobs, mailers, policies, db, lib, spec, public, node_modules. Update references to the new frontend location: - .gitignore: exclude frontend build artifacts (node_modules, tmp, packs), keep frontend/bin/ and frontend/vendor/ via negation - backend/scripts/parity_frontend_smoke.sh: CHATWOOT_DIR default reference/chatwoot -> ../frontend - backend/scripts/parity_frontend_browser_smoke.mjs: same default update - AGENTS.md: add frontend section with Rails/Vite coupling notes - README: architecture tree includes frontend/
167 lines
4.4 KiB
JavaScript
167 lines
4.4 KiB
JavaScript
import { computed } from 'vue';
|
|
import { useMapGetter } from 'dashboard/composables/store';
|
|
import { useCamelCase } from 'dashboard/composables/useTransformKeys';
|
|
import {
|
|
INBOX_TYPES,
|
|
isVoiceCallEnabled,
|
|
getVoiceCallProvider,
|
|
} from 'dashboard/helper/inbox';
|
|
|
|
export const INBOX_FEATURES = {
|
|
REPLY_TO: 'replyTo',
|
|
REPLY_TO_OUTGOING: 'replyToOutgoing',
|
|
};
|
|
|
|
// This is a single source of truth for inbox features
|
|
// This is used to check if a feature is available for a particular inbox or not
|
|
export const INBOX_FEATURE_MAP = {
|
|
[INBOX_FEATURES.REPLY_TO]: [
|
|
INBOX_TYPES.FB,
|
|
INBOX_TYPES.WEB,
|
|
INBOX_TYPES.TWITTER,
|
|
INBOX_TYPES.WHATSAPP,
|
|
INBOX_TYPES.TELEGRAM,
|
|
INBOX_TYPES.TIKTOK,
|
|
INBOX_TYPES.API,
|
|
],
|
|
[INBOX_FEATURES.REPLY_TO_OUTGOING]: [
|
|
INBOX_TYPES.WEB,
|
|
INBOX_TYPES.TWITTER,
|
|
INBOX_TYPES.WHATSAPP,
|
|
INBOX_TYPES.TELEGRAM,
|
|
INBOX_TYPES.TIKTOK,
|
|
INBOX_TYPES.API,
|
|
],
|
|
};
|
|
|
|
/**
|
|
* Composable for handling inbox-related functionality
|
|
* @param {string|null} inboxId - Optional inbox ID. If not provided, uses current chat's inbox
|
|
* @returns {Object} An object containing inbox type checking functions
|
|
*/
|
|
export const useInbox = (inboxId = null) => {
|
|
const currentChat = useMapGetter('getSelectedChat');
|
|
const inboxGetter = useMapGetter('inboxes/getInboxById');
|
|
|
|
const inbox = computed(() => {
|
|
const targetInboxId = inboxId || currentChat.value?.inbox_id;
|
|
|
|
if (!targetInboxId) return null;
|
|
|
|
return useCamelCase(inboxGetter.value(targetInboxId), { deep: true });
|
|
});
|
|
|
|
const channelType = computed(() => {
|
|
return inbox.value?.channelType;
|
|
});
|
|
|
|
const isAPIInbox = computed(() => {
|
|
return channelType.value === INBOX_TYPES.API;
|
|
});
|
|
|
|
const isAFacebookInbox = computed(() => {
|
|
return channelType.value === INBOX_TYPES.FB;
|
|
});
|
|
|
|
const isAWebWidgetInbox = computed(() => {
|
|
return channelType.value === INBOX_TYPES.WEB;
|
|
});
|
|
|
|
const isATwilioChannel = computed(() => {
|
|
return channelType.value === INBOX_TYPES.TWILIO;
|
|
});
|
|
|
|
const isALineChannel = computed(() => {
|
|
return channelType.value === INBOX_TYPES.LINE;
|
|
});
|
|
|
|
const isAnEmailChannel = computed(() => {
|
|
return channelType.value === INBOX_TYPES.EMAIL;
|
|
});
|
|
|
|
const isATelegramChannel = computed(() => {
|
|
return channelType.value === INBOX_TYPES.TELEGRAM;
|
|
});
|
|
|
|
const whatsAppAPIProvider = computed(() => {
|
|
return inbox.value?.provider || '';
|
|
});
|
|
|
|
const isAMicrosoftInbox = computed(() => {
|
|
return isAnEmailChannel.value && inbox.value?.provider === 'microsoft';
|
|
});
|
|
|
|
const isAGoogleInbox = computed(() => {
|
|
return isAnEmailChannel.value && inbox.value?.provider === 'google';
|
|
});
|
|
|
|
const isATwilioSMSChannel = computed(() => {
|
|
const { medium: medium = '' } = inbox.value || {};
|
|
return isATwilioChannel.value && medium === 'sms';
|
|
});
|
|
|
|
const isASmsInbox = computed(() => {
|
|
return channelType.value === INBOX_TYPES.SMS || isATwilioSMSChannel.value;
|
|
});
|
|
|
|
const isATwilioWhatsAppChannel = computed(() => {
|
|
const { medium: medium = '' } = inbox.value || {};
|
|
return isATwilioChannel.value && medium === 'whatsapp';
|
|
});
|
|
|
|
const isAWhatsAppCloudChannel = computed(() => {
|
|
return (
|
|
channelType.value === INBOX_TYPES.WHATSAPP &&
|
|
whatsAppAPIProvider.value === 'whatsapp_cloud'
|
|
);
|
|
});
|
|
|
|
const is360DialogWhatsAppChannel = computed(() => {
|
|
return (
|
|
channelType.value === INBOX_TYPES.WHATSAPP &&
|
|
whatsAppAPIProvider.value === 'default'
|
|
);
|
|
});
|
|
|
|
const isAWhatsAppChannel = computed(() => {
|
|
return (
|
|
channelType.value === INBOX_TYPES.WHATSAPP ||
|
|
isATwilioWhatsAppChannel.value
|
|
);
|
|
});
|
|
|
|
const isAnInstagramChannel = computed(() => {
|
|
return channelType.value === INBOX_TYPES.INSTAGRAM;
|
|
});
|
|
|
|
const isATiktokChannel = computed(() => {
|
|
return channelType.value === INBOX_TYPES.TIKTOK;
|
|
});
|
|
|
|
const voiceCallEnabled = computed(() => isVoiceCallEnabled(inbox.value));
|
|
|
|
const voiceCallProvider = computed(() => getVoiceCallProvider(inbox.value));
|
|
|
|
return {
|
|
inbox,
|
|
isAFacebookInbox,
|
|
isALineChannel,
|
|
isAPIInbox,
|
|
isASmsInbox,
|
|
isATelegramChannel,
|
|
isATwilioChannel,
|
|
isAWebWidgetInbox,
|
|
isAWhatsAppChannel,
|
|
isAMicrosoftInbox,
|
|
isAGoogleInbox,
|
|
isATwilioWhatsAppChannel,
|
|
isAWhatsAppCloudChannel,
|
|
is360DialogWhatsAppChannel,
|
|
isAnEmailChannel,
|
|
isAnInstagramChannel,
|
|
isATiktokChannel,
|
|
voiceCallEnabled,
|
|
voiceCallProvider,
|
|
};
|
|
};
|