chore: add missing workspace name validation to settings and admin forms

Author: prateekshourya29

apps/admin/app/(all)/(dashboard)/workspace/create/form.tsx

@@ -8,6 +8,7 @@ import { Button, getButtonStyling } from "@plane/propel/button";
 import { TOAST_TYPE, setToast } from "@plane/propel/toast";
 import { InstanceWorkspaceService } from "@plane/services";
 import type { IWorkspace } from "@plane/types";
+import { validateSlug, validateWorkspaceName } from "@plane/utils";
 // components
 import { CustomSelect, Input } from "@plane/ui";
 // hooks
@@ -90,14 +91,7 @@ export function WorkspaceCreateForm() {
               control={control}
               name="name"
               rules={{
-                required: "This is a required field.",
-                validate: (value) =>
-                  /^[\w\s-]*$/.test(value) ||
-                  `Workspaces names can contain only (" "), ( - ), ( _ ) and alphanumeric characters.`,
-                maxLength: {
-                  value: 80,
-                  message: "Limit your name to 80 characters.",
-                },
+                validate: (value) => validateWorkspaceName(value, true),
               }}
               render={({ field: { value, ref, onChange } }) => (
                 <Input
@@ -129,11 +123,7 @@ export function WorkspaceCreateForm() {
               control={control}
               name="slug"
               rules={{
-                required: "The URL is a required field.",
-                maxLength: {
-                  value: 48,
-                  message: "Limit your URL to 48 characters.",
-                },
+                validate: (value) => validateSlug(value),
               }}
               render={({ field: { onChange, value, ref } }) => (
                 <Input

apps/web/core/components/workspace/settings/workspace-details.tsx

@@ -9,7 +9,7 @@ import { EditIcon } from "@plane/propel/icons";
 import { TOAST_TYPE, setToast } from "@plane/propel/toast";
 import type { IWorkspace } from "@plane/types";
 import { CustomSelect, Input } from "@plane/ui";
-import { copyUrlToClipboard, getFileURL } from "@plane/utils";
+import { copyUrlToClipboard, getFileURL, validateWorkspaceName } from "@plane/utils";
 // components
 import { WorkspaceImageUploadModal } from "@/components/core/modals/workspace-image-upload-modal";
 import { TimezoneSelect } from "@/components/global/timezone-select";
@@ -188,11 +188,7 @@ export const WorkspaceDetails = observer(function WorkspaceDetails() {
                 control={control}
                 name="name"
                 rules={{
-                  required: t("workspace_settings.settings.general.errors.name.required"),
-                  maxLength: {
-                    value: 80,
-                    message: t("workspace_settings.settings.general.errors.name.max_length"),
-                  },
+                  validate: (value) => validateWorkspaceName(value, true),
                 }}
                 render={({ field: { value, onChange, ref } }) => (
                   <Input
@@ -209,6 +205,7 @@ export const WorkspaceDetails = observer(function WorkspaceDetails() {
                   />
                 )}
               />
+              {errors.name && <p className="text-caption-sm-regular text-danger-primary">{errors.name.message}</p>}
             </div>
 
             <div className="flex flex-col gap-1 ">