diff --git a/frontend/src/Call/GroupModal.js b/frontend/src/Call/GroupModal.js
index 328fbd5..608177b 100644
--- a/frontend/src/Call/GroupModal.js
+++ b/frontend/src/Call/GroupModal.js
@@ -8,32 +8,21 @@ import {
 import "./FilterModal.css";
 
 
-class GroupModal extends Component {
-  constructor(props) {
-    super(props)
-    this.handleInputChange = this.handleInputChange.bind(this);
-    this.handleDone = this.handleDone.bind(this);
-    this.handleClose = this.handleClose.bind(this);
+function GroupModal(props)  {
 
-    this.state = {
-      open: false,
-      selectedGroup: false
-    }
-}
+const [open, setOpen] = useState(false);
+const [selectedGroup, setSelectedGroup] = useState(false);
 
+const handleInputChange = (e, { name, value }) => this.setState({ [name]: value });
+const handleClose = () => this.props.onClose(false);
 
-handleInputChange = (e, { name, value }) => this.setState({ [name]: value });
-handleClose = () => this.props.onClose(false);
-
-handleDone(event) {
-
+const handleDone = () => {
       if (this.state.selectedGroup) {
         this.props.callActions.setGroupFilter(this.state.selectedGroup);
         this.props.onClose(true);
       } else {
         this.props.onClose(false);
       }
-
 }
 componentDidUpdate(prevProps) {