wip: show data connectors on namespace page

Author: ciyer

client/src/features/dataConnectorsV2/components/DataConnectorDisplay.tsx renamed to client/src/features/dataConnectorsV2/components/DataConnectorActions.tsx

@@ -22,7 +22,6 @@ import {
   Button,
   Col,
   DropdownItem,
-  ListGroupItem,
   Modal,
   ModalBody,
   ModalFooter,
@@ -31,11 +30,10 @@ import {
 } from "reactstrap";
 
 import { Loader } from "../../../components/Loader";
-import DataConnectorModal from "../../dataConnectorsV2/components/DataConnectorModal";
+// import DataConnectorModal from "./DataConnectorModal";
 import type { DataConnectorRead } from "../../projectsV2/api/data-connectors.api";
 import { useDeleteDataConnectorsByDataConnectorIdMutation } from "../../projectsV2/api/projectV2.enhanced-api";
 import DataConnectorCredentialsModal from "./DataConnectorCredentialsModal";
-import DataConnectorView from "./DataConnectorView";
 import { ButtonWithMenuV2 } from "../../../components/buttons/Button";
 
 interface DataSourceDeleteModalProps {
@@ -109,12 +107,10 @@ function DataSourceDeleteModal({
     </Modal>
   );
 }
-export function DataSourceActions({
+export default function DataConnectorActions({
   dataConnector,
-  projectId,
 }: {
   dataConnector: DataConnectorRead;
-  projectId: string;
 }) {
   const [isCredentialsOpen, setCredentialsOpen] = useState(false);
   const [isDeleteOpen, setIsDeleteOpen] = useState(false);
@@ -172,70 +168,13 @@ export function DataSourceActions({
         isOpen={isDeleteOpen}
         toggleModal={toggleDelete}
       />
+      {/* TODO: integrate DataConnectorModal
       <DataConnectorModal
         currentStorage={dataConnector}
         isOpen={isEditOpen}
         toggle={toggleEdit}
         projectId={projectId}
-      />
-    </>
-  );
-}
-interface DataConnectorDisplayProps {
-  dataConnector: DataConnectorRead;
-  projectId: string;
-}
-
-export function DataConnectorDisplay({
-  dataConnector,
-  projectId,
-}: DataConnectorDisplayProps) {
-  const storageSensitive = dataConnector.storage;
-  const [toggleView, setToggleView] = useState(false);
-  const toggleDetails = useCallback(() => {
-    setToggleView((open: boolean) => !open);
-  }, []);
-
-  const storageType = storageSensitive?.storage_type ? (
-    <>
-      {" "}
-      <span className="fst-italic" data-cy="data-storage-type">
-        (type: {storageSensitive.storage_type})
-      </span>
-    </>
-  ) : null;
-
-  const storageName = (
-    <span className="fw-bold" data-cy="data-storage-name">
-      {storageSensitive.name}
-    </span>
-  );
-
-  return (
-    <>
-      <ListGroupItem
-        action
-        className={cx("cursor-pointer", "link-primary", "text-body")}
-        onClick={toggleDetails}
-      >
-        <Row className={cx("align-items-center", "g-2")}>
-          <Col>
-            <span>
-              {storageName}
-              {storageType}
-            </span>
-          </Col>
-          <Col xs={12} sm="auto" className="ms-auto">
-            <DataSourceActions storage={storage} projectId={projectId} />
-          </Col>
-        </Row>
-      </ListGroupItem>
-      <DataConnectorView
-        dataConnector={dataConnector}
-        setToggleView={toggleDetails}
-        toggleView={toggleView}
-        projectId={projectId}
-      />
+      /> */}
     </>
   );
 }