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.7 KiB
JavaScript
71 lines
1.7 KiB
JavaScript
import { computed } from 'vue';
|
|
import { useI18n } from 'vue-i18n';
|
|
import {
|
|
ICON_APPEARANCE,
|
|
ICON_LIGHT_MODE,
|
|
ICON_DARK_MODE,
|
|
ICON_SYSTEM_MODE,
|
|
} from 'dashboard/helper/commandbar/icons';
|
|
import { LocalStorage } from 'shared/helpers/localStorage';
|
|
import { LOCAL_STORAGE_KEYS } from 'dashboard/constants/localStorage';
|
|
import { setColorTheme } from 'dashboard/helper/themeHelper.js';
|
|
|
|
const getThemeOptions = t => [
|
|
{
|
|
key: 'light',
|
|
label: t('COMMAND_BAR.COMMANDS.LIGHT_MODE'),
|
|
icon: ICON_LIGHT_MODE,
|
|
},
|
|
{
|
|
key: 'dark',
|
|
label: t('COMMAND_BAR.COMMANDS.DARK_MODE'),
|
|
icon: ICON_DARK_MODE,
|
|
},
|
|
{
|
|
key: 'auto',
|
|
label: t('COMMAND_BAR.COMMANDS.SYSTEM_MODE'),
|
|
icon: ICON_SYSTEM_MODE,
|
|
},
|
|
];
|
|
|
|
const setAppearance = theme => {
|
|
LocalStorage.set(LOCAL_STORAGE_KEYS.COLOR_SCHEME, theme);
|
|
const isOSOnDarkMode = window.matchMedia(
|
|
'(prefers-color-scheme: dark)'
|
|
).matches;
|
|
setColorTheme(isOSOnDarkMode);
|
|
};
|
|
|
|
export function useAppearanceHotKeys() {
|
|
const { t } = useI18n();
|
|
|
|
const themeOptions = computed(() => getThemeOptions(t));
|
|
|
|
const goToAppearanceHotKeys = computed(() => {
|
|
const options = themeOptions.value.map(theme => ({
|
|
id: theme.key,
|
|
title: theme.label,
|
|
parent: 'appearance_settings',
|
|
section: t('COMMAND_BAR.SECTIONS.APPEARANCE'),
|
|
icon: theme.icon,
|
|
handler: () => {
|
|
setAppearance(theme.key);
|
|
},
|
|
}));
|
|
return [
|
|
{
|
|
id: 'appearance_settings',
|
|
title: t('COMMAND_BAR.COMMANDS.CHANGE_APPEARANCE'),
|
|
section: t('COMMAND_BAR.SECTIONS.APPEARANCE'),
|
|
icon: ICON_APPEARANCE,
|
|
children: options.map(option => option.id),
|
|
},
|
|
...options,
|
|
];
|
|
});
|
|
|
|
return {
|
|
goToAppearanceHotKeys,
|
|
};
|
|
}
|