Refactor switcher links updates into one method

ui/src/dashboards/apis/index.ts

@@ -2,7 +2,7 @@ import AJAX from 'src/utils/ajax'
 
 import {
   linksFromDashboards,
-  updateActiveDashboardLink,
+  updateDashboardLinks,
 } from 'src/dashboards/utils/dashboardSwitcherLinks'
 
 import {AxiosResponse} from 'axios'
@@ -30,7 +30,7 @@ export const loadDashboardLinks = async (
   } = await dashboardsAJAX()
 
   const links = linksFromDashboards(dashboards, source)
-  const dashboardLinks = updateActiveDashboardLink(links, activeDashboard)
+  const dashboardLinks = updateDashboardLinks(links, activeDashboard)
 
   return dashboardLinks
 }

ui/src/dashboards/containers/DashboardPage.tsx

@@ -24,10 +24,7 @@ import * as notifyActions from 'src/shared/actions/notifications'
 import idNormalizer, {TYPE_ID} from 'src/normalizers/id'
 import {millisecondTimeRange} from 'src/dashboards/utils/time'
 import {getDeep} from 'src/utils/wrappers'
-import {
-  updateActiveDashboardLink,
-  updateDashboardLinkName,
-} from 'src/dashboards/utils/dashboardSwitcherLinks'
+import {updateDashboardLinks} from 'src/dashboards/utils/dashboardSwitcherLinks'
 
 // APIs
 import {loadDashboardLinks} from 'src/dashboards/apis'
@@ -362,7 +359,7 @@ class DashboardPage extends Component<Props, State> {
 
   private updateActiveDashboard(): void {
     this.setState((prevState, props) => ({
-      dashboardLinks: updateActiveDashboardLink(
+      dashboardLinks: updateDashboardLinks(
         prevState.dashboardLinks,
         props.dashboard
       ),
@@ -448,16 +445,7 @@ class DashboardPage extends Component<Props, State> {
 
     this.props.updateDashboard(newDashboard)
     await this.props.putDashboard(newDashboard)
-    this.updateLinkName()
-  }
-
-  private updateLinkName(): void {
-    this.setState((prevState, props) => ({
-      dashboardLinks: updateDashboardLinkName(
-        prevState.dashboardLinks,
-        props.dashboard
-      ),
-    }))
+    this.updateActiveDashboard()
   }
 
   private handleDeleteDashboardCell = (cell: DashboardsModels.Cell): void => {

ui/src/dashboards/utils/dashboardSwitcherLinks.ts

@@ -21,7 +21,20 @@ export const linksFromDashboards = (
   return {links, active: null}
 }
 
-export const updateActiveDashboardLink = (
+export const updateDashboardLinks = (
+  dashboardLinks: DashboardSwitcherLinks,
+  activeDashboard: Dashboard
+) => {
+  const {active} = dashboardLinks
+
+  if (!active || active.key !== String(activeDashboard.id)) {
+    return updateActiveDashboardLink(dashboardLinks, activeDashboard)
+  }
+
+  return updateDashboardLinkName(dashboardLinks, activeDashboard)
+}
+
+const updateActiveDashboardLink = (
   dashboardLinks: DashboardSwitcherLinks,
   dashboard: Dashboard
 ) => {
@@ -36,7 +49,7 @@ export const updateActiveDashboardLink = (
   return {...dashboardLinks, active}
 }
 
-export const updateDashboardLinkName = (
+const updateDashboardLinkName = (
   dashboardLinks: DashboardSwitcherLinks,
   dashboard: Dashboard
 ): DashboardSwitcherLinks => {

ui/test/dashboards/utils/dashboardSwitcherLinks.test.ts

@@ -1,7 +1,6 @@
 import {
   linksFromDashboards,
-  updateActiveDashboardLink,
-  updateDashboardLinkName,
+  updateDashboardLinks,
 } from 'src/dashboards/utils/dashboardSwitcherLinks'
 import {dashboard, source} from 'test/resources'
 
@@ -35,19 +34,19 @@ describe('dashboards.utils.dashboardSwitcherLinks', () => {
     })
   })
 
-  const link1 = {
-    key: '9001',
-    text: 'Low Dash',
-    to: '/sources/897/dashboards/9001',
-  }
+  describe('updateDashboardLinks', () => {
+    const link1 = {
+      key: '9001',
+      text: 'Low Dash',
+      to: '/sources/897/dashboards/9001',
+    }
 
-  const link2 = {
-    key: '2282',
-    text: 'Other Dash',
-    to: '/sources/897/dashboards/2282',
-  }
+    const link2 = {
+      key: '2282',
+      text: 'Other Dash',
+      to: '/sources/897/dashboards/2282',
+    }
 
-  describe('updateActiveDashboardLink', () => {
     const activeDashboard = {
       ...dashboard,
       id: 123,
@@ -63,10 +62,7 @@ describe('dashboards.utils.dashboardSwitcherLinks', () => {
     const links = [link1, activeLink, link2]
     it('can set the active link', () => {
       const loadedLinks = {links, active: null}
-      const actualLinks = updateActiveDashboardLink(
-        loadedLinks,
-        activeDashboard
-      )
+      const actualLinks = updateDashboardLinks(loadedLinks, activeDashboard)
       const expectedLinks = {links, active: activeLink}
 
       expect(actualLinks).toEqual(expectedLinks)
@@ -74,14 +70,12 @@ describe('dashboards.utils.dashboardSwitcherLinks', () => {
 
     it('can handle a missing dashboard', () => {
       const loadedLinks = {links, active: null}
-      const actualLinks = updateActiveDashboardLink(loadedLinks, undefined)
+      const actualLinks = updateDashboardLinks(loadedLinks, undefined)
       const expectedLinks = {links, active: null}
 
       expect(actualLinks).toEqual(expectedLinks)
     })
-  })
 
-  describe('updateDashboardLinkName', () => {
     const staleDashboard = {
       ...dashboard,
       id: 3000,
@@ -94,40 +88,17 @@ describe('dashboards.utils.dashboardSwitcherLinks', () => {
       to: '/sources/897/dashboards/3000',
     }
 
-    const links = [link1, staleLink, link2]
+    const staleLinks = [link1, staleLink, link2]
     const updatedDashboard = {...staleDashboard, name: 'New Dashboard Name'}
 
-    const dashboardLinks = {
-      links,
-      active: link1,
+    const staleDashboardLinks = {
+      links: staleLinks,
+      active: staleLink,
     }
 
-    it('can update the name of a provided dashboard', () => {
-      const actualDashLinks = updateDashboardLinkName(
-        dashboardLinks,
-        updatedDashboard
-      )
-
-      const expectedDashlinks = {
-        links: [
-          link1,
-          {
-            key: '3000',
-            text: 'New Dashboard Name',
-            to: '/sources/897/dashboards/3000',
-          },
-          link2,
-        ],
-        active: link1,
-      }
-
-      expect(actualDashLinks).toEqual(expectedDashlinks)
-    })
-
-    it('can update name for active link', () => {
-      const linksWithStaleActive = {...dashboardLinks, active: staleLink}
-      const actualLinks = updateDashboardLinkName(
-        linksWithStaleActive,
+    it('can update name for dashboard', () => {
+      const actualLinks = updateDashboardLinks(
+        staleDashboardLinks,
         updatedDashboard
       )