web/satellite: inactivity timer to dashboard added

added InactivityTimerEnabled flag to enable/disable feature
added InactivityTimerDelay to configure delay time in seconds
default timer set up to 10 minutes
reset dom events: keypress, mouseover, mousedown, touchmove

Change-Id: Idb66067c2902b2cdbe1a972225319c8abff97927

satellite/console/consoleweb/server.go

@@ -94,6 +94,8 @@ type Config struct {
 	NewProjectDashboard             bool    `help:"indicates if new project dashboard should be used" default:"false"`
 	NewNavigation                   bool    `help:"indicates if new navigation structure should be rendered" default:"true"`
 	NewObjectsFlow                  bool    `help:"indicates if new objects flow should be used" default:"true"`
+	InactivityTimerEnabled          bool    `help:"indicates if session can be timed out due inactivity" default:"false"`
+	InactivityTimerDelay            int     `help:"inactivity timer delay in seconds" default:"600"`
 
 	// RateLimit defines the configuration for the IP and userID rate limiters.
 	RateLimit web.RateLimiterConfig
@@ -386,6 +388,8 @@ func (server *Server) appHandler(w http.ResponseWriter, r *http.Request) {
 		DefaultPaidBandwidthLimit       memory.Size
 		NewNavigation                   bool
 		NewObjectsFlow                  bool
+		InactivityTimerEnabled          bool
+		InactivityTimerDelay            int
 	}
 
 	data.ExternalAddress = server.config.ExternalAddress
@@ -416,6 +420,8 @@ func (server *Server) appHandler(w http.ResponseWriter, r *http.Request) {
 	data.NewProjectDashboard = server.config.NewProjectDashboard
 	data.NewNavigation = server.config.NewNavigation
 	data.NewObjectsFlow = server.config.NewObjectsFlow
+	data.InactivityTimerEnabled = server.config.InactivityTimerEnabled
+	data.InactivityTimerDelay = server.config.InactivityTimerDelay
 
 	templates, err := server.loadTemplates()
 	if err != nil || templates.index == nil {

scripts/testdata/satellite-config.yaml.lock

@@ -178,6 +178,12 @@ compensation.withheld-percents: 75,75,75,50,50,50,25,25,25,0,0,0,0,0,0
 # url link to general request page
 # console.general-request-url: https://supportdcs.storj.io/hc/en-us/requests/new?ticket_form_id=360000379291
 
+# inactivity timer delay in seconds
+# console.inactivity-timer-delay: 600
+
+# indicates if session can be timed out due inactivity
+# console.inactivity-timer-enabled: false
+
 # indicates if satellite is in beta
 # console.is-beta-satellite: false
 

web/satellite/index.html

@@ -30,6 +30,8 @@
     <meta name="default-paid-bandwidth-limit" content="{{ .DefaultPaidBandwidthLimit }}">
     <meta name="new-navigation-structure" content="{{ .NewNavigation }}">
     <meta name="new-objects-flow" content="{{ .NewObjectsFlow }}">
+    <meta name="inactivity-timer-enabled" content="{{ .InactivityTimerEnabled }}">
+    <meta name="inactivity-timer-delay" content="{{ .InactivityTimerDelay }}">
     <title>{{ .SatelliteName }}</title>
     <link rel="shortcut icon" href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAMAAABEpIrGAAACDVBMVEUAAAD///////////////////////////////////////////////////////////////////////////////8nbP8obf8pbf8qbv8rb/8sb/8tcP8ucf8vcf8vcv8xc/8zdP81df81dv82dv83d/84eP85eP86ef87ev89e/8+fP8/fP9Aff9Bfv9Cfv9Df/9EgP9FgP9Ggf9Hgv9Jg/9LhP9Mhf9Nhv9Oh/9Ph/9RiP9Rif9Sif9Ui/9Vi/9WjP9Xjf9Yjf9aj/9dkf9ekf9ilP9jlf9llv9nl/9omP9rmv9sm/9tnP9vnf9wnv9yn/91of92ov93o/94o/98pv9/qP+Bqf+Cqv+Eq/+FrP+Hrf+Irv+Jr/+Kr/+Msf+Nsv+Stf+Ttf+Ttv+Utv+Vt/+WuP+XuP+Zuf+Zuv+hv/+kwf+lwv+mwv+nw/+oxP+pxP+pxf+qxf+rxv+yy/+0zP+1zf+3zv+4z/+60P+70f+90v+/0/+/1P/B1f/D1v/E1//F1//F2P/G2P/H2f/I2v/J2v/K2//L3P/P3v/Q3//R4P/S4P/V4v/V4//W4//X5P/Y5P/b5v/b5//c5//d6P/e6f/f6f/g6v/h6//j7P/k7f/l7f/m7v/q8f/r8f/u8//w9f/x9f/x9v/z9//0+P/2+f/3+f/3+v/4+v/5+//6/P/8/f/9/v/+/v////9uCbVDAAAAFXRSTlMABAU4Ozw9PpSWl5ilp6ip4+Tl/P6nIcp/AAAAAWJLR0SuuWuTpwAAAh5JREFUOMtjYGBgYOcXEl6HAYSF+FgZQICJex1OwMkEVIAi3+Xh1ozM5wKaj8xfpBwcITsbWYSNgR+JtzpJYvU6jbAVSEK8DEIITpOZqnxItISWfgVCTJAB7v4ZXpKRC9uMNCqXJci6TID7hQFMrV2zJE7abTKQFesDJGb7SYTOX7sGLAVWUKCgrGZcDeaDFaxb12alqC6XDlMwTyKnRLJ1HbKCddNEc0skJkAVdEssXatRiKqgVmLlatUqqILVpuaOEnLJy4GsIhONuHlAOldVwtJWcwnMDb2i4dPKdHVKV3uqRCdYqU9psVDOmh0vUQN35FTRhevWLU+V0FeZBdTtpSQRvgAoKtuMqmBdpKxvKYjXJ+o+cx0WBRPFO6ABHuesMheLghIdePiutc7AoqBLchZchVMSFgUr9HTS8sEgL1C0E1XBRNGUeeV6OlFONjbqSjY2Nv7mKjnzMyXqYQrW2OsYS8smLkOE5OpsFSkdQ6PlUAU9EgtXq6MFdZ3EkpVKNVAFc8TKW6QbURVMFK1slOyGuSFdUkLOoQtZwSRXaRmpKLgj1y1eMjdIImguTMHCCAnvGcuXQhIMPMl1O8hnrOy31GtfnaNi3oRIcohEu7ZY20DZK0DGTCV7NVKi5UVK40vDJVatU/dfgCTEw8AsgsSdLx+TKjUdOeMAsycnMr/BzrIcmc8ByrycuDMvByM4f7PyCmLL/gK8LEBJALYsGEdXEyupAAAAAElFTkSuQmCC" type="image/x-icon">
     <link rel="dns-prefetch" href="https://js.stripe.com">

web/satellite/src/views/DashboardArea.vue

@@ -82,6 +82,8 @@ import { APP_STATE_ACTIONS } from '@/utils/constants/actionNames';
 import { AppState } from '@/utils/constants/appStateEnum';
 import { LocalData } from '@/utils/localData';
 import { User } from "@/types/users";
+import { AuthHttpApi } from "@/api/auth";
+import { MetaUtils } from "@/utils/meta";
 
 const {
     SETUP_ACCOUNT,
@@ -104,6 +106,10 @@ const {
     },
 })
 export default class DashboardArea extends Vue {
+    // List of DOM events that resets inactivity timer.
+    private readonly resetActivityEvents: string[] = ['keypress', 'mousemove', 'mousedown', 'touchmove'];
+    private readonly auth: AuthHttpApi = new AuthHttpApi();
+    private inactivityTimerId: ReturnType<typeof setTimeout>;
     // Minimum number of recovery codes before the recovery code warning bar is shown.
     public recoveryCodeWarningThreshold = 4;
 
@@ -114,6 +120,7 @@ export default class DashboardArea extends Vue {
      * Pre fetches user`s and project information.
      */
     public async mounted(): Promise<void> {
+        this.setupInactivityTimers();
         try {
             await this.$store.dispatch(USER_ACTIONS.GET);
         } catch (error) {
@@ -318,6 +325,54 @@ export default class DashboardArea extends Vue {
     private get isCreateProjectPage(): boolean {
         return this.$route.name === RouteConfig.CreateProject.name;
     }
+
+    /**
+     * Sets up timer id with given delay.
+     */
+    private startInactivityTimer(): void {
+        const inactivityTimerDelayInSeconds = MetaUtils.getMetaContent('inactivity-timer-delay');
+
+        this.inactivityTimerId = setTimeout(this.handleInactive, parseInt(inactivityTimerDelayInSeconds) * 1000);
+    }
+
+    /**
+     * Performs logout and cleans event listeners.
+     */
+    private async handleInactive(): Promise<void> {
+        try {
+            await this.auth.logout();
+            this.resetActivityEvents.forEach((eventName: string) => {
+                document.removeEventListener(eventName, this.resetInactivityTimer);
+            });
+            await this.$router.push(RouteConfig.Login.path);
+            await this.$notify.notify('Your session was timed out.');
+        } catch (error) {
+            await this.$notify.error(error.message);
+        }
+    }
+
+    /**
+     * Resets inactivity timer.
+     */
+    private resetInactivityTimer(): void {
+        clearTimeout(this.inactivityTimerId);
+        this.startInactivityTimer();
+    }
+
+    /**
+     * Adds DOM event listeners and starts timer.
+     */
+    private setupInactivityTimers(): void {
+        const isInactivityTimerEnabled = MetaUtils.getMetaContent('inactivity-timer-enabled');
+
+        if (isInactivityTimerEnabled === 'false') return;
+
+        this.resetActivityEvents.forEach((eventName: string) => {
+            document.addEventListener(eventName, this.resetInactivityTimer, false);
+        });
+
+        this.startInactivityTimer();
+    }
 }
 </script>