From 3e67713c6e47c840570953b0cc3f324c5e0534fe Mon Sep 17 00:00:00 2001
From: Adam Driscoll <adam.r.driscoll@gmail.com>
Date: Thu, 8 Nov 2018 20:15:23 -0700
Subject: [PATCH] Fixes issue with dynamic pages

---
 .../Integration/Page.Tests.ps1                | 22 ++++++++++++++++++-
 src/client/src/app/ud-dashboard.jsx           | 15 ++++++++-----
 2 files changed, 30 insertions(+), 7 deletions(-)

diff --git a/src/UniversalDashboard.UITest/Integration/Page.Tests.ps1 b/src/UniversalDashboard.UITest/Integration/Page.Tests.ps1
index ef39c66b..518def7c 100644
--- a/src/UniversalDashboard.UITest/Integration/Page.Tests.ps1
+++ b/src/UniversalDashboard.UITest/Integration/Page.Tests.ps1
@@ -80,8 +80,16 @@ Describe "New-UDPage" {
         $Page3 = New-UDPage -Name "Test" -Content {
             New-UDCard -Text "TestPage" -Id "Test-Page"
         }
+
+        $Page4 = New-UDPage -Url "/level/:test" -Endpoint {
+            New-UDCard -Text "Level 1" -Id "Level1"
+        }
+
+        $Page5 = New-UDPage -Url "/level/level2/:test" -Endpoint {
+            New-UDCard -Text "Level 2" -Id "Level2"
+        }
         
-        $dashboard = New-UDDashboard -Title "Test" -Pages @($Page1, $Page2, $Page3)
+        $dashboard = New-UDDashboard -Title "Test" -Pages @($Page1, $Page2, $Page3, $Page5, $Page4)
         $Server = Start-UDDashboard -Port 10001 -Dashboard $dashboard
         $Driver = Start-SeFirefox
         Enter-SeUrl -Driver $Driver -Url "http://localhost:$BrowserPort"
@@ -119,6 +127,18 @@ Describe "New-UDPage" {
             (Find-SeElement -Id 'home-page' -Driver $Driver).text | Should not be $TestPageText
         }
 
+        it "should have level 1 but not level 2" {
+            Enter-SeUrl -Driver $Driver -Url "http://localhost:$BrowserPort/level/1"
+            Find-SeElement -Id 'Level1' -Driver $Driver | Should not be $null
+            Find-SeElement -Id 'Level2' -Driver $Driver | Should be $null
+        }
+
+        it "should have level 2 but not level 1" {
+            Enter-SeUrl -Driver $Driver -Url "http://localhost:$BrowserPort/level/level2/1"
+            Find-SeElement -Id 'Level1' -Driver $Driver | Should be $null
+            Find-SeElement -Id 'Level2' -Driver $Driver | Should not be $null
+        }
+
         Stop-SeDriver $Driver
         Stop-UDDashboard -Server $Server 
     }
diff --git a/src/client/src/app/ud-dashboard.jsx b/src/client/src/app/ud-dashboard.jsx
index e4c7507e..b9811e5d 100644
--- a/src/client/src/app/ud-dashboard.jsx
+++ b/src/client/src/app/ud-dashboard.jsx
@@ -2,7 +2,8 @@ import React,{Suspense} from 'react';
 
 import {
     Route,
-    Redirect
+    Redirect,
+    Switch
 } from 'react-router-dom'
 import {getApiPath} from 'config';
 import UdPage from './ud-page.jsx';
@@ -289,7 +290,7 @@ export default class UdDashboard extends React.Component {
             if (x.url === null) return null;
 
             return <Route path={x.url} render={props => (
-                <UdPage id={x.id} dynamic={true} {...props} autoRefresh={x.autoRefresh} refreshInterval={x.refreshInterval}/>
+                <UdPage id={x.id} dynamic={true} {...props} autoRefresh={x.autoRefresh} refreshInterval={x.refreshInterval} key={props.location.key}/>
             )} />
         })
 
@@ -297,7 +298,7 @@ export default class UdDashboard extends React.Component {
             if (x.url !== null) return null;
 
             return <Route path={'/' + x.name.replace(/ /g, "-")} render={props => (
-                <UdPage dynamic={false} {...x} {...props} autoRefresh={x.autoRefresh} refreshInterval={x.refreshInterval}/>
+                <UdPage dynamic={false} {...x} {...props} autoRefresh={x.autoRefresh} refreshInterval={x.refreshInterval} key={props.location.key}/>
             )} />
         })
 
@@ -314,9 +315,11 @@ export default class UdDashboard extends React.Component {
                         authenticated={this.state.authenticated}
                         />,
                 <main style={{background: this.state.dashboard.backgroundColor, color: this.state.dashboard.fontColor}}>
-                    {staticPages}
-                    {dynamicPages}
-                    <Route exact path="/" render={this.redirectToHomePage.bind(this)}/>
+                    <Switch>
+                        {staticPages}
+                        {dynamicPages}
+                        <Route exact path="/" render={this.redirectToHomePage.bind(this)} />
+                    </Switch>
                 </main>,
                 <Suspense fallback={<div></div>}>
                     <UdModalComponent />