docs: updated docs with local packages section (#57)

* build: install mui icons added in package.json Signed-off-by: Jackson Greer <[email protected]> * build: removed icon install since part of package file now Signed-off-by: Jackson Greer <[email protected]> * docs: added local packages section and updated local image build to mention default setting of remote image Signed-off-by: Jackson Greer <[email protected]> * build: update lock file Signed-off-by: Jackson Greer <[email protected]> * docs: mention vscode in installing packages locally section Signed-off-by: Jackson Greer <[email protected]> --------- Signed-off-by: Jackson Greer <[email protected]>
project-copacetic · Aug 9, 2024 · bf4b9a2 · bf4b9a2
1 parent 066ce06
commit bf4b9a2
Show file tree

Hide file tree

Showing 4 changed files with 165 additions and 34 deletions.
diff --git a/Dockerfile b/Dockerfile
@@ -6,8 +6,6 @@ COPY ui/package-lock.json /ui/package-lock.json
 RUN --mount=type=cache,target=/usr/src/app/.npm \
     npm set cache /usr/src/app/.npm && \
     npm ci
-# install mui icons
-RUN npm install @mui/icons-material
 
 COPY ui /ui
 RUN npm run build

diff --git a/contributing.md b/contributing.md
@@ -3,14 +3,14 @@
 Before proceeding, ensure that Docker Desktop is installed on your computer and using the WSL backend if using Windows.
 
 ## Building the copa-extenion image
-In order to run the extension locally, you need to build the `copa-extension` image image specified in the `/container/copa-extension` folder.
+By default, the extension will pull the copa image from `ghcr.io/project-copacetic/copa-extension` and use that for the patching operation. If you would like to make modifications to this image and test locally, you need to build the `copa-extension` image image specified in the `/container/copa-extension` folder.
 
 Run the following make command in the root directory to install it:
 
 ```
 make build-copa-image
 ```
-After the command finishes, confirm that the image `copa-extension` is listed when you run the command `docker images`.
+After the command finishes, confirm that the image `copa-extension` is listed when you run the command `docker images`. Once confirmed, change the `IMAGE_NAME` variable in `app.tsx` to point to  `copa-extension` instead of `ghcr.io/project-copacetic/copa-extension`.
 
 ## Building the frontend image
 
@@ -22,4 +22,19 @@ make build-extension
 ```
 make install-extension
 ```
-After following the steps, the extension should be successfully installed in Docker Desktop. If you make any changes to the code, run `make update-extension` to see those changes reflected. 
+After following the steps, the extension should be successfully installed in Docker Desktop. If you make any changes to the code, run `make update-extension` to see those changes reflected. 
+
+## Install node packages locally (optional)
+
+To use Visual Studio Code IntelliSense features (code completion, parameter info, quick info, and member lists), you need to install the node and yarn packages locally.
+
+After installing [Node.js](https://nodejs.org/en/download/package-manager/), change to the `/ui` directory and run the following command:
+
+```
+npm install
+```
+If making changes to the testing code in `/e2e`, run `npm install --global yarn` to install the yarn package manager and then run the following command in the `/e2e` directory:
+```
+yarn install
+```
+
diff --git a/ui/package-lock.json b/ui/package-lock.json
diff --git a/ui/package.json b/ui/package.json
@@ -8,7 +8,8 @@
     "@docker/extension-api-client": "0.3.4",
     "@emotion/react": "11.13.0",
     "@emotion/styled": "11.13.0",
-    "@mui/material": "5.16.6",
+    "@mui/icons-material": "^5.16.6",
+    "@mui/material": "5.10.8",
     "react": "^18.2.0",
     "react-dom": "^18.2.0"
   },