Fix settings link in the connection row (#9941)

* Fix settings link in the connection row * Fix import
airbytehq · Feb 2, 2022 · edfe96b · edfe96b
1 parent 7428f7c
commit edfe96b
Showing 1 changed file with 6 additions and 7 deletions.
diff --git a/airbyte-webapp/src/components/EntityTable/components/ConnectionSettingsCell.tsx b/airbyte-webapp/src/components/EntityTable/components/ConnectionSettingsCell.tsx
@@ -3,9 +3,9 @@ import styled from "styled-components";
 import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
 import { faCog } from "@fortawesome/free-solid-svg-icons";
 
-import useRouter from "hooks/useRouter";
 import { RoutePaths } from "pages/routes";
 import { useCurrentWorkspace } from "hooks/services/useWorkspace";
+import { Link } from "components";
 
 type IProps = {
   id: string;
@@ -19,6 +19,7 @@ const Content = styled.div`
 
 const Icon = styled(FontAwesomeIcon)`
   display: none;
+  color: ${({ theme }) => theme.greyColor60};
 
   tr:hover & {
     display: block;
@@ -29,20 +30,18 @@ const Icon = styled(FontAwesomeIcon)`
 `;
 
 const ConnectorCell: React.FC<IProps> = ({ id }) => {
-  const { push } = useRouter();
   const { workspaceId } = useCurrentWorkspace();
 
   const openSettings = (event: React.MouseEvent) => {
     event.stopPropagation();
-    // TODO: Replace with link instead of push
-    push(
-      `/${workspaceId}/${RoutePaths.Connections}/${id}/${RoutePaths.Settings}`
-    );
   };
 
+  const settingPath = `/${RoutePaths.Workspaces}/${workspaceId}/${RoutePaths.Connections}/${id}/${RoutePaths.Settings}`;
   return (
     <Content onClick={openSettings}>
-      <Icon icon={faCog} />
+      <Link to={settingPath}>
+        <Icon icon={faCog} />
+      </Link>
     </Content>
   );
 };