From aef96f8b9bdaba9c9b330c3f86b4a8003610302f Mon Sep 17 00:00:00 2001 From: Eugene Pankov Date: Sun, 5 Feb 2023 22:13:15 +0100 Subject: [PATCH] wip --- app/src/app.module.ts | 25 +++++----- app/src/entry.ts | 48 ++++++++++++++----- app/webpack.config.mjs | 3 +- .../src/components/appRoot.component.ts | 3 ++ tabby-core/src/index.ts | 11 +---- tabby-local/src/index.ts | 9 +--- tabby-plugin-manager/src/index.ts | 7 +-- tabby-serial/src/index.ts | 4 -- tabby-settings/src/index.ts | 16 +------ tabby-ssh/src/index.ts | 9 ---- tabby-telnet/src/index.ts | 4 -- tabby-terminal/src/index.ts | 10 +--- tabby-web-demo/src/index.ts | 7 +-- tabby-web/src/index.ts | 3 -- webpack.plugin.config.mjs | 35 +++++++------- 15 files changed, 84 insertions(+), 110 deletions(-) diff --git a/app/src/app.module.ts b/app/src/app.module.ts index 3ad05991..dd2caf76 100644 --- a/app/src/app.module.ts +++ b/app/src/app.module.ts @@ -1,20 +1,13 @@ /* eslint-disable @typescript-eslint/explicit-module-boundary-types */ -import { NgModule } from '@angular/core' +import { ApplicationRef, ComponentFactoryResolver, NgModule } from '@angular/core' import { BrowserModule } from '@angular/platform-browser' -import { NgbModule } from '@ng-bootstrap/ng-bootstrap' -import { ToastrModule } from 'ngx-toastr' +// import { NgbModule } from '@ng-bootstrap/ng-bootstrap' +// import { ToastrModule } from 'ngx-toastr' export function getRootModule (plugins: any[]) { const imports = [ BrowserModule, ...plugins, - NgbModule, - ToastrModule.forRoot({ - positionClass: 'toast-bottom-center', - toastClass: 'toast', - preventDuplicates: true, - extendedTimeOut: 1000, - }), ] const bootstrap = [ @@ -27,10 +20,18 @@ export function getRootModule (plugins: any[]) { @NgModule({ imports, - bootstrap, }) class RootModule { - ngDoBootstrap () { + constructor (private resolver: ComponentFactoryResolver) { } + + ngDoBootstrap (appRef: ApplicationRef) { (window as any)['requestAnimationFrame'] = window[window['Zone'].__symbol__('requestAnimationFrame')] + + bootstrap.forEach(componentDef => { + const factory = this.resolver.resolveComponentFactory(componentDef) + if (document.querySelector(factory.selector)) { + appRef.bootstrap(factory) + } + }) } } diff --git a/app/src/entry.ts b/app/src/entry.ts index 172f0a8f..c9454595 100644 --- a/app/src/entry.ts +++ b/app/src/entry.ts @@ -8,9 +8,8 @@ import './toastr.scss' // Importing before @angular/* import { findPlugins, initModuleLookup, loadPlugins } from './plugins' -import { enableProdMode, NgModuleRef, ApplicationRef } from '@angular/core' -import { enableDebugTools } from '@angular/platform-browser' -import { platformBrowserDynamic } from '@angular/platform-browser-dynamic' +import { enableProdMode } from '@angular/core' +import { bootstrapApplication } from '@angular/platform-browser' import { ipcRenderer } from 'electron' import { getRootModule } from './app.module' @@ -31,7 +30,7 @@ if (process.env.TABBY_DEV && !process.env.TABBY_FORCE_ANGULAR_PROD) { enableProdMode() } -async function bootstrap (bootstrapData: BootstrapData, plugins: PluginInfo[], safeMode = false): Promise> { +async function bootstrap (bootstrapData: BootstrapData, plugins: PluginInfo[], safeMode = false): Promise { if (safeMode) { plugins = plugins.filter(x => x.isBuiltin) } @@ -41,15 +40,40 @@ async function bootstrap (bootstrapData: BootstrapData, plugins: PluginInfo[], s }) const module = getRootModule(pluginModules) window['rootModule'] = module - const moduleRef = await platformBrowserDynamic([ - { provide: BOOTSTRAP_DATA, useValue: bootstrapData }, - ]).bootstrapModule(module) - if (process.env.TABBY_DEV) { - const applicationRef = moduleRef.injector.get(ApplicationRef) - const componentRef = applicationRef.components[0] - enableDebugTools(componentRef) + + function crawlProviders (m) { + if (m.ngModule) { + return [...crawlProviders(m.ngModule), ...m.providers ?? []] + } + const providers = m.ɵinj?.providers ?? [] + for (const exp of m.ɵmod?.exports ?? []) { + providers.push(...crawlProviders(exp)) + } + return providers } - return moduleRef + + const providers = pluginModules.map(x => crawlProviders(x)).flat() + + console.log(providers) + + bootstrapApplication( + pluginModules.find(x => x.bootstrap).bootstrap, + { + providers: [ + { provide: BOOTSTRAP_DATA, useValue: bootstrapData }, + ...providers, + ], + }, + ) + // const moduleRef = await platformBrowserDynamic([ + // { provide: BOOTSTRAP_DATA, useValue: bootstrapData }, + // ]).bootstrapModule(module) + // if (process.env.TABBY_DEV) { + // const applicationRef = moduleRef.injector.get(ApplicationRef) + // const componentRef = applicationRef.components[0] + // enableDebugTools(componentRef) + // } + // return moduleRef } ipcRenderer.once('start', async (_$event, bootstrapData: BootstrapData) => { diff --git a/app/webpack.config.mjs b/app/webpack.config.mjs index 773f8280..ddda811a 100644 --- a/app/webpack.config.mjs +++ b/app/webpack.config.mjs @@ -34,8 +34,9 @@ export default () => ({ test: /\.(m?)js$/, loader: 'babel-loader', options: { - compact: false, plugins: [linkerPlugin], + compact: false, + cacheDirectory: true, }, resolve: { fullySpecified: false, diff --git a/tabby-core/src/components/appRoot.component.ts b/tabby-core/src/components/appRoot.component.ts index cd51c9d9..221f7304 100644 --- a/tabby-core/src/components/appRoot.component.ts +++ b/tabby-core/src/components/appRoot.component.ts @@ -17,6 +17,7 @@ import { SafeModeModalComponent } from './safeModeModal.component' import { TabBodyComponent } from './tabBody.component' import { SplitTabComponent } from './splitTab.component' import { AppService, Command, CommandLocation, FileTransfer, HostWindowService, PlatformService } from '../api' +import { CommonModule } from '@angular/common' function makeTabAnimation (dimension: string, size: number) { return [ @@ -54,6 +55,8 @@ function makeTabAnimation (dimension: string, size: number) { /** @hidden */ @Component({ + imports: [CommonModule], + standalone: true, selector: 'app-root', template: require('./appRoot.component.pug'), styles: [require('./appRoot.component.scss')], diff --git a/tabby-core/src/index.ts b/tabby-core/src/index.ts index a1cced46..d6c801ee 100644 --- a/tabby-core/src/index.ts +++ b/tabby-core/src/index.ts @@ -125,17 +125,8 @@ const PROVIDERS = [ CdkAutoDropGroup, ProfileIconComponent, ], - entryComponents: [ - AppRootComponent, - PromptModalComponent, - RenameTabModalComponent, - SafeModeModalComponent, - SelectorModalComponent, - SplitTabComponent, - UnlockVaultModalComponent, - WelcomeTabComponent, - ], exports: [ + AppRootComponent, CheckboxComponent, ToggleComponent, PromptModalComponent, diff --git a/tabby-local/src/index.ts b/tabby-local/src/index.ts index bdcaad0e..c43f743a 100644 --- a/tabby-local/src/index.ts +++ b/tabby-local/src/index.ts @@ -1,5 +1,5 @@ import { NgModule } from '@angular/core' -import { BrowserModule } from '@angular/platform-browser' +// import { BrowserModule } from '@angular/platform-browser' import { FormsModule } from '@angular/forms' import { NgbModule } from '@ng-bootstrap/ng-bootstrap' import { ToastrModule } from 'ngx-toastr' @@ -46,7 +46,7 @@ import { LocalProfilesService } from './profiles' /** @hidden */ @NgModule({ imports: [ - BrowserModule, + // BrowserModule, FormsModule, NgbModule, ToastrModule, @@ -90,11 +90,6 @@ import { LocalProfilesService } from './profiles' WSLShellProvider, WindowsStockShellsProvider, ], - entryComponents: [ - TerminalTabComponent, - ShellSettingsTabComponent, - LocalProfileSettingsComponent, - ], declarations: [ TerminalTabComponent, ShellSettingsTabComponent, diff --git a/tabby-plugin-manager/src/index.ts b/tabby-plugin-manager/src/index.ts index bcc98971..9bee096b 100644 --- a/tabby-plugin-manager/src/index.ts +++ b/tabby-plugin-manager/src/index.ts @@ -1,5 +1,5 @@ import { NgModule } from '@angular/core' -import { BrowserModule } from '@angular/platform-browser' +// import { BrowserModule } from '@angular/platform-browser' import { FormsModule } from '@angular/forms' import { NgbModule } from '@ng-bootstrap/ng-bootstrap' @@ -12,7 +12,7 @@ import { PluginsSettingsTabProvider } from './settings' @NgModule({ imports: [ - BrowserModule, + // BrowserModule, FormsModule, NgbModule, TabbyCorePlugin, @@ -20,9 +20,6 @@ import { PluginsSettingsTabProvider } from './settings' providers: [ { provide: SettingsTabProvider, useClass: PluginsSettingsTabProvider, multi: true }, ], - entryComponents: [ - PluginsSettingsTabComponent, - ], declarations: [ PluginsSettingsTabComponent, ], diff --git a/tabby-serial/src/index.ts b/tabby-serial/src/index.ts index 30530e3d..4f4261b4 100644 --- a/tabby-serial/src/index.ts +++ b/tabby-serial/src/index.ts @@ -30,10 +30,6 @@ import { SerialProfilesService } from './profiles' { provide: TabRecoveryProvider, useClass: RecoveryProvider, multi: true }, { provide: HotkeyProvider, useClass: SerialHotkeyProvider, multi: true }, ], - entryComponents: [ - SerialProfileSettingsComponent, - SerialTabComponent, - ], declarations: [ SerialProfileSettingsComponent, SerialTabComponent, diff --git a/tabby-settings/src/index.ts b/tabby-settings/src/index.ts index 13fa5a73..b500cea6 100644 --- a/tabby-settings/src/index.ts +++ b/tabby-settings/src/index.ts @@ -1,5 +1,5 @@ import { NgModule } from '@angular/core' -import { BrowserModule } from '@angular/platform-browser' +// import { BrowserModule } from '@angular/platform-browser' import { FormsModule } from '@angular/forms' import { NgbModule } from '@ng-bootstrap/ng-bootstrap' import { InfiniteScrollModule } from 'ngx-infinite-scroll' @@ -30,7 +30,7 @@ import { HotkeySettingsTabProvider, WindowSettingsTabProvider, VaultSettingsTabP /** @hidden */ @NgModule({ imports: [ - BrowserModule, + // BrowserModule, FormsModule, NgbModule, TabbyCorePlugin, @@ -46,18 +46,6 @@ import { HotkeySettingsTabProvider, WindowSettingsTabProvider, VaultSettingsTabP { provide: SettingsTabProvider, useClass: ProfilesSettingsTabProvider, multi: true }, { provide: SettingsTabProvider, useClass: ConfigSyncSettingsTabProvider, multi: true }, ], - entryComponents: [ - EditProfileModalComponent, - HotkeyInputModalComponent, - HotkeySettingsTabComponent, - ProfilesSettingsTabComponent, - SettingsTabComponent, - SetVaultPassphraseModalComponent, - VaultSettingsTabComponent, - WindowSettingsTabComponent, - ConfigSyncSettingsTabComponent, - ReleaseNotesComponent, - ], declarations: [ EditProfileModalComponent, HotkeyInputModalComponent, diff --git a/tabby-ssh/src/index.ts b/tabby-ssh/src/index.ts index ba069a62..fa5f529d 100644 --- a/tabby-ssh/src/index.ts +++ b/tabby-ssh/src/index.ts @@ -48,15 +48,6 @@ import { SFTPCreateDirectoryModalComponent } from './components/sftpCreateDirect { provide: ProfileProvider, useExisting: SSHProfilesService, multi: true }, { provide: SFTPContextMenuItemProvider, useClass: CommonSFTPContextMenu, multi: true }, ], - entryComponents: [ - SSHProfileSettingsComponent, - SFTPDeleteModalComponent, - SFTPCreateDirectoryModalComponent, - SSHPortForwardingModalComponent, - SSHSettingsTabComponent, - SSHTabComponent, - HostKeyPromptModalComponent, - ], declarations: [ SSHProfileSettingsComponent, SFTPDeleteModalComponent, diff --git a/tabby-telnet/src/index.ts b/tabby-telnet/src/index.ts index abcb5d14..3798379e 100644 --- a/tabby-telnet/src/index.ts +++ b/tabby-telnet/src/index.ts @@ -32,10 +32,6 @@ import { TelnetProfilesService } from './profiles' { provide: HotkeyProvider, useClass: TelnetHotkeyProvider, multi: true }, { provide: ProfileProvider, useExisting: TelnetProfilesService, multi: true }, ], - entryComponents: [ - TelnetProfileSettingsComponent, - TelnetTabComponent, - ], declarations: [ TelnetProfileSettingsComponent, TelnetTabComponent, diff --git a/tabby-terminal/src/index.ts b/tabby-terminal/src/index.ts index 0b0689f6..9aee1972 100644 --- a/tabby-terminal/src/index.ts +++ b/tabby-terminal/src/index.ts @@ -1,5 +1,5 @@ import { NgModule } from '@angular/core' -import { BrowserModule } from '@angular/platform-browser' +// import { BrowserModule } from '@angular/platform-browser' import { FormsModule } from '@angular/forms' import { NgbModule } from '@ng-bootstrap/ng-bootstrap' import { ToastrModule } from 'ngx-toastr' @@ -37,7 +37,7 @@ import { TerminalCLIHandler } from './cli' /** @hidden */ @NgModule({ imports: [ - BrowserModule, + // BrowserModule, FormsModule, NgbModule, ToastrModule, @@ -61,12 +61,6 @@ import { TerminalCLIHandler } from './cli' { provide: CLIHandler, useClass: TerminalCLIHandler, multi: true }, ], - entryComponents: [ - AppearanceSettingsTabComponent, - ColorSchemeSettingsTabComponent, - TerminalSettingsTabComponent, - ColorSchemeSelectorComponent, - ], declarations: [ ColorPickerComponent, ColorSchemePreviewComponent, diff --git a/tabby-web-demo/src/index.ts b/tabby-web-demo/src/index.ts index 7c58e936..49c4ae5b 100644 --- a/tabby-web-demo/src/index.ts +++ b/tabby-web-demo/src/index.ts @@ -1,5 +1,5 @@ import { NgModule } from '@angular/core' -import { BrowserModule } from '@angular/platform-browser' +// import { BrowserModule } from '@angular/platform-browser' import { FormsModule } from '@angular/forms' import { NgbModule } from '@ng-bootstrap/ng-bootstrap' @@ -12,7 +12,7 @@ import { DemoProfilesService } from './profiles' /** @hidden */ @NgModule({ imports: [ - BrowserModule, + // BrowserModule, FormsModule, NgbModule, TabbyCorePlugin, @@ -21,9 +21,6 @@ import { DemoProfilesService } from './profiles' providers: [ { provide: ProfileProvider, useClass: DemoProfilesService, multi: true }, ], - entryComponents: [ - DemoTerminalTabComponent, - ], declarations: [ DemoTerminalTabComponent, ], diff --git a/tabby-web/src/index.ts b/tabby-web/src/index.ts index 6fda15e4..067253ba 100644 --- a/tabby-web/src/index.ts +++ b/tabby-web/src/index.ts @@ -27,8 +27,5 @@ import './styles.scss' declarations: [ MessageBoxModalComponent, ], - entryComponents: [ - MessageBoxModalComponent, - ], }) export default class WebModule { } // eslint-disable-line @typescript-eslint/no-extraneous-class diff --git a/webpack.plugin.config.mjs b/webpack.plugin.config.mjs index 71bb9cc0..f7e968e8 100644 --- a/webpack.plugin.config.mjs +++ b/webpack.plugin.config.mjs @@ -55,17 +55,6 @@ export default options => { module: { rules: [ ...options.rules ?? [], - { - test: /\.mjs$/, - loader: 'babel-loader', - options: { - compact: false, - plugins: [linkerPlugin], - }, - resolve: { - fullySpecified: false, - }, - }, { test: /\.js$/, enforce: 'pre', @@ -84,12 +73,26 @@ export default options => { }, { test: /\.ts$/, - use: { - loader: 'ts-loader', - options: { - configFile: path.resolve(options.dirname, 'tsconfig.json'), - allowTsInNodeModules: true, + use: [ + { + loader: 'ts-loader', + options: { + configFile: path.resolve(options.dirname, 'tsconfig.json'), + allowTsInNodeModules: true, + }, }, + ], + }, + { + test: /\.mjs$/, + loader: 'babel-loader', + options: { + plugins: [linkerPlugin], + compact: false, + cacheDirectory: true, + }, + resolve: { + fullySpecified: false, }, }, { test: /\.pug$/, use: ['apply-loader', 'pug-loader'] },