Stop marking direct connections in the connection list and details

docs/features/connections.md

@@ -19,7 +19,7 @@ The next three settings are grouped under an **Advanced options** section that y
 
 - **Fetch Timeout:** Check **Enable Fetch Timeout** to reveal **Fetch Timeout (ms)**, then specify the timeout for the fetch request.
 - **Neighbor Expansion Limit:** Check **Override Default Neighbor Expansion Limit** to reveal this field, then specify the default limit for neighbor expansion. This will override the app setting for neighbor expansion.
-- **Connect directly from the browser (deprecated):** Check this box to have your browser send requests to the database itself instead of through the Graph Explorer server. The database must allow cross-origin requests (CORS) from the Graph Explorer page, and IAM authentication isn't available, so the IAM fields are hidden. When Graph Explorer is served over HTTPS, the browser usually blocks an `http://` Database URL unless it points at a loopback host such as `localhost`; see [Insecure Database URL](../guides/troubleshooting.md#insecure-database-url). A direct connection shows "Direct" in the connection list and "Direct from browser (deprecated)" in its details.
+- **Connect directly from the browser (deprecated):** Check this box to have your browser send requests to the database itself instead of through the Graph Explorer server. The database must allow cross-origin requests (CORS) from the Graph Explorer page, and IAM authentication isn't available, so the IAM fields are hidden. When Graph Explorer is served over HTTPS, the browser usually blocks an `http://` Database URL unless it points at a loopback host such as `localhost`; see [Insecure Database URL](../guides/troubleshooting.md#insecure-database-url).
 
 > [!WARNING]
 >

packages/graph-explorer/src/modules/AvailableConnections/ConnectionRow.test.tsx

@@ -146,29 +146,20 @@ describe("ConnectionRow", () => {
     );
   }
 
-  test("shows Direct ahead of the URL for a direct connection", () => {
-    renderRow({
-      ...createRandomSavedConnection(),
-      connection: {
-        graphDbUrl: "https://my-neptune:8182",
-        proxyConnection: false,
-      },
-    });
-
-    expect(
-      screen.getByText(/ • Direct • https:\/\/my-neptune:8182$/),
-    ).toBeInTheDocument();
-  });
-
-  test("does not mark a proxy connection as direct", () => {
-    renderRow({
-      ...createRandomSavedConnection(),
-      connection: { graphDbUrl: "https://my-neptune:8182" },
-    });
-
-    expect(
-      screen.getByText(/^PG-Gremlin • https:\/\/my-neptune:8182$/),
-    ).toBeInTheDocument();
-    expect(screen.queryByText(/Direct/)).toBeNull();
-  });
+  test.each([
+    { name: "direct", route: { proxyConnection: false } },
+    { name: "proxy", route: {} },
+  ])(
+    "shows the language and URL without a route mark on a $name connection",
+    ({ route }) => {
+      renderRow({
+        ...createRandomSavedConnection(),
+        connection: { graphDbUrl: "https://my-neptune:8182", ...route },
+      });
+
+      expect(
+        screen.getByText(/^PG-Gremlin • https:\/\/my-neptune:8182$/),
+      ).toBeInTheDocument();
+    },
+  );
 });

packages/graph-explorer/src/modules/AvailableConnections/ConnectionRow.tsx

@@ -3,9 +3,8 @@ import { DatabaseIcon } from "lucide-react";
 import type { SavedConnection } from "@/connections";
 
 import { ListRowContent, ListRowSubtitle, ListRowTitle } from "@/components";
-import { isDirectConnection, useActivateConnection } from "@/connections";
+import { useActivateConnection } from "@/connections";
 import { useTranslations } from "@/hooks";
-import { LABELS } from "@/utils/constants";
 
 function ConnectionRow({
   connection,
@@ -21,7 +20,6 @@ function ConnectionRow({
   const setActiveConfig = () => activateConnection(connection.id);
 
   const dbUrl = connection.connection?.graphDbUrl || null;
-  const isDirect = isDirectConnection(connection.connection);
 
   const graphType = t(
     "query-language",
@@ -40,7 +38,6 @@ function ConnectionRow({
         </ListRowTitle>
         <ListRowSubtitle>
           {graphType}
-          {isDirect ? <> &bull; {LABELS.DIRECT_CONNECTION_SHORT}</> : null}
           {dbUrl ? <> &bull; {dbUrl}</> : null}
         </ListRowSubtitle>
       </ListRowContent>

packages/graph-explorer/src/modules/ConnectionDetail/ConnectionDetail.test.tsx

@@ -1,8 +1,7 @@
 // @vitest-environment happy-dom
 import type { ConnectionConfig } from "@shared/types";
 
-import { render, screen, within } from "@testing-library/react";
-import userEvent from "@testing-library/user-event";
+import { render, screen } from "@testing-library/react";
 import { describe, expect, test } from "vitest";
 
 import { TooltipProvider } from "@/components";
@@ -36,23 +35,11 @@ function renderDetail(connection: ConnectionConfig) {
 }
 
 describe("ConnectionDetail", () => {
-  test("marks a direct connection as deprecated and explains how to switch", async () => {
-    const user = userEvent.setup();
-    renderDetail({
-      graphDbUrl: "https://my-neptune:8182",
-      proxyConnection: false,
-    });
-
-    const marker = screen.getByText("Direct from browser (deprecated)");
-    await user.hover(within(marker).getByRole("button"));
-
-    expect(await screen.findByRole("tooltip")).toHaveTextContent(
-      "Requests for this connection go from your browser to the database instead of through the Graph Explorer server. This option will be removed in a future release. To switch, edit the connection and uncheck Connect directly from the browser (deprecated) under Advanced options.",
-    );
-  });
-
-  test("does not mark a proxy connection as direct", () => {
-    renderDetail({ graphDbUrl: "https://my-neptune:8182" });
+  test.each([
+    { name: "direct", route: { proxyConnection: false } },
+    { name: "proxy", route: {} },
+  ])("shows no route mark on a $name connection", ({ route }) => {
+    renderDetail({ graphDbUrl: "https://my-neptune:8182", ...route });
 
     // Proves the query below fails on absence rather than an unrendered panel
     expect(screen.getByText("https://my-neptune:8182")).toBeInTheDocument();

packages/graph-explorer/src/modules/ConnectionDetail/ConnectionDetail.tsx

@@ -18,7 +18,6 @@ import {
   EdgeIcon,
   EditIcon,
   GraphIcon,
-  InfoTooltip,
   NotInProduction,
   Panel,
   PanelContent,
@@ -44,7 +43,7 @@ import {
   DialogHeader,
   DialogTitle,
 } from "@/components/Dialog";
-import { isDirectConnection, useDeleteActiveConnection } from "@/connections";
+import { useDeleteActiveConnection } from "@/connections";
 import {
   activeSchemaSelector,
   type ConfigurationContextProps,
@@ -89,7 +88,6 @@ function ConnectionDetail({ config }: ConnectionDetailProps) {
   const deleteActiveConfig = useDeleteActiveConnection();
 
   const dbUrl = config.connection?.graphDbUrl || LABELS.MISSING_VALUE;
-  const isDirect = isDirectConnection(config.connection);
 
   const connectionName = config.displayLabel || config.id;
 
@@ -149,18 +147,6 @@ function ConnectionDetail({ config }: ConnectionDetailProps) {
               <InfoItemValue className="line-clamp-2 break-all" title={dbUrl}>
                 {dbUrl}
               </InfoItemValue>
-              {isDirect && (
-                <InfoItemLabel className="flex items-center gap-1">
-                  {LABELS.DIRECT_CONNECTION}
-                  <InfoTooltip>
-                    Requests for this connection go from your browser to the
-                    database instead of through the Graph Explorer server. This
-                    option will be removed in a future release. To switch, edit
-                    the connection and uncheck Connect directly from the browser
-                    (deprecated) under Advanced options.
-                  </InfoTooltip>
-                </InfoItemLabel>
-              )}
             </InfoItemContent>
           </InfoItem>
         </InfoBar>

packages/graph-explorer/src/utils/constants.ts

@@ -39,10 +39,6 @@ export const LABELS = {
   MISSING_TYPE: `${ASCII.LAQUO}No Type${ASCII.RAQUO}`,
   /** Shown when a value is missing */
   MISSING_VALUE: `${ASCII.LAQUO}No Value${ASCII.RAQUO}`,
-  /** Marks a deprecated direct connection in its details */
-  DIRECT_CONNECTION: "Direct from browser (deprecated)",
-  /** Marks a deprecated direct connection in the connection list */
-  DIRECT_CONNECTION_SHORT: "Direct",
   /** Shown when a value is empty (like empty string) */
   EMPTY_VALUE: `${ASCII.LAQUO}Empty Value${ASCII.RAQUO}`,