feat(http): add HTTP client space

.github/workflows/build-sponsored.yml

@@ -76,5 +76,3 @@ jobs:
             dist/*.snap
           if-no-files-found: warn
           retention-days: 30
-
-

.github/workflows/release.yml

@@ -118,5 +118,3 @@ jobs:
           append_body: true
         env:
           GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
-
-

CONTRIBUTING.md

@@ -31,4 +31,4 @@ fix #123
 
 It's ok to have multiple commits in a single PR, you don't need to rebase or force push for your changes as we will use Squash and Merge to squash the commits into one commit when merging.
 
-And of course please test your code before PR. 
+And of course please test your code before PR.

README.md

@@ -8,7 +8,7 @@ A free, open-source developer workspace.
 </p>
 
 <p align="center">
-  <strong>Snippets, notes, calculations, and dev tools in one local-first app.</strong>
+  <strong>Snippets, notes, HTTP requests, calculations, and dev tools in one local-first app.</strong>
   <br>
   Your data stays on your machine as plain Markdown files.
 </p>
@@ -75,7 +75,7 @@ massCode is free and open source. But building and maintaining a quality tool ta
 
 ## About
 
-Originally a snippet manager, massCode now brings together snippets, notes, calculations, and developer tools in one desktop app, so everyday work stays in one place.
+Originally a snippet manager, massCode now brings together snippets, notes, HTTP requests, calculations, and developer tools in one desktop app, so everyday work stays in one place.
 
 ## Features
 
@@ -101,6 +101,17 @@ Write longer markdown documents right next to your snippets: project docs, draft
 - Fullscreen presentation mode for demos and meetings
 - Callout blocks and image embedding
 
+### HTTP Client
+
+Keep API requests close to your code snippets and project notes with a lightweight HTTP client built into massCode.
+
+- Organize requests with folders and custom folder icons
+- Use environments and `{{variables}}` for local, staging, and production APIs
+- Edit params, headers, body, auth, and markdown descriptions
+- Preview requests as raw HTTP or cURL before sending
+- Inspect response status, time, size, body, and headers
+- Send the current request with <kbd>Cmd+Enter</kbd> on macOS or <kbd>Ctrl+Enter</kbd> on Windows and Linux
+
 ### Math Notebook
 
 A calculator-style notebook for natural-language calculations, conversions, and date math without leaving your workflow.
@@ -122,7 +133,7 @@ Built-in utilities for the small tasks that usually send you to a browser tab:
 
 ## Markdown Vault
 
-Your snippets and notes live as plain `.md` files on disk with frontmatter metadata, so the data stays readable and portable.
+Your snippets, notes, and HTTP requests live as plain `.md` files on disk with frontmatter metadata, so the data stays readable and portable.
 
 - **Git-friendly** - track changes and sync via any Git remote
 - **Cloud sync** - works with iCloud, Dropbox, Google Drive, Syncthing

docs/website/.vitepress/_data/assets.json

@@ -5,4 +5,4 @@
   "win": "https://github.com/massCodeIO/massCode/releases/download/v4.7.1/massCode-4.7.1-x64.exe",
   "winPortable": "https://github.com/massCodeIO/massCode/releases/download/v4.7.1/massCode-4.7.1-x64-portable.exe",
   "linux": "https://github.com/massCodeIO/massCode/releases/download/v4.7.1/massCode-4.7.1.AppImage"
-}
+}

docs/website/.vitepress/config.mts

@@ -132,6 +132,14 @@ export default defineConfig({
             { text: 'Search', link: '/documentation/notes/search' },
           ],
         },
+        {
+          text: 'HTTP',
+          items: [
+            { text: 'HTTP Client', link: '/documentation/http/' },
+            { text: 'Requests', link: '/documentation/http/requests' },
+            { text: 'Environments', link: '/documentation/http/environments' },
+          ],
+        },
         {
           text: 'Math',
           items: [

docs/website/documentation/http/environments.md

@@ -0,0 +1,49 @@
+---
+title: HTTP Environments
+description: "Use HTTP environments in massCode to manage reusable variables for local, staging, and production API requests."
+---
+
+# Environments
+
+Environments store reusable variables for requests. Use them for values that change between local, staging, and production APIs, such as base URLs, user IDs, organization IDs, and tokens.
+
+<img :src="withBase('/http-envs.png')">
+
+## Variables
+
+Use variables with double braces:
+
+```text
+{{apiUrl}}/v1/users/{{userId}}/sessions
+```
+
+The URL field keeps variables visible while you edit. Preview and request execution resolve variables from the active environment.
+
+Variables can be used in:
+
+- URL
+- params
+- headers
+- body
+- auth fields
+
+## Active Environment
+
+Use the **Environments** panel below folders to choose the active environment.
+
+Select **No environment** when you want requests to keep variables unresolved. This is useful when you are editing templates or copying a request without applying local values.
+
+## Managing Environments
+
+Open **Manage** from the Environments panel to create environments and edit variables.
+
+Each environment has:
+
+- a name
+- a key-value table of variables
+
+The active environment is stored as part of the HTTP space state.
+
+<script setup>
+import { withBase } from 'vitepress'
+</script>

docs/website/documentation/http/index.md

@@ -0,0 +1,46 @@
+---
+title: HTTP Client
+description: "Use the HTTP space in massCode as a lightweight local-first API client for saved requests, environments, previews, and responses."
+---
+
+# HTTP Client
+
+<AppVersion text=">=5.3" />
+
+HTTP is the API client space inside massCode. Use it to keep reusable requests next to your snippets and notes, test endpoints during development, and store small API collections in your local vault.
+
+Access HTTP from the **HTTP** icon in the Space rail. The layout follows the same workspace pattern as Code and Notes: folders on the left, requests in the middle, and the request editor with preview and response panels on the right.
+
+<img :src="withBase('/http.png')">
+
+## When to use HTTP
+
+Use HTTP when you want a lightweight request client without leaving massCode.
+
+- test local or remote API endpoints
+- save repeatable requests by project or service
+- keep request descriptions close to implementation notes
+- switch variables between local, staging, and production environments
+- copy a request as raw HTTP or cURL for debugging and sharing
+
+## Main Concepts
+
+### [Requests](/documentation/http/requests)
+
+Requests store the method, URL, params, headers, body, auth settings, and markdown description for an API call. The editor autosaves changes, shows an outgoing request preview, and sends the selected request with <kbd>Cmd+Enter</kbd> on macOS or <kbd>Ctrl+Enter</kbd> on Windows or Linux.
+
+### [Environments](/documentation/http/environments)
+
+Environments store reusable variables for local, staging, and production APIs. The URL field keeps variables visible while you edit, while preview and request execution resolve values from the active environment.
+
+## Folders
+
+HTTP requests are organized in folders. Selecting a folder shows its requests and selects the first request in that folder. Folders support nesting, drag and drop ordering, inline rename, and custom folder icons.
+
+## Storage
+
+HTTP data is stored in your vault under the `http` folder. Requests are markdown files with YAML frontmatter, so they can be backed up and synced together with the rest of your massCode data.
+
+<script setup>
+import { withBase } from 'vitepress'
+</script>

docs/website/documentation/http/requests.md

@@ -0,0 +1,68 @@
+---
+title: HTTP Requests
+description: "Create, edit, preview, send, duplicate, and inspect HTTP requests in the massCode HTTP space."
+---
+
+# Requests
+
+Requests are the main items in the HTTP space. Each request stores the method, URL, params, headers, body, auth settings, and a markdown description.
+
+## Creating Requests
+
+Create a request from the request list header or from a folder context menu. New requests are created in the selected folder.
+
+Request context menus include actions for:
+
+- duplicate
+- delete
+- copy request preview
+- copy internal link
+- reveal in file manager
+
+## Request Editor
+
+The request editor is split into focused tabs:
+
+- **Params** - query parameters sent with the URL
+- **Headers** - request headers
+- **Body** - JSON, text, form URL encoded, or multipart form data
+- **Auth** - none, bearer token, or basic auth
+- **Description** - markdown notes for the request
+
+Changes are saved automatically while you edit.
+
+## Body
+
+Use the body tab to choose the payload format for methods that send data.
+
+- **JSON** and **Text** use a CodeMirror editor.
+- **Form URL Encoded** uses key-value rows.
+- **Multipart Form Data** supports text and file rows.
+
+## Sending Requests
+
+Send the selected request with one of these methods:
+
+- Click the send button next to the URL field.
+- Select **"Editor"** > **"Send Request"** from the menu bar.
+- Press <kbd>Cmd+Enter</kbd> on macOS or <kbd>Ctrl+Enter</kbd> on Windows or Linux.
+
+## Preview
+
+The lower panel can show the outgoing request before it is sent.
+
+- **HTTP** preview shows the request line, host, headers, and body.
+- **cURL** preview builds a command you can paste into a terminal.
+
+Use the copy button in the preview panel to copy the active preview.
+
+## Response Viewer
+
+After a request is sent, the response panel shows:
+
+- status, duration, and response size
+- body and headers tabs
+- JSON formatting for JSON responses
+- copy action for response body and headers
+
+HTTP has its own editor preferences, including line wrapping for request previews, request bodies, and response viewers.

docs/website/documentation/index.md

@@ -1,11 +1,11 @@
 ---
 title: Documentation Overview
-description: "Explore the massCode documentation for code snippets, markdown notes, math notebook, storage, sync, themes, JSON Diff, and built-in developer tools."
+description: "Explore the massCode documentation for code snippets, markdown notes, HTTP requests, math notebook, storage, sync, themes, JSON Diff, and built-in developer tools."
 ---
 
 # Overview
 
-massCode is a free and open source developer workspace for code snippets, markdown notes, calculations, and quick developer utilities. Instead of scattering everyday work across an editor, a notes app, a calculator, and a handful of websites, you keep it in four focused Spaces inside one local-first desktop app.
+massCode is a free and open source developer workspace for code snippets, markdown notes, HTTP requests, calculations, and quick developer utilities. Instead of scattering everyday work across an editor, a notes app, an HTTP client, a calculator, and a handful of websites, you keep it in focused Spaces inside one local-first desktop app.
 
 Switch between Spaces using the rail on the left side of the app.
 
@@ -19,6 +19,10 @@ Use Code to build a reusable snippet library across projects and languages. The
 
 Use Notes for longer markdown documents that do not fit well into snippets: project notes, drafts, technical docs, meeting notes, and personal knowledge bases. It uses the same three-column layout as Code and adds a Notes Dashboard, live preview, a notes graph, mindmaps, and fullscreen presentation mode.
 
+## HTTP
+
+Use HTTP as a lightweight API client inside massCode. Store requests in folders, switch environments, preview the outgoing request as raw HTTP or cURL, send it from the editor, and inspect the response body and headers without leaving your workspace.
+
 ## Math
 
 Math is a calculator-style notebook for quick development math without leaving massCode. Use it for currency conversion, unit conversion, date math, finance, and natural-language calculations with instant results on every line.

docs/website/documentation/notes/internal-links.md

@@ -1,13 +1,13 @@
 ---
 title: Internal Links
-description: "Link notes and snippets together inside massCode Notes with wiki-style links, hover previews, and back-forward navigation."
+description: "Link notes, snippets, and HTTP requests together inside massCode Notes with wiki-style links, hover previews, and back-forward navigation."
 ---
 
 # Internal Links
 
-<AppVersion text=">=5.1.0" />
+<AppVersion text=">=5.1" />
 
-Internal Links let you connect notes and snippets with wiki-style links directly inside Notes. Use them to build lightweight documentation, link reference snippets from prose, and move through related material without leaving massCode.
+Internal Links let you connect notes, snippets, and HTTP requests with wiki-style links directly inside Notes. Use them to build lightweight documentation, link reference snippets or saved API requests from prose, and move through related material without leaving massCode.
 
 <img :src="withBase('/notes-internal-links.png')">
 
@@ -27,7 +27,7 @@ You can also provide custom visible text with an alias:
 [[Fetch helper|request snippet]]
 ```
 
-massCode resolves internal links by item name. A target can be either a note or a snippet.
+massCode resolves internal links by item name. A target can be a note, a snippet, or an HTTP request.
 
 If two notes share the same name, qualify the link with a folder path:
 
@@ -40,7 +40,7 @@ If two notes share the same name, qualify the link with a folder path:
 
 Start typing `[[` in the Notes editor to open the internal links picker.
 
-- The picker searches both notes and snippets.
+- The picker searches notes, snippets, and HTTP requests.
 - Results show the item name and its current location.
 - Press <kbd>Enter</kbd> to insert the active result.
 - Use the arrow keys to move through the list.
@@ -53,6 +53,7 @@ Hold <kbd>Cmd</kbd> on macOS or <kbd>Ctrl</kbd> on Windows or Linux, then click
 
 - If the target is a note, massCode opens it in Notes.
 - If the target is a snippet, massCode switches to Code and opens the snippet there.
+- If the target is an HTTP request, massCode switches to HTTP and opens the request there.
 
 Broken links stay visible, but they appear dimmed and struck through so you can spot missing targets.
 
@@ -62,6 +63,7 @@ Hover an internal link while holding <kbd>Cmd</kbd> on macOS or <kbd>Ctrl</kbd>
 
 - Note links show a text excerpt.
 - Snippet links show the first snippet fragment.
+- HTTP request links show the method, URL, and description.
 
 This helps you confirm the target before you navigate away from the current note.
 
@@ -78,9 +80,10 @@ The history is specific to internal-link navigation. If you manually select anot
 ## When to Use Internal Links
 
 - Link architecture notes to implementation snippets
+- Link API docs to saved HTTP requests
 - Connect meeting notes to reference code
-- Build personal knowledge-base pages that jump between notes and snippets
-- Keep long-form docs in Notes while linking reusable code examples from Code
+- Build personal knowledge-base pages that jump between notes, snippets, and requests
+- Keep long-form docs in Notes while linking reusable code examples from Code and API checks from HTTP
 
 <script setup>
 import { withBase } from 'vitepress'

docs/website/scripts/align-arrows.mjs

@@ -8,7 +8,8 @@ let inBlock = false
 let block = []
 
 function flushBlock() {
-  if (block.length === 0) return
+  if (block.length === 0)
+    return
   // Find lines with →
   const arrowLines = block.filter(l => l.includes('→'))
   if (arrowLines.length === 0) {
@@ -21,17 +22,19 @@ function flushBlock() {
   for (const line of arrowLines) {
     const idx = line.indexOf('→')
     const left = line.substring(0, idx).trimEnd()
-    if (left.length > maxLeft) maxLeft = left.length
+    if (left.length > maxLeft)
+      maxLeft = left.length
   }
   const col = maxLeft + 4 // 4 spaces before →
   for (const line of block) {
     if (line.includes('→')) {
       const idx = line.indexOf('→')
       const left = line.substring(0, idx).trimEnd()
       const right = line.substring(idx + 1).trimStart()
-      const padded = left.padEnd(col) + '→ ' + right
+      const padded = `${left.padEnd(col)}→ ${right}`
       result.push(padded)
-    } else {
+    }
+    else {
       result.push(line)
     }
   }
@@ -42,13 +45,16 @@ for (const line of lines) {
   if (line.startsWith('```') && !inBlock) {
     inBlock = true
     result.push(line)
-  } else if (line.startsWith('```') && inBlock) {
+  }
+  else if (line.startsWith('```') && inBlock) {
     flushBlock()
     inBlock = false
     result.push(line)
-  } else if (inBlock) {
+  }
+  else if (inBlock) {
     block.push(line)
-  } else {
+  }
+  else {
     result.push(line)
   }
 }