Tidy up IDE code

What does this MR do?

The IDE has gone through a lot of changes recently which meant a lot of code was being added. This tidies up the code by making it match the Vuex docs a little more closely.

Most of the components currently are container components & know use mapState, mapGetter etc. when really they should just be presentational component and take in some props. This changes that to make a clear distinction on what each component is.

A lot of files where left over from when the IDE was a multi-file editor inside of a repository. These files have been removed as well as any state that belongs to them. This reduces the amount of code we are including but also reduces the amount of data we need to store in the state. With this a lot of actions & mutations have also been removed to make the Vuex store a little smaller in size.

The state has been changed a lot. Instead of being a bunch of nested arrays making it impossible to update in a way that matches the docs, they are now stored in a flat object. When the IDE renders anything, it will reference this flat array to get the file out. This means the file objects all remain in one place & don't need to passed around relying on Vues reactive updating to work across each reference of the object.

Data generation also happens inside of a web worker. For larger projects this could be a potential slow down on the browser causing it to hang. Instead we send the data into a worker to keep the main thread free from any lag. Once the data has been normalized to how we expect it, we post this data back to the main thread & update the Vuex store.