chore: remove unused initial report suggestions

Author: gregnr

apps/postgres-new/components/chat.tsx

@@ -21,7 +21,7 @@ import { Button } from '~/components/ui/button'
 import { Skeleton } from '~/components/ui/skeleton'
 import { TablesData } from '~/data/tables/tables-query'
 import { saveFile } from '~/lib/files'
-import { useAutoScroll, useReportSuggestions } from '~/lib/hooks'
+import { useAutoScroll } from '~/lib/hooks'
 import { cn } from '~/lib/utils'
 import { AiIconAnimation } from './ai-icon-animation'
 import ChatMessage from './chat-message'
@@ -189,9 +189,6 @@ export default function Chat() {
     stopReply,
   } = useWorkspace()
 
-  const [brainstormIdeas] = useState(false) // temporarily turn off for now
-  const { reports } = useReportSuggestions({ enabled: brainstormIdeas })
-
   const { input, setInput, handleInputChange, isLoading } = useChat({
     id: databaseId,
     api: '/api/chat',
@@ -406,74 +403,6 @@ export default function Chat() {
             >
               What would you like to create?
             </m.h3>
-            <div>
-              {brainstormIdeas && (
-                <>
-                  {reports ? (
-                    <m.div
-                      className="flex flex-row gap-6 flex-wrap justify-center items-start"
-                      variants={{
-                        show: {
-                          transition: {
-                            staggerChildren: 0.05,
-                          },
-                        },
-                      }}
-                      initial="hidden"
-                      animate="show"
-                    >
-                      {reports.map((report) => (
-                        <m.div
-                          key={report.name}
-                          layoutId={`report-suggestion-${report.name}`}
-                          className="w-64 h-32 flex flex-col overflow-ellipsis rounded-md cursor-pointer"
-                          onMouseDown={() =>
-                            appendMessage({ role: 'user', content: report.description })
-                          }
-                          variants={{
-                            hidden: { scale: 0 },
-                            show: { scale: 1 },
-                          }}
-                        >
-                          <div className="p-4 bg-neutral-200 text-sm rounded-t-md text-neutral-600 font-bold text-center">
-                            {report.name}
-                          </div>
-                          <div className="flex-1 p-4 flex flex-col justify-center border border-neutral-200 text-neutral-500 text-xs font-normal italic rounded-b-md text-center overflow-hidden">
-                            {report.description}
-                          </div>
-                        </m.div>
-                      ))}
-                    </m.div>
-                  ) : (
-                    <m.div
-                      className="flex flex-row gap-4 justify-center items-center"
-                      variants={{
-                        hidden: {
-                          opacity: 0,
-                          y: -10,
-                        },
-                        show: {
-                          opacity: 1,
-                          y: 0,
-                          transition: {
-                            delay: 0.5,
-                          },
-                        },
-                      }}
-                      initial="hidden"
-                      animate="show"
-                    >
-                      <m.div layoutId="ai-loading-icon">
-                        <AiIconAnimation loading />
-                      </m.div>
-                      <h3 className="text-lg italic font-light text-neutral-500">
-                        Brainstorming some ideas
-                      </h3>
-                    </m.div>
-                  )}
-                </>
-              )}
-            </div>
           </div>
         )}
         <AnimatePresence>

apps/postgres-new/lib/hooks.ts

@@ -3,78 +3,16 @@
 import { useQuery, useQueryClient } from '@tanstack/react-query'
 import { FeatureExtractionPipelineOptions, pipeline } from '@xenova/transformers'
 import { generateId } from 'ai'
-import { useChat } from 'ai/react'
 import { Chart } from 'chart.js'
 import { codeBlock } from 'common-tags'
 import { Dispatch, SetStateAction, useCallback, useEffect, useMemo, useRef, useState } from 'react'
-import { useWorkspace } from '~/components/workspace'
 import { useDatabaseUpdateMutation } from '~/data/databases/database-update-mutation'
 import { useTablesQuery } from '~/data/tables/tables-query'
-import { Report } from '~/lib/schema'
 import { getDb } from './db'
 import { loadFile, saveFile } from './files'
 import { SmoothScroller } from './smooth-scroller'
 import { OnToolCall } from './tools'
 
-export type UseReportSuggestionsOptions = {
-  enabled?: boolean
-}
-
-export function useReportSuggestions({ enabled = true }: UseReportSuggestionsOptions) {
-  const { databaseId, appendMessage } = useWorkspace()
-  const { data: tables } = useTablesQuery({ databaseId, schemas: ['public'] })
-  const [reports, setReports] = useState<Report[]>()
-
-  const { setMessages } = useChat({
-    id: databaseId,
-    api: '/api/chat',
-    async onToolCall({ toolCall }) {
-      switch (toolCall.toolName) {
-        case 'brainstormReports': {
-          const { reports } = toolCall.args as any
-          setReports(reports)
-        }
-      }
-    },
-  })
-
-  useEffect(() => {
-    if (enabled && tables) {
-      // Provide the LLM with the current schema before invoking the tool call
-      setMessages([
-        {
-          id: generateId(),
-          role: 'assistant',
-          content: '',
-          toolInvocations: [
-            {
-              state: 'result',
-              toolCallId: generateId(),
-              toolName: 'getDatabaseSchema',
-              args: {},
-              result: tables,
-            },
-          ],
-        },
-      ])
-
-      appendMessage({
-        role: 'user',
-        content: codeBlock`
-        Brainstorm 5 interesting charts that can be generated based on tables and their columns in the database.
-
-        Keep descriptions short and concise. Don't say "eg.". Descriptions should mention charting or visualizing.
-
-        Titles should be 4 words or less.
-      `,
-      })
-    }
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [enabled, tables])
-
-  return { reports }
-}
-
 /**
  * Hook to load/store values from local storage with an API similar
  * to `useState()`.