Merge pull request #333 from andrewm4894/devcontainer-improvements

Devcontainer improvements:
- make devcontainer more generic as opposed to launching into any specific service.
- add readme to .devcontainer folder.
- ensure `pre-commit` is installed and available in dev container.
- validate that `docker compose up --build` works from within the codespace/devcontainer.

.devcontainer/README.md

@@ -0,0 +1,93 @@
+# devcontainer
+
+## example usage
+
+Below are some example use cases you might want to run from within the
+devcontainer (either
+[within VSCode locally](https://code.visualstudio.com/docs/devcontainers/create-dev-container#_create-a-devcontainerjson-file)
+or in your browser via
+[GitHub Codespaces](https://github.com/features/codespaces)).
+
+### Run pre-commit
+
+```bash
+# run pre-commit
+pre-commit run --all-files
+```
+
+A successfull run should look something like this:
+
+```
+@andrewm4894 ➜ /workspaces/Open-Assistant (devcontainer-improvements) $ pre-commit run --all-files
+[INFO] Initializing environment for https://github.com/pre-commit/pre-commit-hooks.
+[INFO] Initializing environment for https://github.com/psf/black.
+[INFO] Initializing environment for https://github.com/psf/black:.[jupyter].
+[INFO] Initializing environment for https://github.com/pycqa/flake8.
+[INFO] Initializing environment for https://github.com/pycqa/isort.
+[INFO] Initializing environment for https://github.com/pre-commit/mirrors-prettier.
+[INFO] Initializing environment for https://github.com/pre-commit/mirrors-prettier:[email protected].
+[INFO] Initializing environment for local.
+[INFO] Installing environment for https://github.com/pre-commit/pre-commit-hooks.
+[INFO] Once installed this environment will be reused.
+[INFO] This may take a few minutes...
+[INFO] Installing environment for https://github.com/psf/black.
+[INFO] Once installed this environment will be reused.
+[INFO] This may take a few minutes...
+[INFO] Installing environment for https://github.com/pycqa/flake8.
+[INFO] Once installed this environment will be reused.
+[INFO] This may take a few minutes...
+[INFO] Installing environment for https://github.com/pycqa/isort.
+[INFO] Once installed this environment will be reused.
+[INFO] This may take a few minutes...
+[INFO] Installing environment for https://github.com/pre-commit/mirrors-prettier.
+[INFO] Once installed this environment will be reused.
+[INFO] This may take a few minutes...
+[INFO] Installing environment for local.
+[INFO] Once installed this environment will be reused.
+[INFO] This may take a few minutes...
+trim trailing whitespace.................................................Passed
+check python ast.........................................................Passed
+check yaml...............................................................Passed
+check json...............................................................Passed
+check for case conflicts.................................................Passed
+detect private key.......................................................Passed
+fix python encoding pragma...............................................Passed
+forbid submodules....................................(no files to check)Skipped
+mixed line ending........................................................Passed
+fix requirements.txt.....................................................Passed
+check that executables have shebangs.....................................Passed
+check that scripts with shebangs are executable..........................Passed
+check BOM - deprecated: use fix-byte-order-marker........................Passed
+check for broken symlinks............................(no files to check)Skipped
+check for merge conflicts................................................Passed
+check for added large files..............................................Passed
+fix end of files.........................................................Passed
+black-jupyter............................................................Passed
+flake8...................................................................Passed
+isort....................................................................Passed
+prettier.................................................................Passed
+Lint website.............................................................Passed
+```
+
+### Docker compose
+
+```bash
+# build the image
+docker compose up --build
+```
+
+You should see some docker containers being pulled and activated.
+
+Once you see a line like:
+
+```
+open-assistant-web-1 | Listening on port 3000 url: http://localhost:3000
+```
+
+you should be able to access that port like below:
+
+<img width="640" alt="image" src="https://user-images.githubusercontent.com/2178292/210395676-e9c2aab5-cb54-4ae6-b1eb-ac929fd73607.png">
+
+this port can then be forwarded to a browser tab like below:
+
+<img width="640" alt="image" src="https://user-images.githubusercontent.com/2178292/210396207-1b2e259f-4d5d-475d-b225-91e2bd004071.png">

.devcontainer/devcontainer.json

@@ -1,7 +1,12 @@
 {
-  "service": "frontend-dev",
-  "dockerComposeFile": "../docker-compose.yaml",
-  "forwardPorts": [3000],
+  "name": "Open-Assistant",
+  "image": "mcr.microsoft.com/vscode/devcontainers/universal",
+  "features": {
+    "ghcr.io/devcontainers-contrib/features/pre-commit:2": {
+      "version": "latest"
+    }
+  },
+  "postCreateCommand": "bash .devcontainer/post_create_command.sh",
   "customizations": {
     "vscode": {
       "extensions": ["GitHub.copilot"]

.devcontainer/post_create_command.sh

@@ -0,0 +1,2 @@
+# ensure pre-commit is installed
+pre-commit install

README.md

@@ -26,6 +26,15 @@ interact with the website.
 **Note:** When logging in via email, navigate to `http://localhost:1080` to get
 the magic email login link.
 
+**Note:** If you would like to run this in a standardized development
+environment (a
+["devcontainer"](https://code.visualstudio.com/docs/devcontainers/containers))
+using
+[vscode locally](https://code.visualstudio.com/docs/devcontainers/create-dev-container#_create-a-devcontainerjson-file)
+or in a web browser using
+[GitHub Codespaces](https://github.com/features/codespaces), you can use the
+provided [`.devcontainer`](.devcontainer/) folder.
+
 ## The Plan
 
 We want to get to an initial MVP as fast as possible, by following the 3-steps