u

src/components/chat/ChatDrawer.jsx

@@ -882,6 +882,7 @@ export default class ChatDrawer extends PureComponent {
                   spellCheck: false,
                   autoCorrect: 'off',
                   autoCapitalize: 'off',
+                  autoComplete: 'off',
                   'aria-label': 'Modellslug',
                 }}
                 sx={{
@@ -968,6 +969,11 @@ export default class ChatDrawer extends PureComponent {
                 onChange={this.handleSelectConversation}
                 disabled={loadingConversations || conversations.length === 0}
                 sx={{ borderRadius: 2 }}
+                MenuProps={{
+                  sx: {
+                    zIndex: (theme) => theme.zIndex.modal + 20,
+                  },
+                }}
                 renderValue={(selectedId) => {
                   const conv = conversations.find((c) => c.id === selectedId);
                   if (!conv) return '';

src/components/vfs/VfsFileExplorer.jsx

@@ -564,6 +564,12 @@ export default class VfsFileExplorer extends PureComponent {
               placeholder="VFS durchsuchen…"
               value={searchQuery || ''}
               onChange={(e) => onSearchChange(e.target.value)}
+              inputProps={{
+                autoComplete: 'off',
+                autoCorrect: 'off',
+                autoCapitalize: 'off',
+                spellCheck: false,
+              }}
               sx={{ fontSize: '0.82rem' }}
             />
             {loading && <CircularProgress size={14} thickness={4} sx={{ mr: 0.5 }} />}
@@ -605,6 +611,7 @@ export default class VfsFileExplorer extends PureComponent {
           anchorEl={menuAnchor}
           open={Boolean(menuAnchor)}
           onClose={this.handleCloseMenu}
+          sx={{ zIndex: (theme) => theme.zIndex.modal + 20 }}
           PaperProps={{ sx: { borderRadius: 2, minWidth: 180 } }}
         >
           {isText && (

src/components/vfs/VfsNewFileDialog.jsx

@@ -4,21 +4,9 @@ import DialogTitle from '@mui/material/DialogTitle';
 import DialogContent from '@mui/material/DialogContent';
 import DialogActions from '@mui/material/DialogActions';
 import Button from '@mui/material/Button';
-import TextField from '@mui/material/TextField';
-import Box from '@mui/material/Box';
-import Chip from '@mui/material/Chip';
 import Typography from '@mui/material/Typography';
 import NoteAddRoundedIcon from '@mui/icons-material/NoteAddRounded';
-
-const COMMON_EXTENSIONS = [
-  { ext: '.txt', label: 'Text (.txt)' },
-  { ext: '.md', label: 'Markdown (.md)' },
-  { ext: '.csv', label: 'CSV (.csv)' },
-  { ext: '.json', label: 'JSON (.json)' },
-  { ext: '.js', label: 'JavaScript (.js)' },
-  { ext: '.html', label: 'HTML (.html)' },
-  { ext: '.SKILL', label: 'Agent Skill (.SKILL)' },
-];
+import SingleLineTextEdit from 'dashgui/SingleLineTextEdit';
 
 export default class VfsNewFileDialog extends PureComponent {
   constructor(props) {
@@ -27,33 +15,14 @@ export default class VfsNewFileDialog extends PureComponent {
       filename: '',
       error: '',
     };
-    this.inputRef = React.createRef();
   }
 
   componentDidUpdate(prevProps) {
     if (!prevProps.open && this.props.open) {
-      this.setState({ filename: '', error: '' }, () => {
-        setTimeout(() => this.inputRef.current?.focus(), 80);
-      });
+      this.setState({ filename: '', error: '' });
     }
   }
 
-  handleExtensionClick = (ext) => {
-    let name = this.state.filename.trim();
-    if (!name) {
-      name = `neue_datei${ext}`;
-    } else {
-      // If it already has an extension, replace it
-      const lastDot = name.lastIndexOf('.');
-      if (lastDot > 0) {
-        name = name.slice(0, lastDot) + ext;
-      } else {
-        name = name + ext;
-      }
-    }
-    this.setState({ filename: name, error: '' });
-  };
-
   handleSubmit = (e) => {
     e?.preventDefault();
     const clean = this.state.filename.trim().replace(/^[/\\]+/, '');
@@ -78,6 +47,7 @@ export default class VfsNewFileDialog extends PureComponent {
         onClose={onClose}
         maxWidth="xs"
         fullWidth
+        sx={{ zIndex: (theme) => theme.zIndex.modal + 20 }}
         PaperProps={{
           sx: { borderRadius: 3, p: 1 },
         }}
@@ -85,50 +55,23 @@ export default class VfsNewFileDialog extends PureComponent {
         <DialogTitle sx={{ display: 'flex', alignItems: 'center', gap: 1.2, pb: 1 }}>
           <NoteAddRoundedIcon color="primary" />
           <Typography variant="h6" fontWeight={700}>
-            Neue VFS-Datei erstellen
+            Neue Datei erstellen
           </Typography>
         </DialogTitle>
 
-        <form onSubmit={this.handleSubmit}>
+        <form onSubmit={this.handleSubmit} noValidate autoComplete="off">
           <DialogContent sx={{ pt: 1 }}>
-            <Typography variant="body2" color="text.secondary" sx={{ mb: 2 }}>
-              Dateien werden im virtuellen Dateisystem des aktuellen Mandanten gespeichert.
-              Verwende ggf. Unterordner wie <code>scripts/test.js</code>.
-            </Typography>
-
-            <TextField
-              inputRef={this.inputRef}
+            <SingleLineTextEdit
+              autoFocus
               fullWidth
               size="small"
-              label="Dateiname oder Pfad"
-              placeholder="z.B. rechnung.csv oder docs/info.md"
+              label=""
               value={filename}
-              onChange={(e) => this.setState({ filename: e.target.value, error: '' })}
+              onChange={(nextVal) => this.setState({ filename: nextVal, error: '' })}
               error={Boolean(error)}
               helperText={error}
-              autoFocus
-              spellCheck={false}
-              autoCapitalize="off"
+              disabled={isCreating}
             />
-
-            <Box sx={{ mt: 2 }}>
-              <Typography variant="caption" color="text.secondary" sx={{ display: 'block', mb: 1, fontWeight: 600 }}>
-                Häufige Dateitypen:
-              </Typography>
-              <Box sx={{ display: 'flex', flexWrap: 'wrap', gap: 0.75 }}>
-                {COMMON_EXTENSIONS.map((item) => (
-                  <Chip
-                    key={item.ext}
-                    label={item.ext}
-                    size="small"
-                    variant="outlined"
-                    clickable
-                    onClick={() => this.handleExtensionClick(item.ext)}
-                    sx={{ fontSize: '0.75rem', fontFamily: 'monospace', borderRadius: 1.5 }}
-                  />
-                ))}
-              </Box>
-            </Box>
           </DialogContent>
 
           <DialogActions sx={{ px: 3, pb: 2, pt: 1 }}>