diff --git a/redisinsight/ui/src/assets/img/icons/rocket.svg b/redisinsight/ui/src/assets/img/icons/rocket.svg deleted file mode 100644 index cf31c6b529..0000000000 --- a/redisinsight/ui/src/assets/img/icons/rocket.svg +++ /dev/null @@ -1,37 +0,0 @@ - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - diff --git a/redisinsight/ui/src/assets/img/oauth/rocket.svg b/redisinsight/ui/src/assets/img/oauth/rocket.svg deleted file mode 100644 index 50919c6d0d..0000000000 --- a/redisinsight/ui/src/assets/img/oauth/rocket.svg +++ /dev/null @@ -1,10 +0,0 @@ - - - - - - - - - - diff --git a/redisinsight/ui/src/assets/img/rdi/rocket.svg b/redisinsight/ui/src/assets/img/rdi/rocket.svg deleted file mode 100644 index 7599de57bc..0000000000 --- a/redisinsight/ui/src/assets/img/rdi/rocket.svg +++ /dev/null @@ -1,6 +0,0 @@ - - - - - - diff --git a/redisinsight/ui/src/components/base/forms/buttons/Button.tsx b/redisinsight/ui/src/components/base/forms/buttons/Button.tsx index 42acbe0ff7..c8a0592ce4 100644 --- a/redisinsight/ui/src/components/base/forms/buttons/Button.tsx +++ b/redisinsight/ui/src/components/base/forms/buttons/Button.tsx @@ -35,7 +35,6 @@ export const BaseButton = ({ icon={icon} iconSide={iconSide} loading={loading} - size={btnSize} /> {children} ) diff --git a/redisinsight/ui/src/components/base/icons/iconRegistry.tsx b/redisinsight/ui/src/components/base/icons/iconRegistry.tsx index 4001665dc7..e35089f66d 100644 --- a/redisinsight/ui/src/components/base/icons/iconRegistry.tsx +++ b/redisinsight/ui/src/components/base/icons/iconRegistry.tsx @@ -36,7 +36,6 @@ import RedisDbBlueSvg from 'uiSrc/assets/img/icons/redis_db_blue.svg?react' import RedisLogoFullSvg from 'uiSrc/assets/img/logo.svg?react' import RedisLogoSvg from 'uiSrc/assets/img/logo_small.svg?react' import ResetSvg from 'uiSrc/assets/img/rdi/reset.svg?react' -import RocketSvg from 'uiSrc/assets/img/rdi/rocket.svg?react' import ShrinkSvg from 'uiSrc/assets/img/icons/shrink.svg?react' import SilentModeSvg from 'uiSrc/assets/img/icons/silent_mode.svg?react' import SnoozeSvg from 'uiSrc/assets/img/icons/snooze.svg?react' @@ -130,12 +129,9 @@ import PipelineStatisticsSvg from 'uiSrc/assets/img/sidebar/pipeline_statistics. import PubSubSvg from 'uiSrc/assets/img/sidebar/pubsub.svg?react' import SlowLogSvg from 'uiSrc/assets/img/sidebar/slowlog.svg?react' import WorkbenchSvg from 'uiSrc/assets/img/sidebar/workbench.svg?react' -// Missing SVGs and not used/legacy: -// import BrowserActiveSvg from 'uiSrc/assets/img/sidebar/browser_active.svg?react' -// import PipelineStatisticsActiveSvg from 'uiSrc/assets/img/sidebar/pipeline_statistics_active.svg?react' -// import PubSubActiveSvg from 'uiSrc/assets/img/sidebar/pubsub_active.svg?react' -// import SlowLogActiveSvg from 'uiSrc/assets/img/sidebar/slowlog_active.svg?react' -// import WorkbenchActiveSvg from 'uiSrc/assets/img/sidebar/workbench_active.svg?react' + +import ShieldSvg from 'uiSrc/assets/img/shield.svg?react' +import RedisSoftwareSvg from 'uiSrc/assets/img/redis-software.svg?react' import { Icon, IconProps } from './Icon' @@ -208,7 +204,6 @@ export const RedisDbBlueIcon = createIconComponent(RedisDbBlueSvg) export const RedisLogo = createIconComponent(RedisLogoSvg) export const RedisLogoFullIcon = createIconComponent(RedisLogoFullSvg) export const RiResetIcon = createIconComponent(ResetSvg) -export const RiRocketIcon = createIconComponent(RocketSvg) export const RiStarsIcon = createIconComponent(StarsSvg) export const RiStopIcon = createIconComponent(StopIconSvg) export const RiUserIcon = createIconComponent(UserSvg) @@ -308,10 +303,6 @@ export const PipelineStatisticsIcon = createIconComponent(PipelineStatisticsSvg) export const PubSubIcon = createIconComponent(PubSubSvg) export const SlowLogIcon = createIconComponent(SlowLogSvg) export const WorkbenchIcon = createIconComponent(WorkbenchSvg) -// export const BrowserActiveIcon = createIconComponent(BrowserActiveSvg) -// export const PipelineStatisticsActiveIcon = createIconComponent( -// PipelineStatisticsActiveSvg, -// ) -// export const PubSubActiveIcon = createIconComponent(PubSubActiveSvg) -// export const SlowLogActiveIcon = createIconComponent(SlowLogActiveSvg) -// export const WorkbenchActiveIcon = createIconComponent(WorkbenchActiveSvg) + +export const ShieldIcon = createIconComponent(ShieldSvg) +export const RedisSoftwareIcon = createIconComponent(RedisSoftwareSvg) \ No newline at end of file diff --git a/redisinsight/ui/src/components/side-panels/panels/enablement-area/EnablementArea/components/InternalPage/InternalPage.tsx b/redisinsight/ui/src/components/side-panels/panels/enablement-area/EnablementArea/components/InternalPage/InternalPage.tsx index 14adab33e1..5dc389fb79 100644 --- a/redisinsight/ui/src/components/side-panels/panels/enablement-area/EnablementArea/components/InternalPage/InternalPage.tsx +++ b/redisinsight/ui/src/components/side-panels/panels/enablement-area/EnablementArea/components/InternalPage/InternalPage.tsx @@ -5,7 +5,7 @@ import { debounce } from 'lodash' import { useLocation, useParams } from 'react-router-dom' import { useSelector } from 'react-redux' -import { ChevronLeftIcon } from 'uiSrc/components/base/icons' +import { ChevronLeftIcon, RocketIcon } from 'uiSrc/components/base/icons' import { ExternalLink, HorizontalRule, LoadingContent } from 'uiSrc/components' import { RiPopover } from 'uiSrc/components/base' import { IEnablementAreaItem } from 'uiSrc/slices/interfaces' @@ -16,7 +16,6 @@ import { } from 'uiSrc/telemetry' import { getTutorialCapability, Nullable } from 'uiSrc/utils' -import RocketIcon from 'uiSrc/assets/img/icons/rocket.svg?react' import { appContextCapability } from 'uiSrc/slices/app/context' import { isShowCapabilityTutorialPopover, diff --git a/redisinsight/ui/src/pages/home/components/add-database-screen/AddDatabaseScreen.styles.ts b/redisinsight/ui/src/pages/home/components/add-database-screen/AddDatabaseScreen.styles.ts new file mode 100644 index 0000000000..599b2b57c5 --- /dev/null +++ b/redisinsight/ui/src/pages/home/components/add-database-screen/AddDatabaseScreen.styles.ts @@ -0,0 +1,24 @@ +import styled from 'styled-components' + +export const CustomHorizontalRule = styled.div` + margin: 12px 0; + width: 100%; + text-align: center; + position: relative; + + &:before, + &:after { + content: ''; + display: block; + width: 47%; + height: 1px; + background: ${({ theme }: { theme: Theme }) => + theme.semantic.color.background.neutral500}; + position: absolute; + top: 50%; + } + + &:after { + right: 0; + } +` diff --git a/redisinsight/ui/src/pages/home/components/add-database-screen/AddDatabaseScreen.tsx b/redisinsight/ui/src/pages/home/components/add-database-screen/AddDatabaseScreen.tsx index 8c17dfacb2..62e609e6b0 100644 --- a/redisinsight/ui/src/pages/home/components/add-database-screen/AddDatabaseScreen.tsx +++ b/redisinsight/ui/src/pages/home/components/add-database-screen/AddDatabaseScreen.tsx @@ -3,8 +3,8 @@ import { useFormik } from 'formik' import { useDispatch, useSelector } from 'react-redux' import { useHistory } from 'react-router' import { toNumber } from 'lodash' -import { Nullable, parseRedisUrl } from 'uiSrc/utils' +import { Nullable, parseRedisUrl } from 'uiSrc/utils' import { AddDbType, DEFAULT_TIMEOUT } from 'uiSrc/pages/home/constants' import { Instance } from 'uiSrc/slices/interfaces' import { @@ -25,8 +25,7 @@ import { RiTooltip } from 'uiSrc/components' import ConnectivityOptions from './components/connectivity-options' import ConnectionUrl from './components/connection-url' import { Values } from './constants' - -import styles from './styles.module.scss' +import { CustomHorizontalRule } from './AddDatabaseScreen.styles' export interface Props { onSelectOption: (type: AddDbType, db: Nullable>) => void @@ -103,7 +102,7 @@ const AddDatabaseScreen = (props: Props) => { }) return ( -
+
@@ -113,8 +112,8 @@ const AddDatabaseScreen = (props: Props) => { /> - - + + { loading={isLoading} data-testid="btn-test-connection" > - Test Connection + Test connection @@ -138,11 +137,11 @@ const AddDatabaseScreen = (props: Props) => { handleProceedForm(AddDbType.manual)} data-testid="btn-connection-settings" > - Connection Settings + Connection settings @@ -152,13 +151,13 @@ const AddDatabaseScreen = (props: Props) => { content={isInvalid ? {ConnectionUrlError} : null} > - Add Database + Add database @@ -167,7 +166,7 @@ const AddDatabaseScreen = (props: Props) => { -
Or
+ Or ( -
Connection URL
+ + Connection URL ( } > - + + + -
+ } >