flowbite-angular icon indicating copy to clipboard operation
flowbite-angular copied to clipboard

[Bug] {SCOPE} - 19 SSR

Open erwinagpasa opened this issue 9 months ago • 0 comments

Is this a regression?

Yes

Description

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";

Please provide the exception or error you saw


OS

Unix (Linux, macOS, etc.)

Browser

None

Node version

23.6.0

Flowbite-angular version

3.1.2

Anything else?

No response

erwinagpasa avatar Mar 23 '25 19:03 erwinagpasa