Debounce link Viz input blur (#32673)

* debounce link viz input blur

* make blur bouncier

e2e/test/scenarios/dashboard/dashboard.cy.spec.js

@@ -811,8 +811,21 @@ describeWithSnowplow("scenarios > dashboard", () => {
     cy.wait("@recentViews");
     cy.findByTestId("custom-edit-text-link").click().type("Orders");
 
+    popover().within(() => {
+      cy.findByText(/Loading/i).should("not.exist");
+      cy.findByText("Orders in a dashboard").click();
+    });
+
+    cy.findByTestId("entity-edit-display-link").findByText(
+      /orders in a dashboard/i,
+    );
+
     saveDashboard();
 
+    cy.findByTestId("entity-view-display-link").findByText(
+      /orders in a dashboard/i,
+    );
+
     expectGoodSnowplowEvent({
       event: "new_link_card_created",
     });

frontend/src/metabase/visualizations/visualizations/LinkViz/LinkViz.tsx

 import { useState, useEffect } from "react";
 import { usePrevious } from "react-use";
+import _ from "underscore";
 
 import Input from "metabase/core/components/Input";
 import SearchResults from "metabase/nav/components/SearchResults";
@@ -170,7 +171,8 @@ function LinkViz({
             placeholder={"https://example.com"}
             onChange={e => handleLinkChange(e.target.value)}
             onFocus={onFocusInput}
-            onBlur={onBlurInput}
+            // we need to debounce this or it may close the popover before the click event can fire
+            onBlur={_.debounce(onBlurInput, 100)}
             // the dashcard really wants to turn all mouse events into drag events
             onMouseDown={e => e.stopPropagation()}
           />