feat: Add UI

Adds a UI to the Starter App
Includes test, doc, and CICD infrastructure to support

Closes: #25 

Signed-off-by: Andrew Borley borley@uk.ibm.com
Signed-off-by: Matthew Chirgwin chirmatt@uk.ibm.com
Signed-off-by: Nic Townsend nictownsend@uk.ibm.com
Signed-off-by: Jordan Tucker jordan.tucker1@ibm.com

.github/ISSUE_TEMPLATE/bug.md

@@ -0,0 +1,30 @@
+---
+name: Bug report
+about: Create a report to help us improve
+---
+
+# Bug
+
+## Issue Summary
+
+* Describe what you were doing when you observed the problem?
+* Did this used to work? If so what changed?
+* Was the error recoverable? Did you perform any maintenance or workaround?
+- *screenshot here*
+
+## Environment
+
+* OS: ?
+* Browser (version): ?
+
+## How To Reproduce This Issue
+
+1. First, ...
+2. Click ...
+3. Enter ...
+
+## Expected Behaviour
+
+* Should have ...
+
+## Relevant Logs

.github/ISSUE_TEMPLATE/feature.md

@@ -0,0 +1,31 @@
+---
+name: Feature request
+about: Request a new feature or enhancement
+---
+
+# Feature / Enhancement
+
+## Description
+As a user...
+
+•Describe end to end flow / end goal*
+
+- *screenshot here*
+
+## Test Cases
+
+- Given ... then ... should ...
+- Given ... then ... should ...
+- ...
+
+## Implementation Details
+
+- Written as ... in ...
+- Tested using ...
+- Affects repository ___.
+
+## Acceptance Criteria
+
+- Code reviewed by ___.
+- Automated tests exist.
+- Manually tested in ___.

.github/PULL_REQUEST_TEMPLATE.md

@@ -0,0 +1,32 @@
+## Status
+**READY/IN DEVELOPMENT/HOLD**
+
+## Commit Message
+
+### Commit Message Title
+* When opening this PR, the raiser should set the title of this PR to the first line of their desired commit message, e.g:
+```
+feat|fix|docs|style|refactor|perf|test|chore: changed function X
+```
+* The reviewer should ensure that the first commit message field is of this form when performing the `squash and merge` from this page.
+
+### Commit Message Description
+```
+# When opening this PR, the raiser should replace this text with the remaining
+# lines of their desired commit message, e.g:
+
+Further details of the code going into the commit
+
+Contributes to: #XYZ
+Closes: #XYZ
+
+Signed-off-by: Your Name <email@address.com>
+```
+* The reviewer should copy the above text into the extended description field when performing the `squash and merge` from this page.
+
+## Checklist
+- [ ] Automated tests exist
+- [ ] Documentation exists [link]()
+- [ ] Local unit tests performed
+- [ ] Sufficient logging/trace
+- [ ] Desired commit message set as PR title and commit description set above

.github/actions/bundle/Dockerfile

@@ -0,0 +1,9 @@
+FROM node:slim
+
+COPY index.js .
+COPY package.json .
+COPY package-lock.json .
+
+RUN npm install
+
+ENTRYPOINT ["node", "/index.js"];

.github/actions/bundle/action.yml

@@ -0,0 +1,8 @@
+name: "Bundle size"
+description: "Check the size of the bundle"
+outputs:
+  bundle_size:
+    description: "Bundle size of webpack build"
+runs:
+  using: "docker"
+  image: "Dockerfile"

.github/actions/bundle/index.js

@@ -0,0 +1,35 @@
+const core = require("@actions/core");
+const fs = require("fs");
+
+const builtFiles = [{
+  fileName: 'main.bundle.js',
+  humanReadableName: 'Kafka Starter App custom UI code bundle size:'
+}, {
+  fileName: 'libs.bundle.js',
+  humanReadableName: 'Dependancy UI code bundle size:'
+}, {
+  fileName: 'styles.bundle.css',
+  humanReadableName: 'Kafka Starter App css bundle size:'
+}];
+
+async function calculateBundle() {
+  try {
+
+    const builtBundlesFeedback = builtFiles.reduce((previousBundleText, {fileName, humanReadableName}) => {
+      const fileSize =
+      Math.round(
+        (fs.statSync(`./src/main/resources/webroot/${fileName}`)["size"] /
+          1024.0) *
+          100
+      ) / 100;
+      return `${previousBundleText} ${humanReadableName} ${fileSize}KB\n`;
+    }, '');
+
+
+    core.setOutput("bundle_size", builtBundlesFeedback);
+  } catch (error) {
+    core.setFailed(error.message);
+  }
+}
+
+calculateBundle();