fix: format

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;
+  browserWidth: number;
-    handleUrlChanged: (url: string) => void;
+  handleUrlChanged: (url: string) => void;
 };
 
 const BrowserNavBar: FC<NavBarProps> = ({
@@ -34,11 +34,11 @@ const BrowserNavBar: FC<NavBarProps> = ({
 
   const [currentUrl, setCurrentUrl] = useState<string>('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<NavBarProps> = ({
     }
   }, [socket, handleCurrentUrlChange])
 
-    const addAddress = (address: string) => {
+  const addAddress = (address: string) => {
-        if (socket) {
+    if (socket) {
-          handleUrlChanged(address);
+      handleUrlChanged(address);
-          handleGoTo(address);
+      handleGoTo(address);
-        }
+    }
-    };
+  };
 
-    return (
+  return (
-        <StyledNavBar browserWidth={browserWidth}>
+    <StyledNavBar browserWidth={browserWidth}>
-            <NavBarButton
+      <NavBarButton
-                type="button"
+        type="button"
-                onClick={() => {
+        onClick={() => {
-                    socket?.emit('input:back');
+          socket?.emit('input:back');
-                }}
+        }}
-                disabled={false}
+        disabled={false}
-            >
+      >
-                <ArrowBackIcon/>
+        <ArrowBackIcon />
-            </NavBarButton>
+      </NavBarButton>
 
-            <NavBarButton
+      <NavBarButton
-                type="button"
+        type="button"
-                onClick={()=>{
+        onClick={() => {
-                  socket?.emit('input:forward');
+          socket?.emit('input:forward');
-                }}
+        }}
-                disabled={false}
+        disabled={false}
-            >
+      >
-                <ArrowForwardIcon/>
+        <ArrowForwardIcon />
-            </NavBarButton>
+      </NavBarButton>
 
-            <NavBarButton
+      <NavBarButton
-                type="button"
+        type="button"
-                onClick={() => {
+        onClick={() => {
-                  if (socket) {
+          if (socket) {
-                    handleRefresh()
+            handleRefresh()
-                  }
+          }
-                }}
+        }}
-                disabled={false}
+        disabled={false}
-            >
+      >
-              <ReplayIcon/>
+        <ReplayIcon />
-            </NavBarButton>
+      </NavBarButton>
 
-            <UrlForm
+      <UrlForm
-                currentAddress={currentUrl}
+        currentAddress={currentUrl}
-                handleRefresh={handleRefresh}
+        handleRefresh={handleRefresh}
-                setCurrentAddress={addAddress}
+        setCurrentAddress={addAddress}
-            />
+      />
-        </StyledNavBar>
+    </StyledNavBar>
-    );
+  );
 }
 
 export default BrowserNavBar;