mirror of
				https://github.com/lingble/chatwoot.git
				synced 2025-10-30 02:32:29 +00:00 
			
		
		
		
	 6d3ecfe3c1
			
		
	
	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,
 | |
|   },
 | |
| });
 |