Brainstorming ideas for highlighting sections on classroomio pages

goAndHighlight.ts

goAndHighlight('ROUTE_NAME', 'section', {
    key: 'value'
});


enum ROUTE_NAME {
 COURSE='/course/[id]'
 COURSE_SETTINGS='/course/[id]/settings'
 COURSE_CERTIFICATE
}

export ROUTE_SECTIONS = {
 'COURSE_SETTINGS': {
    'PUBLISH': 'publish'
  }
}

sectionName should be an object from the routename
function goAndHighlight(routeName: ROUTE_NAME, sectionName, routeValues) {
  // loop through keys of routeValues
  for {const routeValue in routeValues} {}
  // replace key in `routeName` with the value

  // add `?highlight` with the sectionName
}

multiple pages
each page has sections
and their ids should be unique

BEFORE goto('/course/{id}/settings?highlight=publish')

AFTER goAndHighlight('COURSE_SETTINGS', 'publish', { id: 'some-uuid', certificateId: '', soId: '' })



// ideally active should be types to section name
<AttentionHighlight
 active="sectionName"
>
    <some component here>
</AttentionHighlight>