Add valiation to username for bot. (#228)

mattermost · Aug 5, 2024 · aabcab0 · aabcab0
1 parent 9f44046
commit aabcab0
Show file tree

Hide file tree

Showing 2 changed files with 11 additions and 0 deletions.
diff --git a/webapp/src/components/system_console/bot.tsx b/webapp/src/components/system_console/bot.tsx
@@ -59,6 +59,8 @@ const Bot = (props: Props) => {
 		props.bot.service.type === '' ||
 		(props.bot.service.type !== 'asksage' && props.bot.service.apiKey === '') ||
 		(props.bot.service.type === 'openaicompatible' && props.bot.service.apiURL === '');
+
+    const invalidUsername = props.bot.name !== '' && (!(/^[a-z0-9.\-_]+$/).test(props.bot.name) || !(/[a-z]/).test(props.bot.name.charAt(0)));
     return (
         <BotContainer>
             <HeaderContainer onClick={() => setOpen((o) => !o)}>
@@ -79,6 +81,12 @@ const Bot = (props: Props) => {
                         <FormattedMessage defaultMessage='Missing information'/>
                     </DangerPill>
                 )}
+                {invalidUsername && (
+                    <DangerPill>
+                        <AlertOutlineIcon/>
+                        <FormattedMessage defaultMessage='Invalid Username'/>
+                    </DangerPill>
+                )}
                 <ButtonIcon
                     onClick={props.onDelete}
                 >
@@ -97,6 +105,7 @@ const Bot = (props: Props) => {
                         <TextItem
                             label={intl.formatMessage({defaultMessage: 'Bot Username'})}
                             helptext={intl.formatMessage({defaultMessage: 'Team members can mention this bot with this username'})}
+                            maxLength={22}
                             value={props.bot.name}
                             onChange={(e) => props.onChange({...props.bot, name: e.target.value})}
                         />

diff --git a/webapp/src/components/system_console/item.tsx b/webapp/src/components/system_console/item.tsx
@@ -16,6 +16,7 @@ type TextItemProps = {
     helptext?: string,
     multiline?: boolean,
     placeholder?: string,
+    maxLength?: number,
     onChange: (e: React.ChangeEvent<HTMLInputElement>) => void
 };
 
@@ -30,6 +31,7 @@ export const TextItem = (props: TextItemProps) => {
                     type={props.type ? props.type : 'text'}
                     placeholder={props.placeholder ? props.placeholder : props.label}
                     onChange={props.onChange}
+                    maxLength={props.maxLength}
                 />
                 {props.helptext &&
                 <HelpText>{props.helptext}</HelpText>