refactor: shared url_safe_basic constant (#5952)

Uses a new `URL_SAFE_BASIC` regex constant that checks for characters
that are commonly used in URL path sections: alphanumeric lowercase
characters, dashes and underscores.

This will allow us to re-use this constant in our server-side
validation.

frontend/src/component/incomingWebhooks/IncomingWebhooksModal/IncomingWebhooksForm/useIncomingWebhooksForm.ts

@@ -1,9 +1,8 @@
+import { URL_SAFE_BASIC } from '@server/util/constants';
 import { useIncomingWebhooks } from 'hooks/api/getters/useIncomingWebhooks/useIncomingWebhooks';
 import { IIncomingWebhook } from 'interfaces/incomingWebhook';
 import { useEffect, useState } from 'react';
 
-const INCOMING_WEBHOOK_NAME_REGEX = /^[A-Za-z0-9\-_]*$/;
-
 enum ErrorField {
     NAME = 'name',
     TOKEN_NAME = 'tokenName',
@@ -66,8 +65,7 @@ export const useIncomingWebhooksForm = (incomingWebhook?: IIncomingWebhook) => {
             ({ id, name }) => id !== incomingWebhook?.id && name === value,
         );
 
-    const isNameInvalid = (value: string) =>
-        !INCOMING_WEBHOOK_NAME_REGEX.test(value);
+    const isNameInvalid = (value: string) => !URL_SAFE_BASIC.test(value);
 
     const validateName = (name: string) => {
         if (isEmpty(name)) {
@@ -83,7 +81,7 @@ export const useIncomingWebhooksForm = (incomingWebhook?: IIncomingWebhook) => {
         if (isNameInvalid(name)) {
             setError(
                 ErrorField.NAME,
-                'Name must only contain alphanumeric characters, dashes and underscores.',
+                'Name must only contain alphanumeric lowercase characters, dashes and underscores.',
             );
             return false;
         }

src/lib/util/constants.ts

@@ -3,6 +3,8 @@ export const DEFAULT_ENV = 'default';
 export const ALL_PROJECTS = '*';
 export const ALL_ENVS = '*';
 
+export const URL_SAFE_BASIC = /^[a-z0-9\-_]*$/;
+
 export const ROOT_PERMISSION_TYPE = 'root';
 export const ENVIRONMENT_PERMISSION_TYPE = 'environment';
 export const PROJECT_PERMISSION_TYPE = 'project';