@pheem49/mint 1.4.2 → 1.5.0

package/src/System/safety_manager.js

@@ -0,0 +1,165 @@
+const fs = require('fs');
+const os = require('os');
+const path = require('path');
+
+const TIERS = Object.freeze({
+    SAFE: 'safe',
+    APPROVAL: 'approval',
+    DANGEROUS: 'dangerous',
+    BLOCKED: 'blocked'
+});
+
+const BLOCKED_COMMAND_PATTERNS = [
+    { pattern: /\brm\s+(-[^\s]*r[^\s]*f|-rf|-fr)\b/, reason: 'recursive force delete' },
+    { pattern: /\bgit\s+reset\s+--hard\b/, reason: 'destructive git reset' },
+    { pattern: /\bgit\s+checkout\s+--\b/, reason: 'destructive git checkout path restore' },
+    { pattern: /\bgit\s+clean\b.*\s-[^\s]*f/, reason: 'destructive git clean' },
+    { pattern: /\bmkfs(?:\.\w+)?\b/, reason: 'filesystem formatting' },
+    { pattern: /\bdd\s+.*\bof=\/dev\//, reason: 'raw disk write' },
+    { pattern: />\s*\/dev\/(?:sd|nvme|hd|mapper)/, reason: 'write redirection to block device' },
+    { pattern: /\b(shutdown|reboot|poweroff|halt)\b/, reason: 'system power command' },
+    { pattern: /\bsudo\b/, reason: 'privilege escalation' },
+    { pattern: /\bchmod\s+-R\s+777\b/, reason: 'unsafe recursive permissions' },
+    { pattern: /\bchown\s+-R\b/, reason: 'unsafe recursive ownership change' },
+    { pattern: /\bcurl\b.*\|\s*(sh|bash|zsh)\b/, reason: 'remote script piping' },
+    { pattern: /\bwget\b.*\|\s*(sh|bash|zsh)\b/, reason: 'remote script piping' }
+];
+
+const DANGEROUS_ACTIONS = new Set([
+    'delete_file',
+    'system_automation'
+]);
+
+const SAFE_ACTIONS = new Set([
+    'open_url',
+    'search',
+    'open_app',
+    'open_file',
+    'open_folder',
+    'find_path',
+    'clipboard_write',
+    'learn_file',
+    'learn_folder',
+    'mcp_tool',
+    'mouse_move',
+    'mouse_click',
+    'type_text',
+    'key_tap',
+    'plugin',
+    'web_automation',
+    'create_folder'
+]);
+
+const DANGEROUS_SYSTEM_COMMANDS = new Set(['shutdown', 'restart', 'reboot', 'poweroff', 'sleep']);
+
+function normalizeCommand(command) {
+    return String(command || '').replace(/\s+/g, ' ').trim();
+}
+
+function classifyShellCommand(command) {
+    const normalized = normalizeCommand(command);
+    if (!normalized) {
+        return { tier: TIERS.BLOCKED, reason: 'empty shell command' };
+    }
+
+    for (const rule of BLOCKED_COMMAND_PATTERNS) {
+        if (rule.pattern.test(normalized)) {
+            return { tier: TIERS.BLOCKED, reason: rule.reason };
+        }
+    }
+
+    return { tier: TIERS.APPROVAL, reason: 'shell command requires approval' };
+}
+
+function assertShellCommandAllowed(command) {
+    const result = classifyShellCommand(command);
+    if (result.tier === TIERS.BLOCKED) {
+        throw new Error(`Blocked unsafe command (${result.reason}): ${command}`);
+    }
+    return result;
+}
+
+function classifyAction(action = {}) {
+    const type = action.type || 'none';
+    if (type === 'none') return { tier: TIERS.SAFE, reason: 'no-op action' };
+
+    if (type === 'system_automation') {
+        const command = String(action.target || '').split(':')[0];
+        if (DANGEROUS_SYSTEM_COMMANDS.has(command)) {
+            return { tier: TIERS.DANGEROUS, reason: `system automation command '${command}'` };
+        }
+        return { tier: TIERS.APPROVAL, reason: 'system automation requires approval' };
+    }
+
+    if (DANGEROUS_ACTIONS.has(type)) {
+        return { tier: TIERS.DANGEROUS, reason: `${type} can affect user data or system state` };
+    }
+
+    if (SAFE_ACTIONS.has(type)) {
+        return { tier: TIERS.SAFE, reason: 'allowed action' };
+    }
+
+    return { tier: TIERS.APPROVAL, reason: 'unknown action requires approval' };
+}
+
+function assertActionAllowed(action, options = {}) {
+    const classification = classifyAction(action);
+    const allowDangerous = options.allowDangerous === true;
+
+    if (classification.tier === TIERS.BLOCKED) {
+        throw new Error(`Blocked action (${classification.reason}): ${action.type}`);
+    }
+
+    if (classification.tier === TIERS.DANGEROUS && !allowDangerous) {
+        throw new Error(`Dangerous action requires explicit permission (${classification.reason}): ${action.type}`);
+    }
+
+    return classification;
+}
+
+function resolveWithinRoot(root, targetPath) {
+    if (!root) throw new Error('Root path is required.');
+    if (!targetPath) throw new Error('Target path is required.');
+
+    const resolvedRoot = path.resolve(root);
+    const expandedTarget = String(targetPath).startsWith('~/')
+        ? path.join(os.homedir(), String(targetPath).slice(2))
+        : targetPath;
+    const resolvedTarget = path.resolve(resolvedRoot, expandedTarget);
+    const relative = path.relative(resolvedRoot, resolvedTarget);
+
+    if (relative.startsWith('..') || path.isAbsolute(relative)) {
+        throw new Error(`Path is outside allowed root: ${targetPath}`);
+    }
+
+    return resolvedTarget;
+}
+
+function appendActionLog(entry, options = {}) {
+    const logPath = options.logPath || path.join(os.homedir(), '.config', 'mint', 'action-log.jsonl');
+    const payload = {
+        time: new Date().toISOString(),
+        ...entry
+    };
+
+    try {
+        fs.mkdirSync(path.dirname(logPath), { recursive: true });
+        fs.appendFileSync(logPath, `${JSON.stringify(payload)}\n`, 'utf8');
+    } catch (error) {
+        if (process.env.MINT_DEBUG === '1') {
+            console.error('[Safety] Failed to append action log:', error.message);
+        }
+    }
+
+    return payload;
+}
+
+module.exports = {
+    TIERS,
+    classifyShellCommand,
+    assertShellCommandAllowed,
+    classifyAction,
+    assertActionAllowed,
+    resolveWithinRoot,
+    appendActionLog
+};

package/src/System/screen_capture.js

@@ -0,0 +1,175 @@
+const { BrowserWindow, desktopCapturer, screen } = require('electron');
+const path = require('path');
+
+const TRANSLATE_REFRESH_MS = 3000;
+const TRANSLATE_FAILURE_COOLDOWN_MS = 15000;
+
+function createScreenCaptureController({ projectRoot, translateImageContent, getMainWindow }) {
+    let screenPickerWindow = null;
+    let translateIntervalHandle = null;
+    let isTranslateRequestInFlight = false;
+    let translateCooldownUntil = 0;
+
+    async function startScreenCapture() {
+        if (screenPickerWindow) return;
+
+        try {
+            const primaryDisplay = screen.getPrimaryDisplay();
+            const { width, height } = primaryDisplay.size;
+            const sources = await desktopCapturer.getSources({
+                types: ['screen'],
+                thumbnailSize: { width, height }
+            });
+            const primarySource = sources[0];
+
+            screenPickerWindow = new BrowserWindow({
+                width,
+                height,
+                x: primaryDisplay.bounds.x,
+                y: primaryDisplay.bounds.y,
+                fullscreen: true,
+                transparent: true,
+                frame: false,
+                alwaysOnTop: true,
+                skipTaskbar: true,
+                webPreferences: {
+                    preload: path.join(projectRoot, 'preload-picker.js'),
+                    nodeIntegration: false,
+                    contextIsolation: true
+                }
+            });
+
+            await screenPickerWindow.loadFile(path.join(projectRoot, 'src/UI/screenPicker.html'));
+
+            if (primarySource && primarySource.thumbnail) {
+                screenPickerWindow.webContents.send('screenshot-data', primarySource.thumbnail.toDataURL());
+            }
+
+            screenPickerWindow.on('closed', () => { screenPickerWindow = null; });
+        } catch (err) {
+            console.error("Error starting screen capture:", err);
+        }
+    }
+
+    function handleSelection(base64Image) {
+        if (screenPickerWindow) screenPickerWindow.close();
+
+        const mainWindow = getMainWindow();
+        if (mainWindow) {
+            mainWindow.webContents.send('vision-ready', base64Image);
+            mainWindow.show();
+        }
+    }
+
+    function startLiveTranslate(rect) {
+        if (!screenPickerWindow) return;
+
+        screenPickerWindow.setIgnoreMouseEvents(true, { forward: true });
+        isTranslateRequestInFlight = false;
+        translateCooldownUntil = 0;
+
+        stopLiveTranslate(false);
+        captureAndTranslate(rect);
+        translateIntervalHandle = setInterval(() => {
+            captureAndTranslate(rect);
+        }, TRANSLATE_REFRESH_MS);
+    }
+
+    function stopLiveTranslate(resetMouseEvents = true) {
+        if (translateIntervalHandle) {
+            clearInterval(translateIntervalHandle);
+            translateIntervalHandle = null;
+        }
+        if (resetMouseEvents && screenPickerWindow && !screenPickerWindow.isDestroyed()) {
+            screenPickerWindow.setIgnoreMouseEvents(false);
+        }
+        isTranslateRequestInFlight = false;
+        translateCooldownUntil = 0;
+    }
+
+    function setOverlayInteractable(isInteractable) {
+        if (!screenPickerWindow || screenPickerWindow.isDestroyed()) return;
+        screenPickerWindow.setIgnoreMouseEvents(!isInteractable, { forward: true });
+    }
+
+    async function captureAndTranslate(rect) {
+        if (!screenPickerWindow || screenPickerWindow.isDestroyed()) return;
+        if (isTranslateRequestInFlight) return;
+        if (Date.now() < translateCooldownUntil) return;
+
+        try {
+            isTranslateRequestInFlight = true;
+            const primaryDisplay = screen.getPrimaryDisplay();
+            const sources = await desktopCapturer.getSources({
+                types: ['screen'],
+                thumbnailSize: {
+                    width: primaryDisplay.size.width,
+                    height: primaryDisplay.size.height
+                }
+            });
+
+            if (sources.length > 0) {
+                const croppedImage = sources[0].thumbnail.crop({
+                    x: Math.round(rect.x),
+                    y: Math.round(rect.y),
+                    width: Math.round(rect.width),
+                    height: Math.round(rect.height)
+                });
+
+                const base64Crop = croppedImage.toJPEG(70).toString('base64');
+                const translationResult = await translateImageContent(`data:image/jpeg;base64,${base64Crop}`);
+                if (translationResult.retryableFailure) {
+                    translateCooldownUntil = Date.now() + TRANSLATE_FAILURE_COOLDOWN_MS;
+                    console.warn(`Live translation cooldown active for ${TRANSLATE_FAILURE_COOLDOWN_MS / 1000}s after retryable API failure.`);
+                } else {
+                    translateCooldownUntil = 0;
+                }
+
+                if (screenPickerWindow && !screenPickerWindow.isDestroyed()) {
+                    screenPickerWindow.webContents.send('vision-translate-result', translationResult.text);
+                }
+            }
+        } catch (err) {
+            console.error("Continuous translation loop failed:", err);
+        } finally {
+            isTranslateRequestInFlight = false;
+        }
+    }
+
+    function cancel() {
+        stopLiveTranslate(false);
+        if (screenPickerWindow) screenPickerWindow.close();
+
+        const mainWindow = getMainWindow();
+        if (mainWindow) mainWindow.show();
+    }
+
+    async function captureSilentScreen() {
+        try {
+            const primaryDisplay = screen.getPrimaryDisplay();
+            const { width, height } = primaryDisplay.size;
+            const sources = await desktopCapturer.getSources({
+                types: ['screen'],
+                thumbnailSize: { width, height }
+            });
+
+            const primarySource = sources[0];
+            return primarySource && primarySource.thumbnail ? primarySource.thumbnail.toDataURL() : null;
+        } catch (err) {
+            console.error("Error silently capturing screen:", err);
+            return null;
+        }
+    }
+
+    return {
+        startScreenCapture,
+        handleSelection,
+        startLiveTranslate,
+        stopLiveTranslate,
+        setOverlayInteractable,
+        cancel,
+        captureSilentScreen
+    };
+}
+
+module.exports = { createScreenCaptureController };

package/src/System/task_manager.js

@@ -2,13 +2,23 @@ const fs = require('fs');
 const path = require('path');
 const os = require('os');
 
-// Standard location for Mint tasks
-const MINT_DIR = path.join(os.homedir(), '.mint');
-const TASKS_FILE = path.join(MINT_DIR, 'tasks.json');
+const CONFIG_DIR = path.join(os.homedir(), '.config', 'mint');
+const TASKS_FILE = path.join(CONFIG_DIR, 'tasks.json');
 
 // Ensure directory exists
-if (!fs.existsSync(MINT_DIR)) {
-    fs.mkdirSync(MINT_DIR, { recursive: true });
+if (!fs.existsSync(CONFIG_DIR)) {
+    fs.mkdirSync(CONFIG_DIR, { recursive: true });
+}
+
+// Migration Logic: Move tasks.json from ~/.mint to ~/.config/mint
+if (!fs.existsSync(TASKS_FILE)) {
+    const legacyPath = path.join(os.homedir(), '.mint', 'tasks.json');
+    if (fs.existsSync(legacyPath)) {
+        try {
+            fs.copyFileSync(legacyPath, TASKS_FILE);
+            console.log('[TaskManager] Migrated tasks from ~/.mint');
+        } catch (e) { console.error('[TaskManager] Migration failed:', e); }
+    }
 }
 
 /**

package/src/System/window_manager.js

@@ -0,0 +1,210 @@
+const { app, BrowserWindow, Tray, Menu, nativeImage, screen } = require('electron');
+const path = require('path');
+
+function createWindowManager(projectRoot) {
+    let mainWindow = null;
+    let settingsWindow = null;
+    let spotlightWindow = null;
+    let widgetWindow = null;
+    let tray = null;
+
+    function createMainWindow() {
+        mainWindow = new BrowserWindow({
+            width: 600,
+            height: 800,
+            icon: path.join(projectRoot, 'assets', 'icon.png'),
+            webPreferences: {
+                preload: path.join(projectRoot, 'preload.js'),
+                nodeIntegration: false,
+                contextIsolation: true,
+            },
+            frame: false,
+            transparent: true,
+            resizable: true,
+            show: false
+        });
+
+        mainWindow.loadFile(path.join(projectRoot, 'src/UI/index.html'));
+        mainWindow.on('ready-to-show', () => mainWindow.show());
+        mainWindow.on('close', (event) => {
+            if (!app.isQuiting) {
+                event.preventDefault();
+                mainWindow.hide();
+            }
+            return false;
+        });
+        mainWindow.on('focus', () => {
+            // clearFloatingUnread(); // Disabled
+        });
+        mainWindow.on('closed', () => {
+            mainWindow = null;
+        });
+
+        return mainWindow;
+    }
+
+    function createTray() {
+        const iconPath = path.join(projectRoot, 'assets', 'icon.png');
+        let icon = nativeImage.createFromPath(iconPath);
+        icon = icon.resize({ width: 16, height: 16 });
+
+        tray = new Tray(icon);
+        tray.setToolTip('Mint AI Assistant');
+        tray.setContextMenu(Menu.buildFromTemplate([
+            { label: 'Show App', click: () => { if (mainWindow) mainWindow.show(); } },
+            { label: 'Settings', click: () => { createSettingsWindow(); } },
+            { type: 'separator' },
+            {
+                label: 'Quit',
+                click: () => {
+                    app.isQuiting = true;
+                    app.quit();
+                }
+            }
+        ]));
+
+        tray.on('click', toggleMainWindow);
+        return tray;
+    }
+
+    function createSettingsWindow() {
+        if (settingsWindow) {
+            settingsWindow.focus();
+            return settingsWindow;
+        }
+
+        settingsWindow = new BrowserWindow({
+            width: 720,
+            height: 620,
+            minWidth: 640,
+            minHeight: 560,
+            icon: path.join(projectRoot, 'assets', 'icon.png'),
+            webPreferences: {
+                preload: path.join(projectRoot, 'preload-settings.js'),
+                nodeIntegration: false,
+                contextIsolation: true,
+            },
+            frame: false,
+            transparent: true,
+            resizable: true,
+            parent: mainWindow,
+        });
+        settingsWindow.loadFile(path.join(projectRoot, 'src/UI/settings.html'));
+        settingsWindow.on('closed', () => { settingsWindow = null; });
+        return settingsWindow;
+    }
+
+    function createSpotlightWindow() {
+        if (spotlightWindow) {
+            spotlightWindow.show();
+            return spotlightWindow;
+        }
+
+        const { width: screenWidth, height: screenHeight } = screen.getPrimaryDisplay().workAreaSize;
+        const windowWidth = 600;
+        const windowHeight = 80;
+
+        spotlightWindow = new BrowserWindow({
+            width: windowWidth,
+            height: windowHeight,
+            x: Math.floor((screenWidth - windowWidth) / 2),
+            y: Math.floor(screenHeight * 0.25),
+            frame: false,
+            transparent: true,
+            alwaysOnTop: true,
+            skipTaskbar: true,
+            show: false,
+            webPreferences: {
+                preload: path.join(projectRoot, 'src/UI/preload-spotlight.js'),
+                nodeIntegration: false,
+                contextIsolation: true,
+            }
+        });
+
+        spotlightWindow.loadFile(path.join(projectRoot, 'src/UI/spotlight.html'));
+        spotlightWindow.on('blur', () => spotlightWindow.hide());
+        spotlightWindow.on('closed', () => { spotlightWindow = null; });
+        return spotlightWindow;
+    }
+
+    function createWidgetWindow() {
+        if (widgetWindow) return widgetWindow;
+
+        widgetWindow = new BrowserWindow({
+            width: 150,
+            height: 150,
+            frame: false,
+            transparent: true,
+            resizable: false,
+            alwaysOnTop: true,
+            skipTaskbar: true,
+            show: true,
+            webPreferences: {
+                preload: path.join(projectRoot, 'src/UI/preload-widget.js'),
+                nodeIntegration: false,
+                contextIsolation: true
+            }
+        });
+
+        widgetWindow.setVisibleOnAllWorkspaces(true, { visibleOnFullScreen: true });
+        widgetWindow.setAlwaysOnTop(true, 'floating');
+
+        try {
+            const primaryDisplay = screen.getPrimaryDisplay();
+            const { width, x, y } = primaryDisplay.workArea;
+            widgetWindow.setPosition(x + width - 150 - 40, y + 40);
+        } catch (_) {}
+
+        widgetWindow.loadFile(path.join(projectRoot, 'src/UI/widget.html'));
+        widgetWindow.on('closed', () => { widgetWindow = null; });
+        return widgetWindow;
+    }
+
+    function toggleMainWindow() {
+        if (!mainWindow) return;
+        if (mainWindow.isVisible()) {
+            mainWindow.hide();
+        } else {
+            mainWindow.show();
+        }
+    }
+
+    function toggleSpotlightWindow() {
+        if (spotlightWindow && spotlightWindow.isVisible()) {
+            spotlightWindow.hide();
+            return;
+        }
+        createSpotlightWindow().show();
+    }
+
+    function closeWidgetWindow() {
+        if (widgetWindow && !widgetWindow.isDestroyed()) {
+            widgetWindow.close();
+            widgetWindow = null;
+        }
+    }
+
+    function ensureWidgetWindow() {
+        if (!widgetWindow || widgetWindow.isDestroyed()) {
+            createWidgetWindow();
+        }
+    }
+
+    return {
+        createMainWindow,
+        createTray,
+        createSettingsWindow,
+        createSpotlightWindow,
+        createWidgetWindow,
+        toggleMainWindow,
+        toggleSpotlightWindow,
+        closeWidgetWindow,
+        ensureWidgetWindow,
+        getMainWindow: () => mainWindow,
+        getSettingsWindow: () => settingsWindow,
+        getSpotlightWindow: () => spotlightWindow,
+        getWidgetWindow: () => widgetWindow
+    };
+}
+
+module.exports = { createWindowManager };

package/src/UI/renderer.js

@@ -558,7 +558,15 @@ clearBtn.addEventListener('click', async () => {
     appendMessage('Chat history cleared. Starting fresh! 🌿', 'ai', null, new Date().toISOString());
 });
 
-function appendMessage(text, sender, base64Image = null, timestamp = null) {
+function formatProviderInfo(providerInfo) {
+    if (!providerInfo || typeof providerInfo !== 'object') return '';
+    const provider = String(providerInfo.provider || '').trim();
+    const model = String(providerInfo.model || '').trim();
+    if (!provider && !model) return '';
+    return model ? `${provider || 'AI'} • ${model}` : provider;
+}
+
+function appendMessage(text, sender, base64Image = null, timestamp = null, options = {}) {
     const messageDiv = document.createElement('div');
     messageDiv.classList.add('message', `${sender}-message`);
 
@@ -586,11 +594,23 @@ function appendMessage(text, sender, base64Image = null, timestamp = null) {
 
     bubbleWrapper.appendChild(bubble);
 
-    // Add Timestamp
-    if (timestamp) {
+    const providerLabel = sender === 'ai' ? formatProviderInfo(options.providerInfo) : '';
+
+    // Add metadata
+    if (timestamp || providerLabel) {
         const timeDiv = document.createElement('div');
         timeDiv.classList.add('message-time');
-        timeDiv.textContent = formatTime(timestamp);
+        if (providerLabel) {
+            const providerSpan = document.createElement('span');
+            providerSpan.classList.add('provider-badge');
+            providerSpan.textContent = providerLabel;
+            timeDiv.appendChild(providerSpan);
+        }
+        if (timestamp) {
+            const timeSpan = document.createElement('span');
+            timeSpan.textContent = formatTime(timestamp);
+            timeDiv.appendChild(timeSpan);
+        }
         bubbleWrapper.appendChild(timeDiv);
     }
 
@@ -638,6 +658,7 @@ function estimateMessageDelay(text) {
 async function appendAiMessages(text, options = {}) {
     const allowDelay = options.allowDelay !== false;
     const timestamp = options.timestamp || new Date().toISOString();
+    const providerInfo = options.providerInfo || null;
     const parts = splitAiMessages(text);
     let lastDiv = null;
 
@@ -649,7 +670,8 @@ async function appendAiMessages(text, options = {}) {
         }
         // Only show timestamp for the last bubble in a group if multiple
         const partTimestamp = (index === parts.length - 1) ? timestamp : null;
-        lastDiv = appendMessage(parts[index], 'ai', null, partTimestamp);
+        const partProviderInfo = (index === parts.length - 1) ? providerInfo : null;
+        lastDiv = appendMessage(parts[index], 'ai', null, partTimestamp, { providerInfo: partProviderInfo });
     }
 
     return lastDiv;
@@ -750,7 +772,7 @@ async function loadChatHistory() {
             if (!item || typeof item.text !== 'string' || !item.text.trim()) continue;
             const sender = item.sender === 'user' ? 'user' : 'ai';
             if (sender === 'ai') {
-                await appendAiMessages(item.text, { allowDelay: false, timestamp: item.timestamp });
+                await appendAiMessages(item.text, { allowDelay: false, timestamp: item.timestamp, providerInfo: item.providerInfo });
             } else {
                 appendMessage(item.text, sender, null, item.timestamp);
             }
@@ -829,7 +851,11 @@ async function sendTextMessage(text, options = {}) {
         }
 
         // Show AI response
-        const msgDiv = await appendAiMessages(response.response, { allowDelay: true });
+        const msgDiv = await appendAiMessages(response.response, {
+            allowDelay: true,
+            timestamp: response.timestamp,
+            providerInfo: response.providerInfo
+        });
 
         // Speak AI response
         await speakText(normalizeAiText(response.response), { onEnd: resumeSpeechIfNeeded });

package/src/UI/settings.html

@@ -417,6 +417,30 @@
                         </div>
                     </div>
 
+                    <!-- Gmail -->
+                    <div class="plugin-card">
+                        <div class="plugin-icon">✉️</div>
+                        <div class="plugin-info">
+                            <div class="plugin-name">Gmail</div>
+                            <div class="plugin-desc">Read email and create drafts safely</div>
+                        </div>
+                        <div class="plugin-actions">
+                            <button class="btn-connect" id="btn-plugin-gmail" data-plugin="gmail">Connect</button>
+                        </div>
+                    </div>
+
+                    <!-- Notion -->
+                    <div class="plugin-card">
+                        <div class="plugin-icon">📝</div>
+                        <div class="plugin-info">
+                            <div class="plugin-name">Notion</div>
+                            <div class="plugin-desc">Create notes, pages, and read databases</div>
+                        </div>
+                        <div class="plugin-actions">
+                            <button class="btn-connect" id="btn-plugin-notion" data-plugin="notion">Connect</button>
+                        </div>
+                    </div>
+
                     <!-- Discord -->
                     <div class="plugin-card">
                         <div class="plugin-icon">💬</div>