massNav is optional

client/mass/about.ts

@@ -19,6 +19,8 @@ import { getProfileLogin } from '../plots/profilePlot.js'
 - server info
 */
 
+const cohortTableActiveColor = 'yellow'
+
 // this type is fully defined in MassNav def in dataset.ts but not in a form that can extract "about" config to share. thus need to repeat here to avoid tsc err
 type AboutObj = {
 	html: string
@@ -258,7 +260,7 @@ export class MassAbout {
 			}
 		}
 		const activeColumns = this.dom.cohortTable.selectAll(selector)
-		const color = state.termdbConfig.massNav.activeColor || 'yellow'
+		const color = state.termdbConfig.massNav?.activeColor || cohortTableActiveColor
 		activeColumns.style('background-color', color)
 	}
 

client/mass/nav.js

@@ -16,6 +16,8 @@ nav {}
 todo: steps to add a new tab
 */
 
+const navTabActiveColor = '#ececec' // default active color of nav tab
+
 // to be used for assigning unique
 // radio button names by object instance
 // otherwise termdp app popups
@@ -428,7 +430,7 @@ function setRenderers(self) {
 			.style('color', d => (d.colNum == self.activeTab ? '#000' : 'gray'))
 			.style('background-color', d =>
 				d.colNum == self.activeTab && self.dom.subheaderDiv.style('display') != 'none'
-					? self.state.termdbConfig.massNav.activeColor || '#ececec'
+					? self.state.termdbConfig.massNav?.activeColor || navTabActiveColor
 					: 'transparent'
 			)
 			.html(function (d, i) {

shared/types/src/dataset.ts

@@ -1238,6 +1238,7 @@ type MassNav = {
 			}
 		}
 	}
+	/** customize background color of active navigation tab */
 	activeColor?: string
 }