WebChat - Transform CLI into Modern Chat Interface

Convert any command-line program into an elegant conversational web assistant that your clients can use directly in their browser.

What is WebChat?

WebChat is a powerful feature that transforms any CLI tool, agent, or text-based program into a modern chat interface. It captures stdout/stdin interactions and presents them in a WhatsApp-style web interface that's familiar and easy to use.

💬

Conversational UI

Beautiful chat interface with message bubbles, timestamps, and typing indicators. Feels like using WhatsApp or Telegram.

🔐

Token Security

Secure access with unique tokens generated at startup. Share the link to grant access - no passwords needed.

🎨

Customizable Themes

Light and dark themes with WhatsApp-inspired design. Automatically saves user preference.

How It Works

1. Start Any Program

WebChat can wrap any program that reads from stdin and writes to stdout:

# Default: starts bash shell as chat
ploinky webchat

# Output:
Ploinky WebChat ready on http://localhost:8080 (agent: local)
Access URL (share to authenticate): http://localhost:8080/?token=918079319222ed91bb68777bf69a500a332465ff9e9a34989644081ee8fca3bb
Close with Ctrl+C

Start with a specific command:

# Python assistant
ploinky webchat python assistant.py

# Node.js chatbot
ploinky webchat node chatbot.js

# Ploinky CLI agent
ploinky webchat ploinky cli myAgent

# Even system commands
ploinky webchat htop

2. Secure Token Access

Security Model:
  • A unique 256-bit token is generated at startup
  • The access URL includes this token
  • Only users with the complete URL can access the chat
  • Token persists in .ploinky/.secrets for consistent access
  • No passwords to remember or type

3. Magic Transformation

The program's text output becomes chat messages from the assistant. User inputs are sent as chat messages to the program's stdin.

Example Flow:
  1. User types "help" in chat interface
  2. WebChat sends "help\n" to program's stdin
  3. Program outputs help text to stdout
  4. WebChat displays output as assistant message

4. Share the Link

Simply share the access URL with anyone who needs to use the chat interface. The token ensures only authorized users can connect.

Command Syntax

Basic Usage

ploinky webchat [command...]
Parameter Description Default
[command...] Optional command to run /bin/bash

Examples

# Start with default bash shell
ploinky webchat

# Start Python REPL
ploinky webchat python

# Run a specific script
ploinky webchat python chatbot.py

# Run Node.js application
ploinky webchat node assistant.js

# Connect to a Ploinky agent
ploinky webchat ploinky cli demo

# Multiple command arguments
ploinky webchat python -u assistant.py --verbose

Configuration

Environment Variables

# Set custom port (default: 8080)
ploinky var WEBCHAT_PORT 3000

# Set custom title
ploinky var WEBTTY_TITLE "Customer Support"

# View current settings
ploinky vars

Token Management

Tokens are automatically generated and stored in .ploinky/.secrets:

# Token is stored as
WEBCHAT_TOKEN=918079319222ed91bb68777bf69a500a332465ff9e9a34989644081ee8fca3bb

# Token persists across sessions
# Same token = same access URL
# To regenerate, delete the token and restart

Port Configuration

# Change default port
ploinky var WEBCHAT_PORT 3000

# Start on new port
ploinky webchat
# Will now run on http://localhost:3000/?token=...

Use Cases

Customer Support Bots

Transform your Python/Node.js support scripts into customer-facing chat interfaces:

# support_bot.py
while True:
    user_input = input()
    if "order" in user_input.lower():
        print("I can help you track your order. Please provide your order number.")
    elif "refund" in user_input.lower():
        print("For refunds, please visit our refund portal or contact support@example.com")
    else:
        print("How can I help you today?")

# Run as chat interface
ploinky webchat python support_bot.py

# Output:
Ploinky WebChat ready on http://localhost:8080 (agent: local)
Access URL (share to authenticate): http://localhost:8080/?token=918079319222...
# Share this URL with customers!

Interactive Debugging

Debug applications with a friendly chat interface instead of terminal:

# Start Node.js REPL as chat
ploinky webchat node

# Start Python interactive session
ploinky webchat python -i

# Start database CLI
ploinky webchat mysql -u root -p

AI Agent Interfaces

Perfect for LLM-powered agents and assistants:

# Your AI agent that reads prompts from stdin
ploinky webchat python llm_agent.py

# GPT-powered coding assistant
ploinky webchat node gpt-coder.js

# Connect to running Ploinky agent
ploinky webchat ploinky cli ai-assistant

System Administration

