Angular 19 SSR

[erwinagpasa]

Describe the bug
Flowbite isn't initialized immediately after saving app.component.html, and a browser reload is required for it to work.

To Reproduce
Steps to reproduce the behavior:

1. Clone https://github.com/erwinagpasa/ngdashboard
2. Edit app.component.html
3. Then save

Expected behavior
Flowbite should initialize automatically, and the modal should work without needing to reload the browser.

//! app/services/flowbite.service.ts

import { Injectable, Inject, PLATFORM_ID } from '@angular/core';
import { isPlatformBrowser } from '@angular/common';

@Injectable({
  providedIn: 'root'
})
export class FlowbiteService {
  constructor(@Inject(PLATFORM_ID) private platformId: any) { }

  loadFlowbite(callback: (flowbite: any) => void) {
    if (isPlatformBrowser(this.platformId)) {
      import('flowbite').then(flowbite => {
        callback(flowbite);
      });
    }
  }
}

//! /Users/developer/angular-project/ngdashboard/src/app/app.component.ts

import { Component, OnInit } from '@angular/core';
import { RouterOutlet } from '@angular/router';
import { FlowbiteService } from './services/flowbite.service';
import { initFlowbite } from 'flowbite';

@Component({
  selector: 'app-root',
  imports: [RouterOutlet],
  templateUrl: './app.component.html',
  styleUrl: './app.component.css'
})
export class AppComponent implements OnInit {
  title = 'ngdashboard';

  constructor(private flowbiteService: FlowbiteService) { }

  ngOnInit(): void {
    this.flowbiteService.loadFlowbite((flowbite) => {
      initFlowbite();
    });
  }

}

/Users/developer/angular-project/ngdashboard/src/styles.css

@import "tailwindcss";
@import "flowbite/src/themes/default";
/* @plugin "flowbite/plugin"; */
@source "../node_modules/flowbite";