npm - @somfan2001/claudeenv - Versions diffs - 1.0.0 - Mend

@somfan2001/claudeenv 1.0.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (2) hide show

package/package.json +15 -0
package/server.js +434 -0

package/package.json ADDED Viewed

@@ -0,0 +1,15 @@
+{
+  "name": "@somfan2001/claudeenv",
+  "version": "1.0.0",
+  "description": "Standalone CLI tool to edit Claude settings on macOS",
+  "main": "server.js",
+  "bin": {
+    "claudeenv": "./server.js"
+  },
+  "keywords": [],
+  "author": "",
+  "license": "ISC",
+  "engines": {
+    "node": ">=12.0.0"
+  }
+}

package/server.js ADDED Viewed

@@ -0,0 +1,434 @@
+#!/usr/bin/env node
+const http = require('http');
+const fs = require('fs');
+const path = require('path');
+const os = require('os');
+const PORT = 20129;
+// Đường dẫn file settings.json của Claude trên macOS
+const getClaudeSettingsPath = () => {
+  const homeDir = os.homedir();
+  return path.join(homeDir, '.claude', 'settings.json');
+};
+// Đọc cài đặt
+function readSettings() {
+  const settingsPath = getClaudeSettingsPath();
+  try {
+    if (fs.existsSync(settingsPath)) {
+      const data = fs.readFileSync(settingsPath, 'utf8');
+      return JSON.parse(data);
+    }
+  } catch (err) {
+    console.error('Error reading settings:', err);
+  }
+  return { hasCompletedOnboarding: true, env: {} };
+}
+// Lưu cài đặt
+function saveSettings(settings) {
+  const settingsPath = getClaudeSettingsPath();
+  const dir = path.dirname(settingsPath);
+  try {
+    if (!fs.existsSync(dir)) {
+      fs.mkdirSync(dir, { recursive: true });
+    }
+    fs.writeFileSync(settingsPath, JSON.stringify(settings, null, 2), 'utf8');
+    return true;
+  } catch (err) {
+    console.error('Error writing settings:', err);
+    return false;
+  }
+}
+// Render giao diện HTML
+const htmlTemplate = (envData, message = '') => {
+  // Danh sách các key env thường dùng để tiện hiển thị/nhập liệu
+  const defaultKeys = [
+    "ANTHROPIC_AUTH_TOKEN",
+    "ANTHROPIC_BASE_URL",
+    "API_TIMEOUT_MS",
+    "DISABLE_TELEMETRY",
+    "CLAUDE_CODE_DISABLE_1M_CONTEXT",
+    "CLAUDE_CODE_MAX_RETRIES",
+    "CLAUDE_CODE_DISABLE_NONESSENTIAL_TRAFFIC",
+    "ANTHROPIC_DEFAULT_HAIKU_MODEL",
+    "ANTHROPIC_DEFAULT_SONNET_MODEL",
+    "ANTHROPIC_DEFAULT_OPUS_MODEL",
+    "CLAUDE_CODE_SUBAGENT_MODEL"
+  ];
+  const env = envData || {};
+  // Lấy các key tùy biến khác mà user tự thêm
+  const allKeys = Array.from(new Set([...defaultKeys, ...Object.keys(env)]));
+  let rowsHtml = '';
+  allKeys.forEach(key => {
+    const value = env[key] || '';
+    rowsHtml += `
+      <div class="row">
+        <label for="env_${key}">${key}</label>
+        <div class="input-group">
+          <input type="text" id="env_${key}" name="env_${key}" value="${value}" placeholder="Chưa cấu hình">
+          <button type="button" class="btn-clear" onclick="document.getElementById('env_${key}').value = ''">Xóa</button>
+        </div>
+      </div>
+    `;
+  });
+  return `
+    <!DOCTYPE html>
+    <html lang="vi">
+    <head>
+      <meta charset="UTF-8">
+      <meta name="viewport" content="width=device-width, initial-scale=1.0">
+      <title>Claude Settings Editor (macOS)</title>
+      <style>
+        body {
+          font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
+          background-color: #f5f5f7;
+          color: #1d1d1f;
+          margin: 0;
+          padding: 40px 20px;
+          display: flex;
+          justify-content: center;
+        }
+        .container {
+          background: #ffffff;
+          border-radius: 12px;
+          box-shadow: 0 4px 20px rgba(0,0,0,0.08);
+          max-width: 800px;
+          width: 100%;
+          padding: 30px;
+          box-sizing: border-box;
+        }
+        h1 {
+          font-size: 24px;
+          margin-top: 0;
+          margin-bottom: 8px;
+          color: #d97757;
+        }
+        .subtitle {
+          color: #86868b;
+          font-size: 14px;
+          margin-bottom: 24px;
+        }
+        .path-box {
+          background-color: #f5f5f7;
+          padding: 10px 14px;
+          border-radius: 6px;
+          font-family: monospace;
+          font-size: 13px;
+          margin-bottom: 20px;
+          word-break: break-all;
+          border: 1px solid #d2d2d7;
+        }
+        .row {
+          margin-bottom: 16px;
+          display: grid;
+          grid-template-columns: 320px 1fr;
+          align-items: center;
+          gap: 15px;
+        }
+        label {
+          font-weight: 500;
+          font-size: 14px;
+          color: #333;
+          word-break: break-all;
+        }
+        .input-group {
+          display: flex;
+          gap: 8px;
+        }
+        input[type="text"] {
+          flex: 1;
+          padding: 8px 12px;
+          border: 1px solid #ccc;
+          border-radius: 6px;
+          font-size: 14px;
+          font-family: monospace;
+          outline: none;
+        }
+        input[type="text"]:focus {
+          border-color: #d97757;
+          box-shadow: 0 0 0 2px rgba(217,119,87,0.2);
+        }
+        .btn-clear {
+          background-color: #e3e3e3;
+          border: none;
+          color: #333;
+          padding: 8px 12px;
+          border-radius: 6px;
+          font-size: 12px;
+          cursor: pointer;
+          transition: background 0.2s;
+        }
+        .btn-clear:hover {
+          background-color: #d5d5d5;
+        }
+        .actions {
+          margin-top: 30px;
+          padding-top: 20px;
+          border-top: 1px solid #e5e5e7;
+          display: flex;
+          gap: 12px;
+        }
+        .btn-save {
+          background-color: #d97757;
+          color: white;
+          border: none;
+          padding: 10px 20px;
+          border-radius: 6px;
+          font-weight: 600;
+          font-size: 15px;
+          cursor: pointer;
+          transition: opacity 0.2s;
+        }
+        .btn-save:hover {
+          opacity: 0.9;
+        }
+        .btn-add {
+          background-color: #0071e3;
+          color: white;
+          border: none;
+          padding: 10px 16px;
+          border-radius: 6px;
+          font-size: 14px;
+          cursor: pointer;
+        }
+        .btn-add:hover {
+          opacity: 0.9;
+        }
+        .btn-shutdown {
+          background-color: #ff3b30;
+          color: white;
+          border: none;
+          padding: 10px 16px;
+          border-radius: 6px;
+          font-size: 14px;
+          font-weight: 600;
+          cursor: pointer;
+          margin-left: auto;
+        }
+        .btn-shutdown:hover {
+          opacity: 0.9;
+        }
+        .message {
+          padding: 12px;
+          border-radius: 6px;
+          margin-bottom: 20px;
+          font-size: 14px;
+          font-weight: 500;
+        }
+        .success {
+          background-color: #e8f5e9;
+          color: #2e7d32;
+          border: 1px solid #c8e6c9;
+        }
+        .error {
+          background-color: #ffebee;
+          color: #c62828;
+          border: 1px solid #ffcdd2;
+        }
+        /* Modal for adding custom key */
+        #add-modal {
+          display: none;
+          position: fixed;
+          top: 0; left: 0; right: 0; bottom: 0;
+          background: rgba(0,0,0,0.5);
+          justify-content: center;
+          align-items: center;
+          z-index: 100;
+        }
+        .modal-content {
+          background: white;
+          padding: 24px;
+          border-radius: 12px;
+          width: 400px;
+          box-shadow: 0 4px 24px rgba(0,0,0,0.15);
+        }
+        .modal-content h3 {
+          margin-top: 0;
+          margin-bottom: 15px;
+        }
+        .modal-content input {
+          width: 93%;
+          padding: 8px 12px;
+          margin-bottom: 15px;
+          border: 1px solid #ccc;
+          border-radius: 6px;
+        }
+        .modal-actions {
+          display: flex;
+          justify-content: flex-end;
+          gap: 10px;
+        }
+        .btn-cancel {
+          background: #e5e5e7;
+          border: none;
+          padding: 8px 16px;
+          border-radius: 6px;
+          cursor: pointer;
+        }
+        .btn-confirm {
+          background: #0071e3;
+          color: white;
+          border: none;
+          padding: 8px 16px;
+          border-radius: 6px;
+          cursor: pointer;
+        }
+      </style>
+    </head>
+    <body>
+      <div class="container">
+        <h1>Claude CLI Settings Editor</h1>
+        <div class="subtitle">Chỉnh sửa file cấu hình biến môi trường của Claude Code cho macOS</div>
+        <div class="path-box">
+          <strong>Đường dẫn file:</strong> ${getClaudeSettingsPath()}
+        </div>
+        ${message}
+        <form id="settings-form" method="POST" action="/save">
+          <div class="env-rows">
+            ${rowsHtml}
+          </div>
+          <div class="actions">
+            <button type="submit" class="btn-save">Lưu Cấu Hình</button>
+            <button type="button" class="btn-add" onclick="showModal()">+ Thêm Biến Custom</button>
+            <button type="button" class="btn-shutdown" onclick="shutdownServer()">Tắt Server</button>
+          </div>
+        </form>
+      </div>
+      <div id="add-modal">
+        <div class="modal-content">
+          <h3>Thêm Biến Môi Trường Custom</h3>
+          <input type="text" id="new-key-input" placeholder="Ví dụ: MY_CUSTOM_ENV_VAR" style="font-family: monospace;">
+          <div class="modal-actions">
+            <button class="btn-cancel" onclick="closeModal()">Hủy</button>
+            <button class="btn-confirm" onclick="addNewKey()">Thêm</button>
+          </div>
+        </div>
+      </div>
+      <script>
+        function shutdownServer() {
+          fetch('/shutdown', { method: 'POST' })
+            .then(() => {
+              // Gợi ý trình duyệt đóng tab ngay lập tức
+              window.close();
+              // Dự phòng trong trường hợp window.close() bị trình duyệt chặn (do tab không được mở bằng window.open)
+              setTimeout(() => {
+                document.body.innerHTML = '<div style="max-width: 600px; margin: 50px auto; padding: 20px; background: white; border-radius: 8px; box-shadow: 0 2px 10px rgba(0,0,0,0.1); text-align: center;"><h2>Server đã tắt thành công!</h2><p>Tab này sẽ tự đóng hoặc bạn có thể đóng thủ công.</p></div>';
+              }, 100);
+            })
+            .catch(err => {
+              alert('Có lỗi xảy ra khi tắt server.');
+            });
+        }
+        function showModal() {
+          document.getElementById('add-modal').style.display = 'flex';
+          document.getElementById('new-key-input').focus();
+        }
+        function closeModal() {
+          document.getElementById('add-modal').style.display = 'none';
+          document.getElementById('new-key-input').value = '';
+        }
+        function addNewKey() {
+          const keyInput = document.getElementById('new-key-input').value.trim().toUpperCase();
+          if (!keyInput) return;
+          // Kiểm tra xem đã có field đó chưa
+          if (document.getElementById('env_' + keyInput)) {
+            alert('Biến này đã tồn tại!');
+            return;
+          }
+          const container = document.querySelector('.env-rows');
+          const newRow = document.createElement('div');
+          newRow.className = 'row';
+          newRow.innerHTML = \`
+            <label for="env_\${keyInput}">\${keyInput}</label>
+            <div class="input-group">
+              <input type="text" id="env_\${keyInput}" name="env_\${keyInput}" value="" placeholder="Nhập giá trị">
+              <button type="button" class="btn-clear" onclick="document.getElementById('env_\${keyInput}').value = ''">Xóa</button>
+            </div>
+          \`;
+          container.appendChild(newRow);
+          closeModal();
+          // Cuộn xuống
+          newRow.scrollIntoView({ behavior: 'smooth' });
+        }
+      </script>
+    </body>
+    </html>
+  `;
+};
+// Khởi tạo server
+const server = http.createServer((req, res) => {
+  const url = req.url;
+  if (req.method === 'GET' && (url === '/' || url === '/index.html')) {
+    const settings = readSettings();
+    res.writeHead(200, { 'Content-Type': 'text/html; charset=utf-8' });
+    res.end(htmlTemplate(settings.env));
+  }
+  else if (req.method === 'POST' && url === '/save') {
+    let body = '';
+    req.on('data', chunk => {
+      body += chunk.toString();
+    });
+    req.on('end', () => {
+      // Parse application/x-www-form-urlencoded
+      const params = new URLSearchParams(body);
+      const newEnv = {};
+      for (const [key, value] of params.entries()) {
+        if (key.startsWith('env_')) {
+          const envKey = key.slice(4); // Lấy tên biến (bỏ 'env_')
+          if (value.trim() !== '') {
+            newEnv[envKey] = value.trim();
+          }
+        }
+      }
+      const settings = readSettings();
+      settings.env = newEnv;
+      settings.hasCompletedOnboarding = true;
+      const success = saveSettings(settings);
+      res.writeHead(200, { 'Content-Type': 'text/html; charset=utf-8' });
+      if (success) {
+        res.end(htmlTemplate(newEnv, `<div class="message success">Lưu cấu hình thành công! Đã lưu vào file config.</div>`));
+      } else {
+        res.end(htmlTemplate(newEnv, `<div class="message error">Lưu thất bại! Đã xảy ra lỗi khi ghi file settings.json.</div>`));
+      }
+    });
+  }
+  else if (req.method === 'POST' && url === '/shutdown') {
+    res.writeHead(200, { 'Content-Type': 'text/plain; charset=utf-8' });
+    res.end('Server shutting down...');
+    console.log('Shutdown request received. Stopping server...');
+    setTimeout(() => {
+      process.exit(0);
+    }, 500);
+  }
+  else {
+    res.writeHead(404, { 'Content-Type': 'text/plain' });
+    res.end('Not Found');
+  }
+});
+server.listen(PORT, () => {
+  console.log(`Server is running at http://localhost:${PORT}`);
+});