wip

2025-07-16 08:29:58 +00:00 · 2023-02-05 22:13:15 +01:00 · 2023-02-05 22:13:15 +01:00 · aef96f8b9b
commit aef96f8b9b
parent 0187a83cfe
15 changed files with 84 additions and 110 deletions
--- 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)
+                }
+            })
        }
    }

--- 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<NgModuleRef<any>> {
+async function bootstrap (bootstrapData: BootstrapData, plugins: PluginInfo[], safeMode = false): Promise<void> {
    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) => {
--- 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,
--- 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')],
--- 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,
--- 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,
--- 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,
    ],
--- 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,
--- 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,
--- 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,
--- 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,
--- 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,
--- 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,
    ],
--- 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
--- 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'] },