Make system tools accessible to non-technical users:

# System status checker
ploinky webchat bash system-health.sh

# Log analyzer
ploinky webchat python log-analyzer.py

# Container management
ploinky webchat docker ps

Features

Message Formatting

  • ✅ Automatic timestamp for each message
  • ✅ Read receipts visualization
  • ✅ Multi-line message support
  • ✅ Long message truncation with "Show more"
  • ✅ Side panel for viewing full messages

User Experience

  • ✅ Auto-resize input field
  • ✅ Enter to send (Shift+Enter for new line)
  • ✅ Connection status indicator
  • ✅ Automatic reconnection
  • ✅ Mobile responsive design

Security Features

  • ✅ Cryptographically secure tokens (256-bit)
  • ✅ No passwords stored or transmitted
  • ✅ Session-based authentication
  • ✅ Secure WebSocket communication
  • ✅ Input sanitization

Integration Examples

Python ChatBot

# chatbot.py
import json
import sys

def process_command(cmd):
    if cmd.lower() == 'help':
        return "Available commands: help, status, info, quit"
    elif cmd.lower() == 'status':
        return "System is operational"
    elif cmd.lower() == 'info':
        return "ChatBot v1.0 - Python Edition"
    else:
        return f"You said: {cmd}"

print("Welcome! I'm your Python assistant. Type 'help' for commands.")
sys.stdout.flush()

while True:
    try:
        user_input = input()
        response = process_command(user_input)
        print(response)
        sys.stdout.flush()
    except EOFError:
        break

# Run it:
# ploinky webchat python chatbot.py

Node.js Assistant

// assistant.js
const readline = require('readline');

const rl = readline.createInterface({
    input: process.stdin,
    output: process.stdout,
    terminal: false
});

console.log("Hello! I'm your Node.js assistant.");

rl.on('line', (input) => {
    const cmd = input.trim().toLowerCase();
    
    if (cmd === 'time') {
        console.log(`Current time: ${new Date().toLocaleString()}`);
    } else if (cmd === 'random') {
        console.log(`Random number: ${Math.random()}`);
    } else if (cmd.startsWith('calc ')) {
        try {
            const expr = cmd.substring(5);
            console.log(`Result: ${eval(expr)}`);
        } catch (e) {
            console.log('Invalid expression');
        }
    } else {
        console.log(`Echo: ${input}`);
    }
});

// Run it:
// ploinky webchat node assistant.js

Bash Script Interface

#!/bin/bash
# menu.sh

echo "Welcome to System Manager"
echo "========================="

while true; do
    echo ""
    echo "1. Check disk usage"
    echo "2. Show system info"
    echo "3. List processes"
    echo "4. Network status"
    echo "5. Exit"
    echo ""
    echo -n "Select option: "
    
    read option
    
    case $option in
        1)
            df -h
            ;;
        2)
            uname -a
            uptime
            ;;
        3)
            ps aux | head -20
            ;;
        4)
            ip addr show
            ;;
        5)
            echo "Goodbye!"
            exit 0
            ;;
        *)
            echo "Invalid option"
            ;;
    esac
done

# Run it:
# ploinky webchat bash menu.sh

Tips & Best Practices

For Developers

  • Always flush stdout after printing (Python: sys.stdout.flush())
  • Handle EOF gracefully for clean disconnections
  • Use line-buffered output for real-time responses
  • Implement timeout handling for long-running operations
  • Keep the access URL secure - it's the only authentication

For Production

  • Run behind a reverse proxy (nginx/Apache) with SSL
  • Use HTTPS in production to protect token transmission
  • Set appropriate CORS headers for embedding
  • Monitor WebSocket connections for scaling
  • Rotate tokens periodically for enhanced security

UI Customization

The chat interface uses CSS variables for easy theming. You can customize colors by modifying the CSS file or injecting custom styles.

Troubleshooting

Common Issues

Issue Solution
Port already in use Change port: ploinky var WEBCHAT_PORT 3000
Connection refused Check firewall settings and ensure service is running
Messages not appearing Ensure program flushes stdout after printing
Program exits immediately Use interactive mode or loop in your program
Token lost Check .ploinky/.secrets for WEBCHAT_TOKEN
Need new token Delete WEBCHAT_TOKEN from .secrets and restart

Security Notes

Important:
  • The access URL contains the authentication token
  • Share it only with trusted users
  • Use HTTPS in production environments
  • Tokens are stored in .ploinky/.secrets
  • Each service (WebChat, Console, Dashboard) has its own token