1

const NUMBER_CODE = {type: 4, render: (str)=> `<span style="color: orange">${str}</span>` };
const CODES = {
  '(' : {type: 0, render: (str)=> `${str}` },
  ')' : {type: 0, render: (str)=> `${str}` },
  'F' : {type: 1, render: (str)=> `<span style="color: pink">${str}</span>` },
  'L' : {type: 2, render: (str)=> `<span style="color: red">${str}</span>` },
  'R' : {type: 3, render: (str)=> `<span style="color: green">${str}</span>` },
};
function highlight(code) {
  // Implement your syntax highlighter here
  // let  BASE = `<span style = \"color: ${color} \">${value}</span>`;
  returnStr = [];
  let memory = null;
  let letterBuffer = '';
  for(let i = 0; i < code.length; i++){
    let currentLetter = code[i]
    let current = CODES[currentLetter];
    if (current === undefined)
      current = NUMBER_CODE;
    if(memory !== null && memory.type === current.type){
      letterBuffer = letterBuffer + currentLetter;
      continue;
    }
    if(letterBuffer !== '') // First Time
      returnStr.push(memory.render(letterBuffer))
    letterBuffer = currentLetter;
    memory = current;
  }
  returnStr.push(memory.render(letterBuffer))
  return returnStr.join('')
}