profclems · braswelljr · Jul 11, 2023 · Jul 11, 2023 · Jul 11, 2023 · Jul 12, 2023
diff --git a/.gitignore b/.gitignore
@@ -38,3 +38,5 @@ compose.yml
 yarn.lock
 package-lock.json
 pnpm-lock.yaml
+
+!web/dist/.gitkeep
diff --git a/web/.gitignore b/web/.gitignore
@@ -51,7 +51,4 @@ pnpm-lock.yaml
 
 
 # Contentlayer
-.contentlayer
-
-# commit directory dist with content for github pages
-/dist
+.contentlayer
diff --git a/web/README.md b/web/README.md
@@ -20,14 +20,42 @@ cd compozify/web
 
 ### DEVELOPMENT
 
-Install dependencies:
+#### Install dependencies
 
 ```bash
 pnpm install
 ```
 
-Start the development server:
+#### Start the backend server
+
+##### Prerequisites
+
+- [Go 1.18+](https://golang.org/dl/)
+
+##### Run the server
+
+Open a new terminal and route to `cmd/compozify-web` and run:
+
+```bash
+go run main.go
+```
+
+#### Start the development server
+
+In `compozify/web/next.config.js` file
+
+1. Enable comment the `async rewrites()` function.
+
+2. Disable comment the `output: 'export'` function.
+
+Then run the following command:
 
 ```bash
 pnpm dev
 ```
+
+**NB**:
+
+- Make sure you have the backend server running in another terminal in order to make requests to the API endpoints.
+
+- Return the `async rewrites()` function and the `output: 'export'` function to its initial state before building the app for production or making commits.
diff --git a/web/content/docs/commands/compozify-add-service.mdx b/web/content/docs/commands/compozify-add-service.mdx
@@ -0,0 +1,71 @@
+---
+title: compozify add-service
+description: Add a service to an existing docker-compose file
+---
+
+# compozify add-service
+
+Add a service to an existing docker-compose file
+
+## Synopsis
+
+Converts the docker run command to docker compose and adds as a new service to an existing docker-compose file.
+If no file is specified, compozify will look for a docker compose file in the current directory.
+If no file is found, compozify will create one in the current directory.
+Expected file names are docker-compose.[yml,yaml], compose.[yml,yaml]
+
+```bash
+compozify add-service [flags] DOCKER_RUN_COMMAND
+```
+
+## Examples
+
+- Add service to existing docker-compose file in current directory
+
+```bash
+compozify add-service "docker run -i -t --rm alpine"
+```
+
+- Add service to existing docker-compose file
+
+```bash
+compozify add-service -f /path/to/docker-compose.yml "docker run -i -t --rm alpine"
+```
+
+- Write to file
+
+```bash
+compozify add-service -w -f /path/to/docker-compose.yml "docker run -i -t --rm alpine"
+```
+
+- Alternative usage specifying beginning of docker run command without quotes
+
+```bash
+compozify add-service -w -f /path/to/docker-compose.yml -- docker run -i -t --rm alpine
+```
+
+- Add service with custom name
+
+```bash
+compozify add-service -w -f /path/to/docker-compose.yml -n my-service "docker run -i -t --rm alpine"
+```
+
+## Options
+
+```bash
+  -f, --file string           Compose file path
+  -h, --help                  help for add-service
+  -n, --service-name string   Name of the service
+  -w, --write                 write to file
+```
+
+### Options inherited from parent commands
+
+```bash
+  -v, --verbose   verbose output
+```
+
+### SEE ALSO
+
+- <CustomLink href="/docs/commands/compozify">compozify</CustomLink> - compozify is a tool mainly for converting docker run
+  commands to docker compose files
diff --git a/web/content/docs/installation.mdx b/web/content/docs/installation.mdx
@@ -7,6 +7,24 @@ description: Helps with the installation of the tool
 
 Download a binary suitable for your OS at the [releases page](https://github.com/profclems/compozify/releases/latest).
 
+## Quick install
+
+### Linux and macOS
+
+```sh
+curl -sfL https://raw.githubusercontent.com/profclems/compozify/main/install.sh | sh
+```
+
+### Windows (PowerShell)
+
+Open a PowerShell terminal (version 5.1 or later) and run:
+
+```powershell
+Set-ExecutionPolicy RemoteSigned -Scope CurrentUser # Optional: Needed to run a remote script the first time
+
+irm https://raw.githubusercontent.com/profclems/compozify/main/install.ps1 | iex
+```
+
 ## From source
 
 ### Prerequisites for building from source

diff --git a/web/contentlayer.config.ts b/web/contentlayer.config.ts
@@ -9,7 +9,7 @@ import { getHighlighter, loadTheme } from 'shiki'
 import { visit } from 'unist-util-visit'
 
 import { rehypeComponent } from './lib/rehype-component'
-import { UnistNode, UnistTree } from './lib/unist'
+import { UnistNode, UnistTree } from './lib/toc'
 
 /** @type {import('contentlayer/source-files').ComputedFields} */
 const computedFields: import('contentlayer/source-files').ComputedFields = {

diff --git a/web/lib/rehype-component.ts b/web/lib/rehype-component.ts
@@ -4,7 +4,7 @@ import { u } from 'unist-builder'
 import { visit } from 'unist-util-visit'
 
 import { languages } from './rehype-languages'
-import { UnistNode, UnistTree } from './unist'
+import { UnistNode, UnistTree } from './toc'
 
 export function rehypeComponent() {
   return async (tree: UnistTree) => {

diff --git a/web/lib/shiki.ts b/web/lib/shiki.ts
diff --git a/web/lib/toc.ts b/web/lib/toc.ts
@@ -2,7 +2,31 @@ import { toc } from 'mdast-util-toc'
 import { remark } from 'remark'
 import { visit } from 'unist-util-visit'
 
-import { UnistNode } from './unist'
+type Node = import('unist').Node
+
+export interface UnistNode extends Node {
+  url?: string
+  type: string
+  name?: string
+  tagName?: string
+  value?: string
+  properties?: {
+    __rawString__?: string
+    __className__?: string
+    className?: string[]
+    [key: string]: unknown
+  }
+  attributes?: {
+    name: string
+    value: unknown
+    type?: string
+  }[]
+  children?: UnistNode[]
+}
+
+export interface UnistTree extends Node {
+  children: UnistNode[]
+}
 
 const textTypes = ['text', 'emphasis', 'strong', 'inlineCode']
 

diff --git a/web/lib/unist.ts b/web/lib/unist.ts
diff --git a/web/next.config.js b/web/next.config.js
@@ -13,9 +13,6 @@ const nextConfig = {
   output: 'export',
   distDir: process.env.NODE_ENV === 'development' ? 'out' : 'dist',
   images: { unoptimized: true },
-  experimental: {
-    serverComponentsExternalPackages: ['vscode-oniguruma', 'shiki']
-  },
   webpack: (config, { defaultLoaders }) => {
     // clear cache
     defaultLoaders.babel.options.cache = false
@@ -25,6 +22,10 @@ const nextConfig = {
 
     return config
   }
+  // for local development - (\\d{1,}) is for port number
+  // async rewrites() {
+  //   return [{ source: '/api/parse', destination: 'http://localhost:8080/api/parse' }]
+  // }
 }
 
 const withALL = (nextConfig = {}) => withContentlayer(withPWA(nextConfig))

diff --git a/web/package.json b/web/package.json
@@ -17,26 +17,27 @@
     "@radix-ui/react-dropdown-menu": "^2.0.5",
     "@radix-ui/react-scroll-area": "^1.0.4",
     "@radix-ui/react-separator": "^1.0.3",
-    "@types/node": "20.4.1",
-    "@types/react": "18.2.14",
-    "@types/react-dom": "18.2.6",
-    "autoprefixer": "10.4.14",
-    "class-variance-authority": "^0.6.1",
-    "clsx": "^1.2.1",
+    "@types/node": "20.5.1",
+    "@types/react": "18.2.20",
+    "@types/react-dom": "18.2.7",
+    "autoprefixer": "10.4.15",
+    "class-variance-authority": "^0.7.0",
+    "clsx": "^2.0.0",
     "concurrently": "^8.2.0",
     "contentlayer": "^0.3.4",
-    "framer-motion": "^10.12.18",
+    "framer-motion": "^10.16.0",
+    "highlight.js": "^11.8.0",
     "mdast-util-toc": "^7.0.0",
-    "next": "13.4.8",
+    "next": "13.4.19",
     "next-contentlayer": "^0.3.4",
     "next-pwa": "^5.6.0",
     "next-themes": "^0.2.1",
-    "postcss": "8.4.25",
+    "postcss": "8.4.28",
     "postcss-focus-visible": "^9.0.0",
     "postcss-import": "^15.1.0",
     "react": "18.2.0",
     "react-dom": "18.2.0",
-    "react-hook-form": "^7.45.1",
+    "react-hook-form": "^7.45.4",
     "react-icons": "^4.10.1",
     "react-intersection-observer": "^9.5.2",
     "rehype-autolink-headings": "^6.1.1",
@@ -46,28 +47,28 @@
     "remark-code-import": "^1.2.0",
     "remark-gfm": "^3.0.1",
     "shiki": "^0.14.3",
-    "tailwind-merge": "^1.13.2",
-    "tailwindcss": "3.3.2",
+    "tailwind-merge": "^1.14.0",
+    "tailwindcss": "3.3.3",
+    "typeit-react": "^2.6.4",
     "typewriter-react": "^1.0.1",
     "unist-builder": "^4.0.0",
     "unist-util-visit": "^5.0.0",
-    "vscode-oniguruma": "^1.7.0",
     "yaml": "^2.3.1",
-    "zustand": "^4.3.9"
+    "zustand": "^4.4.1"
   },
   "devDependencies": {
     "@types/unist": "^3.0.0",
-    "@typescript-eslint/eslint-plugin": "^6.0.0",
-    "@typescript-eslint/parser": "^6.0.0",
-    "eslint": "8.44.0",
-    "eslint-config-next": "13.4.9",
-    "eslint-config-prettier": "^8.8.0",
+    "@typescript-eslint/eslint-plugin": "^6.4.0",
+    "@typescript-eslint/parser": "^6.4.0",
+    "eslint": "8.47.0",
+    "eslint-config-next": "13.4.19",
+    "eslint-config-prettier": "^9.0.0",
     "eslint-plugin-jsx-a11y": "^6.7.1",
-    "eslint-plugin-prettier": "^4.2.1",
-    "eslint-plugin-react": "^7.32.2",
+    "eslint-plugin-prettier": "^5.0.0",
+    "eslint-plugin-react": "^7.33.2",
     "eslint-plugin-react-hooks": "^4.6.0",
-    "prettier": "^2.8.8",
-    "prettier-plugin-tailwindcss": "^0.3.0",
+    "prettier": "^3.0.2",
+    "prettier-plugin-tailwindcss": "^0.5.3",
     "typescript": "5.1.6"
   }
 }