@rashidazarang/airtable-mcp 2.1.0 → 2.1.1

package/airtable-clipper/releases/v1.0.1/background.js

@@ -1,337 +0,0 @@
-// Airtable Clipper - Background Service Worker
-// Handles context menus, notifications, and cross-tab communication
-
-class BackgroundService {
-  constructor() {
-    this.init();
-  }
-
-  init() {
-    // Create context menu on installation
-    chrome.runtime.onInstalled.addListener(() => {
-      this.createContextMenus();
-      this.setupNotifications();
-    });
-
-    // Handle context menu clicks
-    chrome.contextMenus.onClicked.addListener((info, tab) => {
-      this.handleContextMenuClick(info, tab);
-    });
-
-    // Handle messages from content scripts and popup
-    chrome.runtime.onMessage.addListener((message, sender, sendResponse) => {
-      this.handleMessage(message, sender, sendResponse);
-      return true; // Keep message channel open for async responses
-    });
-
-    // Handle extension icon clicks
-    chrome.action.onClicked.addListener((tab) => {
-      this.handleActionClick(tab);
-    });
-
-    // Periodic cleanup
-    chrome.alarms.onAlarm.addListener((alarm) => {
-      if (alarm.name === 'cleanup') {
-        this.cleanupStorage();
-      }
-    });
-
-    // Set up cleanup alarm
-    chrome.alarms.create('cleanup', { delayInMinutes: 60, periodInMinutes: 60 });
-  }
-
-  createContextMenus() {
-    // Remove existing menus
-    chrome.contextMenus.removeAll();
-
-    // Main menu
-    chrome.contextMenus.create({
-      id: 'save-to-airtable',
-      title: 'Save to Airtable',
-      contexts: ['page', 'selection', 'link', 'image']
-    });
-
-    // LinkedIn specific
-    chrome.contextMenus.create({
-      id: 'save-linkedin-profile',
-      title: 'Save LinkedIn Profile',
-      contexts: ['page'],
-      documentUrlPatterns: ['*://www.linkedin.com/in/*', '*://linkedin.com/in/*']
-    });
-
-    // Quick save selection
-    chrome.contextMenus.create({
-      id: 'quick-save-selection',
-      title: 'Quick Save Selected Text',
-      contexts: ['selection']
-    });
-  }
-
-  async handleContextMenuClick(info, tab) {
-    try {
-      switch (info.menuItemId) {
-        case 'save-to-airtable':
-          await this.triggerSave(tab, { type: 'general', info });
-          break;
-        case 'save-linkedin-profile':
-          await this.triggerSave(tab, { type: 'linkedin', info });
-          break;
-        case 'quick-save-selection':
-          await this.triggerSave(tab, { type: 'selection', text: info.selectionText });
-          break;
-      }
-    } catch (error) {
-      console.error('Context menu error:', error);
-      this.showErrorNotification(error.message);
-    }
-  }
-
-  async triggerSave(tab, data) {
-    // Send message to content script to initiate save
-    try {
-      const response = await chrome.tabs.sendMessage(tab.id, {
-        action: 'triggerSave',
-        data: data
-      });
-
-      if (response && response.success) {
-        this.showSuccessNotification('Content saved to Airtable!');
-      } else {
-        throw new Error(response?.error || 'Failed to save content');
-      }
-    } catch (error) {
-      console.error('Save trigger error:', error);
-      // Fallback: open popup if content script isn't available
-      chrome.action.openPopup();
-    }
-  }
-
-  async handleMessage(message, sender, sendResponse) {
-    try {
-      switch (message.action) {
-        case 'saveToAirtable':
-          const result = await this.saveToAirtable(message.data);
-          sendResponse({ success: true, result });
-          break;
-
-        case 'getSettings':
-          const settings = await this.getSettings();
-          sendResponse({ success: true, settings });
-          break;
-
-        case 'saveSettings':
-          await this.saveSettings(message.settings);
-          sendResponse({ success: true });
-          break;
-
-        case 'showNotification':
-          this.showNotification(message.title, message.message, message.type);
-          sendResponse({ success: true });
-          break;
-
-        case 'openSidePanel':
-          if (sender.tab) {
-            chrome.sidePanel.open({ tabId: sender.tab.id });
-          }
-          sendResponse({ success: true });
-          break;
-
-        default:
-          sendResponse({ success: false, error: 'Unknown action' });
-      }
-    } catch (error) {
-      console.error('Message handler error:', error);
-      sendResponse({ success: false, error: error.message });
-    }
-  }
-
-  async saveToAirtable(data) {
-    // Get user settings
-    const settings = await this.getSettings();
-    
-    if (!settings.airtableToken || !settings.baseId) {
-      throw new Error('Airtable credentials not configured');
-    }
-
-    // Import Airtable client
-    const { AirtableClient } = await import('./lib/airtable-client.js');
-    const client = new AirtableClient(settings.airtableToken, settings.baseId);
-
-    // Process and save data
-    const processedData = await this.processData(data, settings);
-    const result = await client.createRecord(processedData.table, processedData.fields);
-
-    // Update usage stats
-    await this.updateUsageStats();
-
-    return result;
-  }
-
-  async processData(data, settings) {
-    // Smart data processing based on content type
-    if (data.type === 'linkedin') {
-      return {
-        table: settings.linkedinTable || 'Contacts',
-        fields: this.processLinkedInData(data)
-      };
-    } else if (data.type === 'selection') {
-      return {
-        table: settings.defaultTable || 'Clips',
-        fields: {
-          'Content': data.text,
-          'Source URL': data.url,
-          'Date Saved': new Date().toISOString(),
-          'Type': 'Text Selection'
-        }
-      };
-    } else {
-      return {
-        table: settings.defaultTable || 'Clips',
-        fields: {
-          'Title': data.title || 'Untitled',
-          'URL': data.url,
-          'Content': data.content,
-          'Date Saved': new Date().toISOString(),
-          'Type': 'Web Page'
-        }
-      };
-    }
-  }
-
-  processLinkedInData(data) {
-    return {
-      'Name': data.name || '',
-      'Title': data.title || '',
-      'Company': data.company || '',
-      'Location': data.location || '',
-      'LinkedIn URL': data.url || '',
-      'Date Added': new Date().toISOString(),
-      'Source': 'LinkedIn',
-      'Notes': data.about ? data.about.substring(0, 500) + '...' : ''
-    };
-  }
-
-  async getSettings() {
-    const result = await chrome.storage.sync.get([
-      'airtableToken',
-      'baseId',
-      'linkedinTable',
-      'defaultTable',
-      'autoSave',
-      'notifications'
-    ]);
-
-    return {
-      airtableToken: result.airtableToken || '',
-      baseId: result.baseId || '',
-      linkedinTable: result.linkedinTable || 'Contacts',
-      defaultTable: result.defaultTable || 'Clips',
-      autoSave: result.autoSave || false,
-      notifications: result.notifications !== false // Default to true
-    };
-  }
-
-  async saveSettings(settings) {
-    await chrome.storage.sync.set(settings);
-  }
-
-  async updateUsageStats() {
-    const stats = await chrome.storage.local.get(['usageStats']);
-    const currentStats = stats.usageStats || {
-      totalClips: 0,
-      weeklyClips: 0,
-      lastResetDate: new Date().toDateString()
-    };
-
-    // Reset weekly counter if it's a new week
-    const today = new Date().toDateString();
-    if (currentStats.lastResetDate !== today) {
-      const lastReset = new Date(currentStats.lastResetDate);
-      const daysSinceReset = Math.floor((Date.now() - lastReset.getTime()) / (1000 * 60 * 60 * 24));
-      
-      if (daysSinceReset >= 7) {
-        currentStats.weeklyClips = 0;
-        currentStats.lastResetDate = today;
-      }
-    }
-
-    currentStats.totalClips++;
-    currentStats.weeklyClips++;
-
-    await chrome.storage.local.set({ usageStats: currentStats });
-  }
-
-  setupNotifications() {
-    // Check if notifications are supported
-    if ('notifications' in chrome) {
-      // Request notification permission if needed
-      chrome.notifications.getPermissionLevel((level) => {
-        if (level !== 'granted') {
-          console.log('Notification permission not granted');
-        }
-      });
-    }
-  }
-
-  showSuccessNotification(message) {
-    this.showNotification('Success!', message, 'success');
-  }
-
-  showErrorNotification(message) {
-    this.showNotification('Error', message, 'error');
-  }
-
-  async showNotification(title, message, type = 'basic') {
-    const settings = await this.getSettings();
-    if (!settings.notifications) return;
-
-    const iconUrl = type === 'error' ? 'icons/icon-error-48.png' : 'icons/icon-48.png';
-
-    chrome.notifications.create({
-      type: 'basic',
-      iconUrl: iconUrl,
-      title: title,
-      message: message
-    });
-  }
-
-  async handleActionClick(tab) {
-    // Check if this is a LinkedIn profile page
-    if (tab.url.includes('linkedin.com/in/')) {
-      // Try to extract LinkedIn data automatically
-      try {
-        await this.triggerSave(tab, { type: 'linkedin' });
-      } catch (error) {
-        // Fallback to opening popup
-        chrome.action.openPopup();
-      }
-    } else {
-      // Open popup for general pages
-      chrome.action.openPopup();
-    }
-  }
-
-  async cleanupStorage() {
-    // Clean up old temporary data
-    const result = await chrome.storage.local.get(null);
-    const keysToRemove = [];
-
-    for (const [key, value] of Object.entries(result)) {
-      // Remove temporary data older than 24 hours
-      if (key.startsWith('temp_') && value.timestamp) {
-        const age = Date.now() - value.timestamp;
-        if (age > 24 * 60 * 60 * 1000) { // 24 hours
-          keysToRemove.push(key);
-        }
-      }
-    }
-
-    if (keysToRemove.length > 0) {
-      await chrome.storage.local.remove(keysToRemove);
-      console.log(`Cleaned up ${keysToRemove.length} temporary items`);
-    }
-  }
-}
-
-// Initialize the background service
-new BackgroundService();

