Prefer arrow functions and callbacks (#1210)

src/components/RoomDialog.tsx

@@ -9,7 +9,7 @@ import { copyTextToSystemClipboard } from "../clipboard";
 import { Dialog } from "./Dialog";
 import { AppState } from "../types";
 
-function RoomModal({
+const RoomModal = ({
   activeRoomLink,
   username,
   onUsernameChange,
@@ -23,21 +23,21 @@ function RoomModal({
   onRoomCreate: () => void;
   onRoomDestroy: () => void;
   onPressingEnter: () => void;
-}) {
+}) => {
   const roomLinkInput = useRef<HTMLInputElement>(null);
 
-  function copyRoomLink() {
+  const copyRoomLink = () => {
     copyTextToSystemClipboard(activeRoomLink);
     if (roomLinkInput.current) {
       roomLinkInput.current.select();
     }
-  }
-  function selectInput(event: React.MouseEvent<HTMLInputElement>) {
+  };
+  const selectInput = (event: React.MouseEvent<HTMLInputElement>) => {
     if (event.target !== document.activeElement) {
       event.preventDefault();
       (event.target as HTMLInputElement).select();
     }
-  }
+  };
 
   return (
     <div className="RoomDialog-modal">
@@ -113,9 +113,9 @@ function RoomModal({
       )}
     </div>
   );
-}
+};
 
-export function RoomDialog({
+export const RoomDialog = ({
   isCollaborating,
   collaboratorCount,
   username,
@@ -129,7 +129,7 @@ export function RoomDialog({
   onUsernameChange: (username: string) => void;
   onRoomCreate: () => void;
   onRoomDestroy: () => void;
-}) {
+}) => {
   const [modalIsShown, setModalIsShown] = useState(false);
   const [activeRoomLink, setActiveRoomLink] = useState("");
 
@@ -182,4 +182,4 @@ export function RoomDialog({
       )}
     </>
   );
-}
+};