Merge pull request #3073 from RedisInsight/fe/feature/RI-5445

#RI-5445 - do not display run commands confirmation for free databases

Author: mariasergeenko

redisinsight/ui/src/components/database-side-panels/panels/enablement-area/EnablementArea/components/Code/Code.tsx

@@ -19,7 +19,7 @@ export interface Props {
 }
 
 const Code = ({ children, params = '', label, path, ...rest }: Props) => {
-  const { provider, modules = [] } = useSelector(connectedInstanceSelector)
+  const { provider, modules = [], isFreeDb } = useSelector(connectedInstanceSelector)
 
   const { search } = useLocation()
   const { setScript } = useContext(EnablementAreaContext)
@@ -82,6 +82,7 @@ const Code = ({ children, params = '', label, path, ...rest }: Props) => {
       modules={modules}
       label={label}
       params={parsedParams}
+      isShowConfirmation={!isFreeDb}
       {...rest}
     />
   )

redisinsight/ui/src/components/database-side-panels/panels/enablement-area/EnablementArea/components/CodeButtonBlock/CodeButtonBlock.spec.tsx

@@ -89,6 +89,24 @@ describe('CodeButtonBlock', () => {
     expect(screen.queryByTestId(`run-btn-${label}`)).not.toBeInTheDocument()
   })
 
+  it('should not show confirmation popover with option', async () => {
+    render(
+      <CodeButtonBlock
+        {...instance(mockedProps)}
+        label={label}
+        onApply={jest.fn}
+        params={{ run_confirmation: 'true' }}
+        content={simpleContent}
+        isShowConfirmation={false}
+      />
+    )
+    await act(() => {
+      fireEvent.click(screen.getByTestId(`run-btn-${label}`))
+    })
+
+    expect(screen.queryByTestId('tutorial-popover-apply-run')).not.toBeInTheDocument()
+  })
+
   it('should go to home page after click on change db', async () => {
     const pushMock = jest.fn()
     reactRouterDom.useHistory = jest.fn().mockReturnValue({ push: pushMock })

redisinsight/ui/src/components/database-side-panels/panels/enablement-area/EnablementArea/components/CodeButtonBlock/CodeButtonBlock.tsx

@@ -28,6 +28,7 @@ export interface Props {
   isLoading?: boolean
   className?: string
   params?: CodeButtonParams
+  isShowConfirmation?: boolean
 }
 
 const FINISHED_COMMAND_INDICATOR_TIME_MS = 5_000
@@ -41,6 +42,7 @@ const CodeButtonBlock = (props: Props) => {
     content,
     onCopy,
     modules = [],
+    isShowConfirmation = true,
     ...rest
   } = props
 
@@ -51,10 +53,6 @@ const CodeButtonBlock = (props: Props) => {
 
   const { instanceId } = useParams<{ instanceId: string }>()
 
-  const isNotShowConfirmation = getDBConfigStorageField(
-    instanceId,
-    ConfigDBStorageItem.notShowConfirmationRunTutorial
-  )
   const isButtonHasConfirmation = params?.run_confirmation === BooleanParams.true
   const isRunButtonHidden = params?.executable === BooleanParams.false
   const [notLoadedModule] = getUnsupportedModulesFromQuery(modules, content)
@@ -66,6 +64,11 @@ const CodeButtonBlock = (props: Props) => {
       })
   }, [])
 
+  const getIsShowConfirmation = () => isShowConfirmation && !getDBConfigStorageField(
+    instanceId,
+    ConfigDBStorageItem.notShowConfirmationRunTutorial
+  )
+
   const handleCopy = () => {
     const query = getCommandsForExecution(content)?.join('\n') || ''
     navigator?.clipboard?.writeText(query)
@@ -82,7 +85,10 @@ const CodeButtonBlock = (props: Props) => {
   }
 
   const handleRunClicked = () => {
-    if (!instanceId || notLoadedModule || (!isNotShowConfirmation && isButtonHasConfirmation)) {
+    if (!instanceId
+      || notLoadedModule
+      || (getIsShowConfirmation() && isButtonHasConfirmation)
+    ) {
       setIsPopoverOpen((v) => !v)
       return
     }

redisinsight/ui/src/slices/instances/instances.ts

@@ -190,6 +190,7 @@ const instancesSlice = createSlice({
       state.connectedInstance = payload
       state.connectedInstance.loading = false
       state.connectedInstance.isRediStack = isRediStack || false
+      state.connectedInstance.isFreeDb = payload.cloudDetails?.free || false
       state.connectedInstance.db = sessionStorageService.get(`${BrowserStorageItem.dbIndex}${payload.id}`) ?? payload.db
     },