Feat: Agent Tools Improvements

apps/server/src/routes/chat.ts

@@ -11,6 +11,7 @@ import {
   type UIMessage,
 } from '@qwery/agent-factory-sdk';
 import { normalizeUIRole } from '@qwery/shared/message-role-utils';
+import { MessageRole } from '@qwery/domain/entities';
 import type { Repositories } from '@qwery/domain/repositories';
 import { createRepositories } from '../lib/repositories';
 import { getTelemetry } from '../lib/telemetry';
@@ -52,6 +53,17 @@ export function createChatRoutes() {
         const model = body.model ?? getDefaultModel();
 
         const repositories = await getRepositories();
+        if (body.trigger === 'regenerate-message') {
+          const conversation = await repositories.conversation.findBySlug(slug);
+          if (conversation) {
+            const convMessages =
+              await repositories.message.findByConversationId(conversation.id);
+            const lastMessage = convMessages.at(-1);
+            if (lastMessage && lastMessage.role === MessageRole.ASSISTANT) {
+              await repositories.message.delete(lastMessage.id);
+            }
+          }
+        }
         const datasources = await resolveChatDatasources({
           bodyDatasources: body.datasources,
           messages,

apps/web/app/routes.ts

@@ -38,7 +38,7 @@ const projectLayout = layout('routes/project/layout.tsx', [
 const datasourceLayout = layout('routes/datasource/layout.tsx', [
   route('ds/:slug', 'routes/datasource/index.tsx'),
   route('ds/:slug/tables', 'routes/datasource/tables.tsx'),
-  route('ds/:slug/tables/:id', 'routes/datasource/table.tsx'),
+  route('ds/:slug/tables/:schema/:tableName', 'routes/datasource/table.tsx'),
   route('ds/:slug/schema', 'routes/datasource/schema.tsx'),
   route('ds/:slug/settings', 'routes/datasource/settings.tsx'),
 ]);

apps/web/app/routes/datasource/table.tsx

@@ -34,7 +34,10 @@ export async function loader(args: Route.LoaderArgs) {
 export default function TablePage(props: Route.ComponentProps) {
   const params = useParams();
   const slug = params.slug as string;
-  const tableId = params.id as string;
+  const schemaParam = params.schema as string;
+  const tableNameParam = params.tableName as string;
+  const schema = schemaParam ? decodeURIComponent(schemaParam) : '';
+  const tableName = tableNameParam ? decodeURIComponent(tableNameParam) : '';
   const { t } = useTranslation();
   const { datasource } = props.loaderData;
 
@@ -43,18 +46,25 @@ export default function TablePage(props: Route.ComponentProps) {
   });
 
   const table = useMemo(() => {
-    if (!metadata?.tables) return null;
+    if (!metadata?.tables || !schema || !tableName) return null;
     const tables = metadata.tables as Table[];
-    return tables.find((t) => t.id.toString() === tableId) || null;
-  }, [metadata, tableId]);
+    return (
+      tables.find(
+        (t) => (t.schema ?? 'main') === schema && t.name === tableName,
+      ) ?? null
+    );
+  }, [metadata, schema, tableName]);
 
   const columns = useMemo(() => {
     if (!metadata?.columns || !table) return [];
     const allColumns = metadata.columns as Column[];
     return allColumns.filter(
-      (col) => col.table_id.toString() === tableId && col.table === table.name,
+      (col) =>
+        col.table_id === table.id &&
+        col.table === table.name &&
+        (col.schema ?? 'main') === (table.schema ?? 'main'),
     );
-  }, [metadata, table, tableId]);
+  }, [metadata, table]);
 
   const columnListItems: ColumnListItem[] = useMemo(() => {
     return columns.map((col) => ({
@@ -89,7 +99,6 @@ export default function TablePage(props: Route.ComponentProps) {
     );
   }
 
-  const tableName = table.name;
   const tablesPath = `/ds/${slug}/tables`;
 
   return (
@@ -100,7 +109,7 @@ export default function TablePage(props: Route.ComponentProps) {
             defaultValue: 'Tables',
           })}
         </Link>{' '}
-        <span className="text-muted-foreground">&gt;</span> {tableName}
+        <span className="text-muted-foreground">&gt;</span> {table.name}
       </h1>
       <Columns columns={columnListItems} />
     </div>

apps/web/app/routes/datasource/tables.tsx

@@ -82,9 +82,9 @@ export default function TablesPage(props: Route.ComponentProps) {
   const handleTableClick = (table: TableListItem) => {
     const tableData = filteredTables.find((t) => t.name === table.tableName);
     if (!tableData) return;
-
-    const tablePath = `/ds/${slug}/tables/${tableData.id}`;
-    navigate(tablePath);
+    const schema = encodeURIComponent(tableData.schema ?? 'main');
+    const tableName = encodeURIComponent(tableData.name);
+    navigate(`/ds/${slug}/tables/${schema}/${tableName}`);
   };
 
   if (!datasource) {

apps/web/app/routes/project/_components/agent-ui-wrapper.tsx

@@ -45,7 +45,14 @@ import { useAgentStatus, formatRelativeTime } from '@qwery/ui/ai';
 import type { FeedbackPayload } from '@qwery/ui/ai';
 import { toast } from 'sonner';
 import { useTranslation } from 'react-i18next';
-import { createDatasourceViewPath } from '~/config/project.navigation.config';
+import {
+  createDatasourceViewPath,
+  createDatasourceTableViewPath,
+} from '~/config/project.navigation.config';
+import {
+  openDatasourceInNewTab,
+  openTableInNewTab,
+} from '~/lib/utils/datasource-navigation';
 
 type SendMessageFn = (
   message: { text: string },
@@ -693,14 +700,32 @@ export const AgentUIWrapper = forwardRef<
   );
 
   const _handleDatasourceNameClick = useCallback(
-    (idOrSlug: string, _name: string) => {
-      const ds =
-        datasourceItems.find((d) => d.id === idOrSlug) ??
-        datasourceItems.find((d) => d.slug === idOrSlug);
-      if (ds?.slug) {
-        const path = createDatasourceViewPath(ds.slug);
-        window.open(path, '_blank', 'noopener,noreferrer');
-      }
+    (idOrSlug: string, name: string) => {
+      openDatasourceInNewTab(
+        datasourceItems,
+        idOrSlug,
+        name,
+        createDatasourceViewPath,
+      );
+    },
+    [datasourceItems],
+  );
+
+  const _handleTableNameClick = useCallback(
+    (
+      datasourceIdOrSlug: string,
+      datasourceName: string,
+      schema: string,
+      tableName: string,
+    ) => {
+      openTableInNewTab(
+        datasourceItems,
+        datasourceIdOrSlug,
+        datasourceName,
+        schema,
+        tableName,
+        createDatasourceTableViewPath,
+      );
     },
     [datasourceItems],
   );
@@ -733,6 +758,9 @@ export const AgentUIWrapper = forwardRef<
         notebookContext={notebookContext}
         isLoading={isLoading}
         conversationSlug={conversationSlug}
+        onDatasourceNameClick={_handleDatasourceNameClick}
+        onTableNameClick={_handleTableNameClick}
+        getDatasourceTooltip={_getDatasourceTooltip}
       />
       <AlertDialog
         open={noDatasourceDialogOpen}

apps/web/app/routes/project/conversation/index.tsx

@@ -196,10 +196,15 @@ export default function ConversationIndexPage() {
   const isLoading = isLoadingConversations || isProjectLoading;
   const [searchQuery, setSearchQuery] = useState('');
   const [isEditMode, setIsEditMode] = useState(false);
+  const [loadMoreState, setLoadMoreState] = useState<{
+    hasMore: boolean;
+    onLoadMore: () => void;
+    isLoading: boolean;
+  } | null>(null);
 
   return (
-    <div className="bg-background flex h-screen w-full flex-col overflow-hidden">
-      <div className="flex h-full flex-col">
+    <div className="bg-background flex h-full min-h-0 w-full flex-1 flex-col overflow-hidden">
+      <div className="flex min-h-0 flex-1 flex-col">
         <section className="flex shrink-0 flex-col gap-6 px-8 py-6 lg:px-16 lg:py-10">
           <div className="flex items-center justify-between">
             <h1 className="text-3xl font-bold">{t('chat:title')}</h1>
@@ -234,7 +239,7 @@ export default function ConversationIndexPage() {
           </div>
         </section>
 
-        <div className="min-h-0 flex-1 overflow-hidden px-8 lg:px-16">
+        <div className="flex min-h-0 flex-1 flex-col overflow-hidden px-8 lg:px-16">
           {isLoading ? (
             <div className="bg-muted/10 h-full w-full animate-pulse rounded-2xl" />
           ) : (
@@ -257,10 +262,26 @@ export default function ConversationIndexPage() {
               onSearchQueryChange={setSearchQuery}
               isEditMode={isEditMode}
               onEditModeChange={setIsEditMode}
+              onLoadMoreStateChange={setLoadMoreState}
               className="h-full"
             />
           )}
         </div>
+
+        {loadMoreState?.hasMore && (
+          <div className="bg-background flex shrink-0 items-center px-8 py-4 lg:px-16 lg:py-6">
+            <Button
+              variant="outline"
+              size="sm"
+              onClick={loadMoreState.onLoadMore}
+              disabled={loadMoreState.isLoading}
+              className="text-muted-foreground hover:text-foreground h-10 w-full border-2"
+              data-test="conversation-load-more"
+            >
+              {loadMoreState.isLoading ? 'Loading...' : 'Load more'}
+            </Button>
+          </div>
+        )}
       </div>
     </div>
   );

apps/web/config/project.navigation.config.tsx

@@ -66,3 +66,15 @@ export function createDatasourcePath(slug: string, name: string) {
 export function createDatasourceViewPath(slug: string) {
   return createPath(pathsConfig.app.projectDatasourceView, slug);
 }
+
+/** Build path to a specific table: /ds/{slug}/tables/{schema}/{tableName} */
+export function createDatasourceTableViewPath(
+  slug: string,
+  schema: string,
+  tableName: string,
+) {
+  const base = createPath(pathsConfig.app.datasourceTables, slug);
+  const encodedSchema = encodeURIComponent(schema || 'main');
+  const encodedTableName = encodeURIComponent(tableName);
+  return `${base}/${encodedSchema}/${encodedTableName}`;
+}

apps/web/lib/utils/datasource-navigation.ts

@@ -0,0 +1,81 @@
+/**
+ * Resolves a datasource by id, slug, or name and opens its view in a new tab.
+ * Used by getSchema UI (datasource names, error cards, minimal table names) and any other link that should open the datasource page.
+ */
+
+export interface DatasourceItemLike {
+  id: string;
+  name?: string;
+  slug?: string;
+}
+
+function slugify(s: string): string {
+  return (
+    String(s)
+      .replace(/\s+/g, '_')
+      .replace(/[^a-zA-Z0-9_-]/g, '') || s
+  );
+}
+
+export function resolveDatasource(
+  items: DatasourceItemLike[],
+  idOrSlug: string,
+  name: string,
+): DatasourceItemLike | undefined {
+  return (
+    items.find((d) => d.id === idOrSlug) ??
+    items.find((d) => d.slug === idOrSlug) ??
+    items.find(
+      (d) =>
+        slugify(d.name ?? '') === idOrSlug ||
+        slugify(d.slug ?? '') === idOrSlug,
+    ) ??
+    items.find((d) => d.name === name)
+  );
+}
+
+/**
+ * Resolves the datasource and opens its view URL in a new tab.
+ * @param getPath - e.g. createDatasourceViewPath from project.navigation.config
+ */
+export function openDatasourceInNewTab(
+  items: DatasourceItemLike[],
+  idOrSlug: string,
+  name: string,
+  getPath: (slug: string) => string,
+): void {
+  const ds = resolveDatasource(items, idOrSlug, name);
+  if (ds?.slug) {
+    const path = getPath(ds.slug);
+    openUrlInNewTab(path);
+  }
+}
+
+/**
+ * Opens a relative or absolute URL in a new tab.
+ */
+export function openUrlInNewTab(pathOrUrl: string): void {
+  const url = pathOrUrl.startsWith('http')
+    ? pathOrUrl
+    : `${typeof window !== 'undefined' ? window.location.origin : ''}${pathOrUrl}`;
+  window.open(url, '_blank', 'noopener,noreferrer');
+}
+
+/**
+ * Resolves the datasource and opens the table view URL in a new tab.
+ * @param getTablePath - e.g. createDatasourceTableViewPath(slug, schema, tableName)
+ */
+export function openTableInNewTab(
+  items: DatasourceItemLike[],
+  datasourceIdOrSlug: string,
+  datasourceName: string,
+  schema: string,
+  tableName: string,
+  getTablePath: (slug: string, schema: string, tableName: string) => string,
+): void {
+  const ds = resolveDatasource(items, datasourceIdOrSlug, datasourceName);
+  if (ds?.slug) {
+    const path = getTablePath(ds.slug, schema || 'main', tableName);
+    openUrlInNewTab(path);
+  }
+}

apps/web/styles/qwery.css

@@ -1,3 +1,36 @@
+/* Scrollbar visible on hover - overrides base scrollbar styles */
+.scrollbar-hover-visible {
+  scrollbar-color: transparent transparent;
+}
+.scrollbar-hover-visible:hover,
+.group:hover .scrollbar-hover-visible {
+  scrollbar-color: rgba(155, 155, 155, 0.3) transparent;
+}
+.dark .scrollbar-hover-visible:hover,
+.dark .group:hover .scrollbar-hover-visible {
+  scrollbar-color: rgba(255, 255, 255, 0.15) transparent;
+}
+.scrollbar-hover-visible::-webkit-scrollbar {
+  height: 5px !important;
+  width: 5px !important;
+  background: transparent !important;
+}
+.scrollbar-hover-visible::-webkit-scrollbar-track {
+  background: transparent !important;
+}
+.scrollbar-hover-visible::-webkit-scrollbar-thumb {
+  background: transparent !important;
+  border-radius: 10px;
+}
+.scrollbar-hover-visible:hover::-webkit-scrollbar-thumb,
+.group:hover .scrollbar-hover-visible::-webkit-scrollbar-thumb {
+  background: rgba(155, 155, 155, 0.3) !important;
+}
+.dark .scrollbar-hover-visible:hover::-webkit-scrollbar-thumb,
+.dark .group:hover .scrollbar-hover-visible::-webkit-scrollbar-thumb {
+  background: rgba(255, 255, 255, 0.15) !important;
+}
+
 [data-radix-popper-content-wrapper] {
     @apply w-full md:w-auto;
 }

packages/agent-factory-sdk/src/services/default-transport.ts

@@ -5,7 +5,7 @@ export const defaultTransport = (api: string) =>
   new DefaultChatTransport({
     api,
     prepareSendMessagesRequest: (request) => {
-      const { messages, body = {} } = request;
+      const { messages, body = {}, trigger } = request;
       const lastUserMessageIndex = messages.findLastIndex(
         (m) => normalizeUIRole(m.role) === 'user',
       );
@@ -15,6 +15,7 @@ export const defaultTransport = (api: string) =>
         body: {
           ...body,
           messages: lastUserMessage ? [lastUserMessage] : [],
+          ...(trigger ? { trigger } : {}),
         },
       };
     },