@peers-app/peers-ui 0.7.35 → 0.7.40

package/dist/command-palette/command-palette-ui.js

@@ -38,10 +38,16 @@ const react_1 = __importStar(require("react"));
 const hooks_1 = require("../hooks");
 const color_mode_dropdown_1 = require("../screens/settings/color-mode-dropdown");
 const command_palette_1 = require("./command-palette");
+const routes_loader_1 = require("../ui-router/routes-loader");
+const system_apps_1 = require("../system-apps");
+const tabs_state_1 = require("../tabs-layout/tabs-state");
+const peers_sdk_1 = require("@peers-app/peers-sdk");
+const globals_1 = require("../globals");
 function CommandPaletteOverlay() {
     const [isOpen] = (0, hooks_1.useObservable)(command_palette_1.isCommandPaletteOpen);
     const [_persistedQuery] = (0, hooks_1.useObservable)(command_palette_1.commandSearchQuery);
     const [_colorMode] = (0, hooks_1.useObservable)(color_mode_dropdown_1.colorMode);
+    const [packages] = (0, hooks_1.useObservable)(routes_loader_1.allPackages);
     const [selectedIndex, setSelectedIndex] = (0, react_1.useState)(0);
     const inputRef = (0, react_1.useRef)(null);
     // Local state for query input to avoid locking up on fast typing
@@ -75,7 +81,70 @@ function CommandPaletteOverlay() {
     }, []);
     const searchQuery = localQuery;
     const filteredCommands = (0, command_palette_1.searchCommands)(searchQuery);
+    // Get all apps (system and user)
+    const getAllApps = () => {
+        const allPackages_ = [...packages, system_apps_1.systemPackage];
+        return allPackages_
+            .filter(p => !p.disabled && p.appNavs && p.appNavs.length > 0)
+            .flatMap(pkg => pkg.appNavs.map(navItem => {
+            // Construct path - use direct path for system apps, package-nav for others
+            let path;
+            if (pkg.packageId === 'system-apps') {
+                path = navItem.navigationPath ?? navItem.name.replace(/\s/g, '-').toLowerCase();
+            }
+            else {
+                path = `package-nav/${pkg.packageId}/${(navItem.navigationPath ?? navItem.name).replace(/[^a-zA-Z0-9]/g, '-').toLowerCase()}`;
+                while (path.includes('//')) {
+                    path = path.replace('//', '/');
+                }
+            }
+            return {
+                packageId: pkg.packageId,
+                packageName: pkg.name,
+                navItem,
+                path,
+                name: navItem.name,
+                displayName: navItem.displayName || navItem.name,
+                iconClassName: navItem.iconClassName || 'bi-box-seam'
+            };
+        }));
+    };
+    // Search apps
+    const searchApps = (query) => {
+        if (!query.trim())
+            return [];
+        const allApps = getAllApps();
+        const lowerQuery = query.toLowerCase();
+        return allApps.filter(app => app.name.toLowerCase().includes(lowerQuery) ||
+            app.displayName.toLowerCase().includes(lowerQuery) ||
+            app.packageName.toLowerCase().includes(lowerQuery));
+    };
+    const filteredApps = searchApps(searchQuery);
+    // Function to create a new thread from search query
+    const createNewThreadFromQuery = async (query) => {
+        try {
+            const currentUser = await (0, peers_sdk_1.getMe)();
+            const threadMessage = await (0, peers_sdk_1.Messages)().insert({
+                messageId: (0, peers_sdk_1.newid)(),
+                userId: currentUser.userId,
+                channelId: currentUser.userId,
+                message: query.trim(),
+                createdAt: new Date(),
+            });
+            await (0, globals_1.openThreadInTab)(threadMessage);
+        }
+        catch (error) {
+            console.error('Failed to create new thread:', error);
+        }
+    };
     // Create a flattened list that matches the visual rendering order
