Traces list auto refetch (mastra-ai#16204)

## Description

<!-- Provide a brief description of the changes in this PR -->

## Related Issue(s)

<!-- Link to the issue(s) this PR addresses, using hashtag notation:
Fixes mastra-ai#123 -->

## Type of Change

- [ ] Bug fix (non-breaking change that fixes an issue)
- [ ] New feature (non-breaking change that adds functionality)
- [ ] Breaking change (fix or feature that would cause existing
functionality to change)
- [ ] Documentation update
- [ ] Code refactoring
- [ ] Performance improvement
- [ ] Test update

## Checklist

- [ ] I have made corresponding changes to the documentation (if
applicable)
- [ ] I have added tests that prove my fix is effective or that my
feature works
- [ ] I have addressed all Coderabbit comments on this PR


<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->

## ELI5

The PR restores automatic refreshing of the traces list in the
playground UI so users see the latest data without manually refreshing,
while also preventing annoying flickering when access to traces is
denied.

## Overview

This PR restores the auto-refresh functionality for the traces list page
in the playground UI. The traces data is now automatically polled every
10 seconds, keeping the list up-to-date with the latest trace
information.

## Changes

**New File:
`packages/playground-ui/src/domains/traces/hooks/use-traces.tsx`**

Implements the `useTraces` hook using React Query's `useInfiniteQuery`
with the following key features:
- Auto-polling configured to refetch traces every 10 seconds (10000ms)
- Intelligent error handling: when a 403 Forbidden error occurs, polling
temporarily pauses to prevent UI flickering
- Infinite query support with pagination (25 traces per page)
- Deduplication of traces by `traceId` across loaded pages
- Thread title merging for grouping display
- Intersection observer integration for lazy-loading additional pages as
user scrolls

**Changeset: `.changeset/slimy-badgers-remain.md`**

Documents the patch release for `@mastra/playground-ui` with the
restoration of auto-refresh functionality.

## Key Implementation Details

The refetch interval logic uses a dynamic function that checks the query
error state:
- If the error is a 403 Forbidden, refetching is disabled (`false`)
- Otherwise, refetching occurs every 10 seconds (`10000`ms)

This prevents continuous polling failures and UI updates when access is
restricted, improving user experience while maintaining data freshness
in normal operating conditions.

<!-- end of auto-generated comment: release notes by coderabbit.ai -->

Author: greglobinski

.changeset/slimy-badgers-remain.md

@@ -0,0 +1,5 @@
+---
+'@mastra/playground-ui': patch
+---
+
+Restored auto-refresh on the traces list page, polling every 10 seconds. Polling is paused while the request is forbidden (HTTP 403) to avoid flicker.

packages/playground-ui/src/domains/traces/hooks/use-traces.tsx

@@ -3,6 +3,7 @@ import { useMastraClient } from '@mastra/react';
 import { useInfiniteQuery, keepPreviousData } from '@tanstack/react-query';
 import { useEffect } from 'react';
 import { useInView } from '@/hooks/use-in-view';
+import { is403ForbiddenError } from '@/lib/query-utils';
 
 const fetchTracesFn = async ({
   client,
@@ -83,6 +84,8 @@ export const useTraces = ({ filters }: TracesFilters) => {
     select: selectUniqueTraces,
     placeholderData: keepPreviousData,
     retry: false,
+    // Disable polling on 403 to prevent flickering
+    refetchInterval: query => (is403ForbiddenError(query.state.error) ? false : 10000),
   });
 
   const { hasNextPage, isFetchingNextPage, fetchNextPage } = query;