Skip to content

ng2-idle move on multiple tabs screen stuck #188

@AhmerY

Description

@AhmerY

Screenshot 2023-07-07 105433

When the 15 sec countdown start for idle time I move the cursor of mouse in last sec. The screen redirect to login screen and stuck In angular 14.
The URL is redirect to login but it stuck on Home page.

import { Component, OnInit } from '@angular/core';
import { Idle, DEFAULT_INTERRUPTSOURCES } from 'ngx-idle';
import { NgbModal } from '@ng-bootstrap/ng-bootstrap';

@component({
selector: 'app-my-component',
template: <!-- Your component template -->
})
export class MyComponent implements OnInit {
constructor(private idle: Idle, private modalService: NgbModal) {}

ngOnInit() {
// Set the idle timeout duration (in seconds)
this.idle.setIdle(600); // 10 minutes

// Set the timeout duration (in seconds)
this.idle.setTimeout(15); // Disabled

// Set the interrupt events that will reset the idle timeout
this.idle.setInterrupts(DEFAULT_INTERRUPTSOURCES);

// Subscribe to idle timeout events
this.idle.onTimeoutWarning.subscribe((countdown) => {
  if (countdown === 1) {
    // Show the pop-up alert when the countdown reaches 1 (last minute)
    this.openAlertPopup();
  }
});

this.idle.onTimeout.subscribe(() => {
  // Perform the logout or any other necessary actions
  this.logout();
});

// Start watching for user inactivity
this.idle.watch();

}

openAlertPopup() {
// Open the pop-up alert using NgbModal
const modalRef = this.modalService.open(AlertPopupComponent);
modalRef.componentInstance.message = 'You will be logged out due to inactivity.';

modalRef.result.then((result) => {
  if (result === 'logout') {
    this.logout();
  }
});

}

logout() {
// Implement your logout logic here
}
}

Metadata

Metadata

Assignees

No one assigned

    Labels

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions