#RI-2964 - send count as maxLen from config for slow log cloud db

#RI-2969 - fix key details closing

Author: rsergeenko

redisinsight/ui/src/pages/browser/components/key-details/KeyDetailsWrapper.tsx

@@ -110,7 +110,8 @@ const KeyDetailsWrapper = (props: Props) => {
   }
 
   const handleClosePanel = () => {
-    dispatch(toggleBrowserFullScreen())
+    dispatch(toggleBrowserFullScreen(true))
+    keyProp && onCloseKey()
   }
 
   return (

redisinsight/ui/src/pages/slowLog/SlowLogPage.tsx

@@ -14,10 +14,11 @@ import { useParams } from 'react-router-dom'
 import { AutoSizer } from 'react-virtualized'
 
 import InstanceHeader from 'uiSrc/components/instance-header'
+import { DEFAULT_SLOWLOG_MAX_LEN } from 'uiSrc/constants'
 import { DATE_FORMAT } from 'uiSrc/pages/slowLog/components/SlowLogTable/SlowLogTable'
 import { convertNumberByUnits } from 'uiSrc/pages/slowLog/utils'
 import { connectedInstanceSelector } from 'uiSrc/slices/instances/instances'
-import { ConnectionType } from 'uiSrc/slices/interfaces'
+import { ConnectionProvider, ConnectionType } from 'uiSrc/slices/interfaces'
 import {
   clearSlowLogAction,
   fetchSlowLogsAction,
@@ -35,18 +36,19 @@ import styles from './styles.module.scss'
 
 const HIDE_TIMESTAMP_FROM_WIDTH = 850
 const DEFAULT_COUNT_VALUE = '50'
+const MAX_COUNT_VALUE = '-1'
 const countOptions: EuiSuperSelectOption<string>[] = [
   { value: '10', inputDisplay: '10' },
   { value: '25', inputDisplay: '25' },
   { value: '50', inputDisplay: '50' },
   { value: '100', inputDisplay: '100' },
-  { value: '-1', inputDisplay: 'Max available' },
+  { value: MAX_COUNT_VALUE, inputDisplay: 'Max available' },
 ]
 
 const SlowLogPage = () => {
-  const { connectionType } = useSelector(connectedInstanceSelector)
+  const { connectionType, provider } = useSelector(connectedInstanceSelector)
   const { data, loading, durationUnit, config } = useSelector(slowLogSelector)
-  const { slowlogLogSlowerThan = 0 } = useSelector(slowLogConfigSelector)
+  const { slowlogLogSlowerThan = 0, slowlogMaxLen } = useSelector(slowLogConfigSelector)
   const { instanceId } = useParams<{ instanceId: string }>()
 
   const [count, setCount] = useState<string>(DEFAULT_COUNT_VALUE)
@@ -63,9 +65,13 @@ const SlowLogPage = () => {
     getSlowLogs()
   }, [count])
 
-  const getSlowLogs = () => {
+  const getSlowLogs = (maxLen?: number) => {
+    const countToSend = (provider === ConnectionProvider.RE_CLOUD && count === MAX_COUNT_VALUE)
+      ? (maxLen || slowlogMaxLen || DEFAULT_SLOWLOG_MAX_LEN)
+      : toNumber(count)
+
     dispatch(
-      fetchSlowLogsAction(instanceId, toNumber(count), (data: SlowLog[]) => {
+      fetchSlowLogsAction(instanceId, countToSend, (data: SlowLog[]) => {
         sendEventTelemetry({
           event: TelemetryEvent.SLOWLOG_LOADED,
           eventData: {
@@ -111,7 +117,7 @@ const SlowLogPage = () => {
               Execution time: {numberWithSpaces(convertNumberByUnits(slowlogLogSlowerThan, durationUnit))}
                 &nbsp;
               {durationUnit},
-              Max length: {numberWithSpaces(config.slowlogMaxLen)}
+              Max length: {numberWithSpaces(slowlogMaxLen)}
             </EuiText>
             )}
           </EuiFlexItem>

redisinsight/ui/src/pages/slowLog/components/Actions/Actions.tsx

@@ -27,7 +27,7 @@ export interface Props {
   isEmptySlowLog: boolean
   durationUnit: Nullable<DurationUnits>
   onClear: () => void
-  onRefresh: () => void
+  onRefresh: (maxLen?: number) => void
 }
 
 const HIDE_REFRESH_LABEL_WIDTH = 850
@@ -126,7 +126,7 @@ const Actions = (props: Props) => {
           displayText={width > HIDE_REFRESH_LABEL_WIDTH}
           lastRefreshTime={lastRefreshTime}
           containerClassName={styles.refreshContainer}
-          onRefresh={onRefresh}
+          onRefresh={() => onRefresh()}
           onEnableAutoRefresh={handleEnableAutoRefresh}
           onChangeAutoRefreshRate={handleChangeAutoRefreshRate}
           testid="refresh-slowlog-btn"

redisinsight/ui/src/pages/slowLog/components/SlowLogConfig/SlowLogConfig.tsx

@@ -33,7 +33,7 @@ import styles from './styles.module.scss'
 
 export interface Props {
   closePopover: () => void
-  onRefresh: () => void
+  onRefresh: (maxLen?: number) => void
 }
 
 const SlowLogConfig = ({ closePopover, onRefresh }: Props) => {
@@ -98,7 +98,7 @@ const SlowLogConfig = ({ closePopover, onRefresh }: Props) => {
   const onSuccess = () => {
     setDBConfigStorageField(instanceId, ConfigDBStorageItem.slowLogDurationUnit, durationUnit)
 
-    onRefresh()
+    onRefresh(maxLen ? toNumber(maxLen) : DEFAULT_SLOWLOG_MAX_LEN)
     closePopover()
   }
 

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

@@ -45,6 +45,16 @@ export enum ConnectionType {
   Sentinel = 'SENTINEL',
 }
 
+export enum ConnectionProvider {
+  UNKNOWN = 'UNKNOWN',
+  LOCALHOST = 'LOCALHOST',
+  RE_CLUSTER = 'RE_CLUSTER',
+  RE_CLOUD = 'RE_CLOUD',
+  AZURE = 'AZURE',
+  AWS = 'AWS',
+  GOOGLE = 'GOOGLE',
+}
+
 export const CONNECTION_TYPE_DISPLAY = Object.freeze({
   [ConnectionType.Standalone]: 'Standalone',
   [ConnectionType.Cluster]: 'OSS Cluster',