mirror of
https://github.com/danny-avila/LibreChat.git
synced 2025-12-19 09:50:15 +01:00
🔎 feat: Native Web Search with Citation References (#7516)
* WIP: search tool integration * WIP: Add web search capabilities and API key management to agent actions * WIP: web search capability to agent configuration and selection * WIP: Add web search capability to backend agent configuration * WIP: add web search option to default agent form values * WIP: add attachments for web search * feat: add plugin for processing web search citations * WIP: first pass, Citation UI * chore: remove console.log * feat: Add AnimatedTabs component for tabbed UI functionality * refactor: AnimatedTabs component with CSS animations and stable ID generation * WIP example content * feat: SearchContext for managing search results apart from MessageContext * feat: Enhance AnimatedTabs with underline animation and state management * WIP: first pass, Implement dynamic tab functionality in Sources component with search results integration * fix: Update class names for improved styling in Sources and AnimatedTabs components * feat: Improve styling and layout in Sources component with enhanced button and item designs * feat: Refactor Sources component to integrate OGDialog for source display and improve layout * style: Update background color in SourceItem and SourcesGroup components for improved visibility * refactor: Sources component to enhance SourceItem structure and improve favicon handling * style: Adjust font size of domain text in SourceItem for better readability * feat: Add localization for citation source and details in CompositeCitation component * style: add theming to Citation components * feat: Enhance SourceItem component with dialog support and improved hovercard functionality * feat: Add localization for sources tab and image alt text in Sources component * style: Replace divs with spans for better semantic structure in CompositeCitation and Citation components * refactor: Sources component to use useMemo for tab generation and improve performance * chore: bump @librechat/agents to v2.4.318 * chore: update search result types * fix: search results retrieval in ContentParts component, re-render attachments when expected * feat: update sources style/types to use latest search result structure * style: enhance Dialog (expanded) SourceItem component with link wrapping and improved styling * style: update ImageItem component styling for improved title visibility * refactor: remove SourceItemBase component and adjust SourceItem layout for improved styling * chore: linting twcss order * fix: prevent FileAttachment from rendering search attachments * fix: append underscore to responseMessageId for unique identification to prevent mapping of previous latest message's attachments * chore: remove unused parameter 'useSpecs' from loadTools function * chore: twcss order * WIP: WebSearch Tool UI * refactor: add limit parameter to StackedFavicons for customizable source display * refactor: optimize search results memoization by making more granular and separate conerns * refactor: integrated StackedFavicons to WebSearch mid-run * chore: bump @librechat/agents to expose handleToolCallChunks * chore: use typedefs from dedicated file instead of defining them in AgentClient module * WIP: first pass, search progress results * refactor: move createOnSearchResults function to a dedicated search module * chore: bump @librechat/agents to v2.4.320 * WIP: first pass, search results processed UX * refactor: consolidate context variables in createOnSearchResults function * chore: bump @librechat/agents to v2.4.321 * feat: add guidelines for web search tool response formatting in loadTools function * feat: add isLast prop to Part component and update WebSearch logic for improved state handling * style: update Hovercard styles for improved UI consistency * feat: export FaviconImage component for improved accessibility in other modules * refactor: export getCleanDomain function and use FaviconImage in Citation component for improved source representation * refactor: implement SourceHovercard component for consistency and DRY compliance * fix: replace <p> with <span> for snippet and title in SourceItem and SourceHovercard for consistency * style: `not-prose` * style: remove 'not-prose' class for consistency in SourceItem, Citation, and SourceHovercard components, adjust style classes * refactor: `imageUrl` on hover and prevent duplicate sources * refactor: enhance SourcesGroup dialog layout and improve source item presentation * refactor: reorganize Web Components, save in same directory * feat: add 'news' refType to refTypeMap for citation sources * style: adjust Hovercard width for improved layout * refactor: update tool usage guidelines for improved clarity and execution * chore: linting * feat: add Web Search badge with initial permissions and local storage logic * feat: add webSearch support to interface and permissions schemas * feat: implement Web Search API key management and localization updates * feat: refactor Web Search API key handling and integrate new search API key form * fix: remove unnecessary visibility state from FileAttachment component * feat: update WebSearch component to use Globe icon and localized search label * feat: enhance ApiKeyDialog with dropdown for reranker selection and update translations * feat: implement dropdown menus for engine, scraper, and reranker selection in ApiKeyDialog * chore: linting and add unknown instead of `any` type * feat: refactor ApiKeyDialog and useAuthSearchTool for improved API key management * refactor: update ocrSchema to use template literals for default apiKey and baseURL * feat: add web search configuration and utility functions for environment variable extraction * fix: ensure filepath is defined before checking its prefix in useAttachmentHandler * feat: enhance web search functionality with improved configuration and environment variable extraction for authFields * fix: update auth type in TPluginAction and TUpdateUserPlugins to use Partial<Record<string, string>> * feat: implement web search authentication verification and enhance webSearchAuth structure * feat: enhance ephemeral agent handling with new web search capability and type definition * feat: enhance isEphemeralAgent function to include web search selection * feat: refactor verifyWebSearchAuth to improve key handling and authentication checks * feat: implement loadWebSearchAuth function for improved web search authentication handling * feat: enhance web search authentication with new configuration options and refactor related types * refactor: rename search engine to search provider and update related localization keys * feat: update verifyWebSearchAuth to handle multiple authentication types and improve error handling * feat: update ApiKeyDialog to accept authTypes prop and remove isUserProvided check * feat: add tests for extractWebSearchEnvVars and loadWebSearchAuth functions * feat: enhance loadWebSearchAuth to support specific service checks for providers, scrapers, and rerankers * fix: update web search configuration key and adjust auth result handling in loadTools function * feat: add new progress key for repeated web searching and update localization * chore: bump @librechat/agents to 2.4.322 * feat: enhance loadTools function to include ISO time and improve search tool logging * feat: update StackedFavicons to handle negative start index and improve citation attribution styling and text * chore: update .gitignore to categorize AI-related files * fix: mobile responsiveness of sources/citations hovercards * feat: enhance source display with improved line clamping for better readability * chore: bump @librechat/agents to v2.4.33 * feat: add handling for image sources in references mapping * chore: bump librechat-data-provider version to 0.7.84 * chore: bump @librechat/agents version to 2.4.34 * fix: update auth handling to support multiple auth types in tools and allow key configuration in agent panel * chore: remove redundant agent attribution text from search form * fix: web search auth uninstall * refactor: convert CheckboxButton to a forwardRef component and update setValue callback signature * feat: add triggerRef prop to ApiKeyDialog components for improved dialog control * feat: integrate triggerRef in CodeInterpreter and WebSearch components for enhanced dialog management * feat: enhance ApiKeyDialog with additional links for Firecrawl and Jina API key guidance * feat: implement web search configuration handling in ApiKeyDialog and add tests for dropdown visibility * fix: update webSearchConfig reference in config route for correct payload assignment * feat: update ApiKeyDialog to conditionally render sections based on authTypes and modify loadWebSearchAuth to correctly categorize authentication types * feat: refactor ApiKeyDialog and related tests to use SearchCategories and RerankerTypes enums and remove nested ternaries * refactor: move ThinkingButton rendering to improve layout consistency in ContentParts * feat: integrate search context into Markdown component to conditionally include unicodeCitation plugin * chore: bump @librechat/agents to v2.4.35 * chore: remove unused 18n key * ci: add WEB_SEARCH permission testing and update AppService tests for new webSearch configuration * ci: add more comprehensive tests for loadWebSearchAuth to validate authentication handling and authTypes structure * chore: remove debugging console log from web.spec.ts to clean up test output
This commit is contained in:
Danny Avila
parent
bf80cf30b3
commit
0dbbf7de04
73 changed files with 6366 additions and 2003 deletions
250
client/src/components/Web/plugin.ts
Normal file
250
client/src/components/Web/plugin.ts
Normal file
|
|
@ -0,0 +1,250 @@
|
|||
import { visit } from 'unist-util-visit';
|
||||
import type { Node } from 'unist';
|
||||
import type { Citation, CitationNode } from './types';
|
||||
|
||||
const SPAN_REGEX = /(\\ue203.*?\\ue204)/g;
|
||||
const COMPOSITE_REGEX = /(\\ue200.*?\\ue201)/g;
|
||||
const STANDALONE_PATTERN = /\\ue202turn(\d+)(search|image|news|video|ref)(\d+)/g;
|
||||
const CLEANUP_REGEX = /\\ue200|\\ue201|\\ue202|\\ue203|\\ue204|\\ue206/g;
|
||||
|
||||
/**
|
||||
* Checks if a standalone marker is truly standalone (not inside a composite block)
|
||||
*/
|
||||
function isStandaloneMarker(text: string, position: number): boolean {
|
||||
const beforeText = text.substring(0, position);
|
||||
const lastUe200 = beforeText.lastIndexOf('\\ue200');
|
||||
const lastUe201 = beforeText.lastIndexOf('\\ue201');
|
||||
|
||||
return lastUe200 === -1 || (lastUe201 !== -1 && lastUe201 > lastUe200);
|
||||
}
|
||||
|
||||
/**
|
||||
* Find the next pattern match from the current position
|
||||
*/
|
||||
function findNextMatch(
|
||||
text: string,
|
||||
position: number,
|
||||
): { type: string; match: RegExpExecArray | null; index: number } | null {
|
||||
// Reset regex lastIndex to start from current position
|
||||
SPAN_REGEX.lastIndex = position;
|
||||
COMPOSITE_REGEX.lastIndex = position;
|
||||
STANDALONE_PATTERN.lastIndex = position;
|
||||
|
||||
// Find next occurrence of each pattern
|
||||
const spanMatch = SPAN_REGEX.exec(text);
|
||||
const compositeMatch = COMPOSITE_REGEX.exec(text);
|
||||
|
||||
// For standalone, we need to check each match
|
||||
let standaloneMatch: RegExpExecArray | null = null;
|
||||
STANDALONE_PATTERN.lastIndex = position;
|
||||
|
||||
// Find the first standalone match that's not inside a composite block
|
||||
let match: RegExpExecArray | null;
|
||||
while (!standaloneMatch && (match = STANDALONE_PATTERN.exec(text)) !== null) {
|
||||
if (isStandaloneMarker(text, match.index)) {
|
||||
standaloneMatch = match;
|
||||
}
|
||||
}
|
||||
|
||||
// Find closest match
|
||||
let nextMatch: RegExpExecArray | null = null;
|
||||
let matchType = '';
|
||||
let matchIndex = -1;
|
||||
let typeIndex = -1;
|
||||
|
||||
if (spanMatch && (!nextMatch || spanMatch.index < matchIndex || matchIndex === -1)) {
|
||||
nextMatch = spanMatch;
|
||||
matchType = 'span';
|
||||
matchIndex = spanMatch.index;
|
||||
// We can use a counter for typeIndex if needed
|
||||
typeIndex = 0;
|
||||
}
|
||||
|
||||
if (compositeMatch && (!nextMatch || compositeMatch.index < matchIndex || matchIndex === -1)) {
|
||||
nextMatch = compositeMatch;
|
||||
matchType = 'composite';
|
||||
matchIndex = compositeMatch.index;
|
||||
typeIndex = 0;
|
||||
}
|
||||
|
||||
if (standaloneMatch && (!nextMatch || standaloneMatch.index < matchIndex || matchIndex === -1)) {
|
||||
nextMatch = standaloneMatch;
|
||||
matchType = 'standalone';
|
||||
matchIndex = standaloneMatch.index;
|
||||
typeIndex = 0;
|
||||
}
|
||||
|
||||
if (!nextMatch) return null;
|
||||
|
||||
return { type: matchType, match: nextMatch, index: typeIndex };
|
||||
}
|
||||
|
||||
function processTree(tree: Node) {
|
||||
visit(tree, 'text', (node, index, parent) => {
|
||||
const textNode = node as CitationNode;
|
||||
const parentNode = parent as CitationNode;
|
||||
|
||||
if (typeof textNode.value !== 'string') return;
|
||||
|
||||
const originalValue = textNode.value;
|
||||
const segments: Array<CitationNode> = [];
|
||||
|
||||
// Single-pass processing through the string
|
||||
let currentPosition = 0;
|
||||
|
||||
// Important change: Create a map to track citation IDs by their position
|
||||
// This ensures consistent IDs across multiple segments
|
||||
const citationIds = new Map<number, string>();
|
||||
const typeCounts = { span: 0, composite: 0, standalone: 0 };
|
||||
|
||||
while (currentPosition < originalValue.length) {
|
||||
const nextMatchInfo = findNextMatch(originalValue, currentPosition);
|
||||
|
||||
if (!nextMatchInfo) {
|
||||
// No more matches, add remaining content with cleanup
|
||||
const remainingText = originalValue.substring(currentPosition).replace(CLEANUP_REGEX, '');
|
||||
if (remainingText) {
|
||||
segments.push({ type: 'text', value: remainingText });
|
||||
}
|
||||
break;
|
||||
}
|
||||
|
||||
const { type, match } = nextMatchInfo;
|
||||
const matchIndex = match!.index;
|
||||
const matchText = match![0];
|
||||
|
||||
// Add cleaned text before this match
|
||||
if (matchIndex > currentPosition) {
|
||||
const textBeforeMatch = originalValue
|
||||
.substring(currentPosition, matchIndex)
|
||||
.replace(CLEANUP_REGEX, '');
|
||||
|
||||
if (textBeforeMatch) {
|
||||
segments.push({ type: 'text', value: textBeforeMatch });
|
||||
}
|
||||
}
|
||||
|
||||
// Generate a unique ID for this citation based on its position in the text
|
||||
const citationId = `${type}-${typeCounts[type as keyof typeof typeCounts]}-${matchIndex}`;
|
||||
citationIds.set(matchIndex, citationId);
|
||||
|
||||
// Process based on match type
|
||||
switch (type) {
|
||||
case 'span': {
|
||||
const spanText = matchText;
|
||||
const cleanText = spanText.replace(/\\ue203|\\ue204/g, '');
|
||||
|
||||
// Look ahead for associated citation
|
||||
let associatedCitationId: string | null = null;
|
||||
const endOfSpan = matchIndex + matchText.length;
|
||||
|
||||
// Check if there's a citation right after this span
|
||||
const nextCitation = findNextMatch(originalValue, endOfSpan);
|
||||
if (
|
||||
nextCitation &&
|
||||
(nextCitation.type === 'standalone' || nextCitation.type === 'composite') &&
|
||||
nextCitation.match!.index - endOfSpan < 5
|
||||
) {
|
||||
// Use the ID that will be generated for the next citation
|
||||
const nextIndex = nextCitation.match!.index;
|
||||
const nextType = nextCitation.type;
|
||||
associatedCitationId = `${nextType}-${typeCounts[nextType as keyof typeof typeCounts]}-${nextIndex}`;
|
||||
}
|
||||
|
||||
segments.push({
|
||||
type: 'highlighted-text',
|
||||
data: {
|
||||
hName: 'highlighted-text',
|
||||
hProperties: { citationId: associatedCitationId },
|
||||
},
|
||||
children: [{ type: 'text', value: cleanText }],
|
||||
});
|
||||
|
||||
typeCounts.span++;
|
||||
break;
|
||||
}
|
||||
|
||||
case 'composite': {
|
||||
const compositeText = matchText;
|
||||
|
||||
// Use a regular expression to extract reference indices
|
||||
const compositeRefRegex = new RegExp(STANDALONE_PATTERN.source, 'g');
|
||||
let refMatch: RegExpExecArray | null;
|
||||
const citations: Array<Citation> = [];
|
||||
|
||||
while ((refMatch = compositeRefRegex.exec(compositeText)) !== null) {
|
||||
const turn = Number(refMatch[1]);
|
||||
const refType = refMatch[2];
|
||||
const refIndex = Number(refMatch[3]);
|
||||
|
||||
citations.push({
|
||||
turn,
|
||||
refType,
|
||||
index: refIndex,
|
||||
});
|
||||
}
|
||||
|
||||
if (citations.length > 0) {
|
||||
segments.push({
|
||||
type: 'composite-citation',
|
||||
data: {
|
||||
hName: 'composite-citation',
|
||||
hProperties: {
|
||||
citations,
|
||||
citationId: citationId,
|
||||
},
|
||||
},
|
||||
});
|
||||
}
|
||||
|
||||
typeCounts.composite++;
|
||||
break;
|
||||
}
|
||||
|
||||
case 'standalone': {
|
||||
// Extract reference info
|
||||
const turn = Number(match![1]);
|
||||
const refType = match![2];
|
||||
const refIndex = Number(match![3]);
|
||||
|
||||
segments.push({
|
||||
type: 'citation',
|
||||
data: {
|
||||
hName: 'citation',
|
||||
hProperties: {
|
||||
citation: {
|
||||
turn,
|
||||
refType,
|
||||
index: refIndex,
|
||||
},
|
||||
citationType: 'standalone',
|
||||
citationId: citationId,
|
||||
},
|
||||
},
|
||||
});
|
||||
|
||||
typeCounts.standalone++;
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
// Move position forward
|
||||
currentPosition = matchIndex + matchText.length;
|
||||
}
|
||||
|
||||
// Replace the original node with our segments or clean up the original
|
||||
if (segments.length > 0 && index !== undefined) {
|
||||
parentNode.children?.splice(index, 1, ...segments);
|
||||
return index + segments.length;
|
||||
} else if (textNode.value !== textNode.value.replace(CLEANUP_REGEX, '')) {
|
||||
// If we didn't create segments but there are markers to clean up
|
||||
textNode.value = textNode.value.replace(CLEANUP_REGEX, '');
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
export function unicodeCitation() {
|
||||
return (tree: Node) => {
|
||||
processTree(tree);
|
||||
};
|
||||
}
|
||||
Loading…
Add table
Add a link
Reference in a new issue