diff --git a/src/components/molecules/BrowserNavBar.tsx b/src/components/molecules/BrowserNavBar.tsx index 91980cf3..b35e4d7f 100644 --- a/src/components/molecules/BrowserNavBar.tsx +++ b/src/components/molecules/BrowserNavBar.tsx @@ -1,5 +1,5 @@ import type { - FC, + FC, } from 'react'; import styled from 'styled-components'; @@ -8,9 +8,9 @@ import ArrowBackIcon from '@mui/icons-material/ArrowBack'; import ArrowForwardIcon from '@mui/icons-material/ArrowForward'; import { NavBarButton } from '../atoms/buttons/buttons'; -import { UrlForm } from './UrlForm'; +import { UrlForm } from './UrlForm'; import { useCallback, useEffect, useState } from "react"; -import {useSocketStore} from "../../context/socket"; +import { useSocketStore } from "../../context/socket"; import { getCurrentUrl } from "../../api/recording"; const StyledNavBar = styled.div<{ browserWidth: number }>` @@ -21,8 +21,8 @@ const StyledNavBar = styled.div<{ browserWidth: number }>` `; interface NavBarProps { - browserWidth: number; - handleUrlChanged: (url: string) => void; + browserWidth: number; + handleUrlChanged: (url: string) => void; }; const BrowserNavBar: FC = ({ @@ -34,11 +34,11 @@ const BrowserNavBar: FC = ({ const [currentUrl, setCurrentUrl] = useState('https://'); - const handleRefresh = useCallback(() : void => { + const handleRefresh = useCallback((): void => { socket?.emit('input:refresh'); }, [socket]); - const handleGoTo = useCallback((address: string) : void => { + const handleGoTo = useCallback((address: string): void => { socket?.emit('input:url', address); }, [socket]); @@ -69,54 +69,54 @@ const BrowserNavBar: FC = ({ } }, [socket, handleCurrentUrlChange]) - const addAddress = (address: string) => { - if (socket) { - handleUrlChanged(address); - handleGoTo(address); - } - }; + const addAddress = (address: string) => { + if (socket) { + handleUrlChanged(address); + handleGoTo(address); + } + }; - return ( - - { - socket?.emit('input:back'); - }} - disabled={false} - > - - + return ( + + { + socket?.emit('input:back'); + }} + disabled={false} + > + + - { - socket?.emit('input:forward'); - }} - disabled={false} - > - - + { + socket?.emit('input:forward'); + }} + disabled={false} + > + + - { - if (socket) { - handleRefresh() - } - }} - disabled={false} - > - - + { + if (socket) { + handleRefresh() + } + }} + disabled={false} + > + + - - - ); + + + ); } export default BrowserNavBar;