feat(registration-wizard): implement automatic tenant slug locking based on subdomain

- Added logic to automatically set the tenant slug from the current subdomain in the RegistrationWizard component.
- Introduced a state to lock the tenant slug, preventing manual changes when it matches the subdomain.
- Updated WorkspaceStep to reflect the locked state and provide appropriate messaging to users.

Signed-off-by: Innei <tukon479@gmail.com>

Author: Innei

be/apps/dashboard/src/modules/auth/components/registration-wizard/RegistrationWizard.tsx

@@ -10,6 +10,7 @@ import { useAuthUserValue } from '~/atoms/auth'
 import { useRegisterTenant } from '~/modules/auth/hooks/useRegisterTenant'
 import type { TenantRegistrationFormState, TenantSiteFieldKey } from '~/modules/auth/hooks/useRegistrationForm'
 import { useRegistrationForm } from '~/modules/auth/hooks/useRegistrationForm'
+import { getTenantSlugFromHost } from '~/modules/auth/utils/domain'
 import type { SchemaFormValue, UiSchema } from '~/modules/schema-form/types'
 import { getWelcomeSiteSchema } from '~/modules/welcome/api'
 import { LinearBorderContainer } from '~/modules/welcome/components/LinearBorderContainer'
@@ -41,6 +42,7 @@ export const RegistrationWizard: FC = () => {
   const [maxVisitedIndex, setMaxVisitedIndex] = useState(0)
   const contentRef = useRef<HTMLElement | null>(null)
   const slugManuallyEditedRef = useRef(false)
+  const [lockedTenantSlug, setLockedTenantSlug] = useState<string | null>(null)
   const siteDefaultsAppliedRef = useRef(false)
 
   const siteSchemaQuery = useQuery({
@@ -58,6 +60,25 @@ export const RegistrationWizard: FC = () => {
     })
   }, [])
 
+  useEffect(() => {
+    try {
+      const { hostname } = window.location
+      const slug = getTenantSlugFromHost(hostname)
+      if (!slug) {
+        return
+      }
+      setLockedTenantSlug((prev) => (prev === slug ? prev : slug))
+      slugManuallyEditedRef.current = true
+      const currentValue = form.getFieldValue('tenantSlug')
+      if (currentValue !== slug) {
+        form.setFieldValue('tenantSlug', () => slug)
+        void form.validateField('tenantSlug', 'change')
+      }
+    } catch {
+      // Ignore hostname parsing failures; user can still enter slug manually.
+    }
+  }, [form])
+
   useEffect(() => {
     const data = siteSchemaQuery.data as
       | {
@@ -365,6 +386,7 @@ export const RegistrationWizard: FC = () => {
           <WorkspaceStep
             form={form}
             slugManuallyEditedRef={slugManuallyEditedRef}
+            lockedTenantSlug={lockedTenantSlug}
             isSubmitting={isLoading}
             onFieldInteraction={onFieldInteraction}
           />

be/apps/dashboard/src/modules/auth/components/registration-wizard/steps/WorkspaceStep.tsx

@@ -9,13 +9,15 @@ import { firstErrorMessage } from '../utils'
 type WorkspaceStepProps = {
   form: ReturnType<typeof useRegistrationForm>
   slugManuallyEditedRef: MutableRefObject<boolean>
+  lockedTenantSlug?: string | null
   isSubmitting: boolean
   onFieldInteraction: () => void
 }
 
 export const WorkspaceStep: FC<WorkspaceStepProps> = ({
   form,
   slugManuallyEditedRef,
+  lockedTenantSlug,
   isSubmitting,
   onFieldInteraction,
 }) => (
@@ -63,26 +65,33 @@ export const WorkspaceStep: FC<WorkspaceStepProps> = ({
       <form.Field name="tenantSlug">
         {(field) => {
           const error = firstErrorMessage(field.state.meta.errors)
+          const isSlugLocked = Boolean(lockedTenantSlug)
+          const helperText = isSlugLocked
+            ? 'Workspace slug follows the current subdomain and cannot be changed in this flow.'
+            : 'Lowercase letters, numbers, and hyphen are allowed. We&apos;ll ensure the slug is unique.'
+
           return (
             <div className="space-y-2">
               <Label htmlFor={field.name}>Workspace slug</Label>
               <Input
                 id={field.name}
                 value={field.state.value}
                 onChange={(event) => {
+                  if (isSlugLocked) {
+                    return
+                  }
                   onFieldInteraction()
                   slugManuallyEditedRef.current = true
                   field.handleChange(event.currentTarget.value)
                 }}
                 onBlur={field.handleBlur}
                 placeholder="acme"
-                disabled={isSubmitting}
+                disabled={isSubmitting || isSlugLocked}
+                readOnly={isSlugLocked}
                 error={Boolean(error)}
                 autoComplete="off"
               />
-              <p className="text-text-tertiary text-xs">
-                Lowercase letters, numbers, and hyphen are allowed. We&apos;ll ensure the slug is unique.
-              </p>
+              <p className="text-text-tertiary text-xs">{helperText}</p>
               <FormError>{error}</FormError>
             </div>
           )