Hide Idle Session Timeout for all users(Host/Tenant) #9769

9 Answer(s)

• 

  0

  AI-Bot created one month ago

  Support Team ABP Agent

  To hide the "Idle Session Timeout" tab from the Settings page for all users (host and tenant) in an ABP Angular application, you need to remove or hide the related setting from the UI. The ABP Framework does not provide a direct configuration to hide individual settings tabs out-of-the-box, so you must customize the Angular UI.

  The recommended approach is to override or customize the Angular settings component to exclude the "Idle Session Timeout" tab. Here are the general steps:

  1. Locate the settings module/component in your Angular project (commonly under src/app/proxy/account/settings or similar).
  2. Find the code that defines the tabs for the Account settings.
  3. Remove or comment out the entry for the "Idle Session Timeout" tab, or add a condition to hide it for all users.

  If you want to ensure the setting is not available at the backend level as well, you can also override the related setting definition in your application layer to set isVisibleToClients: false for the idle session timeout setting. This will prevent it from being sent to the client.

  Example (in your module's SettingDefinitionProvider):

  context.Add(
      new SettingDefinition(
          AccountSettingNames.IdleSessionTimeout,
          defaultValue: "60",
          isVisibleToClients: false // Hide from all clients
      )
  );
  

  After making these changes, rebuild and redeploy your application. The "Idle Session Timeout" tab should no longer appear in the settings UI for any user.

  Sources:

  • ABP Idle Session Timeout Documentation

  ---

  This response was generated by AI. If it didn’t solve your problem, feel free to post a new answer — our support team will jump in to help you soon.

  Save Cancel
• 

  0

  Pallabi created one month ago

  AI agent answer does not work

  Save Cancel
• 

  0

  maliming created one month ago

  Support Team Fullstack Developer

  hi

  Do you mean you don't need this Idle feature and want to disable/hide it completely?

  Thanks,

  Save Cancel
• 

  0

  alper created one month ago

  Support Team Director

  you can hide it visually by adding the following CSS

  #IdleSessionTimeoutTab-tab {
      display: none;
  }
  

  • for MVC there's a global styling file => global-styles.css in the wwwroot folder.
  • for Angular styles.scss in the angular/src folder.

  Save Cancel
• 

  0

  Pallabi created one month ago

  [maliming] said: hi

  Do you mean you don't need this Idle feature and want to disable/hide it completely?

  Thanks,

  yes, we want to disable and hide this feature completely.

  Save Cancel
• 

  0

  Pallabi created one month ago

  [alper] said: you can hide it visually by adding the following CSS

  #IdleSessionTimeoutTab-tab { 
      display: none; 
  } 
  

  • for MVC there's a global styling file => global-styles.css in the wwwroot folder.
  • for Angular styles.scss in the angular/src folder.

  i tried your solution inside root and outside in styles.scss, but i can still see the tab and its content.

  

  Save Cancel
• 

  0

  maliming created one month ago

  Support Team Fullstack Developer

  hi

  I will ask our Angular team.

  Thanks.

  Save Cancel
• 

  0

  sumeyye.kurtulus created one month ago

  Support Team Angular Expert

  Hello,

  I can suggest you to hide the tab programmatically inside your app.component.ts

  //app.component.ts
  ngOnInit() {
      // Hide idle session timeout tab specifically
      const hideIdleTab = () => {
        const tabs = document.querySelectorAll('.nav-link');
        tabs.forEach(tab => {
          if (tab.textContent?.toLowerCase().includes('idle session timeout')) {
            tab.closest('.nav-item')?.remove();
          }
        });
      };
      
      hideIdleTab();
      // Watch for dynamic content
      new MutationObserver(hideIdleTab).observe(document.body, { childList: true, subtree: true });
    }
  

  You can let us know if you need further assistance. Thank you for your cooperation.

  Save Cancel
• 

  0

  Pallabi created one month ago

  [sumeyye.kurtulus] said: Hello,

  I can suggest you to hide the tab programmatically inside your app.component.ts

  //app.component.ts 
  ngOnInit() { 
      // Hide idle session timeout tab specifically 
      const hideIdleTab = () => { 
        const tabs = document.querySelectorAll('.nav-link'); 
        tabs.forEach(tab => { 
          if (tab.textContent?.toLowerCase().includes('idle session timeout')) { 
            tab.closest('.nav-item')?.remove(); 
          } 
        }); 
      }; 
       
      hideIdleTab(); 
      // Watch for dynamic content 
      new MutationObserver(hideIdleTab).observe(document.body, { childList: true, subtree: true }); 
    } 
  

  You can let us know if you need further assistance. Thank you for your cooperation.

  Hello,

  Your solution worked. Thank you so much for you quick assistance.

  Save Cancel

  1