rogee
321c61aaae
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/
71 lines
1.9 KiB
Vue
71 lines
1.9 KiB
Vue
<script setup>
|
|
import { computed } from 'vue';
|
|
import ContactPanel from 'dashboard/routes/dashboard/conversation/ContactPanel.vue';
|
|
import { useUISettings } from 'dashboard/composables/useUISettings';
|
|
import { useWindowSize } from '@vueuse/core';
|
|
import { vOnClickOutside } from '@vueuse/components';
|
|
import wootConstants from 'dashboard/constants/globals';
|
|
|
|
defineProps({
|
|
currentChat: {
|
|
required: true,
|
|
type: Object,
|
|
},
|
|
});
|
|
|
|
const { uiSettings, updateUISettings } = useUISettings();
|
|
const { width: windowWidth } = useWindowSize();
|
|
|
|
const activeTab = computed(() => {
|
|
const { is_contact_sidebar_open: isContactSidebarOpen } = uiSettings.value;
|
|
|
|
if (isContactSidebarOpen) {
|
|
return 0;
|
|
}
|
|
return null;
|
|
});
|
|
|
|
const isSmallScreen = computed(
|
|
() => windowWidth.value < wootConstants.SMALL_SCREEN_BREAKPOINT
|
|
);
|
|
|
|
const closeContactPanel = () => {
|
|
if (isSmallScreen.value && uiSettings.value?.is_contact_sidebar_open) {
|
|
updateUISettings({
|
|
is_contact_sidebar_open: false,
|
|
is_copilot_panel_open: false,
|
|
});
|
|
}
|
|
};
|
|
</script>
|
|
|
|
<template>
|
|
<div
|
|
v-on-click-outside="[
|
|
() => closeContactPanel(),
|
|
{
|
|
ignore: [
|
|
'dialog.ProseMirror-prompt-backdrop',
|
|
'[data-popover-content]',
|
|
'[data-popover-backdrop]',
|
|
],
|
|
},
|
|
]"
|
|
class="bg-n-surface-2 h-full overflow-hidden flex flex-col fixed top-0 z-40 w-full max-w-sm transition-transform duration-300 ease-in-out ltr:right-0 rtl:left-0 md:static md:w-[320px] md:min-w-[320px] ltr:border-l rtl:border-r border-n-weak 2xl:min-w-[360px] 2xl:w-[360px] shadow-lg md:shadow-none"
|
|
:class="[
|
|
{
|
|
'md:flex': activeTab === 0,
|
|
'md:hidden': activeTab !== 0,
|
|
},
|
|
]"
|
|
>
|
|
<div class="flex flex-1 overflow-auto">
|
|
<ContactPanel
|
|
v-show="activeTab === 0"
|
|
:conversation-id="currentChat.id"
|
|
:inbox-id="currentChat.inbox_id"
|
|
/>
|
|
</div>
|
|
</div>
|
|
</template>
|