From 4e7e828f7d3d55db773bc27429a6b6ac0b0f763b Mon Sep 17 00:00:00 2001 From: abhizipstack Date: Thu, 16 Apr 2026 19:40:24 +0530 Subject: [PATCH] =?UTF-8?q?fix:=20CreateConnection=20crash=20=E2=80=94=20h?= =?UTF-8?q?asDetailsChanged=20used=20before=20declaration?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit The useMemo for hasDetailsChanged was declared after the useCallback (handleCreateOrUpdate) that references it in its dependency array. JavaScript's temporal dead zone causes a ReferenceError when the useCallback closure captures the variable before the useMemo initializes it. Moved the useMemo above the useCallback. Introduced by PR #57 (connection name/description edit fix). Co-Authored-By: Claude Opus 4.6 (1M context) --- .../components/environment/CreateConnection.jsx | 17 ++++++++--------- 1 file changed, 8 insertions(+), 9 deletions(-) diff --git a/frontend/src/base/components/environment/CreateConnection.jsx b/frontend/src/base/components/environment/CreateConnection.jsx index 81ff920..7fecee9 100644 --- a/frontend/src/base/components/environment/CreateConnection.jsx +++ b/frontend/src/base/components/environment/CreateConnection.jsx @@ -125,6 +125,14 @@ const CreateConnection = ({ getConnectionFields(); }, [getConnectionFields]); + const hasDetailsChanged = useMemo(() => { + if (!connectionId || !originalDbSelectionInfo) return false; + return ( + formName !== originalDbSelectionInfo.name || + formDescription !== originalDbSelectionInfo.description + ); + }, [connectionId, formName, formDescription, originalDbSelectionInfo]); + const handleCreateOrUpdate = useCallback(async () => { setIsCreateOrUpdateLoading(true); try { @@ -407,15 +415,6 @@ const CreateConnection = ({ [dbSelectionInfo.datasource_name, selectedOrgId, csrfToken, connType] ); - // Detect if connection name or description changed (metadata-only changes) - const hasDetailsChanged = useMemo(() => { - if (!connectionId || !originalDbSelectionInfo) return false; - return ( - formName !== originalDbSelectionInfo.name || - formDescription !== originalDbSelectionInfo.description - ); - }, [connectionId, formName, formDescription, originalDbSelectionInfo]); - const mappedDataSources = useMemo( () => dataSources.map((dSource) => ({