Charles Bochet
3bfdc2c83f
## Summary
Continues the Emotion → Linaria migration (PR 4-6 from the [migration
plan](docs/emotion-to-linaria-migration-plan.md)). Migrates **311
files** across four module groups:
| Module | Files |
|---|---|
| command-menu | 53 |
| workflow | 84 |
| page-layout | 84 |
| UI (partial - first ~80 files) | ~80 |
| twenty-ui (TEXT_INPUT_STYLE) | 1 |
| misc (hooks, keyboard-shortcut-menu, file-upload) | ~9 |
### Migration patterns applied
- `import styled from '@emotion/styled'` → `import { styled } from
'@linaria/react'`
- `import { useTheme } from '@emotion/react'` → `import { useContext }
from 'react'` + `import { ThemeContext } from 'twenty-ui/theme'`
- `${({ theme }) => theme.X.Y.Z}` → `${themeCssVariables.X.Y.Z}` (static
CSS variables)
- `theme.spacing(N)` → `themeCssVariables.spacing[N]`
- `styled(motion.div)` → `motion.create(StyledBase)` (11 components)
- `styled(Component)<TypeParams>` → wrapper div approach for non-HTML
elements
- Multi-declaration interpolations split into one CSS property per
interpolation
- Interpolation return types fixed (`&&` → ternary `? : ''`)
- `TEXT_INPUT_STYLE` converted from function to static string constant
(backward compatible)
- Emotion `<Global>` replaced with `useEffect` style injection
- Complex runtime-dependent styles use CSS custom properties via
`style={}` prop
### After this PR
- **Remaining files**: ~400 (object-record: ~160, settings: ~200, UI:
~44)
- **No breaking changes**: CSS variables resolve identically to the
previous Emotion theme values
814 lines
32 KiB
TypeScript
814 lines
32 KiB
TypeScript
/* eslint-disable no-console */
|
|
import { lingui } from '@lingui/vite-plugin';
|
|
import { isNonEmptyString } from '@sniptt/guards';
|
|
import react from '@vitejs/plugin-react-swc';
|
|
import wyw from '@wyw-in-js/vite';
|
|
import fs from 'fs';
|
|
import path from 'path';
|
|
import { visualizer } from 'rollup-plugin-visualizer';
|
|
import {
|
|
defineConfig,
|
|
loadEnv,
|
|
type PluginOption,
|
|
searchForWorkspaceRoot,
|
|
} from 'vite';
|
|
import checker from 'vite-plugin-checker';
|
|
import svgr from 'vite-plugin-svgr';
|
|
import tsconfigPaths from 'vite-tsconfig-paths';
|
|
type Checkers = Parameters<typeof checker>[0];
|
|
|
|
export default defineConfig(({ command, mode }) => {
|
|
const env = loadEnv(mode, __dirname, '');
|
|
|
|
const {
|
|
REACT_APP_SERVER_BASE_URL,
|
|
VITE_BUILD_SOURCEMAP,
|
|
VITE_DISABLE_TYPESCRIPT_CHECKER,
|
|
VITE_HOST,
|
|
SSL_CERT_PATH,
|
|
SSL_KEY_PATH,
|
|
REACT_APP_PORT,
|
|
IS_DEBUG_MODE,
|
|
} = env;
|
|
|
|
const port = isNonEmptyString(REACT_APP_PORT)
|
|
? parseInt(REACT_APP_PORT)
|
|
: 3001;
|
|
|
|
const isBuildCommand = command === 'build';
|
|
|
|
const tsConfigPath = isBuildCommand
|
|
? path.resolve(__dirname, './tsconfig.build.json')
|
|
: path.resolve(__dirname, './tsconfig.json');
|
|
|
|
const CHUNK_SIZE_WARNING_LIMIT = 1024 * 1024; // 1MB
|
|
// Please don't increase this limit for main index chunk
|
|
// If it gets too big then find modules in the code base
|
|
// that can be loaded lazily, there are more!
|
|
const MAIN_CHUNK_SIZE_LIMIT = 6.8 * 1024 * 1024; // 6.8MB for main index chunk
|
|
const OTHER_CHUNK_SIZE_LIMIT = 5 * 1024 * 1024; // 5MB for other chunks
|
|
|
|
const checkers: Checkers = {
|
|
overlay: false,
|
|
};
|
|
|
|
if (VITE_DISABLE_TYPESCRIPT_CHECKER === 'true') {
|
|
console.log(
|
|
`VITE_DISABLE_TYPESCRIPT_CHECKER: ${VITE_DISABLE_TYPESCRIPT_CHECKER}`,
|
|
);
|
|
}
|
|
|
|
if (VITE_BUILD_SOURCEMAP === 'true') {
|
|
console.log(`VITE_BUILD_SOURCEMAP: ${VITE_BUILD_SOURCEMAP}`);
|
|
}
|
|
|
|
if (VITE_DISABLE_TYPESCRIPT_CHECKER !== 'true') {
|
|
checkers['typescript'] = {
|
|
tsconfigPath: tsConfigPath,
|
|
};
|
|
}
|
|
|
|
return {
|
|
root: __dirname,
|
|
cacheDir: '../../node_modules/.vite/packages/twenty-front',
|
|
|
|
server: {
|
|
port: port,
|
|
...(VITE_HOST ? { host: VITE_HOST } : {}),
|
|
...(SSL_KEY_PATH && SSL_CERT_PATH
|
|
? {
|
|
protocol: 'https',
|
|
https: {
|
|
key: fs.readFileSync(env.SSL_KEY_PATH),
|
|
cert: fs.readFileSync(env.SSL_CERT_PATH),
|
|
},
|
|
}
|
|
: {
|
|
protocol: 'http',
|
|
}),
|
|
fs: {
|
|
allow: [
|
|
searchForWorkspaceRoot(process.cwd()),
|
|
'**/@blocknote/core/src/fonts/**',
|
|
],
|
|
},
|
|
},
|
|
|
|
plugins: [
|
|
react({
|
|
jsxImportSource: '@emotion/react',
|
|
plugins: [['@lingui/swc-plugin', {}]],
|
|
}),
|
|
tsconfigPaths({
|
|
root: __dirname,
|
|
projects: ['tsconfig.json'],
|
|
}),
|
|
svgr(),
|
|
lingui({
|
|
configPath: path.resolve(__dirname, './lingui.config.ts'),
|
|
}),
|
|
checker(checkers),
|
|
{
|
|
...wyw({
|
|
include: [
|
|
'**/twenty-ui/src/**/*.{ts,tsx}',
|
|
'**/AdvancedTextEditor.tsx',
|
|
'**/FileUploadProvider.tsx',
|
|
'**/MultiSelectControl.tsx',
|
|
'**/FormNumberFieldInput.tsx',
|
|
'**/FormUuidFieldInput.tsx',
|
|
'**/KeyboardShortcutMenuStyles.tsx',
|
|
'**/BubbleMenuIconButton.tsx',
|
|
'**/TextBubbleMenu.tsx',
|
|
'**/TurnIntoBlockDropdown.tsx',
|
|
'**/WorkflowAttachmentChip.tsx',
|
|
'**/WorkflowSendEmailAttachments.tsx',
|
|
'**/ResizableImageView.tsx',
|
|
'**/SettingsBillingSubscriptionInfo.tsx',
|
|
'**/SubscriptionBenefit.tsx',
|
|
'**/SubscriptionInfoContainer.tsx',
|
|
'**/SubscriptionPrice.tsx',
|
|
'**/TrialCard.tsx',
|
|
'**/MeteredPriceSelector.tsx',
|
|
'**/PlansTags.tsx',
|
|
'**/SettingsBillingLabelValueItem.tsx',
|
|
'**/SubscriptionInfoRowContainer.tsx',
|
|
'**/FileBlock.tsx',
|
|
'**/MentionInlineContent.tsx',
|
|
'**/BlockEditor.tsx',
|
|
'**/CustomMentionMenu.tsx',
|
|
'**/CustomSideMenu.tsx',
|
|
'**/CustomSideMenuOptions.tsx',
|
|
'**/CustomSlashMenu.tsx',
|
|
'**/CurrentWorkspaceMemberOrphanFavorites.tsx',
|
|
'**/FavoritesBackButton.tsx',
|
|
'**/FavoritesDroppable.tsx',
|
|
'**/FavoritesSkeletonLoader.tsx',
|
|
'**/FavoriteFolderPickerList.tsx',
|
|
'**/InformationBanner.tsx',
|
|
'**/InformationBannerWrapper.tsx',
|
|
'**/InformationBannerDeletedRecord.tsx',
|
|
'**/AddToNavigationDragHandle.tsx',
|
|
'**/CurrentWorkspaceMemberOrphanNavigationMenuItems.tsx',
|
|
'**/NavigationItemDropTarget.tsx',
|
|
'**/NavigationMenuEditModeBar.tsx',
|
|
'**/NavigationMenuItemBackButton.tsx',
|
|
'**/NavigationMenuItemDroppable.tsx',
|
|
'**/NavigationMenuItemIconContainer.tsx',
|
|
'**/NavigationMenuItemSkeletonLoader.tsx',
|
|
'**/ObjectIconWithViewOverlay.tsx',
|
|
'**/WorkspaceNavigationMenuItems.tsx',
|
|
'**/WorkspaceNavigationMenuItemsFolder.tsx',
|
|
'**/MainNavigationDrawerAIChatContent.tsx',
|
|
'**/MainNavigationDrawerNavigationContent.tsx',
|
|
'**/MainNavigationDrawerScrollableItems.tsx',
|
|
'**/MainNavigationDrawerTabsRow.tsx',
|
|
'**/RecordTableCellBaseContainer.tsx',
|
|
'**/RecordTableCellDisplayContainer.tsx',
|
|
'**/RecordTableCellFirstRowFirstColumn.tsx',
|
|
'**/RecordTableCellLoading.tsx',
|
|
'**/RecordTableCellStyleWrapper.tsx',
|
|
'**/RecordTableDragAndDropPlaceholderCell.tsx',
|
|
'**/RecordTableAggregateFooterCell.tsx',
|
|
'**/RecordTableHeaderAddColumnButton.tsx',
|
|
'**/RecordTableHeaderCell.tsx',
|
|
'**/RecordTableHeaderCheckboxColumn.tsx',
|
|
'**/RecordTableHeaderDragDropColumn.tsx',
|
|
'**/RecordTableHeaderFirstCell.tsx',
|
|
'**/RecordTableHeaderFirstScrollableCell.tsx',
|
|
'**/RecordTableHeaderLastEmptyColumn.tsx',
|
|
'**/RecordTableAddButtonPlaceholderCell.tsx',
|
|
'**/RecordTableGroupSectionLastDynamicFillingCell.tsx',
|
|
'**/RecordTableLastDynamicFillingCell.tsx',
|
|
'**/RecordTableRowVirtualizedContainer.tsx',
|
|
'**/RecordTableVirtualizedBodyPlaceholder.tsx',
|
|
'**/SignInAppNavigationDrawerMock.tsx',
|
|
'**/SignInBackgroundMockContainer.tsx',
|
|
'**/SignInBackgroundMockPage.tsx',
|
|
'**/Heading.tsx',
|
|
'**/MatchColumnSelectFieldSelectDropdownContent.tsx',
|
|
'**/MatchColumnToFieldSelect.tsx',
|
|
'**/SpreadSheetImportModalCloseButton.tsx',
|
|
'**/SpreadSheetImportModalWrapper.tsx',
|
|
'**/SpreadsheetImportTable.tsx',
|
|
'**/StepNavigationButton.tsx',
|
|
'**/ImportDataStep.tsx',
|
|
'**/MatchColumnsStep.tsx',
|
|
'**/ColumnGrid.tsx',
|
|
'**/SubMatchingSelectControlContainer.tsx',
|
|
'**/SubMatchingSelectDropdownButton.tsx',
|
|
'**/SubMatchingSelectRow.tsx',
|
|
'**/SubMatchingSelectRowLeftSelect.tsx',
|
|
'**/SubMatchingSelectRowRightDropdown.tsx',
|
|
'**/TemplateColumn.tsx',
|
|
'**/UnmatchColumn.tsx',
|
|
'**/UnmatchColumnBanner.tsx',
|
|
'**/UserTableColumn.tsx',
|
|
'**/SelectHeaderStep.tsx',
|
|
'**/SelectSheetStep.tsx',
|
|
'**/SpreadsheetImportStepper.tsx',
|
|
'**/SpreadsheetImportStepperContainer.tsx',
|
|
'**/UploadStep.tsx',
|
|
'**/DropZone.tsx',
|
|
'**/ValidationStep.tsx',
|
|
'**/columns.tsx',
|
|
'**/BooleanDisplay.tsx',
|
|
'**/EllipsisDisplay.tsx',
|
|
'**/EmailsDisplay.tsx',
|
|
'**/MultiSelectDisplay.tsx',
|
|
'**/PhonesDisplay.tsx',
|
|
'**/TextDisplay.tsx',
|
|
'**/RatingInput.tsx',
|
|
'**/SortOrFilterChip.tsx',
|
|
'**/UpdateViewButtonGroup.tsx',
|
|
'**/ViewBarDetails.tsx',
|
|
'**/ViewBarFilterDropdownAdvancedFilterButton.tsx',
|
|
'**/ViewBarFilterDropdownAnyFieldSearchButtonMenuItem.tsx',
|
|
'**/ViewBarFilterDropdownBottomMenu.tsx',
|
|
'**/ViewBarFilterDropdownFieldSelectMenu.tsx',
|
|
'**/ViewPickerContentCreateMode.tsx',
|
|
'**/ViewPickerDropdown.tsx',
|
|
'**/ViewPickerIconAndNameContainer.tsx',
|
|
'**/ViewPickerListContent.tsx',
|
|
'**/ViewPickerSaveButtonContainer.tsx',
|
|
'**/ViewPickerSelectContainer.tsx',
|
|
'**/AIChatAssistantMessageRenderer.tsx',
|
|
'**/AIChatBanner.tsx',
|
|
'**/AIChatContextUsageButton.tsx',
|
|
'**/AIChatEmptyState.tsx',
|
|
'**/AIChatErrorMessage.tsx',
|
|
'**/AIChatMessage.stories.tsx',
|
|
'**/AIChatMessage.tsx',
|
|
'**/AIChatSkeletonLoader.tsx',
|
|
'**/AIChatStandaloneError.tsx',
|
|
'**/AIChatSuggestedPrompts.tsx',
|
|
'**/AIChatTab.tsx',
|
|
'**/AIChatThreadGroup.tsx',
|
|
'**/AIChatThreadsList.tsx',
|
|
'**/ActionButton.tsx',
|
|
'**/ActivityList.tsx',
|
|
'**/ActivityRow.tsx',
|
|
'**/ActivityTargetChips.tsx',
|
|
'**/AgentChatContextPreview.tsx',
|
|
'**/AgentChatFileUploadButton.tsx',
|
|
'**/AppFullScreenErrorFallback.tsx',
|
|
'**/AppRootErrorFallback.tsx',
|
|
'**/AttachmentList.tsx',
|
|
'**/AttachmentRow.tsx',
|
|
'**/AuthModal.tsx',
|
|
'**/Authorize.tsx',
|
|
'**/BookCall.tsx',
|
|
'**/BookCallDecision.tsx',
|
|
'**/CalendarDayCardContent.tsx',
|
|
'**/CalendarEventDetails.tsx',
|
|
'**/CalendarEventNotSharedContent.tsx',
|
|
'**/CalendarEventParticipantsResponseStatusField.tsx',
|
|
'**/CalendarEventRow.tsx',
|
|
'**/CalendarEventsCard.tsx',
|
|
'**/ChooseYourPlan.tsx',
|
|
'**/ChooseYourPlanContent.tsx',
|
|
'**/CodeExecutionDisplay.tsx',
|
|
'**/ComponentStorybookLayout.tsx',
|
|
'**/ContextUsageProgressRing.tsx',
|
|
'**/CreateProfile.tsx',
|
|
'**/CreateWorkspace.tsx',
|
|
'**/CustomResolverFetchMoreLoader.tsx',
|
|
'**/DocumentViewer.tsx',
|
|
'**/EmailThreadBottomBar.tsx',
|
|
'**/EmailThreadHeader.tsx',
|
|
'**/EmailThreadMessage.tsx',
|
|
'**/EmailThreadMessageBody.tsx',
|
|
'**/EmailThreadMessageBodyPreview.tsx',
|
|
'**/EmailThreadMessageReceivers.tsx',
|
|
'**/EmailThreadMessageSender.tsx',
|
|
'**/EmailThreadNotShared.tsx',
|
|
'**/EmailThreadPreview.tsx',
|
|
'**/EmailVerificationSent.tsx',
|
|
'**/EmailsCard.tsx',
|
|
'**/EventCard.tsx',
|
|
'**/EventCardCalendarEvent.tsx',
|
|
'**/EventCardMessage.tsx',
|
|
'**/EventCardMessageBodyNotShared.tsx',
|
|
'**/EventCardMessageForbidden.tsx',
|
|
'**/EventCardToggleButton.tsx',
|
|
'**/EventFieldDiff.tsx',
|
|
'**/EventFieldDiffLabel.tsx',
|
|
'**/EventFieldDiffValue.tsx',
|
|
'**/EventList.tsx',
|
|
'**/EventLogDatePickerInput.tsx',
|
|
'**/EventLogFilters.tsx',
|
|
'**/EventLogJsonCell.tsx',
|
|
'**/EventLogResultsTable.tsx',
|
|
'**/EventRow.tsx',
|
|
'**/EventRowActivity.tsx',
|
|
'**/EventRowCalendarEvent.tsx',
|
|
'**/EventRowDynamicComponent.tsx',
|
|
'**/EventRowMainObject.tsx',
|
|
'**/EventRowMainObjectUpdated.tsx',
|
|
'**/EventRowMessage.tsx',
|
|
'**/EventsGroup.tsx',
|
|
'**/FileIcon.tsx',
|
|
'**/FilesCard.tsx',
|
|
'**/FooterNote.tsx',
|
|
'**/FullHeightStorybookLayout.tsx',
|
|
'**/FullScreenDecorator.tsx',
|
|
'**/InviteTeam.tsx',
|
|
'**/LastUsedPill.tsx',
|
|
'**/LazyMarkdownRendererStyledComponents.tsx',
|
|
'**/LeftPanelSkeletonLoader.tsx',
|
|
'**/LocalePicker.tsx',
|
|
'**/Logo.tsx',
|
|
'**/MainNavigationDrawerItemsSkeletonLoader.tsx',
|
|
'**/NavigationDrawerAIChatThreadDateSection.tsx',
|
|
'**/NavigationDrawerAIChatThreadsList.tsx',
|
|
'**/NavigationDrawerSectionForObjectMetadataItemsSkeletonLoader.tsx',
|
|
'**/NavigationDrawerSectionForWorkspaceItems.tsx',
|
|
'**/NotFound.tsx',
|
|
'**/NoteList.tsx',
|
|
'**/NoteTile.tsx',
|
|
'**/NotesCard.tsx',
|
|
'**/OnboardingModalCircularIcon.tsx',
|
|
'**/OnboardingSyncEmailsSettingsCard.tsx',
|
|
'**/PageHeaderActionMenuButtons.tsx',
|
|
'**/ParticipantChip.tsx',
|
|
'**/PasswordReset.tsx',
|
|
'**/PaymentSuccess.tsx',
|
|
'**/PlaceAutocompleteSelect.tsx',
|
|
'**/ProfilingReporter.tsx',
|
|
'**/ReasoningSummaryDisplay.tsx',
|
|
'**/RecordIndexActionMenuDropdown.tsx',
|
|
'**/RightDrawerSkeletonLoader.tsx',
|
|
'**/RightPanelSkeletonLoader.tsx',
|
|
'**/RoutingDebugDisplay.tsx',
|
|
'**/RoutingStatusDisplay.tsx',
|
|
'**/SettingsAI.tsx',
|
|
'**/SettingsAIAgentForm.tsx',
|
|
'**/SettingsAIAgentTableRow.tsx',
|
|
'**/SettingsAIAgentsTable.tsx',
|
|
'**/SettingsAIMCP.tsx',
|
|
'**/SettingsAIModelsTab.tsx',
|
|
'**/SettingsAIPrompts.tsx',
|
|
'**/SettingsAdminConfigVariableDetails.tsx',
|
|
'**/SettingsAdminIndicatorHealthStatus.tsx',
|
|
'**/SettingsAgentDetailSkeletonLoader.tsx',
|
|
'**/SettingsAgentEvalsTab.tsx',
|
|
'**/SettingsAgentForm.tsx',
|
|
'**/SettingsAgentLogsTab.tsx',
|
|
'**/SettingsAgentModelCapabilities.tsx',
|
|
'**/SettingsAgentResponseFormat.tsx',
|
|
'**/SettingsAgentRoleTab.tsx',
|
|
'**/SettingsAgentSettingsTab.tsx',
|
|
'**/SettingsAgentTurnDetail.tsx',
|
|
'**/SettingsApiKeys.tsx',
|
|
'**/SettingsApiWebhooks.tsx',
|
|
'**/SettingsApplicationCustomTab.tsx',
|
|
'**/SettingsApplicationDataTable.tsx',
|
|
'**/SettingsApplicationDataTableRow.tsx',
|
|
'**/SettingsApplicationDetailEnvironmentVariablesTable.tsx',
|
|
'**/SettingsApplicationDetailSkeletonLoader.tsx',
|
|
'**/SettingsApplicationNameDescriptionTable.tsx',
|
|
'**/SettingsApplicationRegistrationDetails.tsx',
|
|
'**/SettingsApplicationTableRow.tsx',
|
|
'**/SettingsApplicationsAvailableTab.tsx',
|
|
'**/SettingsApplicationsDeveloperTab.tsx',
|
|
'**/SettingsApplicationsTable.tsx',
|
|
'**/SettingsAvailableApplicationCard.tsx',
|
|
'**/SettingsAvailableApplicationDetails.tsx',
|
|
'**/SettingsDevelopersApiKeyDetail.tsx',
|
|
'**/SettingsDomains.tsx',
|
|
'**/SettingsEmailingDomains.tsx',
|
|
'**/SettingsEventLogs.tsx',
|
|
'**/SettingsObjectDetailPage.tsx',
|
|
'**/SettingsObjectFieldEdit.tsx',
|
|
'**/SettingsObjectFieldTable.tsx',
|
|
'**/SettingsObjectIndexTable.tsx',
|
|
'**/SettingsObjectTable.tsx',
|
|
'**/SettingsSecurity.tsx',
|
|
'**/SettingsSkillForm.tsx',
|
|
'**/SettingsSkillTableRow.tsx',
|
|
'**/SettingsSkillsTable.tsx',
|
|
'**/SettingsSystemToolTableRow.tsx',
|
|
'**/SettingsToolTableRow.tsx',
|
|
'**/SettingsToolsTable.tsx',
|
|
'**/SettingsTwoFactorAuthenticationMethod.tsx',
|
|
'**/SettingsUpdates.tsx',
|
|
'**/SettingsWebhooks.tsx',
|
|
'**/SettingsWorkspaceMembers.tsx',
|
|
'**/ShimmeringText.tsx',
|
|
'**/SignInUp.tsx',
|
|
'**/SignInUpEmailField.tsx',
|
|
'**/SignInUpGlobalScopeForm.tsx',
|
|
'**/SignInUpPasswordField.tsx',
|
|
'**/SignInUpSSOButtonStyles.ts',
|
|
'**/SignInUpSSOIdentityProviderSelection.tsx',
|
|
'**/SignInUpTwoFactorAuthenticationProvision.tsx',
|
|
'**/SignInUpTwoFactorAuthenticationVerification.tsx',
|
|
'**/SignInUpWithCredentials.tsx',
|
|
'**/SignInUpWorkspaceScopeForm.tsx',
|
|
'**/SkeletonLoader.tsx',
|
|
'**/SubTitle.tsx',
|
|
'**/SyncEmails.tsx',
|
|
'**/TaskGroups.tsx',
|
|
'**/TaskList.tsx',
|
|
'**/TaskRow.tsx',
|
|
'**/TasksCard.tsx',
|
|
'**/TerminalOutput.tsx',
|
|
'**/ThinkingStepsDisplay.tsx',
|
|
'**/TimelineCard.tsx',
|
|
'**/Title.tsx',
|
|
'**/ToolStepRenderer.tsx',
|
|
'**/UserOrMetadataLoader.tsx',
|
|
'**/WorkflowStepActionDrawerDecorator.tsx',
|
|
'**/WorkspaceInviteLink.tsx',
|
|
'**/WorkspaceInviteTeam.tsx',
|
|
'**/AddressInput.tsx',
|
|
'**/AxisLayer.tsx',
|
|
'**/BarChart.tsx',
|
|
'**/BarChartBaseLayer.tsx',
|
|
'**/BarChartHoverLayer.tsx',
|
|
'**/BarChartLayers.tsx',
|
|
'**/BarChartTotalsLayer.tsx',
|
|
'**/BlankLayout.tsx',
|
|
'**/BodyInput.tsx',
|
|
'**/BooleanInput.tsx',
|
|
'**/CalendarWidget.tsx',
|
|
'**/ChartColorGradientOption.tsx',
|
|
'**/ChartColorPaletteOption.tsx',
|
|
'**/ChartFiltersSettings.tsx',
|
|
'**/ChartSettings.tsx',
|
|
'**/ChartTypeSelectionSection.tsx',
|
|
'**/CommandGroup.tsx',
|
|
'**/CommandMenuAIChatThreadsPage.tsx',
|
|
'**/CommandMenuAskAIInfo.tsx',
|
|
'**/CommandMenuAskAIPage.tsx',
|
|
'**/CommandMenuBackButton.tsx',
|
|
'**/CommandMenuContainer.tsx',
|
|
'**/CommandMenuContextChip.tsx',
|
|
'**/CommandMenuContextRecordChipAvatars.tsx',
|
|
'**/CommandMenuEditColorOption.tsx',
|
|
'**/CommandMenuEditRichTextPage.tsx',
|
|
'**/CommandMenuFolderInfo.tsx',
|
|
'**/CommandMenuForMobile.tsx',
|
|
'**/CommandMenuItemNumberInput.tsx',
|
|
'**/CommandMenuItemTextInput.tsx',
|
|
'**/CommandMenuItemWithAddToNavigationDrag.tsx',
|
|
'**/CommandMenuList.tsx',
|
|
'**/CommandMenuMergeRecordPage.tsx',
|
|
'**/CommandMenuMessageThreadIntermediaryMessages.tsx',
|
|
'**/CommandMenuMessageThreadPage.tsx',
|
|
'**/CommandMenuNavigationMenuItemEditPage.tsx',
|
|
'**/CommandMenuOpenContainer.tsx',
|
|
'**/CommandMenuPageInfo.tsx',
|
|
'**/CommandMenuPageInfoLayout.tsx',
|
|
'**/CommandMenuPageLayoutChartSettings.tsx',
|
|
'**/CommandMenuPageLayoutFieldsLayout.tsx',
|
|
'**/CommandMenuPageLayoutFieldsSettings.tsx',
|
|
'**/CommandMenuPageLayoutIframeSettings.tsx',
|
|
'**/CommandMenuRecordPage.tsx',
|
|
'**/CommandMenuRouter.tsx',
|
|
'**/CommandMenuSidePanelForDesktop.tsx',
|
|
'**/CommandMenuSubViewWithSearch.tsx',
|
|
'**/CommandMenuTopBar.tsx',
|
|
'**/CommandMenuTopBarRightCornerIcon.tsx',
|
|
'**/CommandMenuUpdateMultipleRecords.tsx',
|
|
'**/CommandMenuWorkflowEditStepContent.tsx',
|
|
'**/CommandMenuWorkflowRunViewStepContent.tsx',
|
|
'**/CommandMenuWorkflowViewStepContent.tsx',
|
|
'**/ConfirmationModal.tsx',
|
|
'**/CreateNewButton.tsx',
|
|
'**/CronExpressionHelper.tsx',
|
|
'**/CurrencyInput.tsx',
|
|
'**/CurrencyPickerDropdownButton.tsx',
|
|
'**/DashboardColorIcon.tsx',
|
|
'**/DashboardColorSelectionMenu.tsx',
|
|
'**/DashboardEditorSideMenu.tsx',
|
|
'**/DashboardFormattingToolbar.tsx',
|
|
'**/DashboardFormattingToolbarColorButton.tsx',
|
|
'**/DashboardsBlockEditor.tsx',
|
|
'**/DatePicker.tsx',
|
|
'**/DatePickerHeader.tsx',
|
|
'**/DatePickerInput.tsx',
|
|
'**/DatePickerWithoutCalendar.tsx',
|
|
'**/DateTimeDisplay.tsx',
|
|
'**/DateTimePicker.tsx',
|
|
'**/DateTimePickerHeader.tsx',
|
|
'**/DateTimePickerInput.tsx',
|
|
'**/DefaultLayout.tsx',
|
|
'**/Dialog.tsx',
|
|
'**/DoubleTextInput.tsx',
|
|
'**/DraggableList.tsx',
|
|
'**/Dropdown.stories.tsx',
|
|
'**/Dropdown.tsx',
|
|
'**/DropdownContent.tsx',
|
|
'**/DropdownInternalContainer.tsx',
|
|
'**/DropdownMenuHeader.tsx',
|
|
'**/DropdownMenuHeaderLeftComponent.tsx',
|
|
'**/DropdownMenuInnerSelect.tsx',
|
|
'**/DropdownMenuInput.tsx',
|
|
'**/DropdownMenuItemsContainer.tsx',
|
|
'**/DropdownMenuSearchInput.tsx',
|
|
'**/DropdownMenuSectionLabel.tsx',
|
|
'**/DropdownMenuSeparator.tsx',
|
|
'**/DropdownMenuSkeletonItem.tsx',
|
|
'**/EmailWidget.tsx',
|
|
'**/ExpandableList.stories.tsx',
|
|
'**/ExpandableList.tsx',
|
|
'**/ExpandedFieldDisplay.tsx',
|
|
'**/ExpandedListDropdown.tsx',
|
|
'**/FieldInputContainer.tsx',
|
|
'**/FieldRichTextWidget.tsx',
|
|
'**/FieldWidget.tsx',
|
|
'**/FieldWidgetDisplay.tsx',
|
|
'**/FieldWidgetEditAction.tsx',
|
|
'**/FieldWidgetInlineCellContainer.tsx',
|
|
'**/FieldWidgetMorphRelationCard.tsx',
|
|
'**/FieldWidgetMorphRelationField.tsx',
|
|
'**/FieldWidgetRelationCard.tsx',
|
|
'**/FieldWidgetRelationEditAction.tsx',
|
|
'**/FieldWidgetRelationField.tsx',
|
|
'**/FieldWidgetShowMoreButton.tsx',
|
|
'**/FieldsConfigurationEditor.tsx',
|
|
'**/FieldsConfigurationGroupEditor.tsx',
|
|
'**/FieldsConfigurationGroupRenameInput.tsx',
|
|
'**/FieldsWidget.tsx',
|
|
'**/FieldsWidgetGroupContainer.tsx',
|
|
'**/FileChip.tsx',
|
|
'**/FileWidget.tsx',
|
|
'**/FrontComponentWidgetRenderer.tsx',
|
|
'**/FullScreenContainer.stories.tsx',
|
|
'**/FullScreenContainer.tsx',
|
|
'**/GlobalFilePreviewModal.tsx',
|
|
'**/GraphWidgetAggregateChart.tsx',
|
|
'**/GraphWidgetBarChart.tsx',
|
|
'**/GraphWidgetChartContainer.tsx',
|
|
'**/GraphWidgetGaugeChart.tsx',
|
|
'**/GraphWidgetLegend.tsx',
|
|
'**/GraphWidgetLegendDot.tsx',
|
|
'**/GraphWidgetLineChart.tsx',
|
|
'**/GraphWidgetPieChart.tsx',
|
|
'**/GraphWidgetTooltip.tsx',
|
|
'**/HttpRequestTestVariableInput.tsx',
|
|
'**/IconPicker.tsx',
|
|
'**/IframeWidget.tsx',
|
|
'**/ImageInput.tsx',
|
|
'**/InputErrorHelper.tsx',
|
|
'**/InputHint.tsx',
|
|
'**/InputLabel.tsx',
|
|
'**/KeyValuePairInput.tsx',
|
|
'**/Modal.tsx',
|
|
'**/NoteWidget.tsx',
|
|
'**/OverlayContainer.tsx',
|
|
'**/PageBody.tsx',
|
|
'**/PageContainer.tsx',
|
|
'**/PageHeader.tsx',
|
|
'**/PageHeaderToggleCommandMenuButton.tsx',
|
|
'**/PageLayoutCanvasViewer.tsx',
|
|
'**/PageLayoutGridLayout.tsx',
|
|
'**/PageLayoutGridOverlay.tsx',
|
|
'**/PageLayoutGridResizeHandle.tsx',
|
|
'**/PageLayoutLeftPanel.tsx',
|
|
'**/PageLayoutRendererContent.tsx',
|
|
'**/PageLayoutTabList.stories.tsx',
|
|
'**/PageLayoutTabList.tsx',
|
|
'**/PageLayoutTabListDroppableMoreButton.tsx',
|
|
'**/PageLayoutTabListReorderableOverflowDropdown.tsx',
|
|
'**/PageLayoutTabListReorderableTab.tsx',
|
|
'**/PageLayoutTabListVisibleTabs.tsx',
|
|
'**/PageLayoutTabMenuItemSelectAvatar.tsx',
|
|
'**/PageLayoutTabRenderClone.tsx',
|
|
'**/PageLayoutVerticalListEditor.tsx',
|
|
'**/PageLayoutVerticalListViewer.tsx',
|
|
'**/PageLayoutWidgetInvalidConfigDisplay.tsx',
|
|
'**/PageLayoutWidgetNoDataDisplay.tsx',
|
|
'**/PagePanel.tsx',
|
|
'**/PhoneCountryPickerDropdownButton.tsx',
|
|
'**/PhoneCountryPickerDropdownSelect.tsx',
|
|
'**/PieChartCenterMetricLayer.tsx',
|
|
'**/RelativeDatePickerHeader.tsx',
|
|
'**/ResizablePanelEdge.tsx',
|
|
'**/ResizablePanelGap.tsx',
|
|
'**/RightDrawerFooter.tsx',
|
|
'**/RightDrawerWorkflowSelectStepContainer.tsx',
|
|
'**/RightDrawerWorkflowSelectStepTitle.tsx',
|
|
'**/Select.tsx',
|
|
'**/SelectControl.tsx',
|
|
'**/ShowPageContainer.tsx',
|
|
'**/SidePanelSubPageNavigationHeader.tsx',
|
|
'**/SnackBar.tsx',
|
|
'**/SnackBarProvider.tsx',
|
|
'**/StandaloneRichTextWidget.tsx',
|
|
'**/StyledDropdownButtonContainer.tsx',
|
|
'**/StyledDropdownMenuSubheader.tsx',
|
|
'**/StyledHeaderDropdownButton.tsx',
|
|
'**/SubMenuTopBarContainer.tsx',
|
|
'**/TaskWidget.tsx',
|
|
'**/TextArea.tsx',
|
|
'**/TextAreaInput.tsx',
|
|
'**/TextInput.tsx',
|
|
'**/TimeZoneAbbreviation.tsx',
|
|
'**/TimelineWidget.tsx',
|
|
'**/TitleInput.tsx',
|
|
'**/UploadFileChip.tsx',
|
|
'**/WidgetActionFieldSeeAll.tsx',
|
|
'**/WidgetCard.tsx',
|
|
'**/WidgetCardContent.tsx',
|
|
'**/WidgetCardHeader.tsx',
|
|
'**/WidgetGrip.tsx',
|
|
'**/WidgetRenderer.tsx',
|
|
'**/WidgetSkeletonLoader.tsx',
|
|
'**/WorkflowAiAgentPermissionsStyles.ts',
|
|
'**/WorkflowAiAgentPermissionsTab.tsx',
|
|
'**/WorkflowCodeEditor.tsx',
|
|
'**/WorkflowDiagramCanvasBase.tsx',
|
|
'**/WorkflowDiagramCreateStepElement.tsx',
|
|
'**/WorkflowDiagramEdgeButtonGroup.tsx',
|
|
'**/WorkflowDiagramEdgeLabel.tsx',
|
|
'**/WorkflowDiagramEdgeLabelContainer.tsx',
|
|
'**/WorkflowDiagramEdgeV2Container.tsx',
|
|
'**/WorkflowDiagramEdgeV2VisibilityContainer.tsx',
|
|
'**/WorkflowDiagramHandleSource.tsx',
|
|
'**/WorkflowDiagramHandleTarget.tsx',
|
|
'**/WorkflowDiagramRightClickCommandMenu.tsx',
|
|
'**/WorkflowDiagramStepNodeEditableContent.tsx',
|
|
'**/WorkflowEditActionAiAgent.tsx',
|
|
'**/WorkflowEditActionCode.tsx',
|
|
'**/WorkflowEditActionCodeFields.tsx',
|
|
'**/WorkflowEditActionFilterBody.tsx',
|
|
'**/WorkflowEditActionFindRecords.tsx',
|
|
'**/WorkflowEditActionFormBuilder.tsx',
|
|
'**/WorkflowEditActionFormFieldSettings.tsx',
|
|
'**/WorkflowEditActionHttpRequest.tsx',
|
|
'**/WorkflowEditActionIfElseBody.tsx',
|
|
'**/WorkflowEditActionLogicFunction.tsx',
|
|
'**/WorkflowEditTriggerDatabaseEventForm.tsx',
|
|
'**/WorkflowEditTriggerManual.tsx',
|
|
'**/WorkflowFindRecordsSorts.tsx',
|
|
'**/WorkflowFormFieldSettingsNumber.tsx',
|
|
'**/WorkflowFormFieldSettingsRecordPicker.tsx',
|
|
'**/WorkflowFormFieldSettingsSelect.tsx',
|
|
'**/WorkflowFormFieldSettingsText.tsx',
|
|
'**/WorkflowIfElseBranchEditor.tsx',
|
|
'**/WorkflowIteratorSubStepSwitcher.tsx',
|
|
'**/WorkflowNodeContainer.tsx',
|
|
'**/WorkflowNodeIconContainer.tsx',
|
|
'**/WorkflowNodeLabel.tsx',
|
|
'**/WorkflowNodeLabelWithCounterPart.tsx',
|
|
'**/WorkflowNodeRightPart.tsx',
|
|
'**/WorkflowNodeTitle.tsx',
|
|
'**/WorkflowOutputSchemaBuilder.tsx',
|
|
'**/WorkflowReadonlyActionCode.tsx',
|
|
'**/WorkflowRunCard.tsx',
|
|
'**/WorkflowRunDiagramStepNode.tsx',
|
|
'**/WorkflowRunStepJsonContainer.tsx',
|
|
'**/WorkflowStepBody.tsx',
|
|
'**/WorkflowStepExecutionResult.tsx',
|
|
'**/WorkflowStepFilterAddRootStepFilterButton.tsx',
|
|
'**/WorkflowStepFilterColumn.tsx',
|
|
'**/WorkflowStepFilterGroupChildren.tsx',
|
|
'**/WorkflowStepFilterGroupColumn.tsx',
|
|
'**/WorkflowStepFilterLogicalOperatorCell.tsx',
|
|
'**/WorkflowTextEditorTextChip.tsx',
|
|
'**/WorkflowTextEditorVariableChip.tsx',
|
|
'**/WorkflowVariablePicker.tsx',
|
|
'**/WorkflowVariablesDropdown.tsx',
|
|
'**/WorkflowVersionCard.tsx',
|
|
'**/useCommandMenuContextChips.tsx',
|
|
'**/useFullScreenModal.tsx',
|
|
],
|
|
babelOptions: {
|
|
presets: ['@babel/preset-typescript', '@babel/preset-react'],
|
|
plugins: ['@babel/plugin-transform-export-namespace-from'],
|
|
},
|
|
}),
|
|
enforce: 'pre',
|
|
},
|
|
visualizer({
|
|
open: true,
|
|
gzipSize: true,
|
|
brotliSize: true,
|
|
filename: 'dist/stats.html',
|
|
}) as PluginOption, // https://github.com/btd/rollup-plugin-visualizer/issues/162#issuecomment-1538265997,
|
|
],
|
|
|
|
optimizeDeps: {
|
|
exclude: [
|
|
'../../node_modules/.vite',
|
|
'../../node_modules/.cache',
|
|
'../../node_modules/twenty-ui',
|
|
],
|
|
},
|
|
|
|
build: {
|
|
minify: 'esbuild',
|
|
outDir: 'build',
|
|
sourcemap: VITE_BUILD_SOURCEMAP === 'true',
|
|
chunkSizeWarningLimit: CHUNK_SIZE_WARNING_LIMIT,
|
|
rollupOptions: {
|
|
// Don't use manual chunks as it causes many issue
|
|
// including this one we wasted a lot of time on:
|
|
// https://github.com/rollup/rollup/issues/2793
|
|
output: {
|
|
// Custom plugin to fail build if chunks exceed max size
|
|
plugins: [
|
|
{
|
|
name: 'chunk-size-limit',
|
|
generateBundle(_options, bundle) {
|
|
const oversizedChunks: string[] = [];
|
|
|
|
Object.entries(bundle).forEach(([fileName, chunk]) => {
|
|
if (chunk.type === 'chunk' && chunk.code !== undefined) {
|
|
const size = Buffer.byteLength(chunk.code, 'utf8');
|
|
const isMainChunk =
|
|
fileName.includes('index') && chunk.isEntry;
|
|
const sizeLimit = isMainChunk
|
|
? MAIN_CHUNK_SIZE_LIMIT
|
|
: OTHER_CHUNK_SIZE_LIMIT;
|
|
const limitType = isMainChunk ? 'main' : 'other';
|
|
|
|
if (size > sizeLimit) {
|
|
oversizedChunks.push(
|
|
`${fileName} (${limitType}): ${(size / 1024 / 1024).toFixed(2)}MB (limit: ${(sizeLimit / 1024 / 1024).toFixed(2)}MB)`,
|
|
);
|
|
}
|
|
}
|
|
});
|
|
|
|
if (oversizedChunks.length > 0) {
|
|
const errorMessage = `Build failed: The following chunks exceed their size limits:\n${oversizedChunks.map((chunk) => ` - ${chunk}`).join('\n')}`;
|
|
this.error(errorMessage);
|
|
}
|
|
},
|
|
},
|
|
// TODO; later - think about prefetching modules such
|
|
// as date time picker, phone input etc...
|
|
/*
|
|
{
|
|
name: 'add-prefetched-modules',
|
|
transformIndexHtml(html: string,
|
|
ctx: {
|
|
path: string;
|
|
filename: string;
|
|
server?: ViteDevServer;
|
|
bundle?: import('rollup').OutputBundle;
|
|
chunk?: import('rollup').OutputChunk;
|
|
}) {
|
|
|
|
const bundles = Object.keys(ctx.bundle ?? {});
|
|
|
|
let modernBundles = bundles.filter(
|
|
(bundle) => bundle.endsWith('.map') === false
|
|
);
|
|
|
|
|
|
// Remove existing files and concatenate them into link tags
|
|
const prefechBundlesString = modernBundles
|
|
.filter((bundle) => html.includes(bundle) === false)
|
|
.map((bundle) => `<link rel="prefetch" href="${ctx.server?.config.base}${bundle}">`)
|
|
.join('');
|
|
|
|
// Use regular expression to get the content within <head> </head>
|
|
const headContent = html.match(/<head>([\s\S]*)<\/head>/)?.[1] ?? '';
|
|
// Insert the content of prefetch into the head
|
|
const newHeadContent = `${headContent}${prefechBundlesString}`;
|
|
// Replace the original head
|
|
html = html.replace(
|
|
/<head>([\s\S]*)<\/head>/,
|
|
`<head>${newHeadContent}</head>`
|
|
);
|
|
|
|
return html;
|
|
|
|
|
|
},
|
|
}*/
|
|
],
|
|
},
|
|
},
|
|
},
|
|
|
|
envPrefix: 'REACT_APP_',
|
|
|
|
define: {
|
|
_env_: {
|
|
REACT_APP_SERVER_BASE_URL,
|
|
},
|
|
'process.env': {
|
|
REACT_APP_SERVER_BASE_URL,
|
|
IS_DEBUG_MODE,
|
|
IS_DEV_ENV: mode === 'development' ? 'true' : 'false',
|
|
},
|
|
},
|
|
css: {
|
|
modules: {
|
|
localsConvention: 'camelCaseOnly',
|
|
},
|
|
},
|
|
resolve: {
|
|
alias: {
|
|
path: 'rollup-plugin-node-polyfills/polyfills/path',
|
|
'@tabler/icons-react': '@tabler/icons-react/dist/esm/icons/index.mjs',
|
|
},
|
|
},
|
|
};
|
|
});
|