Skip to content

Commit af395d9

Browse files
rsergeenkorsergeenko
committed
#RI-1453 - preparation for pub sub
1 parent 4481424 commit af395d9

File tree

17 files changed

+203
-20
lines changed

17 files changed

+203
-20
lines changed

‎redisinsight/ui/src/components/main-router/constants/defaultRoutes.ts‎

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -11,6 +11,7 @@ import {
1111
} from 'uiSrc/pages'
1212
import WorkbenchPage from 'uiSrc/pages/workbench'
1313
import SlowLogPage from 'uiSrc/pages/slowLog'
14+
import PubSubPage from 'uiSrc/pages/pubSub'
1415

1516
import COMMON_ROUTES from './commonRoutes'
1617

@@ -30,6 +31,11 @@ const INSTANCE_ROUTES: IRoute[] = [
3031
path: Pages.slowLog(':instanceId'),
3132
component: SlowLogPage,
3233
},
34+
{
35+
pageName: PageNames.pubSub,
36+
path: Pages.pubSub(':instanceId'),
37+
component: PubSubPage,
38+
},
3339
]
3440

3541
const ROUTES: IRoute[] = [

‎redisinsight/ui/src/components/main-router/constants/redisStackRoutes.ts‎

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,7 @@ import {
44
} from 'uiSrc/pages'
55
import WorkbenchPage from 'uiSrc/pages/workbench'
66
import SlowLogPage from 'uiSrc/pages/slowLog'
7+
import PubSubPage from 'uiSrc/pages/pubSub'
78
import EditConnection from 'uiSrc/pages/redisStack/components/edit-connection'
89
import COMMON_ROUTES from './commonRoutes'
910

@@ -26,6 +27,12 @@ const INSTANCE_ROUTES: IRoute[] = [
2627
path: Pages.slowLog(':instanceId'),
2728
component: SlowLogPage,
2829
},
30+
{
31+
pageName: PageNames.pubSub,
32+
protected: true,
33+
path: Pages.pubSub(':instanceId'),
34+
component: PubSubPage,
35+
},
2936
]
3037

