Refactor tool selection logic and enhance regex mapping (#10)

This pull request includes updates to the `ToolsToggle` component and
the `toolIcons` configuration to enhance the tool selection
functionality. The most important changes involve the introduction of
regex-based tool matching and the addition of new tool icon mappings.

Enhancements to tool selection functionality:

*
[`src/components/ChatInputButton/ToolsToggle.tsx`](diffhunk://#diff-5e81be1e28b3637aa2337dde6d10a306e31c56a504ee3c59747f301d1f3fc2e1L24-R40):
Updated the `handleQuickToolToggle` function to use regex patterns from
`toolIconMappings` for more accurate tool matching.

Updates to tool icon mappings:

*
[`src/components/ChatInputButton/toolIcons.tsx`](diffhunk://#diff-f9c7082cb98bf0b9e486b971e75e43b385a100093e611408d2e6cb356ec3f655L3-L29):
Added new tool icon mappings for Docker, GitHub, Git, and filesystem
management tools, and made regex a required field for all tool
mappings.Updated the tool selection logic to use regex for more precise
matching, replacing the simple pattern-based approach. Introduced
required regex fields in `toolIconMappings` for consistent behavior
across tool integrations. Expanded `toolIcons.tsx` with additional tool
mappings and refined titles.

Author: shahariaazam

src/components/ChatInputButton/ToolsToggle.tsx

@@ -21,13 +21,23 @@ export const ToolsToggle: React.FC<ToolsToggleButtonProps> = ({
     };
 
     const handleQuickToolToggle = (pattern: string) => {
-        const relatedTools = availableTools.filter(tool =>
-            tool.toLowerCase().includes(pattern.toLowerCase())
-        );
+        // Find the tool mapping for the current pattern
+        const toolMapping = toolIconMappings.find(mapping => mapping.pattern === pattern);
 
-        // If all related tools are selected, unselect them; otherwise, select them
-        const allSelected = relatedTools.every(tool => selectedTools.includes(tool));
+        const relatedTools = availableTools.filter(tool => {
+            const toolLower = tool.toLowerCase();
+
+            // Use the regex pattern from toolMapping if it exists
+            if (toolMapping?.regex) {
+                return toolMapping.regex.test(toolLower);
+            }
+
+            // Fallback to simple pattern matching if no regex is defined
+            const regex = new RegExp(`^${pattern}`, 'i');
+            return regex.test(toolLower);
+        });
 
+        const allSelected = relatedTools.every(tool => selectedTools.includes(tool));
         if (allSelected) {
             onToolsChange(selectedTools.filter(tool => !relatedTools.includes(tool)));
         } else {
@@ -36,6 +46,7 @@ export const ToolsToggle: React.FC<ToolsToggleButtonProps> = ({
         }
     };
 
+
     return (
         <div className="flex items-center gap-2">
             {/* Main tools configuration button */}

src/components/ChatInputButton/toolIcons.tsx

@@ -1,30 +1,56 @@
 import { IconType } from 'react-icons';
 import { SiGmail } from 'react-icons/si';
-import { TbApi } from 'react-icons/tb';
-import { FaDatabase } from 'react-icons/fa';
-// Import other icons as needed
+import {FaDatabase, FaDocker, FaGithub, FaGitSquare, FaRegFolderOpen} from 'react-icons/fa';
+import {MdOutlineHttp} from "react-icons/md";
 
 interface ToolIconMapping {
     pattern: string;
     icon: IconType;
     title: string;
+    regex: RegExp;  // Make regex required since we're using it for all
 }
 
 export const toolIconMappings: ToolIconMapping[] = [
     {
         pattern: 'gmail',
         icon: SiGmail,
-        title: 'Gmail Tools'
+        title: 'Access Gmail',
+        regex: /^gmail\w*/
     },
     {
         pattern: 'curl',
-        icon: TbApi,
-        title: 'API Tools'
+        icon: MdOutlineHttp,
+        title: 'HTTP Tools using cURL',
+        regex: /^curl\w*/
     },
     {
         pattern: 'sql',
         icon: FaDatabase,
-        title: 'Database Tools'
+        title: 'Database Tools',
+        regex: /^sql\w*/
+    },
+    {
+        pattern: 'git',
+        icon: FaGitSquare,
+        title: 'Git Tools',
+        regex: /^git(?!hub)\w*/
+    },
+    {
+        pattern: 'github',
+        icon: FaGithub,
+        title: 'GitHub Tools',
+        regex: /^github\w*/
+    },
+    {
+        pattern: 'docker',
+        icon: FaDocker,
+        title: 'Docker Tools',
+        regex: /^docker\w*/
+    },
+    {
+        pattern: 'filesystem',
+        icon: FaRegFolderOpen,
+        title: 'Manage Filesystem',
+        regex: /^filesystem\w*/
     }
-    // Add more mappings as needed
 ];