github/kubeshark
1
0
Fork 0
mirror of https://github.com/kubeshark/kubeshark.git synced 2025-06-25 07:45:01 +00:00
Code Issues Packages Projects Releases Wiki Activity

close ws on modals open (#994)

Browse Source
This commit is contained in:
lirazyehezkel 2022-04-12 17:56:03 +03:00 committed by GitHub
parent df1fd2c3a7
commit 81fe4af30d
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 14 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

16
ui-common/src/components/TrafficViewer/TrafficViewer.tsx
View File

@ -49,14 +49,15 @@ interface TrafficViewerProps {
actionButtons?: JSX.Element,
isShowStatusBar?: boolean,
webSocketUrl: string,
isCloseWebSocket: boolean,
shouldCloseWebSocket: boolean,
setShouldCloseWebSocket: (flag: boolean) => void,
isDemoBannerView: boolean
}
export const TrafficViewer: React.FC<TrafficViewerProps> = ({
setAnalyzeStatus, trafficViewerApiProp,
actionButtons, isShowStatusBar, webSocketUrl,
isCloseWebSocket, isDemoBannerView
shouldCloseWebSocket, setShouldCloseWebSocket, isDemoBannerView
}) => {
const classes = useLayoutStyles();
@ -104,8 +105,11 @@ export const TrafficViewer: React.FC<TrafficViewerProps> = ({
}, [query, handleQueryChange]);
useEffect(() => {
isCloseWebSocket && closeWebSocket()
}, [isCloseWebSocket])
if(shouldCloseWebSocket){
closeWebSocket()
setShouldCloseWebSocket(false);
}
}, [shouldCloseWebSocket])
useEffect(() => {
reopenConnection()
@ -295,11 +299,11 @@ const MemoiedTrafficViewer = React.memo(TrafficViewer)
const TrafficViewerContainer: React.FC<TrafficViewerProps> = ({
setAnalyzeStatus, trafficViewerApiProp,
actionButtons, isShowStatusBar = true,
webSocketUrl, isCloseWebSocket, isDemoBannerView
webSocketUrl, shouldCloseWebSocket, setShouldCloseWebSocket, isDemoBannerView
}) => {
return <RecoilRoot>
<MemoiedTrafficViewer actionButtons={actionButtons} isShowStatusBar={isShowStatusBar} webSocketUrl={webSocketUrl}
isCloseWebSocket={isCloseWebSocket} trafficViewerApiProp={trafficViewerApiProp}
shouldCloseWebSocket={shouldCloseWebSocket} setShouldCloseWebSocket={setShouldCloseWebSocket} trafficViewerApiProp={trafficViewerApiProp}
setAnalyzeStatus={setAnalyzeStatus} isDemoBannerView={isDemoBannerView}/>
<ToastContainer enableMultiContainer containerId={TOAST_CONTAINER_ID}
position="bottom-right"

8
ui/src/components/Pages/TrafficPage/TrafficPage.tsx
View File

@ -21,17 +21,17 @@ export const TrafficPage: React.FC<TrafficPageProps> = ({ setAnalyzeStatus }) =>
const commonClasses = useCommonStyles();
const [serviceMapModalOpen, setServiceMapModalOpen] = useRecoilState(serviceMapModalOpenAtom);
const [openOasModal, setOpenOasModal] = useRecoilState(oasModalOpenAtom);
const [openWebSocket, setOpenWebSocket] = useState(true);
const [shouldCloseWebSocket, setShouldCloseWebSocket] = useState(false);
const trafficViewerApi = { ...api }
const handleOpenOasModal = () => {
setOpenWebSocket(false)
setShouldCloseWebSocket(true)
setOpenOasModal(true);
}
const openServiceMapModalDebounce = debounce(() => {
setOpenWebSocket(false)
setShouldCloseWebSocket(true)
setServiceMapModalOpen(true)
}, 500);
@ -59,7 +59,7 @@ export const TrafficPage: React.FC<TrafficPageProps> = ({ setAnalyzeStatus }) =>
return (
<>
<TrafficViewer setAnalyzeStatus={setAnalyzeStatus} webSocketUrl={MizuWebsocketURL} isCloseWebSocket={!openWebSocket}
<TrafficViewer setAnalyzeStatus={setAnalyzeStatus} webSocketUrl={MizuWebsocketURL} shouldCloseWebSocket={shouldCloseWebSocket} setShouldCloseWebSocket={setShouldCloseWebSocket}
trafficViewerApiProp={trafficViewerApi} actionButtons={actionButtons} isShowStatusBar={!(openOasModal || serviceMapModalOpen)} isDemoBannerView={false} />
</>
);