diff --git a/CHANGELOG.md b/CHANGELOG.md index 351327a..797ab7e 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -8,10 +8,11 @@ and this project adheres to ## [Unreleased] -- 🎨(front) change list attachment in chat +- ✅(chat) add frontend feature flags #29 ### Changed +- 🎨(front) change list attachment in chat - 🎨(front) move emplacement for attachment - 🎨(ui) retour ui sources files - ✨(ui) fix retour global ui diff --git a/src/frontend/apps/conversations/src/core/config/api/useConfig.tsx b/src/frontend/apps/conversations/src/core/config/api/useConfig.tsx index 3c62426..0a812f0 100644 --- a/src/frontend/apps/conversations/src/core/config/api/useConfig.tsx +++ b/src/frontend/apps/conversations/src/core/config/api/useConfig.tsx @@ -11,9 +11,20 @@ interface ThemeCustomization { translations?: Resource; } +export enum FeatureFlagState { + ENABLED = 'enabled', + DISABLED = 'disabled', + DYNAMIC = 'dynamic', +} + +interface FeatureFlags { + [key: string]: FeatureFlagState; +} + export interface ConfigResponse { CRISP_WEBSITE_ID?: string; ENVIRONMENT: string; + FEATURE_FLAGS: FeatureFlags; FRONTEND_CSS_URL?: string; FRONTEND_HOMEPAGE_FEATURE_ENABLED?: boolean; FRONTEND_THEME?: Theme; diff --git a/src/frontend/apps/conversations/src/features/chat/components/InputChat.tsx b/src/frontend/apps/conversations/src/features/chat/components/InputChat.tsx index b7ecede..6a831ff 100644 --- a/src/frontend/apps/conversations/src/features/chat/components/InputChat.tsx +++ b/src/frontend/apps/conversations/src/features/chat/components/InputChat.tsx @@ -3,6 +3,8 @@ import React, { useEffect, useRef, useState } from 'react'; import { useTranslation } from 'react-i18next'; import { Box, Icon, Text } from '@/components'; +import { FeatureFlagState, useConfig } from '@/core'; +import { useAnalytics } from '@/libs'; import { useResponsiveStore } from '@/stores'; import { AttachmentList } from './AttachmentList'; @@ -44,6 +46,10 @@ export const InputChat = ({ const [isDragActive, setIsDragActive] = useState(false); const { isDesktop, isMobile } = useResponsiveStore(); const [currentSuggestionIndex, setCurrentSuggestionIndex] = useState(0); + const { data: conf } = useConfig(); + const { isFeatureFlagActivated } = useAnalytics(); + const [fileUploadEnabled, setFileUploadEnabled] = useState(false); + const [webSearchEnabled, setWebSearchEnabled] = useState(false); const [isResetting, setIsResetting] = useState(false); const suggestions = [ @@ -53,6 +59,29 @@ export const InputChat = ({ t('Find recent news about...'), ]; + useEffect(() => { + if (!conf?.FEATURE_FLAGS) { + setWebSearchEnabled(false); + setFileUploadEnabled(false); + return; + } + const isFeatureEnabled = (featureKey: string): boolean => { + const configValue = conf.FEATURE_FLAGS[featureKey]; + if (!configValue) { + return false; + } else if (configValue === FeatureFlagState.DISABLED) { + return false; + } else if (configValue === FeatureFlagState.ENABLED) { + return true; + } else { + return isFeatureFlagActivated(featureKey); + } + }; + + setWebSearchEnabled(isFeatureEnabled('web-search')); + setFileUploadEnabled(isFeatureEnabled('document-upload')); + }, [conf, isFeatureFlagActivated]); + useEffect(() => { if (messagesLength === 0) { const interval = setInterval(() => { @@ -140,7 +169,7 @@ export const InputChat = ({ onSubmit={handleSubmit} onDragOver={(e) => { e.preventDefault(); - setIsDragActive(true); + setIsDragActive(fileUploadEnabled); }} onDragLeave={(e) => { e.preventDefault(); @@ -149,6 +178,9 @@ export const InputChat = ({ onDrop={(e) => { e.preventDefault(); setIsDragActive(false); + if (!fileUploadEnabled) { + return; + } if (e.dataTransfer.files?.length) { setFiles((prev) => { const dt = new DataTransfer(); @@ -337,6 +369,7 @@ export const InputChat = ({ + {onToggleWebSearch && (