Repository File Browser Component

[LamboCreeper]

Description

Create a new component which takes three parameters of user: string, repository: string, commit: string.
With these parameters, use the GitHub API to get the repository's contents.

Loop through each item returned:

• If the type is file: display the name of the file WITH extension.
  • On click of this, set it to be the active file
• If the type is dir: display the name of the folder appended with /
  • On click of this, fetch the contents of the given folder using the same API
  • Render another section for this (the UI wireframe hopefully makes this clearer)

I would recommend having a top level RepositoryFileBrowser component and then render a:

• RepositoryFileBrowserFile component for an individual file
• RepositoryFileBrowserFolder component for a folder, which then does the same

UI Wireframe

The active file is highlighted blue. On hover on a file/folder it should be highlighted (light grey in the wireframe). Clicking on a folder shows the files within the folder, indented. Keep indenting for each level deeper you go.

User Story

As a user
I want to browse the files and folders within a repository
So that I can open the selected file to review it

Notes

• Documentation to get a repository's content
  • You will need to pass the ?ref parameter with the given commit hash to get the right contents