Kyle Pope
a1b2067faa
Sonner's toaster container has z-index: 999999999 with no pointer-events: none, creating an invisible overlay that intercepts clicks. Set pointer-events: none on the container and pointer-events: auto on individual toasts so buttons underneath remain clickable while toasts stay interactive. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
34 lines
878 B
TypeScript
34 lines
878 B
TypeScript
import React from 'react';
|
|
import ReactDOM from 'react-dom/client';
|
|
import { BrowserRouter } from 'react-router-dom';
|
|
import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
|
|
import { Toaster } from 'sonner';
|
|
import App from './App';
|
|
import './index.css';
|
|
|
|
const queryClient = new QueryClient({
|
|
defaultOptions: {
|
|
queries: {
|
|
refetchOnWindowFocus: false,
|
|
retry: 1,
|
|
staleTime: 5 * 60 * 1000,
|
|
},
|
|
},
|
|
});
|
|
|
|
ReactDOM.createRoot(document.getElementById('root')!).render(
|
|
<React.StrictMode>
|
|
<QueryClientProvider client={queryClient}>
|
|
<BrowserRouter>
|
|
<App />
|
|
<Toaster
|
|
position="top-right"
|
|
theme="dark"
|
|
style={{ pointerEvents: 'none' }}
|
|
toastOptions={{ style: { pointerEvents: 'auto' } }}
|
|
/>
|
|
</BrowserRouter>
|
|
</QueryClientProvider>
|
|
</React.StrictMode>
|
|
);
|