+    // Apps first, then commands
+    const allItems = [];
+    // Add apps first
+    filteredApps.forEach((app) => {
+        allItems.push({ type: 'app', app, id: `app-${app.packageId}-${app.path}` });
+    });
+    // Then add commands
     const visualOrderCommands = Object.entries(filteredCommands.reduce((acc, cmd) => {
         const category = cmd.category || 'Other';
         if (!acc[category])
@@ -83,6 +152,9 @@ function CommandPaletteOverlay() {
         acc[category].push(cmd);
         return acc;
     }, {})).flatMap(([, commands]) => commands);
+    visualOrderCommands.forEach((cmd) => {
+        allItems.push({ type: 'command', command: cmd, id: `command-${cmd.id}` });
+    });
     // Focus input when opened
     (0, react_1.useEffect)(() => {
         if (isOpen && inputRef.current) {
@@ -100,7 +172,9 @@ function CommandPaletteOverlay() {
         const handleKeyDown = (e) => {
             if (e.key === 'ArrowDown') {
                 e.preventDefault();
-                setSelectedIndex(prev => Math.min(prev + 1, visualOrderCommands.length - 1));
+                // Allow selection to go one past the end if there's a search query (for new thread option)
+                const maxIndex = searchQuery.trim() ? allItems.length : allItems.length - 1;
+                setSelectedIndex(prev => Math.min(prev + 1, maxIndex));
             }
             else if (e.key === 'ArrowUp') {
                 e.preventDefault();
@@ -108,14 +182,34 @@ function CommandPaletteOverlay() {
             }
             else if (e.key === 'Enter') {
                 e.preventDefault();
-                if (visualOrderCommands[selectedIndex]) {
-                    (0, command_palette_1.executeCommand)(visualOrderCommands[selectedIndex].id);
+                // Check if the new thread option is selected (selectedIndex >= allItems.length)
+                if (selectedIndex >= allItems.length && searchQuery.trim()) {
+                    (0, command_palette_1.closeCommandPalette)();
+                    createNewThreadFromQuery(searchQuery);
+                }
+                else {
+                    const selectedItem = allItems[selectedIndex];
+                    if (selectedItem) {
+                        if (selectedItem.type === 'app' && selectedItem.app) {
+                            (0, command_palette_1.closeCommandPalette)();
+                            (0, tabs_state_1.goToTabPath)(selectedItem.app.path);
+                        }
+                        else if (selectedItem.type === 'command' && selectedItem.command) {
+                            (0, command_palette_1.executeCommand)(selectedItem.command.id);
+                        }
+                    }
+                    else if (searchQuery.trim()) {
+                        // Fallback: Create a new thread with the search query as the message
+                        // This happens when no item is selected (selectedIndex is out of bounds or -1)
+                        (0, command_palette_1.closeCommandPalette)();
+                        createNewThreadFromQuery(searchQuery);
+                    }
                 }
             }
         };
         document.addEventListener('keydown', handleKeyDown);
         return () => document.removeEventListener('keydown', handleKeyDown);
-    }, [isOpen, visualOrderCommands, selectedIndex]);
+    }, [isOpen, allItems, selectedIndex]);
     if (!isOpen)
         return null;
     const isDark = _colorMode === 'dark';
@@ -152,7 +246,7 @@ function CommandPaletteOverlay() {
                             color: '#6c757d',
                             zIndex: 1
                         } }),
-                    react_1.default.createElement("input", { ref: inputRef, type: "text", className: `form-control ${isDark ? 'bg-dark text-light border-secondary' : ''}`, placeholder: "Type a command or search...", value: searchQuery, onChange: (e) => {
+                    react_1.default.createElement("input", { ref: inputRef, type: "text", className: `form-control ${isDark ? 'bg-dark text-light border-secondary' : ''}`, placeholder: "Search apps, commands, or navigate...", value: searchQuery, onChange: (e) => {
                             const newQuery = e.target.value;
                             setLocalQuery(newQuery);
                             updatePersistedQuery(newQuery);
@@ -174,41 +268,101 @@ function CommandPaletteOverlay() {
             react_1.default.createElement("div", { style: {
                     maxHeight: '400px',
                     overflowY: 'auto'
-                } }, visualOrderCommands.length === 0 ? (react_1.default.createElement("div", { className: "p-4 text-center text-muted" },
+                } }, allItems.length === 0 && !searchQuery.trim() ? (react_1.default.createElement("div", { className: "p-4 text-center text-muted" },
                 react_1.default.createElement("i", { className: "bi-search mb-2 d-block", style: { fontSize: '24px' } }),
-                "No commands found")) : (react_1.default.createElement("div", { className: "py-2" }, Object.entries(filteredCommands.reduce((acc, cmd) => {
-                const category = cmd.category || 'Other';
-                if (!acc[category])
-                    acc[category] = [];
-                acc[category].push(cmd);
-                return acc;
-            }, {})).map(([category, commands]) => (react_1.default.createElement("div", { key: category },
-                react_1.default.createElement("div", { className: "px-3 py-1 small text-muted fw-bold text-uppercase", style: { fontSize: '11px', letterSpacing: '0.5px' } }, category),
-                commands.map((command) => {
-                    const globalIndex = visualOrderCommands.indexOf(command);
-                    const isSelected = globalIndex === selectedIndex;
-                    return (react_1.default.createElement("div", { key: command.id, className: `px-3 py-2 d-flex align-items-center justify-content-between ${isSelected
+                "No results found")) : (react_1.default.createElement("div", { className: "py-2" },
+                allItems.length === 0 && searchQuery.trim() && (react_1.default.createElement("div", { className: "px-3 py-2 text-muted small text-center" }, "No matching results")),
+                filteredApps.length > 0 && (react_1.default.createElement("div", null,
+                    react_1.default.createElement("div", { className: "px-3 py-1 small text-muted fw-bold text-uppercase", style: { fontSize: '11px', letterSpacing: '0.5px' } }, "Apps"),
+                    filteredApps.map((app) => {
+                        const appId = `app-${app.packageId}-${app.path}`;
+                        const globalIndex = allItems.findIndex(item => item.id === appId);
+                        const isSelected = globalIndex === selectedIndex;
+                        return (react_1.default.createElement("div", { key: `${app.packageId}-${app.path}`, className: `px-3 py-2 d-flex align-items-center justify-content-between ${isSelected
+                                ? (isDark ? 'bg-primary bg-opacity-25' : 'bg-primary bg-opacity-10')
+                                : ''}`, style: {
+                                cursor: 'pointer',
+                                transition: 'background-color 0.1s ease'
+                            }, onClick: () => {
+                                (0, command_palette_1.closeCommandPalette)();
+                                (0, tabs_state_1.goToTabPath)(app.path);
+                            }, onMouseEnter: () => setSelectedIndex(globalIndex) },
+                            react_1.default.createElement("div", { className: "d-flex align-items-center" },
+                                react_1.default.createElement("i", { className: `${app.iconClassName} me-3`, style: {
+                                        fontSize: '16px',
+                                        color: isSelected ? (isDark ? '#ffffff' : '#0d6efd') : '#6c757d',
+                                        minWidth: '16px'
+                                    } }),
+                                react_1.default.createElement("div", null,
+                                    react_1.default.createElement("div", { className: "fw-medium" }, app.displayName),
+                                    react_1.default.createElement("div", { className: "small text-muted", style: { fontSize: '12px' } }, app.packageId === 'system-apps' ? 'System App' : app.packageName)))));
+                    }))),
+                filteredCommands.length > 0 && Object.entries(filteredCommands.reduce((acc, cmd) => {
+                    const category = cmd.category || 'Other';
+                    if (!acc[category])
+                        acc[category] = [];
+                    acc[category].push(cmd);
+                    return acc;
+                }, {})).map(([category, commands]) => (react_1.default.createElement("div", { key: category },
+                    react_1.default.createElement("div", { className: "px-3 py-1 small text-muted fw-bold text-uppercase", style: { fontSize: '11px', letterSpacing: '0.5px' } }, category),
+                    commands.map((command) => {
+                        const commandId = `command-${command.id}`;
+                        const globalIndex = allItems.findIndex(item => item.id === commandId);
+                        const isSelected = globalIndex === selectedIndex;
+                        return (react_1.default.createElement("div", { key: command.id, className: `px-3 py-2 d-flex align-items-center justify-content-between ${isSelected
+                                ? (isDark ? 'bg-primary bg-opacity-25' : 'bg-primary bg-opacity-10')
+                                : ''}`, style: {
+                                cursor: 'pointer',
+                                transition: 'background-color 0.1s ease'
+                            }, onClick: () => (0, command_palette_1.executeCommand)(command.id), onMouseEnter: () => setSelectedIndex(globalIndex) },
+                            react_1.default.createElement("div", { className: "d-flex align-items-center" },
+                                command.iconClassName && (react_1.default.createElement("i", { className: `${command.iconClassName} me-3`, style: {
+                                        fontSize: '16px',
+                                        color: isSelected ? (isDark ? '#ffffff' : '#0d6efd') : '#6c757d',
+                                        minWidth: '16px'
+                                    } })),
+                                react_1.default.createElement("div", null,
+                                    react_1.default.createElement("div", { className: "fw-medium" }, command.label),
+                                    command.description && (react_1.default.createElement("div", { className: "small text-muted", style: { fontSize: '12px' } }, command.description)))),
+                            command.shortcut && (react_1.default.createElement("div", { className: `small px-2 py-1 rounded ${isDark ? 'bg-secondary bg-opacity-50' : 'bg-light'}`, style: {
+                                    fontSize: '11px',
+                                    fontFamily: 'monospace',
+                                    color: isDark ? '#adb5bd' : '#6c757d',
+                                    border: isDark ? '1px solid #495057' : '1px solid #dee2e6'
+                                } }, command.shortcut))));
+                    })))),
+                searchQuery.trim() && (react_1.default.createElement("div", null,
+                    react_1.default.createElement("div", { className: "px-3 py-1 small text-muted fw-bold text-uppercase", style: { fontSize: '11px', letterSpacing: '0.5px' } }, "Actions"),
+                    react_1.default.createElement("div", { className: `px-3 py-2 d-flex align-items-center ${(allItems.length === 0 || selectedIndex >= allItems.length) && searchQuery.trim()
                             ? (isDark ? 'bg-primary bg-opacity-25' : 'bg-primary bg-opacity-10')
                             : ''}`, style: {
                             cursor: 'pointer',
-                            transition: 'background-color 0.1s ease'
-                        }, onClick: () => (0, command_palette_1.executeCommand)(command.id), onMouseEnter: () => setSelectedIndex(globalIndex) },
+                            transition: 'background-color 0.1s ease',
+                            borderTop: allItems.length > 0 ? `1px solid ${isDark ? '#495057' : '#dee2e6'}` : 'none',
+                            marginTop: allItems.length > 0 ? '8px' : '0',
+                            paddingTop: allItems.length > 0 ? '12px' : '8px'
+                        }, onClick: () => {
+                            (0, command_palette_1.closeCommandPalette)();
+                            createNewThreadFromQuery(searchQuery);
+                        }, onMouseEnter: () => {
+                            // Set selected index beyond the list to indicate this item is selected
+                            setSelectedIndex(allItems.length);
+                        } },
                         react_1.default.createElement("div", { className: "d-flex align-items-center" },
-                            command.iconClassName && (react_1.default.createElement("i", { className: `${command.iconClassName} me-3`, style: {
+                            react_1.default.createElement("i", { className: "bi-chat-dots me-3", style: {
                                     fontSize: '16px',
-                                    color: isSelected ? (isDark ? '#ffffff' : '#0d6efd') : '#6c757d',
+                                    color: (allItems.length === 0 || selectedIndex >= allItems.length) && searchQuery.trim()
+                                        ? (isDark ? '#ffffff' : '#0d6efd')
+                                        : '#6c757d',
                                     minWidth: '16px'
-                                } })),
+                                } }),
                             react_1.default.createElement("div", null,
-                                react_1.default.createElement("div", { className: "fw-medium" }, command.label),
-                                command.description && (react_1.default.createElement("div", { className: "small text-muted", style: { fontSize: '12px' } }, command.description)))),
-                        command.shortcut && (react_1.default.createElement("div", { className: `small px-2 py-1 rounded ${isDark ? 'bg-secondary bg-opacity-50' : 'bg-light'}`, style: {
-                                fontSize: '11px',
-                                fontFamily: 'monospace',
-                                color: isDark ? '#adb5bd' : '#6c757d',
-                                border: isDark ? '1px solid #495057' : '1px solid #dee2e6'
-                            } }, command.shortcut))));
-                }))))))),
+                                react_1.default.createElement("div", { className: "fw-medium" },
+                                    "Start new thread: ",
+                                    react_1.default.createElement("span", { className: "text-muted" },
+                                        searchQuery.trim().slice(0, 50),
+                                        searchQuery.trim().length > 50 ? '...' : '')),
+                                react_1.default.createElement("div", { className: "small text-muted", style: { fontSize: '12px' } }, "Press Enter to create"))))))))),
             react_1.default.createElement("div", { className: `px-3 py-2 small text-muted border-top d-flex align-items-center justify-content-between`, style: {
                     borderTopColor: isDark ? '#495057' : '#dee2e6',
                     fontSize: '11px'
@@ -224,7 +378,8 @@ function CommandPaletteOverlay() {
                         react_1.default.createElement("kbd", { className: "small" }, "esc"),
                         " to close")),
                 react_1.default.createElement("div", null,
-                    visualOrderCommands.length,
-                    " command",
-                    visualOrderCommands.length !== 1 ? 's' : '')))));
+                    allItems.length,
+                    " result",
+                    allItems.length !== 1 ? 's' : '',
+                    searchQuery.trim() && allItems.length === 0 && ' • Start thread')))));
 }

package/dist/command-palette/command-palette.js

@@ -129,127 +129,6 @@ const coreCommands = [
             closeCommandPalette();
             (0, tabs_state_1.goToTabPath)('threads');
         }
-    },
-    {
-        id: 'go-settings',
-        label: 'Open Settings',
-        description: 'Open application settings',
-        iconClassName: 'bi-gear-fill',
-        category: 'Navigation',
-        action: () => {
-            closeCommandPalette();
-            (0, tabs_state_1.goToTabPath)('settings');
-        }
-    },
-    {
-        id: 'go-assistants',
-        label: 'Go to Assistants',
-        description: 'View and manage assistants',
-        iconClassName: 'bi-person-fill-gear',
-        category: 'Navigation',
-        action: () => {
-            closeCommandPalette();
-            (0, tabs_state_1.goToTabPath)('assistants');
-        }
-    },
-    {
-        id: 'go-workflows',
-        label: 'Go to Workflows',
-        description: 'View and manage workflows',
-        iconClassName: 'bi-database-fill-gear',
-        category: 'Navigation',
-        action: () => {
-            closeCommandPalette();
-            (0, tabs_state_1.goToTabPath)('workflows');
-        }
-    },
-    {
-        id: 'go-tools',
-        label: 'Go to Tools',
-        description: 'View and manage tools',
-        iconClassName: 'bi-tools',
-        category: 'Navigation',
-        action: () => {
-            closeCommandPalette();
-            (0, tabs_state_1.goToTabPath)('tools');
-        }
-    },
-    {
-        id: 'go-events',
-        label: 'Go to Events',
-        description: 'View and manage events',
-        iconClassName: 'bi-lightning-charge-fill',
-        category: 'Navigation',
-        action: () => {
-            closeCommandPalette();
-            (0, tabs_state_1.goToTabPath)('events');
-        }
-    },
-    {
-        id: 'go-predicates',
-        label: 'Go to Predicates',
-        description: 'View and manage predicates',
-        iconClassName: 'bi-node-plus-fill',
-        category: 'Navigation',
-        action: () => {
-            closeCommandPalette();
-            (0, tabs_state_1.goToTabPath)('predicates');
-        }
-    },
-    {
-        id: 'go-peer-types',
-        label: 'Go to Peer Types',
-        description: 'View and manage peer types',
-        iconClassName: 'bi-code-square',
-        category: 'Navigation',
-        action: () => {
-            closeCommandPalette();
-            (0, tabs_state_1.goToTabPath)('peer-types');
-        }
-    },
-    {
-        id: 'go-packages',
-        label: 'Go to Packages',
-        description: 'View and manage packages',
-        iconClassName: 'bi-box-fill',
-        category: 'Navigation',
-        action: () => {
-            closeCommandPalette();
-            (0, tabs_state_1.goToTabPath)('packages');
-        }
-    },
-    {
-        id: 'go-variables',
-        label: 'Go to Variables',
-        description: 'View and manage variables',
-        iconClassName: 'bi-braces',
-        category: 'Navigation',
-        action: () => {
-            closeCommandPalette();
-            (0, tabs_state_1.goToTabPath)('variables');
-        }
-    },
-    {
-        id: 'go-knowledge-values',
-        label: 'Go to Knowledge Values',
-        description: 'View and manage knowledge values',
-        iconClassName: 'bi-journal-bookmark-fill',
-        category: 'Navigation',
-        action: () => {
-            closeCommandPalette();
-            (0, tabs_state_1.goToTabPath)('knowledge-values');
-        }
-    },
-    {
-        id: 'go-knowledge-frames',
-        label: 'Go to Knowledge Frames',
-        description: 'View and manage knowledge frames',
-        iconClassName: 'bi-window-dock',
-        category: 'Navigation',
-        action: () => {
-            closeCommandPalette();
-            (0, tabs_state_1.goToTabPath)('knowledge-frames');
-        }
     }
 ];
 // Register core commands

package/dist/mention-configs.js

@@ -128,7 +128,7 @@ exports.valueTypeMentionConfig = {
         name: item.name
     }),
     onClick(data) {
-        peers_sdk_1.rpcClientCalls.setClientPath(`value-types/${data.id}`);
+        peers_sdk_1.rpcClientCalls.setClientPath(`peer-types/${data.id}`);
     },
 };
 // Tasks().list({ title: { $matchWords: mentionString }, completeDT: { $exists: searchCompletedTasks } }, { pageSize: MAX_RESULTS })

package/dist/screens/console-logs/console-logs-list.js

@@ -59,9 +59,10 @@ const DEFAULT_COLUMNS = [
 const ConsoleLogsList = () => {
     const logs = (0, hooks_1.useObservableState)([]);
     const [allLogsLoaded, setAllLogsLoaded] = (0, react_1.useState)(false);
+    const loadMoreId = (0, hooks_1.useObservableState)((0, peers_sdk_1.newid)(), true);
     const [levelFilter, setLevelFilter] = (0, react_1.useState)('all');
     const [processFilter, setProcessFilter] = (0, react_1.useState)('all');
-    const [searchText, setSearchText] = (0, react_1.useState)('');
+    const searchText = (0, hooks_1.useObservableState)('');
     const [columns, setColumns] = (0, react_1.useState)(DEFAULT_COLUMNS);
     const [totalLogCount, setTotalLogCount] = (0, react_1.useState)(0);
     const [_colorMode] = (0, hooks_1.useObservable)(color_mode_dropdown_1.colorMode);
@@ -102,6 +103,9 @@ const ConsoleLogsList = () => {
         if (processFilter !== 'all') {
             filter.process = processFilter;
         }
+        if (searchText()) {
+            filter.message = { $matchWords: searchText() };
+        }
         return filter;
     };
     // Update total log count
@@ -109,11 +113,6 @@ const ConsoleLogsList = () => {
         const table = await (0, peers_sdk_1.ConsoleLogs)();
         const filter = buildFilter();
         let count = await table.count(filter);
-        // If search text is applied, we need to count manually since it's client-side filtering
-        if (searchText) {
-            const allLogs = await table.list(filter);
-            count = allLogs.filter(log => log.message.toLowerCase().includes(searchText.toLowerCase())).length;
-        }
         setTotalLogCount(count);
     }
     // Fetch logs using cursor-based pagination
@@ -123,54 +122,50 @@ const ConsoleLogsList = () => {
         if (lastLog) {
             filter.logId = { $lt: lastLog.logId };
         }
-        const cursor = table.cursor(filter, {
-            sortBy: ['-timestamp', '-logId'],
-        });
-        const fetchedLogs = [];
-        for await (const log of cursor) {
-            // Apply text search filter (if search is implemented in cursor, this can be removed)
-            if (searchText && !log.message.toLowerCase().includes(searchText.toLowerCase())) {
-                continue;
-            }
-            fetchedLogs.push(log);
-            if (fetchedLogs.length >= batchSize) {
-                break;
-            }
-        }
-        return fetchedLogs;
+        const results = await table.list(filter, { pageSize: batchSize, sortBy: ['-timestamp', '-logId'] });
+        return results;
     }
     // Load older logs (prepend to list)
-    function prependLogs() {
+    async function loadMoreLogs(startLoadId) {
+        if (startLoadId && startLoadId !== loadMoreId()) {
+            return;
+        }
+        startLoadId ??= loadMoreId();
         const oldestLog = logs()[0];
-        fetchLogs(oldestLog).then(fetchedLogs => {
-            if (fetchedLogs.length === 0) {
-                setAllLogsLoaded(true);
-            }
-            else {
-                let _logs = (0, lodash_1.sortBy)([...logs(), ...fetchedLogs], 'timestamp');
-                _logs = (0, lodash_1.uniqBy)(_logs, l => l.logId);
-                logs(_logs);
-            }
-        });
-        return false;
+        const fetchedLogs = await fetchLogs(oldestLog);
+        if (loadMoreId() !== startLoadId) {
+            loadMoreLogs(loadMoreId());
+            return;
+        }
+        if (fetchedLogs.length === 0) {
+            setAllLogsLoaded(true);
+        }
+        let _logs = (0, lodash_1.sortBy)([...logs(), ...fetchedLogs], 'timestamp');
+        _logs = (0, lodash_1.uniqBy)(_logs, l => l.logId);
+        logs(_logs);
     }
     // Initial load and ensure screen is filled
     const minHeightOfLog = 30;
     (0, react_1.useEffect)(() => {
         if (!allLogsLoaded && (!logs.length || logs.length * minHeightOfLog < windowHeight())) {
-            prependLogs();
+            loadMoreLogs();
         }
-    }, [logs, levelFilter, processFilter, searchText]);
+    }, [logs, levelFilter, processFilter, searchText()]);
     // Reset when filters change
     (0, react_1.useEffect)(() => {
+        loadMoreId((0, peers_sdk_1.newid)());
         logs([]);
-        setAllLogsLoaded(false);
         updateLogCount();
-    }, [levelFilter, processFilter, searchText]);
+        if (allLogsLoaded) {
+            setAllLogsLoaded(false);
+            loadMoreLogs();
+        }
+    }, [levelFilter, processFilter, searchText()]);
     // Subscribe to new logs
     (0, react_1.useEffect)(() => {
+        let sub = undefined;
         (0, peers_sdk_1.ConsoleLogs)().then(table => {
-            const sub = table.dataChanged.subscribe(evt => {
+            sub = table.dataChanged.subscribe(evt => {
                 // Update count whenever data changes
                 updateLogCount();
                 const log = evt.dataObject;
@@ -179,8 +174,12 @@ const ConsoleLogsList = () => {
                     return;
                 if (processFilter !== 'all' && log.process !== processFilter)
                     return;
-                if (searchText && !log.message.toLowerCase().includes(searchText.toLowerCase()))
-                    return;
+                if (searchText()) {
+                    const logMessage = log.message.toLowerCase();
+                    const filterOut = searchText().toLowerCase().split(' ').some(word => !logMessage.includes(word));
+                    if (filterOut)
+                        return;
+                }
                 // Don't add we're only showing a limited batch and this is older
                 if (logs().length > batchSize && (0, lodash_1.min)(logs().map(l => l.timestamp)) > log.timestamp)
                     return;
@@ -191,11 +190,11 @@ const ConsoleLogsList = () => {
                     scrollToBottom('smooth');
                 }
             });
-            return () => {
-                sub.unsubscribe();
-            };
         });
-    }, [levelFilter, processFilter, searchText]);
+        return () => {
+            sub?.unsubscribe();
+        };
+    }, [levelFilter, processFilter]);
     function scrollToBottom(behavior, delay = 100) {
         setTimeout(() => {
             logsEndRef.current?.scrollIntoView({ behavior });
@@ -207,7 +206,6 @@ const ConsoleLogsList = () => {
                 const table = await (0, peers_sdk_1.ConsoleLogs)();
                 await table.deleteOldLogs(Date.now());
                 logs([]);
-                setAllLogsLoaded(true);
                 setTotalLogCount(0);
             }
             catch (err) {
@@ -217,7 +215,7 @@ const ConsoleLogsList = () => {
     }
     const _logs = (0, lodash_1.uniqBy)(logs(), l => l.logId);
     return (react_1.default.createElement("div", { className: "container-fluid", style: { height: 'calc(100vh - 100px)', display: 'flex', flexDirection: 'column' } },
-        react_1.default.createElement(log_filters_1.LogFilters, { levelFilter: levelFilter, setLevelFilter: setLevelFilter, processFilter: processFilter, setProcessFilter: setProcessFilter, searchText: searchText, setSearchText: setSearchText }),
+        react_1.default.createElement(log_filters_1.LogFilters, { levelFilter: levelFilter, setLevelFilter: setLevelFilter, processFilter: processFilter, setProcessFilter: setProcessFilter, searchText: searchText(), setSearchText: searchText }),
         react_1.default.createElement("div", { ref: containerRef, style: {
                 flex: 1,
                 display: 'flex',
@@ -234,7 +232,7 @@ const ConsoleLogsList = () => {
                     display: 'flex',
                     flexDirection: 'column-reverse',
                 } },
-                react_1.default.createElement(react_infinite_scroll_component_1.default, { dataLength: _logs.length, next: prependLogs, style: { display: 'flex', flexDirection: 'column-reverse', overflow: 'hidden' }, inverse: true, hasMore: !allLogsLoaded, loader: react_1.default.createElement(loading_indicator_1.LoadingIndicator, null), scrollableTarget: "scrollableLogsDiv", endMessage: react_1.default.createElement(react_1.Fragment, null,
+                react_1.default.createElement(react_infinite_scroll_component_1.default, { dataLength: _logs.length, next: loadMoreLogs, style: { display: 'flex', flexDirection: 'column-reverse', overflow: 'hidden' }, inverse: true, hasMore: !allLogsLoaded, loader: react_1.default.createElement(loading_indicator_1.LoadingIndicator, null), scrollableTarget: "scrollableLogsDiv", endMessage: react_1.default.createElement(react_1.Fragment, null,
                         react_1.default.createElement("div", { className: "d-flex justify-content-center p-3" },
                             react_1.default.createElement("div", { className: "text-muted" },
                                 react_1.default.createElement("i", null, "beginning of logs")))) },