import { Component, Input, ChangeDetectionStrategy } from "@angular/core";
import { ActivatedRoute, Params, Router, RouterModule } from "@angular/router";
import { IonButton, IonicModule } from "@ionic/angular";

@Component({
    selector: "oe-flat-button",
    templateUrl: "./flat-widget-button.html",
    standalone: true,
    changeDetection: ChangeDetectionStrategy.Eager,
    imports: [IonicModule, RouterModule],
})
export class FlatWidgetButtonComponent {
    @Input() public link: { routeRelative?: ActivatedRoute; text: string; queryParams?: Params } | null = null;
    @Input() public color: "light" | "medium" | "primary" = "primary";
    @Input() public disabled: IonButton["disabled"] = false;
    @Input() public fill: IonButton["fill"] | undefined = undefined;
    @Input() public size: IonButton["size"] | undefined = undefined;

    constructor(private router: Router) {}

    protected navigateTo() {
        if (this.link == null) {
            return;
        }

        if (this.link.routeRelative != null) {
            this.router.navigate([this.link.text], {
                queryParams: this.link.queryParams ? this.link.queryParams : null,
                relativeTo: this.link.routeRelative,
            });
            return;
        }

        this.router.navigate(
            [this.link.text],
            this.link.queryParams ? { queryParams: this.link.queryParams } : { replaceUrl: true },
        );
    }
}
