improvement: trim search params on contacts and tickets filters

frontend/src/components/NewTicketModal/index.js

@@ -9,7 +9,9 @@ import Dialog from "@material-ui/core/Dialog";
 import DialogActions from "@material-ui/core/DialogActions";
 import DialogContent from "@material-ui/core/DialogContent";
 import DialogTitle from "@material-ui/core/DialogTitle";
-import Autocomplete from "@material-ui/lab/Autocomplete";
+import Autocomplete, {
+	createFilterOptions,
+} from "@material-ui/lab/Autocomplete";
 import CircularProgress from "@material-ui/core/CircularProgress";
 import { green } from "@material-ui/core/colors";
 
@@ -39,6 +41,12 @@ const useStyles = makeStyles(theme => ({
 	},
 }));
 
+const filterOptions = createFilterOptions({
+	matchFrom: "start",
+	trim: true,
+	stringify: option => option.name,
+});
+
 const NewTicketModal = ({ modalOpen, onClose }) => {
 	const history = useHistory();
 	const classes = useStyles();
@@ -73,6 +81,8 @@ const NewTicketModal = ({ modalOpen, onClose }) => {
 		return () => clearTimeout(delayDebounceFn);
 	}, [searchParam, modalOpen]);
 
+	console.log(options);
+
 	const handleClose = () => {
 		onClose();
 		setSearchParam("");
@@ -121,7 +131,8 @@ const NewTicketModal = ({ modalOpen, onClose }) => {
 								setSelectedContact(newValue);
 							}}
 							options={options}
-							noOptionsText="No contacts found. Try another term."
+							filterOptions={filterOptions}
+							noOptionsText={i18n.t("newTicketModal.noOptions")}
 							loading={loading}
 							renderInput={params => (
 								<TextField