Loopin – VS Code Extension

Sign in to Loopin, manage tasks and features, and link files or code selections to tasks from your IDE.

How to install and run

Option A: Run from source (development)

1. Open the extension folder in VS Code:
   • File → Open Folder → choose extensions/vscode (inside the Loopin repo).
2. In the terminal (inside that folder):

   npm install
   npm run compile
   

3. Press F5 (or Run → Start Debugging).
4. A new Extension Development Host window opens with Loopin already loaded. In the left sidebar, open Explorer and use the Loopin section to sign in.

To test changes: edit code, run npm run compile, then press Ctrl+R (or Cmd+R) in the Development Host window to reload the extension.

Option B: Install in your main VS Code (packaged extension)

1. Install the VS Code packaging tool once:

   npm install -g @vscode/vsce
   

2. From the Loopin repo root:

   cd extensions/vscode
   npm install
   npm run compile
   vsce package
   

   This creates a file like loopin-0.1.0.vsix.

3. Install the .vsix in your IDE:

   • Open the Extensions view: click the Extensions icon in the left sidebar (or Cmd+Shift+X).
   • Click the ... (three dots) at the top of the Extensions panel.
   • Choose Install from VSIX....
   • Browse to extensions/vscode/loopin-0.1.0.vsix and select it.
   • If prompted, reload the window (e.g. “Reload Required” button).

4. Where to see Loopin (login, tasks, projects):

   • Click the Explorer icon in the left sidebar (file/folder icon, or Cmd+Shift+E).
   • In that same sidebar, scroll if needed — you’ll see a section named Loopin (below your project files).
   • Expand Loopin → click “Sign in to Loopin” (or run Loopin: Sign in from the Command Palette Cmd+Shift+P).
   • After signing in, your email appears; expand it to see Projects, then expand a project to see Tasks and Features.

Note: Ensure your Loopin API is reachable (e.g. backend at http://127.0.0.1:8000 or set Loopin: Api Url in Settings).

Publishing (so others can install from the marketplace)

You can publish to VS Code Marketplace (VS Code users) and/or Open VSX (Cursor, VSCodium, etc.). Update package.json first: set repository.url to your real repo and bump version for each release.

1. VS Code Marketplace

1. Create a publisher (one-time): go to marketplace.visualstudio.com/manage, sign in with a Microsoft account, click Create Publisher, and choose an ID (e.g. loopin or your name). Set that ID as publisher in package.json if it’s different.
2. Create a Personal Access Token (PAT) (one-time): go to dev.azure.com → your user menu → Personal access tokens → New Token. Scope: Marketplace (Publish) → Create and copy the token.
3. Publish (from extensions/vscode):

   npm run compile
   vsce login <your-publisher-id>   # paste the PAT when prompted
   vsce publish                      # or: vsce publish --pat <PAT>
   

   For a patch release: npm version patch then vsce publish.

2. Open VSX (Cursor / VSCodium)

1. Account (one-time): sign in at open-vsx.org (e.g. with GitHub).
2. Create token: Open VSX → User menu → Access Tokens → Create → copy the token.
3. Publish (from extensions/vscode):

   npm run compile
   vsce package
   npx ovsx publish loopin-0.1.0.vsix -p <your-open-vsx-token>
   

Where it shows up (two different marketplaces)

• If you only published to Open VSX: the extension will not show in VS Code. Install it in VS Code via Install from VSIX or publish to the VS Code Marketplace as well (steps above).
• If you only published to VS Code Marketplace: it will not show in Cursor’s Extensions. Publish to Open VSX for Cursor, or share the .vsix and use Install from VSIX.
• Delays: either marketplace can take a few minutes (or sometimes longer) to index. Search for Loopin or your publisher id (e.g. loopin).
• Direct links:
  • VS Code Marketplace: https://marketplace.visualstudio.com/items?itemName=loopin.loopin
  • Open VSX: https://open-vsx.org/extension/loopin/loopin

Features

• Sign in – Store your Loopin credentials securely (VS Code Secret Storage).
• Sidebar – View your account, projects, and under each project: Tasks and Features.
• Select project – Choose a project for “Create task”, “Create feature”, and “Link to task”.
• Create task / Create feature – Quick actions (use Command Palette: Loopin: Create task).
• Link current file to task – Adds a comment on the task with the file path.
• Link selection to task – Adds a comment with file path and the selected code snippet.

Configuration

• Loopin: Api Url – API base URL (default: http://127.0.0.1:8000/api/v1).

Development

npm install
npm run compile

Then press F5 in VS Code to launch the Extension Development Host and test the extension.

Commands