Skip to content

Commit ebf0c26

Browse files
committed
fix react event use in integration config forms to avoid RC with async state updates
1 parent d754741 commit ebf0c26

17 files changed

+210
-105
lines changed

src/webviews/webview-side/integrations/AlloyDBForm.tsx

Lines changed: 12 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -58,41 +58,47 @@ export const AlloyDBForm: React.FC<IAlloyDBFormProps> = ({
5858
};
5959

6060
const handleNameChange = (e: React.ChangeEvent<HTMLInputElement>) => {
61-
setPendingConfig({ ...pendingConfig, name: e.target.value });
61+
const value = e.target.value;
62+
setPendingConfig({ ...pendingConfig, name: value });
6263
};
6364

6465
const handleHostChange = (e: React.ChangeEvent<HTMLInputElement>) => {
66+
const value = e.target.value;
6567
setPendingConfig({
6668
...pendingConfig,
67-
metadata: { ...pendingConfig.metadata, host: e.target.value }
69+
metadata: { ...pendingConfig.metadata, host: value }
6870
});
6971
};
7072

7173
const handlePortChange = (e: React.ChangeEvent<HTMLInputElement>) => {
74+
const value = e.target.value;
7275
setPendingConfig({
7376
...pendingConfig,
74-
metadata: { ...pendingConfig.metadata, port: e.target.value || undefined }
77+
metadata: { ...pendingConfig.metadata, port: value || undefined }
7578
});
7679
};
7780

7881
const handleDatabaseChange = (e: React.ChangeEvent<HTMLInputElement>) => {
82+
const value = e.target.value;
7983
setPendingConfig({
8084
...pendingConfig,
81-
metadata: { ...pendingConfig.metadata, database: e.target.value }
85+
metadata: { ...pendingConfig.metadata, database: value }
8286
});
8387
};
8488

8589
const handleUsernameChange = (e: React.ChangeEvent<HTMLInputElement>) => {
90+
const value = e.target.value;
8691
setPendingConfig({
8792
...pendingConfig,
88-
metadata: { ...pendingConfig.metadata, user: e.target.value }
93+
metadata: { ...pendingConfig.metadata, user: value }
8994
});
9095
};
9196

9297
const handlePasswordChange = (e: React.ChangeEvent<HTMLInputElement>) => {
98+
const value = e.target.value;
9399
setPendingConfig({
94100
...pendingConfig,
95-
metadata: { ...pendingConfig.metadata, password: e.target.value }
101+
metadata: { ...pendingConfig.metadata, password: value }
96102
});
97103
};
98104

src/webviews/webview-side/integrations/AthenaForm.tsx

Lines changed: 12 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -52,27 +52,33 @@ export const AthenaForm: React.FC<IAthenaFormProps> = ({
5252
}, [existingConfig, integrationId, defaultName]);
5353

5454
const handleNameChange = (e: React.ChangeEvent<HTMLInputElement>) => {
55-
setPendingConfig((prev) => ({ ...prev, name: e.target.value }));
55+
const value = e.target.value;
56+
setPendingConfig((prev) => ({ ...prev, name: value }));
5657
};
5758

5859
const handleAccessKeyIdChange = (e: React.ChangeEvent<HTMLInputElement>) => {
59-
setPendingConfig((prev) => ({ ...prev, metadata: { ...prev.metadata, access_key_id: e.target.value } }));
60+
const value = e.target.value;
61+
setPendingConfig((prev) => ({ ...prev, metadata: { ...prev.metadata, access_key_id: value } }));
6062
};
6163

6264
const handleSecretAccessKeyChange = (e: React.ChangeEvent<HTMLInputElement>) => {
63-
setPendingConfig((prev) => ({ ...prev, metadata: { ...prev.metadata, secret_access_key: e.target.value } }));
65+
const value = e.target.value;
66+
setPendingConfig((prev) => ({ ...prev, metadata: { ...prev.metadata, secret_access_key: value } }));
6467
};
6568

6669
const handleRegionChange = (e: React.ChangeEvent<HTMLInputElement>) => {
67-
setPendingConfig((prev) => ({ ...prev, metadata: { ...prev.metadata, region: e.target.value } }));
70+
const value = e.target.value;
71+
setPendingConfig((prev) => ({ ...prev, metadata: { ...prev.metadata, region: value } }));
6872
};
6973

7074
const handleS3OutputPathChange = (e: React.ChangeEvent<HTMLInputElement>) => {
71-
setPendingConfig((prev) => ({ ...prev, metadata: { ...prev.metadata, s3_output_path: e.target.value } }));
75+
const value = e.target.value;
76+
setPendingConfig((prev) => ({ ...prev, metadata: { ...prev.metadata, s3_output_path: value } }));
7277
};
7378

7479
const handleWorkgroupChange = (e: React.ChangeEvent<HTMLInputElement>) => {
75-
setPendingConfig((prev) => ({ ...prev, metadata: { ...prev.metadata, workgroup: e.target.value } }));
80+
const value = e.target.value;
81+
setPendingConfig((prev) => ({ ...prev, metadata: { ...prev.metadata, workgroup: value } }));
7682
};
7783

7884
const handleSubmit = (e: React.FormEvent) => {

src/webviews/webview-side/integrations/BigQueryForm.tsx

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -57,9 +57,10 @@ export const BigQueryForm: React.FC<IBigQueryFormProps> = ({
5757
: '';
5858

5959
const handleNameChange = (e: React.ChangeEvent<HTMLInputElement>) => {
60+
const value = e.target.value;
6061
setPendingConfig((prev) => ({
6162
...prev,
62-
name: e.target.value
63+
name: value
6364
}));
6465
};
6566

src/webviews/webview-side/integrations/ClickHouseForm.tsx

Lines changed: 12 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -59,41 +59,47 @@ export const ClickHouseForm: React.FC<IClickHouseFormProps> = ({
5959
};
6060

6161
const handleNameChange = (e: React.ChangeEvent<HTMLInputElement>) => {
62-
setPendingConfig({ ...pendingConfig, name: e.target.value });
62+
const value = e.target.value;
63+
setPendingConfig({ ...pendingConfig, name: value });
6364
};
6465

6566
const handleHostChange = (e: React.ChangeEvent<HTMLInputElement>) => {
67+
const value = e.target.value;
6668
setPendingConfig({
6769
...pendingConfig,
68-
metadata: { ...pendingConfig.metadata, host: e.target.value }
70+
metadata: { ...pendingConfig.metadata, host: value }
6971
});
7072
};
7173

7274
const handlePortChange = (e: React.ChangeEvent<HTMLInputElement>) => {
75+
const value = e.target.value;
7376
setPendingConfig({
7477
...pendingConfig,
75-
metadata: { ...pendingConfig.metadata, port: e.target.value || undefined }
78+
metadata: { ...pendingConfig.metadata, port: value || undefined }
7679
});
7780
};
7881

7982
const handleDatabaseChange = (e: React.ChangeEvent<HTMLInputElement>) => {
83+
const value = e.target.value;
8084
setPendingConfig({
8185
...pendingConfig,
82-
metadata: { ...pendingConfig.metadata, database: e.target.value }
86+
metadata: { ...pendingConfig.metadata, database: value }
8387
});
8488
};
8589

8690
const handleUsernameChange = (e: React.ChangeEvent<HTMLInputElement>) => {
91+
const value = e.target.value;
8792
setPendingConfig({
8893
...pendingConfig,
89-
metadata: { ...pendingConfig.metadata, user: e.target.value }
94+
metadata: { ...pendingConfig.metadata, user: value }
9095
});
9196
};
9297

9398
const handlePasswordChange = (e: React.ChangeEvent<HTMLInputElement>) => {
99+
const value = e.target.value;
94100
setPendingConfig({
95101
...pendingConfig,
96-
metadata: { ...pendingConfig.metadata, password: e.target.value || undefined }
102+
metadata: { ...pendingConfig.metadata, password: value || undefined }
97103
});
98104
};
99105

src/webviews/webview-side/integrations/DatabricksForm.tsx

Lines changed: 14 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -56,31 +56,38 @@ export const DatabricksForm: React.FC<IDatabricksFormProps> = ({
5656
}, [existingConfig, integrationId, defaultName]);
5757

5858
const handleNameChange = (e: React.ChangeEvent<HTMLInputElement>) => {
59-
setPendingConfig((prev) => ({ ...prev, name: e.target.value }));
59+
const value = e.target.value;
60+
setPendingConfig((prev) => ({ ...prev, name: value }));
6061
};
6162

6263
const handleHostChange = (e: React.ChangeEvent<HTMLInputElement>) => {
63-
setPendingConfig((prev) => ({ ...prev, metadata: { ...prev.metadata, host: e.target.value } }));
64+
const value = e.target.value;
65+
setPendingConfig((prev) => ({ ...prev, metadata: { ...prev.metadata, host: value } }));
6466
};
6567

6668
const handlePortChange = (e: React.ChangeEvent<HTMLInputElement>) => {
67-
setPendingConfig((prev) => ({ ...prev, metadata: { ...prev.metadata, port: e.target.value } }));
69+
const value = e.target.value;
70+
setPendingConfig((prev) => ({ ...prev, metadata: { ...prev.metadata, port: value } }));
6871
};
6972

7073
const handleHttpPathChange = (e: React.ChangeEvent<HTMLInputElement>) => {
71-
setPendingConfig((prev) => ({ ...prev, metadata: { ...prev.metadata, httpPath: e.target.value } }));
74+
const value = e.target.value;
75+
setPendingConfig((prev) => ({ ...prev, metadata: { ...prev.metadata, httpPath: value } }));
7276
};
7377

7478
const handleTokenChange = (e: React.ChangeEvent<HTMLInputElement>) => {
75-
setPendingConfig((prev) => ({ ...prev, metadata: { ...prev.metadata, token: e.target.value } }));
79+
const value = e.target.value;
80+
setPendingConfig((prev) => ({ ...prev, metadata: { ...prev.metadata, token: value } }));
7681
};
7782

7883
const handleSchemaChange = (e: React.ChangeEvent<HTMLInputElement>) => {
79-
setPendingConfig((prev) => ({ ...prev, metadata: { ...prev.metadata, schema: e.target.value } }));
84+
const value = e.target.value;
85+
setPendingConfig((prev) => ({ ...prev, metadata: { ...prev.metadata, schema: value } }));
8086
};
8187

8288
const handleCatalogChange = (e: React.ChangeEvent<HTMLInputElement>) => {
83-
setPendingConfig((prev) => ({ ...prev, metadata: { ...prev.metadata, catalog: e.target.value } }));
89+
const value = e.target.value;
90+
setPendingConfig((prev) => ({ ...prev, metadata: { ...prev.metadata, catalog: value } }));
8491
};
8592

8693
const handleSshEnabledChange = (enabled: boolean) => {

src/webviews/webview-side/integrations/DremioForm.tsx

Lines changed: 10 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -52,23 +52,28 @@ export const DremioForm: React.FC<IDremioFormProps> = ({
5252
}, [existingConfig, integrationId, defaultName]);
5353

5454
const handleNameChange = (e: React.ChangeEvent<HTMLInputElement>) => {
55-
setPendingConfig((prev) => ({ ...prev, name: e.target.value }));
55+
const value = e.target.value;
56+
setPendingConfig((prev) => ({ ...prev, name: value }));
5657
};
5758

5859
const handleHostChange = (e: React.ChangeEvent<HTMLInputElement>) => {
59-
setPendingConfig((prev) => ({ ...prev, metadata: { ...prev.metadata, host: e.target.value } }));
60+
const value = e.target.value;
61+
setPendingConfig((prev) => ({ ...prev, metadata: { ...prev.metadata, host: value } }));
6062
};
6163

6264
const handlePortChange = (e: React.ChangeEvent<HTMLInputElement>) => {
63-
setPendingConfig((prev) => ({ ...prev, metadata: { ...prev.metadata, port: e.target.value } }));
65+
const value = e.target.value;
66+
setPendingConfig((prev) => ({ ...prev, metadata: { ...prev.metadata, port: value } }));
6467
};
6568

6669
const handleSchemaChange = (e: React.ChangeEvent<HTMLInputElement>) => {
67-
setPendingConfig((prev) => ({ ...prev, metadata: { ...prev.metadata, schema: e.target.value } }));
70+
const value = e.target.value;
71+
setPendingConfig((prev) => ({ ...prev, metadata: { ...prev.metadata, schema: value } }));
6872
};
6973

7074
const handleTokenChange = (e: React.ChangeEvent<HTMLInputElement>) => {
71-
setPendingConfig((prev) => ({ ...prev, metadata: { ...prev.metadata, token: e.target.value } }));
75+
const value = e.target.value;
76+
setPendingConfig((prev) => ({ ...prev, metadata: { ...prev.metadata, token: value } }));
7277
};
7378

7479
const handleSshEnabledChange = (enabled: boolean) => {

src/webviews/webview-side/integrations/MariaDBForm.tsx

Lines changed: 12 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -54,27 +54,33 @@ export const MariaDBForm: React.FC<IMariaDBFormProps> = ({
5454
}, [existingConfig, integrationId, defaultName]);
5555

5656
const handleNameChange = (e: React.ChangeEvent<HTMLInputElement>) => {
57-
setPendingConfig((prev) => ({ ...prev, name: e.target.value }));
57+
const value = e.target.value;
58+
setPendingConfig((prev) => ({ ...prev, name: value }));
5859
};
5960

6061
const handleHostChange = (e: React.ChangeEvent<HTMLInputElement>) => {
61-
setPendingConfig((prev) => ({ ...prev, metadata: { ...prev.metadata, host: e.target.value } }));
62+
const value = e.target.value;
63+
setPendingConfig((prev) => ({ ...prev, metadata: { ...prev.metadata, host: value } }));
6264
};
6365

6466
const handlePortChange = (e: React.ChangeEvent<HTMLInputElement>) => {
65-
setPendingConfig((prev) => ({ ...prev, metadata: { ...prev.metadata, port: e.target.value } }));
67+
const value = e.target.value;
68+
setPendingConfig((prev) => ({ ...prev, metadata: { ...prev.metadata, port: value } }));
6669
};
6770

6871
const handleDatabaseChange = (e: React.ChangeEvent<HTMLInputElement>) => {
69-
setPendingConfig((prev) => ({ ...prev, metadata: { ...prev.metadata, database: e.target.value } }));
72+
const value = e.target.value;
73+
setPendingConfig((prev) => ({ ...prev, metadata: { ...prev.metadata, database: value } }));
7074
};
7175

7276
const handleUsernameChange = (e: React.ChangeEvent<HTMLInputElement>) => {
73-
setPendingConfig((prev) => ({ ...prev, metadata: { ...prev.metadata, user: e.target.value } }));
77+
const value = e.target.value;
78+
setPendingConfig((prev) => ({ ...prev, metadata: { ...prev.metadata, user: value } }));
7479
};
7580

7681
const handlePasswordChange = (e: React.ChangeEvent<HTMLInputElement>) => {
77-
setPendingConfig((prev) => ({ ...prev, metadata: { ...prev.metadata, password: e.target.value } }));
82+
const value = e.target.value;
83+
setPendingConfig((prev) => ({ ...prev, metadata: { ...prev.metadata, password: value } }));
7884
};
7985

8086
const handleSshEnabledChange = (enabled: boolean) => {

src/webviews/webview-side/integrations/MaterializeForm.tsx

Lines changed: 14 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -62,48 +62,55 @@ export const MaterializeForm: React.FC<IMaterializeFormProps> = ({
6262
};
6363

6464
const handleNameChange = (e: React.ChangeEvent<HTMLInputElement>) => {
65-
setPendingConfig({ ...pendingConfig, name: e.target.value });
65+
const value = e.target.value;
66+
setPendingConfig({ ...pendingConfig, name: value });
6667
};
6768

6869
const handleHostChange = (e: React.ChangeEvent<HTMLInputElement>) => {
70+
const value = e.target.value;
6971
setPendingConfig({
7072
...pendingConfig,
71-
metadata: { ...pendingConfig.metadata, host: e.target.value }
73+
metadata: { ...pendingConfig.metadata, host: value }
7274
});
7375
};
7476

7577
const handlePortChange = (e: React.ChangeEvent<HTMLInputElement>) => {
78+
const value = e.target.value;
7679
setPendingConfig({
7780
...pendingConfig,
78-
metadata: { ...pendingConfig.metadata, port: e.target.value || undefined }
81+
metadata: { ...pendingConfig.metadata, port: value || undefined }
7982
});
8083
};
8184

8285
const handleDatabaseChange = (e: React.ChangeEvent<HTMLInputElement>) => {
86+
const value = e.target.value;
8387
setPendingConfig({
8488
...pendingConfig,
85-
metadata: { ...pendingConfig.metadata, database: e.target.value }
89+
metadata: { ...pendingConfig.metadata, database: value }
8690
});
8791
};
8892

8993
const handleClusterChange = (e: React.ChangeEvent<HTMLInputElement>) => {
94+
const value = e.target.value;
9095
setPendingConfig({
9196
...pendingConfig,
92-
metadata: { ...pendingConfig.metadata, cluster: e.target.value }
97+
metadata: { ...pendingConfig.metadata, cluster: value }
9398
});
9499
};
95100

96101
const handleUsernameChange = (e: React.ChangeEvent<HTMLInputElement>) => {
102+
const value = e.target.value;
97103
setPendingConfig({
98104
...pendingConfig,
99-
metadata: { ...pendingConfig.metadata, user: e.target.value }
105+
metadata: { ...pendingConfig.metadata, user: value }
100106
});
101107
};
102108

103109
const handlePasswordChange = (e: React.ChangeEvent<HTMLInputElement>) => {
110+
const value = e.target.value;
104111
setPendingConfig({
105112
...pendingConfig,
106-
metadata: { ...pendingConfig.metadata, password: e.target.value }
113+
metadata: { ...pendingConfig.metadata, password: value }
107114
});
108115
};
109116

src/webviews/webview-side/integrations/MindsDBForm.tsx

Lines changed: 12 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -58,41 +58,47 @@ export const MindsDBForm: React.FC<IMindsDBFormProps> = ({
5858
};
5959

6060
const handleNameChange = (e: React.ChangeEvent<HTMLInputElement>) => {
61-
setPendingConfig({ ...pendingConfig, name: e.target.value });
61+
const value = e.target.value;
62+
setPendingConfig({ ...pendingConfig, name: value });
6263
};
6364

6465
const handleHostChange = (e: React.ChangeEvent<HTMLInputElement>) => {
66+
const value = e.target.value;
6567
setPendingConfig({
6668
...pendingConfig,
67-
metadata: { ...pendingConfig.metadata, host: e.target.value }
69+
metadata: { ...pendingConfig.metadata, host: value }
6870
});
6971
};
7072

7173
const handlePortChange = (e: React.ChangeEvent<HTMLInputElement>) => {
74+
const value = e.target.value;
7275
setPendingConfig({
7376
...pendingConfig,
74-
metadata: { ...pendingConfig.metadata, port: e.target.value || undefined }
77+
metadata: { ...pendingConfig.metadata, port: value || undefined }
7578
});
7679
};
7780

7881
const handleDatabaseChange = (e: React.ChangeEvent<HTMLInputElement>) => {
82+
const value = e.target.value;
7983
setPendingConfig({
8084
...pendingConfig,
81-
metadata: { ...pendingConfig.metadata, database: e.target.value }
85+
metadata: { ...pendingConfig.metadata, database: value }
8286
});
8387
};
8488

8589
const handleUsernameChange = (e: React.ChangeEvent<HTMLInputElement>) => {
90+
const value = e.target.value;
8691
setPendingConfig({
8792
...pendingConfig,
88-
metadata: { ...pendingConfig.metadata, user: e.target.value }
93+
metadata: { ...pendingConfig.metadata, user: value }
8994
});
9095
};
9196

9297
const handlePasswordChange = (e: React.ChangeEvent<HTMLInputElement>) => {
98+
const value = e.target.value;
9399
setPendingConfig({
94100
...pendingConfig,
95-
metadata: { ...pendingConfig.metadata, password: e.target.value }
101+
metadata: { ...pendingConfig.metadata, password: value }
96102
});
97103
};
98104

0 commit comments

Comments
 (0)