updated for the mobile view

src/pages/team/UserFormDialog.jsx

@@ -1,8 +1,9 @@
 import { useState, useEffect } from 'react';
 import {
   Dialog, DialogTitle, DialogContent, DialogActions, Button, Grid, TextField,
-  MenuItem, Alert, CircularProgress, IconButton
+  MenuItem, Alert, CircularProgress, IconButton, useMediaQuery
 } from '@mui/material';
+import { useTheme } from '@mui/material/styles';
 import CloseIcon from '@mui/icons-material/Close';
 import { createPoint, setPayload, COLLECTIONS } from '@/utils/qdrant';
 
@@ -14,6 +15,8 @@ const withValue = (opts, v) => (v && !opts.includes(v) ? [v, ...opts] : opts);
 
 export default function UserFormDialog({ open, mode, initial, onClose, onSaved }) {
   const isEdit = mode === 'edit';
+  const theme = useTheme();
+  const fullScreen = useMediaQuery(theme.breakpoints.down('sm'));
   const [form, setForm] = useState(EMPTY);
   const [saving, setSaving] = useState(false);
   const [error, setError] = useState(null);
@@ -56,7 +59,7 @@ export default function UserFormDialog({ open, mode, initial, onClose, onSaved }
   };
 
   return (
-    <Dialog open={open} onClose={saving ? undefined : onClose} maxWidth="sm" fullWidth>
+    <Dialog open={open} onClose={saving ? undefined : onClose} maxWidth="sm" fullWidth fullScreen={fullScreen}>
       <DialogTitle sx={{ display: 'flex', alignItems: 'center', justifyContent: 'space-between' }}>
         {isEdit ? 'Edit Team User' : 'Add Team User'}
         <IconButton onClick={onClose} size="small" disabled={saving}><CloseIcon /></IconButton>