chore: remove reference to Object.groupBy for browser support

gptscript-ai · Sep 9, 2024 · 793a7e0 · 793a7e0
1 parent 7cb716e
commit 793a7e0
Show file tree

Hide file tree

Showing 3 changed files with 34 additions and 23 deletions.
diff --git a/components/chat/chatBar/CatalogListBox.tsx b/components/chat/chatBar/CatalogListBox.tsx
@@ -1,5 +1,9 @@
 import { useDebouncedValue } from '@/hooks/useDebounce';
-import { FeaturedTool, FeaturedToolsByCategory } from '@/model/tools';
+import {
+  FeaturedTool,
+  FeaturedToolList,
+  FeaturedToolsByCategory,
+} from '@/model/tools';
 import {
   Listbox,
   ListboxItem,
@@ -41,14 +45,13 @@ export const CatalogListBox = forwardRef<ToolCatalogRef, CatalogListboxProps>(
     const debouncedQuery = useDebouncedValue(query || '', 250);
 
     const featuredResults = useMemo(() => {
-      const flattened = (featuredTools: Record<string, FeaturedTool[]>) =>
-        Object.entries(featuredTools).flatMap(([category, tools]) =>
-          tools.map((tool) => ({ tool, category }))
-        );
-
-      if (debouncedQuery.trim().length <= 0) return FeaturedToolsByCategory;
+      if (debouncedQuery.trim().length <= 0)
+        return Object.fromEntries(FeaturedToolsByCategory);
 
-      const fuse = new Fuse(flattened(FeaturedToolsByCategory), fuseOptions);
+      const fuse = new Fuse(
+        FeaturedToolList.map((tool) => ({ tool, category: tool.category })),
+        fuseOptions
+      );
       const results = fuse.search(debouncedQuery).map((result) => result.item);
 
       results.reverse();

diff --git a/components/chat/chatBar/search/catalog.tsx b/components/chat/chatBar/search/catalog.tsx
@@ -1,5 +1,9 @@
 import { useDebouncedValue } from '@/hooks/useDebounce';
-import { FeaturedTool, FeaturedToolsByCategory } from '@/model/tools';
+import {
+  FeaturedTool,
+  FeaturedToolList,
+  FeaturedToolsByCategory,
+} from '@/model/tools';
 import {
   Card,
   Listbox,
@@ -50,14 +54,13 @@ export default forwardRef<ToolCatalogRef, CatalogListboxProps>(
     const debouncedQuery = useDebouncedValue(query, 250);
 
     const featuredResults = useMemo(() => {
-      const flattened = (featuredTools: Record<string, FeaturedTool[]>) =>
-        Object.entries(featuredTools).flatMap(([category, tools]) =>
-          tools.map((tool) => ({ tool, category }))
-        );
-
-      if (debouncedQuery.trim().length <= 0) return FeaturedToolsByCategory;
+      if (debouncedQuery.trim().length <= 0)
+        return Object.fromEntries(FeaturedToolsByCategory);
 
-      const fuse = new Fuse(flattened(FeaturedToolsByCategory), fuseOptions);
+      const fuse = new Fuse(
+        FeaturedToolList.map((tool) => ({ tool, category: tool.category })),
+        fuseOptions
+      );
       const results = fuse.search(debouncedQuery).map((result) => result.item);
 
       results.reverse();

diff --git a/model/tools.tsx b/model/tools.tsx
@@ -51,7 +51,7 @@ export type FeaturedTool = {
 };
 
 // note(tylerslaton) - This will eventually be retrieved from the tools site, for now we must endure the pain of hardcoding.
-const featuredTools: FeaturedTool[] = [
+export const FeaturedToolList: FeaturedTool[] = [
   {
     name: 'Vision',
     description: 'Allows the assistant to interact with images.',
@@ -285,14 +285,19 @@ const toolIconMap = new Map<string, () => React.ReactNode>([
 ]);
 
 export const FeaturedToolMap = new Map(
-  featuredTools.map((tool) => [tool.url, tool])
+  FeaturedToolList.map((tool) => [tool.url, tool])
 );
 
-// using Object.groupby for backwards compatibility
-export const FeaturedToolsByCategory = Object.groupBy(
-  featuredTools,
-  (tool) => tool.category
-) as Record<string, FeaturedTool[]>;
+// Object.groupBy is not supported in all browsers :(
+export const FeaturedToolsByCategory = FeaturedToolList.reduce((acc, tool) => {
+  if (!acc.get(tool.category)) {
+    acc.set(tool.category, []);
+  }
+
+  acc.get(tool.category)?.push(tool);
+
+  return acc;
+}, new Map<string, FeaturedTool[]>());
 
 export const ToolIcon = ({ toolName }: { toolName?: string }) => {
   if (!toolName) return <GoQuestion className="text-md" />;