Skip to content

feat: simplify DC form #3698

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Draft
wants to merge 7 commits into
base: main
Choose a base branch
from
Draft

feat: simplify DC form #3698

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
7 commits
Select commit Hold shift + click to select a range
97a4c99
feat: simplify DC form
andre-code May 16, 2025
d001a1a
split form when edit data connector in two options, one to edit mount…
andre-code May 20, 2025
89b6841
Split edit data connector form
andre-code May 21, 2025
943f20e
Merge branch 'main' into andrea/simplify-dc-form-third-screen
andre-code May 23, 2025
c2de131
Update DC form text and side panel content
andre-code May 23, 2025
8b8baa3
Fix e2e tests
andre-code May 23, 2025
670a2ef
Merge branch 'main' into andrea/simplify-dc-form-third-screen
andre-code May 23, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
4 changes: 2 additions & 2 deletions ...res/ProjectPageV2/ProjectPageContent/DataConnectors/ProjectConnectDataConnectorsModal.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -388,7 +388,7 @@ function ProjectLinkDataConnectorBodyAndFooter({
</ModalBody>

<ModalFooter className="border-top" data-cy="data-connector-edit-footer">
<Button color="outline-primary" onClick={toggle}>
<Button color="outline-primary" onClick={() => toggle()}>
<XLg className={cx("bi", "me-1")} />
Cancel
</Button>
Expand Down Expand Up @@ -541,7 +541,7 @@ function ProjectDoiDataConnectorBodyAndFooter({
</ModalBody>

<ModalFooter className="border-top" data-cy="data-connector-edit-footer">
<Button color="outline-primary" onClick={toggle}>
<Button color="outline-primary" onClick={() => toggle()}>
<XLg className={cx("bi", "me-1")} />
Cancel
</Button>
Expand Down
26 changes: 14 additions & 12 deletions client/src/features/dataConnectorsV2/components/DataConnectorActions.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -57,7 +57,6 @@ import {
import useDataConnectorPermissions from "../utils/useDataConnectorPermissions.hook";

import DataConnectorCredentialsModal from "./DataConnectorCredentialsModal";
import DataConnectorModal from "./DataConnectorModal";
import { getDataConnectorScope } from "./dataConnector.utils";

interface DataConnectorRemoveModalProps {
Expand Down Expand Up @@ -366,6 +365,7 @@ function DataConnectorActionsInner({
dataConnector,
dataConnectorLink,
toggleView,
toggleEdit,
}: DataConnectorActionsProps) {
const { id: dataConnectorId } = dataConnector;
const scope = getDataConnectorScope(dataConnector.namespace);
Expand Down Expand Up @@ -394,7 +394,6 @@ function DataConnectorActionsInner({
dataConnector.storage.sensitive_fields?.length > 0;
const [isCredentialsOpen, setCredentialsOpen] = useState(false);
const [isDeleteOpen, setIsDeleteOpen] = useState(false);
const [isEditOpen, setIsEditOpen] = useState(false);
const [isUnlinkOpen, setIsUnlinkOpen] = useState(false);
const onDelete = useCallback(() => {
toggleView();
Expand All @@ -410,9 +409,7 @@ function DataConnectorActionsInner({
const toggleDelete = useCallback(() => {
setIsDeleteOpen((open) => !open);
}, []);
const toggleEdit = useCallback(() => {
setIsEditOpen((open) => !open);
}, []);

const toggleUnlink = useCallback(() => {
setIsUnlinkOpen((open) => !open);
}, []);
Expand All @@ -422,14 +419,24 @@ function DataConnectorActionsInner({
? [
{
key: "data-connector-edit",
onClick: toggleEdit,
onClick: () => toggleEdit(3),
content: (
<>
<Pencil className={cx("bi", "me-1")} />
Edit
</>
),
},
{
key: "data-connector-edit-connection",
onClick: () => toggleEdit(2),
content: (
<>
<Pencil className={cx("bi", "me-1")} />
Edit Connection Information
</>
),
},
]
: []),
...(requiresCredentials
Expand Down Expand Up @@ -516,12 +523,6 @@ function DataConnectorActionsInner({
return (
<>
{actionsContent}
<DataConnectorModal
dataConnector={dataConnector}
isOpen={isEditOpen}
namespace={dataConnector.namespace}
toggle={toggleEdit}
/>
<DataConnectorCredentialsModal
dataConnector={dataConnector}
setOpen={setCredentialsOpen}
Expand Down Expand Up @@ -553,6 +554,7 @@ interface DataConnectorActionsProps {
dataConnector: DataConnectorRead;
dataConnectorLink?: DataConnectorToProjectLink;
toggleView: () => void;
toggleEdit: (initialStep: number) => void;
}

export default function DataConnectorActions(props: DataConnectorActionsProps) {
Expand Down
Loading
Loading