Merge pull request #18 from jgrer/dockerfile-label-documentation

docs: dockerfile label documentation

Dockerfile

@@ -26,16 +26,33 @@ RUN npm run build
 
 FROM alpine
 LABEL org.opencontainers.image.title="Copacetic" \
-    org.opencontainers.image.description="Copacetic Extension for Docker Desktop" \
-    org.opencontainers.image.vendor="Microsoft" \
+    org.opencontainers.image.description="Directly patch container images given the vulnerability scanning results from popular tools like Trivy." \
+    org.opencontainers.image.vendor="Project Copacetic" \
     com.docker.desktop.extension.api.version="0.3.4" \
-    com.docker.extension.screenshots="" \
+    com.docker.extension.screenshots="\
+    [ \
+    {\"alt\": \"Copa Light Screenshot\", \"url\": \"https://raw.githubusercontent.com/jgrer/copa-extension/dockerfile-label-documentation/.github/images/demo1.png\"}, \
+    {\"alt\": \"Copa Dark Screenshot\", \"url\": \"https://raw.githubusercontent.com/jgrer/copa-extension/dockerfile-label-documentation/.github/images/demo2.png\"}, \
+    {\"alt\": \"Copa Scan For Vulnerability\", \"url\": \"https://raw.githubusercontent.com/jgrer/copa-extension/dockerfile-label-documentation/.github/images/demo3.png\"}, \
+    {\"alt\": \"Copa Vulnerability Display\", \"url\": \"https://raw.githubusercontent.com/jgrer/copa-extension/dockerfile-label-documentation/.github/images/demo4.png\"}, \
+    {\"alt\": \"Copa Patching Image Show Console\", \"url\": \"https://raw.githubusercontent.com/jgrer/copa-extension/dockerfile-label-documentation/.github/images/demo5.png\"}, \
+    {\"alt\": \"Copa Success Screen\", \"url\": \"https://raw.githubusercontent.com/jgrer/copa-extension/dockerfile-label-documentation/.github/images/demo6.png\"}, \
+    {\"alt\": \"Copa Success Screen And Vuln Loading\", \"url\": \"https://raw.githubusercontent.com/jgrer/copa-extension/dockerfile-label-documentation/.github/images/demo7.png\"}, \
+    {\"alt\": \"Copa Success Screen And Patched Image Vuln Display\", \"url\": \"https://raw.githubusercontent.com/jgrer/copa-extension/dockerfile-label-documentation/.github/images/demo8.png\"} \
+    ]" \
     com.docker.desktop.extension.icon="https://raw.githubusercontent.com/project-copacetic/copacetic/main/images/copa-color.png" \
-    com.docker.extension.detailed-description="" \
-    com.docker.extension.publisher-url="" \
-    com.docker.extension.additional-urls="" \
-    com.docker.extension.categories="" \
-    com.docker.extension.changelog=""
+    com.docker.extension.detailed-description="<h1>Copacetic Extension For Docker Desktop</h1> \
+    The copa tool is a versatile engine designed to parse container image vulnerability reports from scanners like Trivy, \
+    process update packages through various package managers, and apply updates to container images using buildkit, with \
+    the flexibility to extend support for additional report formats and package managers." \
+    com.docker.extension.publisher-url="https://project-copacetic.github.io/copacetic/website/" \
+    com.docker.extension.additional-urls='\
+    [ \ 
+    {"title":"Documentation","url":"https://project-copacetic.github.io/copacetic/website/"}, \
+    {"title":"Extension Repository","url":"https://github.com/project-copacetic/copa-extension"} \
+    ]' \
+    com.docker.extension.categories="security" \
+    com.docker.extension.changelog="Initial version."
 
 COPY --from=builder /backend/bin/service /
 COPY docker-compose.yaml .

Makefile

@@ -1,5 +1,5 @@
 IMAGE?=copacetic/copacetic-docker-desktop-extension
-TAG?=latest
+TAG?=0.1.0
 COPA_VERSION?=latest
 
 BUILDER=buildx-multi-arch

README.md

@@ -1 +1,44 @@
-# copa-extension
+# Copa Docker Desktop Extension
+
+![starting page for the extension](https://raw.githubusercontent.com/jgrer/copa-extension/dockerfile-label-documentation/.github/images/demo1.png)
+
+## What is this extension for?
+
+[`copa`](https://github.com/project-copacetic/copacetic) is a CLI tool written in Go and based on buildkit that can be used to directly patch container images given the vulnerability scanning results from popular tools like Trivy. 
+
+This extension allows the user to leverage the abilities of the CLI tool without having to install a scanner or the CLI tool itself. The only requirement to use this extension is [Docker Desktop](https://docs.docker.com/desktop/)! 
+
+## How does it work?
+
+This extension is a web application displayed in a tab of the dashboard in Docker Desktop. It is written in JavaScript using the React JavaScript library and Material UI React component library. It creates three containers to scan an image, send vulnerability information to the frontend, and patch an image. It uses the `copa-extension-volume` to share the scan result between the three containers.
+
+### Images/Containers
+
+|Image | Container        | Description                                                                                                          |
+| -----|------------- | ---------------------------------------------------------------------------------------------------------------------|
+|`aquasec/trivy`| `trivy-copa-extension-container`          | Runs a scan of the selected image and outputs the json file result `scan.json` to the volume `copa-extension-volume` |
+| `busybox`| `busybox-copa-extension-container`          | Runs the `cat` command to dump the json output file `scan.json` to `stdout`|
+|`copa-extension` | `copa-extension-container`     | Runs a copa patch on the selected image using the vulnerability results from `scan.json` |
+
+
+### Components
+
+| Component           | Description                                                                                                          |
+| ------------------- | ---------------------------------------------------------------------------------------------------------------------|
+| `main.tsx`          | Main entry point of the frontend, meant to set up React                                                              |
+| `app.tsx`           | Contains the other main components and the left side of the UI, which includes the Copa logo and learn more link. Also includes the frontend code for the loading screen, success screen, and failure screen
+| `copainput.tsx`     | Has TextFields, Autocompletes, and Buttons to gather input. Displayed on the right side when first loading the page. |
+| `commandline.tsx`   | Stylized display to look like the command line for the stdout and stderr from the container running Copacetic        |
+| `vulnerabilitydisplay.tsx`| Displays the vulnerability results from a trivy scan, similar to the docker scout vulnerability display|
+
+## How do install it?
+
+The extension be installed using this link! It can also be installed with the following command:
+
+```
+docker extension install copacetic/copacetic-docker-desktop-extension:0.1.0
+```
+
+## Contributing
+
+We welcome contributions from the community! Read more about contributing [here](contributing.md).