diff --git a/apps/web/src/components/sidebar/SidebarProviderUpdatePill.tsx b/apps/web/src/components/sidebar/SidebarProviderUpdatePill.tsx
index d584e04656f2..53ff1d77c376 100644
--- a/apps/web/src/components/sidebar/SidebarProviderUpdatePill.tsx
+++ b/apps/web/src/components/sidebar/SidebarProviderUpdatePill.tsx
@@ -3,7 +3,7 @@ import { useNavigate } from "@tanstack/react-router";
 import { useAtomValue } from "@effect/atom-react";
 import type { ServerProvider } from "@t3tools/contracts";
 import { CircleCheckIcon, DownloadIcon, TriangleAlertIcon, XIcon } from "lucide-react";
-import { useCallback, useEffect, useState, type CSSProperties } from "react";
+import { useEffect, useEffectEvent, useState, type CSSProperties } from "react";
 
 import { primaryServerProvidersAtom } from "../../state/server";
 import {
@@ -56,15 +56,13 @@ export function SidebarProviderUpdatePill() {
     dismissedKeys,
   });
 
-  useEffect(() => {
-    if (visibleAfterIso === undefined && effectiveVisibleAfterIso !== undefined) {
-      setVisibleAfterIso(effectiveVisibleAfterIso);
-    }
-  }, [effectiveVisibleAfterIso, visibleAfterIso]);
+  if (visibleAfterIso === undefined && effectiveVisibleAfterIso !== undefined) {
+    setVisibleAfterIso(effectiveVisibleAfterIso);
+  }
 
-  const openProviderSettings = useCallback(() => {
+  const openProviderSettings = () => {
     void navigate({ to: "/settings/providers" });
-  }, [navigate]);
+  };
   const displayedView = renderedView ?? view;
   const dismissAfterVisibleMs = displayedView?.dismissAfterVisibleMs;
   const viewKey = displayedView?.key ?? null;
@@ -73,37 +71,32 @@ export function SidebarProviderUpdatePill() {
     displayedView?.tone !== "loading" &&
     exitingKey !== viewKey;
 
-  const startExit = useCallback(
-    (key: string, nextView: ProviderUpdateSidebarPillView | null, dismissKey?: string) => {
-      if (exitingKey === key) {
-        return;
-      }
-      setPendingView(nextView);
-      setExitingKey(key);
-      setDismissAfterExitKey(dismissKey ?? null);
-    },
-    [exitingKey],
-  );
-
-  useEffect(() => {
-    if (exitingKey !== null) {
+  const startExit = (
+    key: string,
+    nextView: ProviderUpdateSidebarPillView | null,
+    dismissKey?: string,
+  ) => {
+    if (exitingKey === key) {
       return;
     }
+    setPendingView(nextView);
+    setExitingKey(key);
+    setDismissAfterExitKey(dismissKey ?? null);
+  };
+
+  if (exitingKey === null) {
     if (!renderedView) {
       if (view) {
         setRenderedView(view);
       }
-      return;
-    }
-    if (!view) {
+    } else if (!view) {
       startExit(renderedView.key, null);
-      return;
-    }
-    if (view.key !== renderedView.key) {
+    } else if (view.key !== renderedView.key) {
       startExit(renderedView.key, view);
-      return;
     }
-  }, [exitingKey, renderedView, startExit, view]);
+  }
+
+  const exitAfterVisible = useEffectEvent((key: string) => startExit(key, null, key));
 
   useEffect(() => {
     if (!dismissAfterVisibleMs || !viewKey) {
@@ -113,11 +106,11 @@ export function SidebarProviderUpdatePill() {
       return;
     }
     const timeoutId = window.setTimeout(() => {
-      startExit(viewKey, null, viewKey);
+      exitAfterVisible(viewKey);
     }, dismissAfterVisibleMs);
 
     return () => window.clearTimeout(timeoutId);
-  }, [dismissAfterVisibleMs, exitingKey, startExit, viewKey]);
+  }, [dismissAfterVisibleMs, exitingKey, viewKey]);
 
   if (!displayedView) {
     return null;