This file tree displays all the diff files in a tree like format
Each file is taken and converted into a tree with folders
Each folder can be toggled open & closed
Clicking a file will scroll to the diff file & highlight with a glow affect

Searching the tree list will search only files & return a list of the
files without any folders

Each file row contains an icon to show changed, new file or deleted
Each row will also contain the added & removed lines count

Closes https://gitlab.com/gitlab-org/gitlab-ce/issues/14249

This makes the file row component re-usable ouside of the Web IDE

Pre-request for https://gitlab.com/gitlab-org/gitlab-ce/issues/14249

moved heights into variables

Closes #48182

improved variable & prop names

Closes #48059

This enables JavaScripts projects to have live previews straight in the
browser without requiring any local configuration. This uses the
CodeSandbox package `sandpack` to compile it all inside of an iframe.

This feature is off by default and can be toggled on in the admin
settings. Only projects with a `package.json` and a `main` key are
supported.

Updates happen in real-time with hot-reloading. We just watch for
changes to files and then send them to `sandpack` to allow it to reload
the iframe. The iframe includes a very simple navigation bar, the text
bar is `readonly` to stop users navigating away from the preview and
the back and forward buttons just pop/splice the navigation stack
which is tracked by a listener on `sandpack`

There is a button inside the iframe which allows the user to open the
projects inside of CodeSandbox. This button is only visible on
**public** projects. On private or internal projects this button
get hidden to protect private code being leaked into an external
public URL.

Closes #47268

for folders, it shows all the files in commit mode
for files, nothing changes, the behaviour is the same

Closes #44845

added api spec

added tooltip to more actions

fixed karma specs
added CHANGELOG item

Closes #46122

Closes #46051

Closes #47696