Add a UI for the app

[d47853]

Add a dynamic SPA which will allow users to provision and manage their Graph instances. It should use some kind of UI framework to make it easier to deliver features in the future. This should probably be either React or Angular.

[t11947]

An MVP for the UI app should fulfil the following criteria:

• The UI has a way of authenticating users
• As a user, I can see a list of the graphs I can access
• As a user, I can provision a new graph with a name and a brief description
• As an administrator, I can list the graphs and see which users can access them
• As an administrator, I can grant a user access to a graph
• As an administrator, I can delete a graph

[macenturalxl1]

Hi - I'll claim this one please.

I'll start on the "As a user, I can see a list of the graphs I can access" user story you've listed. So have a few questions before starting so I'll group them below as how the UI connects to the backend and how to present the data.

Endpoints

1. What will the request and response look like? I can add a RAML or some form of documentation for what they should look like when the UI calls the backend. Or some other solution to provide a contract for the UI to stick to and ensure it connects nicely with the backend.

2. getAll() API Responses - What will each response body look like for the following scenarios?:

   • Array of graphs
   • One graph
   • Empty graphs array
   • Error response from API

3. Will Admin and Any Generic User share the same API getAll() graph response body? i.e. the graph objects returned in response body be the same objects

Presentation

1. Is the name of the UI App going to be Kai also? - Or Graph-as-a-Service, as named in the README.md?

2. For each graph, what data should be presented to the User? e.g. Name & Description, or other data

3. Would both Admin and Generic User view the graphs in the same way (i.e. share the same presentation logic) - or will data be hidden - or different object structure?

4. For API errors returned, I can put a simple notification that appears at the top of the page (this can be added as another Issue later for a more enhance complex presentation) - is it ok to do this for now?

5. CSS/styling - I've seen you've worked on another app called Gaffer alongside this one - I can copy the CSS and design similar styling as that app - let me know if this is ok too

[jpelbertrios]

Hi .. I am working on to setup React project for UI I found entry point will be graph.js in lambdas, so do I need to defined

module.exports = { entry: './path/.../graph.js' };

in webpack.config.js ?

[d47853]

Hi @jpelbertrios

Going forward, we're moving the project back to a Typescript layout (see #19). That file was just a placeholder for where we might put Lambda functions associated with the REST API so I don't think so.

Hopefully moving to a Typescript project will mean an easier integration between the UI and the Infrastructure as Code backend.