u

src/components/chat/ChatDrawer.jsx

@@ -26,6 +26,9 @@ import DirectionsWalkRoundedIcon from '@mui/icons-material/DirectionsWalkRounded
 import DirectionsRunRoundedIcon from '@mui/icons-material/DirectionsRunRounded';
 import PsychologyRoundedIcon from '@mui/icons-material/PsychologyRounded';
 import FolderOpenRoundedIcon from '@mui/icons-material/FolderOpenRounded';
+import DarkModeRoundedIcon from '@mui/icons-material/DarkModeRounded';
+import LightModeRoundedIcon from '@mui/icons-material/LightModeRounded';
+import CycloneRoundedIcon from '@mui/icons-material/CycloneRounded';
 
 import { setting as settingApi } from '../../api';
 import chatAutomat, { selectPendingAskUser } from '../../automats/chatAutomat';
@@ -627,6 +630,17 @@ export default class ChatDrawer extends PureComponent {
       this.setState({ modelreasoning: current });
     }
   };
+  handleSetModelslug = async (nextSlug) => {
+    if (this.state.modelslug === nextSlug) return;
+    const current = this.state.modelslug;
+    this.setState({ modelslug: nextSlug });
+    try {
+      await settingApi.upsert('modelslug', { value: nextSlug });
+    } catch (err) {
+      console.error('[ChatDrawer] Failed to save modelslug:', err);
+      this.setState({ modelslug: current });
+    }
+  };
 
   handleModelslugChange = (e) => {
     this.setState({ modelslug: e.target.value });
@@ -871,6 +885,79 @@ export default class ChatDrawer extends PureComponent {
 
               <Divider orientation="vertical" flexItem sx={{ mx: 0.3, my: 0.5 }} />
 
+              {/* Group 3: Model preset shortcuts (moon -> luna, sun -> sol, universe -> astra) */}
+              <Box
+                sx={{
+                  display: 'inline-flex',
+                  alignItems: 'center',
+                  gap: 0.3,
+                  bgcolor: (theme) => (theme.palette.mode === 'dark' ? 'rgba(255,255,255,0.06)' : 'rgba(0,0,0,0.05)'),
+                  p: 0.3,
+                  borderRadius: 2,
+                  flexShrink: 0,
+                }}
+              >
+                {/* moon toggle (openai/gpt-6-luna) */}
+                <IconButton
+                  size="small"
+                  onClick={() => this.handleSetModelslug('openai/gpt-6-luna')}
+                  aria-label="Luna (openai/gpt-6-luna)"
+                  sx={{
+                    p: 0.3,
+                    width: 26,
+                    height: 26,
+                    borderRadius: 1.5,
+                    bgcolor: modelslug === 'openai/gpt-6-luna' ? 'primary.main' : 'transparent',
+                    color: modelslug === 'openai/gpt-6-luna' ? 'primary.contrastText' : 'text.secondary',
+                    '&:hover': {
+                      bgcolor: modelslug === 'openai/gpt-6-luna' ? 'primary.dark' : 'action.selected',
+                    },
+                  }}
+                >
+                  <DarkModeRoundedIcon sx={{ fontSize: 16 }} />
+                </IconButton>
+
+                {/* sun toggle (openai/gpt-6.1-sol) */}
+                <IconButton
+                  size="small"
+                  onClick={() => this.handleSetModelslug('openai/gpt-6.1-sol')}
+                  aria-label="Sol (openai/gpt-6.1-sol)"
+                  sx={{
+                    p: 0.3,
+                    width: 26,
+                    height: 26,
+                    borderRadius: 1.5,
+                    bgcolor: modelslug === 'openai/gpt-6.1-sol' ? 'primary.main' : 'transparent',
+                    color: modelslug === 'openai/gpt-6.1-sol' ? 'primary.contrastText' : 'text.secondary',
+                    '&:hover': {
+                      bgcolor: modelslug === 'openai/gpt-6.1-sol' ? 'primary.dark' : 'action.selected',
+                    },
+                  }}
+                >
+                  <LightModeRoundedIcon sx={{ fontSize: 17 }} />
+                </IconButton>
+
+                {/* universe toggle (openai/gpt-6-astra) */}
+                <IconButton
+                  size="small"
+                  onClick={() => this.handleSetModelslug('openai/gpt-6-astra')}
+                  aria-label="Astra (openai/gpt-6-astra)"
+                  sx={{
+                    p: 0.3,
+                    width: 26,
+                    height: 26,
+                    borderRadius: 1.5,
+                    bgcolor: modelslug === 'openai/gpt-6-astra' ? 'primary.main' : 'transparent',
+                    color: modelslug === 'openai/gpt-6-astra' ? 'primary.contrastText' : 'text.secondary',
+                    '&:hover': {
+                      bgcolor: modelslug === 'openai/gpt-6-astra' ? 'primary.dark' : 'action.selected',
+                    },
+                  }}
+                >
+                  <CycloneRoundedIcon sx={{ fontSize: 17 }} />
+                </IconButton>
+              </Box>
+
               {/* modelslug input */}
               <InputBase
                 value={modelslug || ''}
@@ -1167,6 +1254,8 @@ export default class ChatDrawer extends PureComponent {
       <Box
         component="form"
         onSubmit={this.handleSend}
+        noValidate
+        autoComplete="off"
         onDragEnter={this.handleDragEnter}
         onDragOver={this.handleDragOver}
         onDragLeave={this.handleDragLeave}
@@ -1444,6 +1533,12 @@ export default class ChatDrawer extends PureComponent {
               onFocus={() => this.setState({ isInputFocused: true })}
               onBlur={() => this.setState({ isInputFocused: false })}
               disabled={!canChat}
+              inputProps={{
+                spellCheck: false,
+                autoCorrect: 'off',
+                autoCapitalize: 'off',
+                autoComplete: 'off',
+              }}
               placeholder={
                 pendingAsk
                   ? 'Bitte Frage oben beantworten…'