jake/jarv.is
1
Fork 0
mirror of https://github.com/jakejarvis/jarv.is.git synced 2025-07-21 15:01:18 -04:00
Code Issues Activity

handle vnc disconnect error

Browse Source
This commit is contained in:
Jake Jarvis
2022-06-26 10:18:22 -04:00
parent 24968377e8
commit 7c1eb11f30
1 changed files with 14 additions and 16 deletions
Download Patch File Download Diff File Expand all files Collapse all files

30
components/VNC/VNC.tsx
View File

@@ -1,9 +1,9 @@
import { useRef, useEffect, useState, forwardRef, useImperativeHandle } from "react"; import { useRef, useEffect, useState, forwardRef, useImperativeHandle, useCallback } from "react";
import { useRouter } from "next/router"; import { useRouter } from "next/router";
import RFB from "@novnc/novnc/core/rfb"; import RFB from "@novnc/novnc/core/rfb";
import Terminal from "../Terminal"; import Terminal from "../Terminal";
import { styled } from "../../lib/styles/stitches.config"; import { styled } from "../../lib/styles/stitches.config";
import type { Ref, CSSProperties } from "react"; import type { Ref, ComponentProps } from "react";
const Display = styled( const Display = styled(
"div", "div",
@@ -33,13 +33,11 @@ const Display = styled(
} }
); );
export type VNCProps = { export type VNCProps = ComponentProps<typeof Display> & {
server: string; server: string;
style?: CSSProperties;
className?: string;
}; };
const VNC = ({ server, style, className }: VNCProps, ref: Ref<Partial<RFB>>) => { const VNC = ({ server, style, ...rest }: VNCProps, ref: Ref<Partial<RFB>>) => {
const router = useRouter(); const router = useRouter();
// we definitely do NOT want this page to connect more than once! // we definitely do NOT want this page to connect more than once!
@@ -55,21 +53,21 @@ const VNC = ({ server, style, className }: VNCProps, ref: Ref<Partial<RFB>>) =>
const screenRef = useRef<HTMLDivElement>(null); const screenRef = useRef<HTMLDivElement>(null);
// ends the session forcefully // ends the session forcefully
const disconnectVM = () => { const disconnect = useCallback(() => {
try { try {
rfbRef?.current?.disconnect(); if (connected) {
rfbRef.current?.disconnect();
}
} catch (error) {} // eslint-disable-line no-empty } catch (error) {} // eslint-disable-line no-empty
rfbRef.current = null; rfbRef.current = null;
setConnected(false); setConnected(false);
}; }, [connected]);
// expose some of noVNC's functionality to the parent of this component // expose some of noVNC's functionality to the parent of this component
useImperativeHandle(ref, () => ({ useImperativeHandle(ref, () => ({
rfb: rfbRef?.current, rfb: rfbRef?.current,
disconnect: () => { disconnect,
rfbRef.current?.disconnect();
},
focus: () => { focus: () => {
rfbRef.current?.focus(); rfbRef.current?.focus();
}, },
@@ -96,13 +94,13 @@ const VNC = ({ server, style, className }: VNCProps, ref: Ref<Partial<RFB>>) =>
// prepare for possible navigation away from this page, and disconnect if/when it happens // prepare for possible navigation away from this page, and disconnect if/when it happens
useEffect(() => { useEffect(() => {
router.events.on("routeChangeStart", disconnectVM); router.events.on("routeChangeStart", disconnect);
return () => { return () => {
// unassign event listener // unassign event listener
router.events.off("routeChangeStart", disconnectVM); router.events.off("routeChangeStart", disconnect);
}; };
}, [router.events]); }, [router.events, disconnect]);
useEffect(() => { useEffect(() => {
if (loaded) { if (loaded) {
@@ -171,7 +169,7 @@ const VNC = ({ server, style, className }: VNCProps, ref: Ref<Partial<RFB>>) =>
display: !connected ? "none" : undefined, display: !connected ? "none" : undefined,
...style, ...style,
}} }}
className={className} {...rest}
/> />
</> </>
); );