fix consent toast first hover (supabase#28660)

* fix consent toast first hover * more delay * delay consent toast in studio

Author: fsansalvadore

apps/studio/pages/_app.tsx

@@ -134,14 +134,16 @@ function CustomApp({ Component, pageProps }: AppPropsWithLayout) {
 
  const hasAcknowledgedConsent = localStorage.getItem(LOCAL_STORAGE_KEYS.TELEMETRY_CONSENT)
  if (IS_PLATFORM && hasAcknowledgedConsent === null) {
- consentToastId.current = toast(
- <ConsentToast onAccept={onAcceptConsent} onOptOut={onOptOut} />,
- {
- id: 'consent-toast',
- position: 'bottom-right',
- duration: Infinity,
- }
- )
+ setTimeout(() => {
+ consentToastId.current = toast(
+ <ConsentToast onAccept={onAcceptConsent} onOptOut={onOptOut} />,
+ {
+ id: 'consent-toast',
+ position: 'bottom-right',
+ duration: Infinity,
+ }
+ )
+ }, 300)
  }
  }
  // eslint-disable-next-line react-hooks/exhaustive-deps

packages/ui-patterns/ConsentToast/index.tsx

@@ -95,19 +95,21 @@ export const useConsent = () => {
 
  useEffect(() => {
  if (isClient && consentValue === null) {
- consentToastId.current = toast(
- <ConsentToast
- onAccept={() => handleConsent('true')}
- onOptOut={() => handleConsent('false')}
- />,
- {
- id: 'consent-toast',
- position: 'bottom-right',
- duration: Infinity,
- className:
- '!w-screen !-m-4 !border-t !rounded-none !max-w-none !bg-overlay !text sm:!m-0 sm:!rounded-lg sm:!w-auto sm:!max-w-[400px] sm:border',
- }
- )
+ setTimeout(() => {
+ consentToastId.current = toast(
+ <ConsentToast
+ onAccept={() => handleConsent('true')}
+ onOptOut={() => handleConsent('false')}
+ />,
+ {
+ id: 'consent-toast',
+ position: 'bottom-right',
+ duration: Infinity,
+ className:
+ '!w-screen !-m-4 !border-t !rounded-none !max-w-none !bg-overlay !text sm:!m-0 sm:!rounded-lg sm:!w-auto sm:!max-w-[400px] sm:border',
+ }
+ )
+ }, 300)
  }
  }, [consentValue])