update imports for React 18

Change-Id: Ibc75ce532003a478b31d5d85d84c83a017262041
diff --git a/client/src/components/buttons.js b/client/src/components/buttons.js
index e1b82a4..7ea9802 100644
--- a/client/src/components/buttons.js
+++ b/client/src/components/buttons.js
@@ -2,7 +2,7 @@
 import { Box, ClickAwayListener, IconButton, Popper } from "@mui/material";
 import { styled } from "@mui/material/styles";
 import EmojiPicker from "emoji-picker-react";
-import React from "react";
+import { useState, useCallback } from "react";
 import { Arrow2Icon, ArrowIcon, CameraIcon, CameraInBubbleIcon, CancelIcon, CrossedEyeIcon, CrossIcon, EmojiIcon, EyeIcon, FolderIcon, InfoIcon, MicroInBubbleIcon, PaperClipIcon, PenIcon } from "./svgIcons";
 
 const RoundButton = styled(
@@ -215,19 +215,19 @@
 }
 
 export const SelectEmojiButton = (props) => {
-    const [anchorEl, setAnchorEl] = React.useState(null)
+    const [anchorEl, setAnchorEl] = useState(null)
   
-    const handleOpenEmojiPicker = React.useCallback(
+    const handleOpenEmojiPicker = useCallback(
       e => setAnchorEl(anchorEl ? null : e.currentTarget),
       [anchorEl],
     )
   
-    const handleClose = React.useCallback(
+    const handleClose = useCallback(
       () => setAnchorEl(null),
       [setAnchorEl],
     )
   
-    const onEmojiClick = React.useCallback(
+    const onEmojiClick = useCallback(
       (e, emojiObject) => {
         props.onEmojiSelected(emojiObject.emoji)
         handleClose()