fix: address review feedback on warehouse frontend

- Only render Test connection button when the handler is provided
  (backend only supports ClickHouse, not Snowflake)
- Add missing id attributes on ClickHouse form buttons for E2E
- Extract shared getButtonLabel helper from both config forms
- Extract WarehouseConfigValue named type in requests.ts
- Extract WarehouseConfigResponse named type in responses.ts

Author: Zaimwa9

frontend/common/types/requests.ts

@@ -147,6 +147,8 @@ export interface PipelineStageRequest {
   actions: StageActionRequest[]
 }
 
+type WarehouseConfigValue = string | number | boolean
+
 export type Req = {
   getFeatureCodeReferences: {
     projectId: number
@@ -1032,7 +1034,7 @@ export type Req = {
     environmentId: string
     warehouse_type: string
     name?: string
-    config?: Record<string, string | number | boolean>
+    config?: Record<string, WarehouseConfigValue>
     credentials?: { password: string }
   }
   deleteWarehouseConnection: { environmentId: string; id: number }
@@ -1041,7 +1043,7 @@ export type Req = {
     environmentId: string
     id: number
     name?: string
-    config?: Record<string, string | number | boolean>
+    config?: Record<string, WarehouseConfigValue>
     credentials?: { password: string }
   }
   getExperiments: PagedRequest<{

frontend/common/types/responses.ts

@@ -1290,13 +1290,18 @@ export type ClickHouseConfig = {
   secure: boolean
 }
 
+export type WarehouseConfigResponse =
+  | SnowflakeConfig
+  | ClickHouseConfig
+  | Record<string, never>
+
 export type WarehouseConnection = {
   id: number
   warehouse_type: WarehouseType
   status: WarehouseConnectionStatus
   status_detail: string | null
   name: string
-  config: SnowflakeConfig | ClickHouseConfig | Record<string, never>
+  config: WarehouseConfigResponse
   created_at: string
   total_events_received: number | null
   unique_events_count: number | null

frontend/web/components/pages/environment-settings/tabs/warehouse-tab/ClickHouseConfigForm.tsx

@@ -11,6 +11,7 @@ import {
   ClickHouseFormState,
   isClickHouseFormValid,
 } from './clickhouseConfig'
+import { getButtonLabel } from './warehouseFormUtils'
 import './ConfigForm.scss'
 
 type ClickHouseConfigFormProps = {
@@ -21,11 +22,6 @@ type ClickHouseConfigFormProps = {
   initialName?: string
 }
 
-const getButtonLabel = (isEdit: boolean, isSaving: boolean): string => {
-  if (isSaving) return isEdit ? 'Saving...' : 'Creating...'
-  return isEdit ? 'Save changes' : 'Save and continue'
-}
-
 const ClickHouseConfigForm: FC<ClickHouseConfigFormProps> = ({
   initialConfig,
   initialName = '',
@@ -169,10 +165,17 @@ const ClickHouseConfigForm: FC<ClickHouseConfigFormProps> = ({
         )}
 
         <div className='wh-config-form__actions'>
-          <Button theme='outline' size='small' onClick={onCancel} type='button'>
+          <Button
+            id='warehouse-config-cancel'
+            theme='outline'
+            size='small'
+            onClick={onCancel}
+            type='button'
+          >
             Cancel
           </Button>
           <Button
+            id='warehouse-config-save'
             theme='primary'
             size='small'
             type='submit'

frontend/web/components/pages/environment-settings/tabs/warehouse-tab/ConfigForm.tsx

@@ -3,6 +3,7 @@ import Button from 'components/base/forms/Button'
 import Input from 'components/base/forms/Input'
 import ErrorMessage from 'components/ErrorMessage'
 import { SnowflakeConfig } from 'common/types/responses'
+import { getButtonLabel } from './warehouseFormUtils'
 import './ConfigForm.scss'
 
 export type ConfigFormData = SnowflakeConfig & { name: string }
@@ -15,11 +16,6 @@ type ConfigFormProps = {
   initialName?: string
 }
 
-const getButtonLabel = (isEdit: boolean, isSaving: boolean): string => {
-  if (isSaving) return isEdit ? 'Saving...' : 'Creating...'
-  return isEdit ? 'Save changes' : 'Save and continue'
-}
-
 const DEFAULTS: SnowflakeConfig = {
   account_identifier: '',
   database: 'FLAGSMITH',

frontend/web/components/pages/environment-settings/tabs/warehouse-tab/WarehouseConnectionCard.tsx

@@ -144,13 +144,13 @@ const WarehouseConnectionCard: FC<WarehouseConnectionCardProps> = ({
       )}
       <WarehouseEventCodeHelp />
       <div className='d-flex justify-content-end mt-3'>
-        {!isFlagsmith && (
+        {onTestConnection && (
           <Button
             id='warehouse-connection-test'
             theme='outline'
             size='small'
             onClick={onTestConnection}
-            disabled={!onTestConnection || isSendingTestEvent}
+            disabled={isSendingTestEvent}
           >
             {isSendingTestEvent ? 'Testing...' : 'Test connection'}
           </Button>

frontend/web/components/pages/environment-settings/tabs/warehouse-tab/warehouseFormUtils.ts

@@ -0,0 +1,4 @@
+export const getButtonLabel = (isEdit: boolean, isSaving: boolean): string => {
+  if (isSaving) return isEdit ? 'Saving...' : 'Creating...'
+  return isEdit ? 'Save changes' : 'Save and continue'
+}