package/airtable-clipper/releases/v1.0.1/base-setup.html

@@ -1,324 +0,0 @@
-<!DOCTYPE html>
-<html lang="en">
-<head>
-  <meta charset="UTF-8">
-  <meta name="viewport" content="width=device-width, initial-scale=1.0">
-  <title>Airtable Clipper - Base Setup</title>
-  <link rel="stylesheet" href="styles/popup.css">
-  <style>
-    .setup-wizard {
-      width: 420px;
-      max-height: 600px;
-      overflow-y: auto;
-    }
-    
-    .wizard-step {
-      display: none;
-      padding: 20px;
-    }
-    
-    .wizard-step.active {
-      display: block;
-    }
-    
-    .step-indicator {
-      display: flex;
-      justify-content: center;
-      margin-bottom: 20px;
-      gap: 10px;
-    }
-    
-    .step-dot {
-      width: 12px;
-      height: 12px;
-      border-radius: 50%;
-      background-color: #e5e7eb;
-      transition: background-color 0.3s ease;
-    }
-    
-    .step-dot.active {
-      background-color: #667eea;
-    }
-    
-    .step-dot.completed {
-      background-color: #10b981;
-    }
-    
-    .template-preview {
-      border: 1px solid #e5e7eb;
-      border-radius: 8px;
-      padding: 16px;
-      margin: 16px 0;
-      background-color: #f9fafb;
-    }
-    
-    .table-preview {
-      margin-bottom: 16px;
-      padding: 12px;
-      border: 1px solid #d1d5db;
-      border-radius: 6px;
-      background-color: white;
-    }
-    
-    .table-preview h4 {
-      margin: 0 0 8px 0;
-      color: #374151;
-      font-size: 14px;
-      font-weight: 600;
-    }
-    
-    .table-preview p {
-      margin: 0 0 8px 0;
-      font-size: 12px;
-      color: #6b7280;
-    }
-    
-    .field-list {
-      display: flex;
-      flex-wrap: wrap;
-      gap: 4px;
-    }
-    
-    .field-tag {
-      background-color: #e0e7ff;
-      color: #3730a3;
-      padding: 2px 6px;
-      border-radius: 3px;
-      font-size: 10px;
-      font-weight: 500;
-    }
-    
-    .validation-result {
-      margin: 16px 0;
-      padding: 12px;
-      border-radius: 6px;
-    }
-    
-    .validation-result.excellent {
-      background-color: #d1fae5;
-      border: 1px solid #a7f3d0;
-      color: #065f46;
-    }
-    
-    .validation-result.good {
-      background-color: #dbeafe;
-      border: 1px solid #93c5fd;
-      color: #1e40af;
-    }
-    
-    .validation-result.fair {
-      background-color: #fef3c7;
-      border: 1px solid #fcd34d;
-      color: #92400e;
-    }
-    
-    .validation-result.needs-work {
-      background-color: #fee2e2;
-      border: 1px solid #fca5a5;
-      color: #991b1b;
-    }
-    
-    .wizard-actions {
-      display: flex;
-      justify-content: space-between;
-      margin-top: 20px;
-      padding-top: 16px;
-      border-top: 1px solid #e5e7eb;
-    }
-    
-    .copy-script-area {
-      width: 100%;
-      height: 200px;
-      font-family: 'Monaco', 'Menlo', 'Ubuntu Mono', monospace;
-      font-size: 11px;
-      resize: vertical;
-    }
-    
-    .template-url {
-      display: block;
-      margin: 16px 0;
-      padding: 12px;
-      background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
-      color: white;
-      text-decoration: none;
-      border-radius: 6px;
-      text-align: center;
-      font-weight: 500;
-      transition: transform 0.2s ease;
-    }
-    
-    .template-url:hover {
-      transform: translateY(-1px);
-    }
-  </style>
-</head>
-<body class="setup-wizard">
-  <!-- Step Indicator -->
-  <div class="step-indicator">
-    <div class="step-dot active" data-step="1"></div>
-    <div class="step-dot" data-step="2"></div>
-    <div class="step-dot" data-step="3"></div>
-    <div class="step-dot" data-step="4"></div>
-  </div>
-
-  <!-- Step 1: Welcome & Template Choice -->
-  <div class="wizard-step active" id="step1">
-    <h2>🚀 Create Your Airtable Clipper Database</h2>
-    <p>Let's set up the perfect Airtable base for your web clipping needs. This wizard will create optimized tables with all the right fields.</p>
-    
-    <div class="form-group">
-      <label>Choose your setup method:</label>
-      <div style="margin-top: 12px;">
-        <label class="checkbox-label">
-          <input type="radio" name="setupMethod" value="template" checked>
-          <span class="checkmark"></span>
-          <strong>One-Click Template</strong> (Recommended)
-          <br><small style="margin-left: 24px; color: #6b7280;">Instantly copy our proven database structure</small>
-        </label>
-        
-        <label class="checkbox-label" style="margin-top: 12px;">
-          <input type="radio" name="setupMethod" value="manual">
-          <span class="checkmark"></span>
-          <strong>Manual Setup Guide</strong>
-          <br><small style="margin-left: 24px; color: #6b7280;">Step-by-step instructions to create tables yourself</small>
-        </label>
-        
-        <label class="checkbox-label" style="margin-top: 12px;">
-          <input type="radio" name="setupMethod" value="existing">
-          <span class="checkmark"></span>
-          <strong>Validate Existing Base</strong>
-          <br><small style="margin-left: 24px; color: #6b7280;">Check if your current base is clipper-ready</small>
-        </label>
-      </div>
-    </div>
-
-    <div class="wizard-actions">
-      <button class="btn secondary" onclick="window.close()">Cancel</button>
-      <button class="btn primary" onclick="nextStep()">Next</button>
-    </div>
-  </div>
-
-  <!-- Step 2: Template Configuration -->
-  <div class="wizard-step" id="step2">
-    <h2>📋 Configure Your Database</h2>
-    <p>Customize which tables to include based on your use case:</p>
-
-    <div class="form-group">
-      <label class="checkbox-label">
-        <input type="checkbox" id="includeContacts" checked>
-        <span class="checkmark"></span>
-        <strong>Contacts Table</strong> - LinkedIn profiles & leads
-      </label>
-      
-      <label class="checkbox-label">
-        <input type="checkbox" id="includeClips" checked>
-        <span class="checkmark"></span>
-        <strong>Web Clips Table</strong> - Articles & web content
-      </label>
-      
-      <label class="checkbox-label">
-        <input type="checkbox" id="includeCompanies" checked>
-        <span class="checkmark"></span>
-        <strong>Companies Table</strong> - Organization profiles
-      </label>
-      
-      <label class="checkbox-label">
-        <input type="checkbox" id="includeTasks">
-        <span class="checkmark"></span>
-        <strong>Tasks Table</strong> - Follow-up actions
-      </label>
-    </div>
-
-    <div class="form-group">
-      <label for="baseName">Base Name:</label>
-      <input type="text" id="baseName" value="Airtable Clipper Database" placeholder="Enter base name">
-    </div>
-
-    <div class="wizard-actions">
-      <button class="btn secondary" onclick="prevStep()">Back</button>
-      <button class="btn primary" onclick="nextStep()">Preview</button>
-    </div>
-  </div>
-
-  <!-- Step 3: Template Preview -->
-  <div class="wizard-step" id="step3">
-    <h2>👀 Preview Your Database</h2>
-    <p>Here's what will be created in your Airtable base:</p>
-
-    <div class="template-preview" id="templatePreview">
-      <!-- Dynamically populated -->
-    </div>
-
-    <!-- Template Link -->
-    <div id="templateLinkSection" style="display: none;">
-      <h3>🎉 One-Click Template Ready!</h3>
-      <a href="#" class="template-url" id="templateLink" target="_blank">
-        📋 Copy Template to Your Airtable →
-      </a>
-      <p style="font-size: 12px; color: #6b7280; text-align: center;">
-        This will open Airtable in a new tab and copy the complete database structure
-      </p>
-    </div>
-
-    <!-- Manual Setup -->
-    <div id="manualSetupSection" style="display: none;">
-      <h3>📝 Manual Setup Instructions</h3>
-      <ol style="font-size: 13px; line-height: 1.5; padding-left: 20px;">
-        <li>Go to <a href="https://airtable.com" target="_blank">airtable.com</a> and create a new base</li>
-        <li>Name it "<span id="baseNameDisplay"></span>"</li>
-        <li>Create the tables shown above with their respective fields</li>
-        <li>Copy your Base ID and return to configure the extension</li>
-      </ol>
-      
-      <details style="margin-top: 16px;">
-        <summary style="cursor: pointer; font-weight: 500;">📋 Copy Creation Script</summary>
-        <p style="font-size: 12px; margin: 8px 0;">Copy this script and paste it into Airtable's Scripting app:</p>
-        <textarea class="copy-script-area" id="creationScript" readonly></textarea>
-        <button class="btn secondary" onclick="copyScript()" style="margin-top: 8px;">Copy Script</button>
-      </details>
-    </div>
-
-    <div class="wizard-actions">
-      <button class="btn secondary" onclick="prevStep()">Back</button>
-      <button class="btn primary" onclick="nextStep()" id="step3NextBtn">Create Database</button>
-    </div>
-  </div>
-
-  <!-- Step 4: Validation & Completion -->
-  <div class="wizard-step" id="step4">
-    <h2>✅ Database Validation</h2>
-    <p>Let's check if your Airtable base is set up correctly:</p>
-
-    <div class="form-group" id="credentialsSection">
-      <label for="validationToken">Personal Access Token:</label>
-      <input type="password" id="validationToken" placeholder="pat...">
-      
-      <label for="validationBaseId">Base ID:</label>
-      <input type="text" id="validationBaseId" placeholder="app...">
-      
-      <button class="btn primary full-width" onclick="validateBase()" id="validateBtn">
-        Validate Base Setup
-      </button>
-    </div>
-
-    <div id="validationResults" style="display: none;">
-      <!-- Validation results will be shown here -->
-    </div>
-
-    <div class="wizard-actions">
-      <button class="btn secondary" onclick="prevStep()">Back</button>
-      <button class="btn primary" onclick="completeSetup()" id="completeBtn" style="display: none;">
-        Complete Setup
-      </button>
-    </div>
-  </div>
-
-  <!-- Loading Overlay -->
-  <div class="loading-overlay" id="loadingOverlay" style="display: none;">
-    <div class="loading-spinner"></div>
-    <div class="loading-text" id="loadingText">Processing...</div>
-  </div>
-
-  <script type="module" src="base-setup.js"></script>
-</body>
-</html>