3138
const ROUTES: IRoute[] = [

‎redisinsight/ui/src/components/navigation-menu/NavigationMenu.tsx‎

Lines changed: 20 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -41,6 +41,7 @@ import styles from './styles.module.scss'
4141
const workbenchPath = `/${PageNames.workbench}`
4242
const browserPath = `/${PageNames.browser}`
4343
const slowLogPath = `/${PageNames.slowLog}`
44+
const pubSubPath = `/${PageNames.pubSub}`
4445

4546
interface INavigations {
4647
isActivePage: boolean;
@@ -72,18 +73,7 @@ const NavigationMenu = ({ buildType }: IProps) => {
7273
setActivePage(`/${last(location.pathname.split('/'))}`)
7374
}, [location])
7475

75-
const handleGoSettingsPage = () => {
76-
history.push(Pages.settings)
77-
}
78-
const handleGoWorkbenchPage = () => {
79-
history.push(Pages.workbench(connectedInstanceId))
80-
}
81-
const handleGoBrowserPage = () => {
82-
history.push(Pages.browser(connectedInstanceId))
83-
}
84-
const handleGoSlowLogPage = () => {
85-
history.push(Pages.slowLog(connectedInstanceId))
86-
}
76+
const handleGoPage = (page: string) => history.push(page)
8777

8878
const onKeyboardShortcutClick = () => {
8979
setIsHelpMenuActive(false)
@@ -95,7 +85,7 @@ const NavigationMenu = ({ buildType }: IProps) => {
9585
tooltipText: 'Browser',
9686
isActivePage: activePage === browserPath,
9787
ariaLabel: 'Browser page button',
98-
onClick: handleGoBrowserPage,
88+
onClick: () => handleGoPage(Pages.browser(connectedInstanceId)),
9989
dataTestId: 'browser-page-btn',
10090
connectedInstanceId,
10191
getClassName() {
@@ -108,7 +98,7 @@ const NavigationMenu = ({ buildType }: IProps) => {
10898
{
10999
tooltipText: 'Workbench',
110100
ariaLabel: 'Workbench page button',
111-
onClick: handleGoWorkbenchPage,
101+
onClick: () => handleGoPage(Pages.workbench(connectedInstanceId)),
112102
dataTestId: 'workbench-page-btn',
113103
connectedInstanceId,
114104
isActivePage: activePage === workbenchPath,
@@ -122,7 +112,7 @@ const NavigationMenu = ({ buildType }: IProps) => {
122112
{
123113
tooltipText: 'Slow Log',
124114
ariaLabel: 'SlowLog page button',
125-
onClick: handleGoSlowLogPage,
115+
onClick: () => handleGoPage(Pages.slowLog(connectedInstanceId)),
126116
dataTestId: 'slowlog-page-btn',
127117
connectedInstanceId,
128118
isActivePage: activePage === slowLogPath,
@@ -133,13 +123,27 @@ const NavigationMenu = ({ buildType }: IProps) => {
133123
return this.isActivePage ? SlowLogActiveSVG : SlowLogSVG
134124
},
135125
},
126+
{
127+
tooltipText: 'Pub/Sub',
128+
ariaLabel: 'Pub/Sub page button',
129+
onClick: () => handleGoPage(Pages.pubSub(connectedInstanceId)),
130+
dataTestId: 'pub-sub-page-btn',
131+
connectedInstanceId,
132+
isActivePage: activePage === pubSubPath,
133+
getClassName() {
134+
return cx(styles.navigationButton, { [styles.active]: this.isActivePage })
135+
},
136+
getIconType() {
137+
return this.isActivePage ? SlowLogActiveSVG : SlowLogSVG
138+
},
139+
},
136140
]
137141

138142
const publicRoutes: INavigations[] = [
139143
{
140144
tooltipText: 'Settings',
141145
ariaLabel: 'Settings page button',
142-
onClick: handleGoSettingsPage,
146+
onClick: () => handleGoPage(Pages.settings),
143147
dataTestId: 'settings-page-btn',
144148
isActivePage: activePage === Pages.settings,
145149
getClassName() {

‎redisinsight/ui/src/constants/pages.ts‎

Lines changed: 4 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import React from 'react';
1+
import React from 'react'
22

33
export interface IRoute {
44
path: any;
@@ -13,7 +13,8 @@ export interface IRoute {
1313
export enum PageNames {
1414
workbench = 'workbench',
1515
browser = 'browser',
16-
slowLog = 'slowlog'
16+
slowLog = 'slowlog',
17+
pubSub = 'pubSub',
1718
}
1819

1920
const redisCloud = '/redis-cloud'
@@ -34,4 +35,5 @@ export const Pages = {
3435
browser: (instanceId: string) => `/${instanceId}/${PageNames.browser}`,
3536
workbench: (instanceId: string) => `/${instanceId}/${PageNames.workbench}`,
3637
slowLog: (instanceId: string) => `/${instanceId}/${PageNames.slowLog}`,
38+
pubSub: (instanceId: string) => `/${instanceId}/${PageNames.pubSub}`,
3739
}

‎redisinsight/ui/src/pages/pubSub/PubSubPage.tsx‎

Lines changed: 34 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,34 @@
1+
import { EuiTitle } from '@elastic/eui'
2+
import React from 'react'
3+
import InstanceHeader from 'uiSrc/components/instance-header'
4+
5+
import { MessagesList, SubscriptionPanel } from './components'
6+
7+
import styles from './styles.module.scss'
8+
9+
const PubSubPage = () => {
10+
//
11+
return (
12+
<>
13+
<InstanceHeader />
14+
<div className={styles.main} data-testid="pub-sub-page">
15+
<div className={styles.contentPanel}>
16+
<div className={styles.header}>
17+
<EuiTitle size="m" className={styles.title}>
18+
<h1>Slow Log</h1>
19+
</EuiTitle>
20+
<SubscriptionPanel />
21+
</div>
22+
<div className={styles.tableWrapper}>
23+
<MessagesList />
24+
</div>
25+
</div>
26+
<div className={styles.footerPanel}>
27+
footer
28+
</div>
29+
</div>
30+
</>
31+
)
32+
}
33+
34+
export default PubSubPage

‎redisinsight/ui/src/pages/pubSub/components/MessagesList/MessagesListWrapper.tsx‎

Lines changed: 18 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,18 @@
1+
import React from 'react'
2+
3+
const MessagesListWrapper = () => {
4+
//
5+
return (
6+
<div>
7+
<ul>
8+
<li>1</li>
9+
<li>2</li>
10+
<li>3</li>
11+
<li>4</li>
12+
<li>5</li>
13+
</ul>
14+
</div>
15+
)
16+
}
17+
18+
export default MessagesListWrapper

‎redisinsight/ui/src/pages/pubSub/components/MessagesList/index.ts‎

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
import MessagesListWrapper from './MessagesListWrapper'
2+
3+
export default MessagesListWrapper

‎redisinsight/ui/src/pages/pubSub/components/SubscriptionPanel/SubscriptionPanel.tsx‎

Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
import React from 'react'
2+
3+
const SubscriptionPanel = () => {
4+
return (
5+
<div>
6+
You are unsubscribed
7+
</div>
8+
)
9+
}
10+
11+
export default SubscriptionPanel

‎redisinsight/ui/src/pages/pubSub/components/SubscriptionPanel/index.ts‎

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
import SubscriptionPanel from './SubscriptionPanel'
2+
3+
export default SubscriptionPanel

‎redisinsight/ui/src/pages/pubSub/components/index.ts‎

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
import SubscriptionPanel from './SubscriptionPanel'
2+
import MessagesList from './MessagesList'
3+
4+
export {
5+
SubscriptionPanel,
6+
MessagesList
7+
}

0 commit comments

Comments
 (0)