🚀 Feature: Refactor Excursion 3 BunnyCode function creation

[EDWIN1669086]

Context

File: ~/src/components/bunny-comps/BunnyCode.tsx

FinishTheCode component works by taking in the correct function in the prop given_function and taking in the user-defined function in the prop chosen_function. It also includes the parameters, so it runs the functions in this page. Note that it needs to have a test case value to determine correctness, namely n=7. Example from the page:

given_function={() => recurFib(7)}
chosen_function={() =>
  selectedRecurFib(
    7,
    selectedanswer.question1,
    selectedanswer.question2,
    selectedanswer.question3
  )
}

Problem

Although our solution works, we are creating functions for every permutation possible based on user-input. If you were to tell someone that you were dynamically creating a function based on user input and defining functions for every permutation of user input and selecting the chosen user function based on these inputs, they'll look at you crazy. This is because creating all these functions are a waste of memory since we (technically) already have the user function, so all we have to do is execute it.

Think of a code editor... when you write and run the code, the editor is not going to guess which functions you are going to use and then match it with your input function, it'll just run what you gave it. That's what we want to do.

Proposed Solution

Thankfully, Javascript has a solution for this. Please look into this documentation for Function constructor. It creates a function based on a string. Therefore, if we can get the function into a string format, and run the Function constructor, we can have the function we want without having to case-by-case select the function. THIS IS HUGE!!! (We don't need a Code Editor and we don't have to hard-code anything!)

---

This is a 🚀 Feature Request