Skip to content

Commit 7af33c1

Browse files
ciyerciyer
committed
work
1 parent 575908f commit 7af33c1

File tree

2 files changed

+109
-74
lines changed

2 files changed

+109
-74
lines changed

‎client/src/features/dataConnectorsV2/components/DataConnectorCredentialsModal.tsx‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -28,7 +28,7 @@ import {
2828
} from "../../projectsV2/api/projectV2.enhanced-api";
2929
import type { DataConnectorRead } from "../../projectsV2/api/data-connectors.api";
3030
import type { SessionStartCloudStorageConfiguration } from "../../sessionsV2/startSessionOptionsV2.types";
31-
import CloudStorageSecretsModal from "../../sessionsV2/DataConnectorSecretsModal";
31+
import DataConnectorSecretsModal from "../../sessionsV2/DataConnectorSecretsModal";
3232

3333
import useDataConnectorConfiguration from "./useDataConnectorConfiguration.hook";
3434
import { Loader } from "../../../components/Loader";
@@ -188,7 +188,7 @@ export default function DataSourceCredentialsModal({
188188
}
189189

190190
return (
191-
<CloudStorageSecretsModal
191+
<DataConnectorSecretsModal
192192
dataConnectorConfigs={dataConnectorConfigs}
193193
context="storage"
194194
isOpen={isOpen}

‎client/src/features/dataConnectorsV2/components/DataConnectorModal.tsx‎

Lines changed: 107 additions & 72 deletions
Original file line numberDiff line numberDiff line change
@@ -24,15 +24,6 @@ import { ArrowCounterclockwise } from "react-bootstrap-icons";
2424
import { Button, Modal, ModalBody, ModalFooter, ModalHeader } from "reactstrap";
2525

2626
import { RtkOrNotebooksError } from "../../../components/errors/RtkErrorAlert";
27-
import { usePostStoragesV2ByStorageIdSecretsMutation } from "../../projectsV2/api/projectV2.enhanced-api";
28-
import {
29-
CloudStorageGetV2Read,
30-
CloudStoragePatch,
31-
PostStoragesV2ApiArg,
32-
RCloneConfig,
33-
usePatchStoragesV2ByStorageIdMutation,
34-
usePostStoragesV2Mutation,
35-
} from "../../projectsV2/api/storagesV2.api";
3627

3728
import AddStorageBreadcrumbNavbar from "../../project/components/cloudStorage/AddStorageBreadcrumbNavbar";
3829
import {
@@ -62,28 +53,63 @@ import {
6253
} from "../../project/components/cloudStorage/cloudStorageModalComponents";
6354
import {
6455
findSensitive,
65-
getCurrentStorageDetails,
6656
getSchemaProviders,
6757
hasProviderShortlist,
6858
} from "../../project/utils/projectCloudStorage.utils";
6959

60+
import {
61+
usePatchDataConnectorsByDataConnectorIdMutation,
62+
usePostDataConnectorsMutation,
63+
usePostStoragesV2ByStorageIdSecretsMutation,
64+
} from "../../projectsV2/api/projectV2.enhanced-api";
65+
import { CloudStoragePatch } from "../../projectsV2/api/storagesV2.api";
66+
import type {
67+
DataConnectorPatch,
68+
DataConnectorPost,
69+
DataConnectorRead,
70+
} from "../../projectsV2/api/data-connectors.api";
71+
7072
import styles from "../../project/components/cloudStorage/CloudStorage.module.scss";
7173

7274
import DataConnectorModalBody from "./DataConnectorModalBody";
7375

76+
function dataConnectorStorageDetails(
77+
dataConnector: DataConnectorRead | null
78+
): CloudStorageDetails {
79+
if (!dataConnector) {
80+
return EMPTY_CLOUD_STORAGE_DETAILS;
81+
}
82+
const configurationOptions = dataConnector.storage.configuration
83+
? dataConnector.storage.configuration
84+
: {};
85+
const { type, provider, ...options } = configurationOptions; // eslint-disable-line @typescript-eslint/no-unused-vars
86+
const storageDetails: CloudStorageDetails = {
87+
storageId: dataConnector.id,
88+
schema: dataConnector.storage.configuration.type as string,
89+
name: dataConnector.name,
90+
mountPoint: dataConnector.storage.target_path,
91+
sourcePath: dataConnector.storage.source_path,
92+
readOnly: dataConnector.storage.readonly,
93+
provider: dataConnector.storage.configuration.provider
94+
? (dataConnector.storage.configuration.provider as string)
95+
: undefined,
96+
options,
97+
};
98+
99+
return storageDetails;
100+
}
101+
74102
interface DataConnectorModalProps {
75-
currentStorage?: CloudStorageGetV2Read | null;
103+
dataConnector?: DataConnectorRead | null;
76104
isOpen: boolean;
77105
toggle: () => void;
78-
projectId: string;
79106
}
80107
export default function DataConnectorModal({
81-
currentStorage = null,
108+
dataConnector = null,
82109
isOpen,
83110
toggle: originalToggle,
84-
projectId,
85111
}: DataConnectorModalProps) {
86-
const storageId = currentStorage?.storage.storage_id ?? null;
112+
const dataConnectorId = dataConnector?.id ?? null;
87113
// Fetch available schema when users open the modal
88114
const {
89115
data: schema,
@@ -94,11 +120,9 @@ export default function DataConnectorModal({
94120
// Reset state on props change
95121
useEffect(() => {
96122
const cloudStorageDetails: CloudStorageDetails =
97-
currentStorage != null
98-
? getCurrentStorageDetails(currentStorage)
99-
: EMPTY_CLOUD_STORAGE_DETAILS;
123+
dataConnectorStorageDetails(dataConnector);
100124
const cloudStorageState: AddCloudStorageState =
101-
currentStorage != null
125+
dataConnector != null
102126
? {
103127
...EMPTY_CLOUD_STORAGE_STATE,
104128
step: 2,
@@ -107,7 +131,7 @@ export default function DataConnectorModal({
107131
: EMPTY_CLOUD_STORAGE_STATE;
108132
setStorageDetails(cloudStorageDetails);
109133
setState(cloudStorageState);
110-
}, [currentStorage]);
134+
}, [dataConnector]);
111135

112136
const [success, setSuccess] = useState(false);
113137
const [credentialSaveStatus, setCredentialSaveStatus] =
@@ -167,19 +191,18 @@ export default function DataConnectorModal({
167191
}, [redraw]);
168192

169193
// Mutations
170-
const [addCloudStorageForProjectV2, addResultV2] =
171-
usePostStoragesV2Mutation();
172-
const [modifyCloudStorageV2ForProject, modifyResultV2] =
173-
usePatchStoragesV2ByStorageIdMutation();
194+
const [createDataConnector, createResult] = usePostDataConnectorsMutation();
195+
const [updateDataConnector, updateResult] =
196+
usePatchDataConnectorsByDataConnectorIdMutation();
174197
const [saveCredentials, saveCredentialsResult] =
175198
usePostStoragesV2ByStorageIdSecretsMutation();
176199
const [validateCloudStorageConnection, validationResult] =
177200
useTestCloudStorageConnectionMutation();
178201

179202
const reset = useCallback(() => {
180-
const resetStatus = getCurrentStorageDetails(currentStorage);
203+
const resetStatus = dataConnectorStorageDetails(dataConnector);
181204
setState((prevState) =>
182-
currentStorage != null
205+
dataConnector != null
183206
? {
184207
...EMPTY_CLOUD_STORAGE_STATE,
185208
step: prevState.step,
@@ -189,14 +212,14 @@ export default function DataConnectorModal({
189212
...EMPTY_CLOUD_STORAGE_STATE,
190213
}
191214
);
192-
addResultV2.reset();
215+
createResult.reset();
193216
validationResult.reset();
194217
setStorageDetails(resetStatus);
195218
setSuccess(false);
196219
setCredentialSaveStatus("none");
197220
setValidationSucceeded(false);
198221
setRedraw(true); // This forces re-loading the useForm fields
199-
}, [addResultV2, currentStorage, validationResult]);
222+
}, [createResult, dataConnector, validationResult]);
200223

201224
const setStorageDetailsSafe = useCallback(
202225
(newStorageDetails: Partial<CloudStorageDetails>) => {
@@ -248,12 +271,13 @@ export default function DataConnectorModal({
248271
}, [storageDetails, validateCloudStorageConnection]);
249272

250273
const addOrEditStorage = useCallback(() => {
274+
// TODO Convert this to a data-connector-native structure
251275
const storageParameters:
252276
| AddCloudStorageForProjectParams
253277
| CloudStoragePatch = {
254278
name: storageDetails.name as string,
279+
project_id: "",
255280
readonly: storageDetails.readOnly ?? true,
256-
project_id: `${projectId}`,
257281
source_path: storageDetails.sourcePath ?? "/",
258282
target_path: storageDetails.mountPoint as string,
259283
configuration: { type: storageDetails.schema },
@@ -274,8 +298,8 @@ export default function DataConnectorModal({
274298
const allOptions = storageDetails.options as CloudStorageDetailsOptions;
275299
const sensitiveFields = schema
276300
? findSensitive(schema.find((s) => s.prefix === storageDetails.schema))
277-
: currentStorage?.sensitive_fields
278-
? currentStorage.sensitive_fields.map((field) => field.name)
301+
: dataConnector?.storage?.sensitive_fields
302+
? dataConnector.storage.sensitive_fields.map((field) => field.name)
279303
: [];
280304
const validOptions = Object.keys(
281305
storageDetails.options
@@ -296,41 +320,52 @@ export default function DataConnectorModal({
296320
}
297321

298322
// We manually set success only when we get an ID back. That's just to show a success message
299-
if (storageId) {
300-
const cloudStoragePatch: CloudStoragePatch = {
301-
project_id: projectId,
323+
if (dataConnector && dataConnectorId) {
324+
const dataConnectorPatch: DataConnectorPatch = {
302325
name: storageParameters.name,
303-
configuration: storageParameters.configuration as RCloneConfig,
304-
source_path: storageParameters.source_path,
305-
target_path: storageParameters.target_path,
306-
readonly: storageParameters.readonly,
326+
// TODO ad namespace, slug, visibility, description, keywords
327+
storage: {
328+
...storageParameters.configuration,
329+
source_path: storageParameters.source_path,
330+
target_path: storageParameters.target_path,
331+
readonly: storageParameters.readonly,
332+
},
307333
};
308-
modifyCloudStorageV2ForProject({
309-
storageId: storageId,
310-
cloudStoragePatch,
334+
updateDataConnector({
335+
dataConnectorId,
336+
dataConnectorPatch,
337+
"If-Match": dataConnector.etag,
311338
}).then((result) => {
312-
if ("data" in result && result.data.storage.storage_id) {
339+
if ("data" in result && result.data.id) {
313340
setSuccess(true);
314341
}
315342
});
316343
} else {
317-
const parameterV2 = {
318-
body: storageParameters,
319-
} as PostStoragesV2ApiArg;
320-
addCloudStorageForProjectV2(parameterV2).then((result) => {
321-
if ("data" in result && result.data.storage.storage_id) {
344+
const dataConnectorPost = {
345+
name: storageParameters.name,
346+
// TODO ad namespace, slug, visibility, description, keywords
347+
storage: {
348+
...storageParameters.configuration,
349+
source_path: storageParameters.source_path,
350+
target_path: storageParameters.target_path,
351+
readonly: storageParameters.readonly,
352+
},
353+
} as DataConnectorPost;
354+
createDataConnector({
355+
dataConnectorPost,
356+
}).then((result) => {
357+
if ("data" in result && result.data.id) {
322358
setSuccess(true);
323359
}
324360
});
325361
}
326362
}, [
327-
addCloudStorageForProjectV2,
328-
currentStorage,
329-
modifyCloudStorageV2ForProject,
330-
projectId,
363+
createDataConnector,
364+
dataConnector,
365+
dataConnectorId,
366+
updateDataConnector,
331367
schema,
332368
storageDetails,
333-
storageId,
334369
]);
335370

336371
const toggle = useCallback(() => {
@@ -341,10 +376,10 @@ export default function DataConnectorModal({
341376
setSuccess(false);
342377
reset();
343378
} else {
344-
addResultV2.reset();
379+
createResult.reset();
345380
validationResult.reset();
346381
}
347-
}, [addResultV2, originalToggle, reset, success, validationResult]);
382+
}, [createResult, originalToggle, reset, success, validationResult]);
348383

349384
// Handle unmount
350385
useEffect(() => {
@@ -361,8 +396,8 @@ export default function DataConnectorModal({
361396
);
362397

363398
useEffect(() => {
364-
const storageId = addResultV2.data?.storage?.storage_id;
365-
if (storageId == null) return;
399+
const dataConnectorId = createResult.data?.id;
400+
if (dataConnectorId == null) return;
366401
const shouldSaveCredentials = shouldSaveDataConnectorCredentials(
367402
storageDetails.options,
368403
state.saveCredentials,
@@ -387,11 +422,11 @@ export default function DataConnectorModal({
387422
value: "" + secret.value,
388423
}));
389424
saveCredentials({
390-
storageId,
425+
storageId: dataConnectorId,
391426
cloudStorageSecretPostList,
392427
});
393428
}, [
394-
addResultV2.data?.storage?.storage_id,
429+
createResult.data?.id,
395430
saveCredentials,
396431
state.saveCredentials,
397432
schema,
@@ -406,7 +441,7 @@ export default function DataConnectorModal({
406441
return;
407442
}
408443
if (
409-
addResultV2.data?.storage?.storage_id == null ||
444+
createResult.data?.id == null ||
410445
saveCredentialsResult.isUninitialized
411446
) {
412447
setCredentialSaveStatus("none");
@@ -425,19 +460,19 @@ export default function DataConnectorModal({
425460
return;
426461
}
427462
setCredentialSaveStatus("none");
428-
}, [addResultV2, saveCredentialsResult, validationSucceeded]);
463+
}, [createResult, saveCredentialsResult, validationSucceeded]);
429464

430465
// Visual elements
431466
const disableContinueButton =
432467
state.step === 1 &&
433468
(!storageDetails.schema ||
434469
(schemaRequiresProvider && !storageDetails.provider));
435470

436-
const isAddResultLoading = addResultV2.isLoading;
437-
const isModifyResultLoading = modifyResultV2.isLoading;
438-
const addResultError = addResultV2.error;
439-
const modifyResultError = modifyResultV2.error;
440-
const addResultStorageName = addResultV2?.data?.storage?.name;
471+
const isAddResultLoading = createResult.isLoading;
472+
const isModifyResultLoading = updateResult.isLoading;
473+
const addResultError = createResult.error;
474+
const modifyResultError = updateResult.error;
475+
const addResultStorageName = createResult?.data?.name;
441476

442477
const disableAddButton =
443478
isAddResultLoading ||
@@ -448,7 +483,7 @@ export default function DataConnectorModal({
448483
(hasProviderShortlist(storageDetails.schema) && !storageDetails.provider);
449484
const addButtonDisableReason = isAddResultLoading
450485
? "Please wait, the storage is being added"
451-
: modifyResultV2.isLoading
486+
: updateResult.isLoading
452487
? "Please wait, the storage is being modified"
453488
: !storageDetails.name
454489
? "Please provide a name"
@@ -460,8 +495,8 @@ export default function DataConnectorModal({
460495
const isResultLoading = isAddResultLoading || isModifyResultLoading;
461496

462497
const storageSecrets =
463-
currentStorage != null && "secrets" in currentStorage
464-
? currentStorage.secrets ?? []
498+
dataConnector != null && "secrets" in dataConnector
499+
? dataConnector.secrets ?? []
465500
: [];
466501
const hasStoredCredentialsInConfig = storageSecrets.length > 0;
467502

@@ -472,15 +507,15 @@ export default function DataConnectorModal({
472507
className={styles.modal}
473508
data-cy="cloud-storage-edit-modal"
474509
fullscreen="lg"
475-
id={currentStorage?.storage.storage_id ?? "new-cloud-storage"}
510+
id={dataConnector?.id ?? "new-cloud-storage"}
476511
isOpen={isOpen}
477512
scrollable
478513
size="lg"
479514
unmountOnClose={false}
480515
toggle={toggle}
481516
>
482517
<ModalHeader toggle={toggle} data-cy="cloud-storage-edit-header">
483-
<AddCloudStorageHeaderContent isV2={true} storageId={storageId} />
518+
<AddCloudStorageHeaderContent isV2={true} storageId={dataConnectorId} />
484519
</ModalHeader>
485520

486521
<ModalBody data-cy="cloud-storage-edit-body">
@@ -497,7 +532,7 @@ export default function DataConnectorModal({
497532
state={state}
498533
storageDetails={storageDetails}
499534
storageSecrets={storageSecrets}
500-
storageId={storageId}
535+
storageId={dataConnectorId}
501536
success={success}
502537
validationSucceeded={validationSucceeded}
503538
/>
@@ -549,7 +584,7 @@ export default function DataConnectorModal({
549584
setValidationSucceeded={setValidationSucceeded}
550585
state={state}
551586
storageDetails={storageDetails}
552-
storageId={storageId}
587+
storageId={dataConnectorId}
553588
validateConnection={validateConnection}
554589
validationResult={validationResult}
555590
/>

0 commit comments

Comments
 (0)