mirror of
https://github.com/lingble/chatwoot.git
synced 2025-10-29 10:12:34 +00:00
6d3ecfe3c1
This PR has the initial version of the new sidebar targeted for the next major redesign of the app. This PR includes the following changes - Components in the `layouts-next` and `base-next` directories in `dashboard/components` - Two generic components `Avatar` and `Icon` - `SidebarGroup` component to manage expandable sidebar groups with nested navigation items. This includes handling active states, transitions, and permissions. - `SidebarGroupHeader` component to display the header of each navigation group with optional icons and active state indication. - `SidebarGroupLeaf` component for individual navigation items within a group, supporting icons and active state. - `SidebarGroupSeparator` component to visually separate nested navigation items. (They look a lot like header) - `SidebarGroupEmptyLeaf` component to render empty state of any navigation groups. ---- Co-authored-by: Pranav <pranav@chatwoot.com> Co-authored-by: Pranav <pranavrajs@gmail.com>
112 lines
3.6 KiB
TypeScript
112 lines
3.6 KiB
TypeScript
/// <reference types="vitest" />
|
|
|
|
/**
|
|
What's going on with library mode?
|
|
|
|
Glad you asked, here's a quick rundown:
|
|
|
|
1. vite-plugin-ruby will automatically bring all the entrypoints like dashbord and widget as input to vite.
|
|
2. vite needs to be in library mode to build the SDK as a single file. (UMD) format and set `inlineDynamicImports` to true.
|
|
3. But when setting `inlineDynamicImports` to true, vite will not be able to handle mutliple entrypoints.
|
|
|
|
This puts us in a deadlock, now there are two ways around this, either add another separate build pipeline to
|
|
the app using vanilla rollup or rspack or something. The second option is to remove sdk building from the main pipeline
|
|
and build it separately using Vite itself, toggled by an ENV variable.
|
|
|
|
`BUILD_MODE=library bin/vite build` should build only the SDK and save it to `public/packs/js/sdk.js`
|
|
`bin/vite build` will build the rest of the app as usual. But exclude the SDK.
|
|
|
|
We need to edit the `asset:precompile` rake task to include the SDK in the precompile list.
|
|
*/
|
|
import { defineConfig } from 'vite';
|
|
import ruby from 'vite-plugin-ruby';
|
|
import path from 'path';
|
|
import vue from '@vitejs/plugin-vue';
|
|
|
|
const isLibraryMode = process.env.BUILD_MODE === 'library';
|
|
const isTestMode = process.env.TEST === 'true';
|
|
|
|
const vueOptions = {
|
|
template: {
|
|
compilerOptions: {
|
|
isCustomElement: tag => ['ninja-keys'].includes(tag),
|
|
},
|
|
},
|
|
};
|
|
|
|
let plugins = [ruby(), vue(vueOptions)];
|
|
|
|
if (isLibraryMode) {
|
|
plugins = [];
|
|
} else if (isTestMode) {
|
|
plugins = [vue(vueOptions)];
|
|
}
|
|
|
|
export default defineConfig({
|
|
plugins: plugins,
|
|
build: {
|
|
rollupOptions: {
|
|
output: {
|
|
// [NOTE] when not in library mode, no new keys will be addedd or overwritten
|
|
// setting dir: isLibraryMode ? 'public/packs' : undefined will not work
|
|
...(isLibraryMode
|
|
? {
|
|
dir: 'public/packs',
|
|
entryFileNames: chunkInfo => {
|
|
if (chunkInfo.name === 'sdk') {
|
|
return 'js/sdk.js';
|
|
}
|
|
return '[name].js';
|
|
},
|
|
}
|
|
: {}),
|
|
inlineDynamicImports: isLibraryMode, // Disable code-splitting for SDK
|
|
},
|
|
},
|
|
lib: isLibraryMode
|
|
? {
|
|
entry: path.resolve(__dirname, './app/javascript/entrypoints/sdk.js'),
|
|
formats: ['iife'], // IIFE format for single file
|
|
name: 'sdk',
|
|
}
|
|
: undefined,
|
|
},
|
|
resolve: {
|
|
alias: {
|
|
vue: 'vue/dist/vue.esm-bundler.js',
|
|
components: path.resolve('./app/javascript/dashboard/components'),
|
|
next: path.resolve('./app/javascript/dashboard/components-next'),
|
|
v3: path.resolve('./app/javascript/v3'),
|
|
dashboard: path.resolve('./app/javascript/dashboard'),
|
|
helpers: path.resolve('./app/javascript/shared/helpers'),
|
|
shared: path.resolve('./app/javascript/shared'),
|
|
survey: path.resolve('./app/javascript/survey'),
|
|
widget: path.resolve('./app/javascript/widget'),
|
|
assets: path.resolve('./app/javascript/dashboard/assets'),
|
|
},
|
|
},
|
|
test: {
|
|
environment: 'jsdom',
|
|
include: ['app/**/*.{test,spec}.?(c|m)[jt]s?(x)'],
|
|
coverage: {
|
|
reporter: ['lcov', 'text'],
|
|
include: ['app/**/*.js', 'app/**/*.vue'],
|
|
exclude: [
|
|
'app/**/*.@(spec|stories|routes).js',
|
|
'**/specs/**/*',
|
|
'**/i18n/**/*',
|
|
],
|
|
},
|
|
globals: true,
|
|
outputFile: 'coverage/sonar-report.xml',
|
|
server: {
|
|
deps: {
|
|
inline: ['tinykeys', '@material/mwc-icon'],
|
|
},
|
|
},
|
|
setupFiles: ['fake-indexeddb/auto', 'vitest.setup.js'],
|
|
mockReset: true,
|
|
clearMocks: true,
|
|
},
|
|
});
|