Individual Service

SketchSystems.spec

Individual Service
  TimeTable*
    Today
    Future
    SlotsForProvider
      Select Slot -> SlotProvidersModal
      Remove Filter -> TimeTable
    
    Next Date -> Future
    Previous Date -> Today
    Filter Providers -> ProviderIndexModal
    Display Calendar -> CalendarModal
    Select Slot -> SlotProvidersModal
  
Modals
  ProviderIndexModal
    Select Provider -> SlotsForProvider
  SlotProvidersModal
    Change Slot -> TimeTable
    Select Provider -> ReviewModal
  CalendarModal
    Select Date -> Future
  ReviewModal
    Reviewing*
      Change Slot -> TimeTable
      Change Provider -> SlotProvidersModal
      Add to Cart -> CartSuccess
    CartSuccess
      Book Again -> TimeTable
  

SketchSystems_prototype.js

function render(model){
  let current_state_name = model.active_states[0].name;
  return $("h1",
           {style: {color: "darkBlue"}},
           `The current state is: ${current_state_name}`);
}