From 672c7e623c91e5a0dd2663c4e66472abfa3914b0 Mon Sep 17 00:00:00 2001
From: Samuel Newman <mozzius@protonmail.com>
Date: Fri, 10 Jan 2025 13:18:28 +0000
Subject: [PATCH 1/2] validate too long handles in signup

---
 src/lib/strings/handles.ts        | 12 ++++++++++--
 src/screens/Signup/StepHandle.tsx | 13 ++++++++++---
 2 files changed, 20 insertions(+), 5 deletions(-)

diff --git a/src/lib/strings/handles.ts b/src/lib/strings/handles.ts
index 90786ac3f6..1672cfb258 100644
--- a/src/lib/strings/handles.ts
+++ b/src/lib/strings/handles.ts
@@ -19,6 +19,10 @@ export function createFullHandle(name: string, domain: string): string {
   return `${name}.${domain}`
 }
 
+export function maxServiceHandleLength(domain: string): number {
+  return 30 - `.${(domain || '').replace(/^[.]+/, '')}`.length
+}
+
 export function isInvalidHandle(handle: string): boolean {
   return handle === 'handle.invalid'
 }
@@ -38,7 +42,11 @@ export interface IsValidHandle {
 }
 
 // More checks from https://github.com/bluesky-social/atproto/blob/main/packages/pds/src/handle/index.ts#L72
-export function validateHandle(str: string, userDomain: string): IsValidHandle {
+export function validateHandle(
+  str: string,
+  userDomain: string,
+  serviceHandle?: boolean,
+): IsValidHandle {
   const fullHandle = createFullHandle(str, userDomain)
 
   const results = {
@@ -46,7 +54,7 @@ export function validateHandle(str: string, userDomain: string): IsValidHandle {
       !str || (VALIDATE_REGEX.test(fullHandle) && !str.includes('.')),
     hyphenStartOrEnd: !str.startsWith('-') && !str.endsWith('-'),
     frontLength: str.length >= 3,
-    totalLength: fullHandle.length <= 253,
+    totalLength: fullHandle.length <= (serviceHandle ? 30 : 253),
   }
 
   return {
diff --git a/src/screens/Signup/StepHandle.tsx b/src/screens/Signup/StepHandle.tsx
index dee7df8488..1d04264aec 100644
--- a/src/screens/Signup/StepHandle.tsx
+++ b/src/screens/Signup/StepHandle.tsx
@@ -4,7 +4,11 @@ import {msg, Trans} from '@lingui/macro'
 import {useLingui} from '@lingui/react'
 
 import {logEvent} from '#/lib/statsig/statsig'
-import {createFullHandle, validateHandle} from '#/lib/strings/handles'
+import {
+  createFullHandle,
+  maxServiceHandleLength,
+  validateHandle,
+} from '#/lib/strings/handles'
 import {useAgent} from '#/state/session'
 import {ScreenTransition} from '#/screens/Login/ScreenTransition'
 import {useSignupContext} from '#/screens/Signup/state'
@@ -93,7 +97,7 @@ export function StepHandle() {
     })
   }, [dispatch, state.activeStep])
 
-  const validCheck = validateHandle(draftValue, state.userDomain)
+  const validCheck = validateHandle(draftValue, state.userDomain, true)
   return (
     <ScreenTransition>
       <View style={[a.gap_lg]}>
@@ -166,7 +170,10 @@ export function StepHandle() {
               />
               {!validCheck.totalLength ? (
                 <Text style={[a.text_md, a.flex_1]}>
-                  <Trans>No longer than 253 characters</Trans>
+                  <Trans>
+                    No longer than {maxServiceHandleLength(state.userDomain)}{' '}
+                    characters
+                  </Trans>
                 </Text>
               ) : (
                 <Text style={[a.text_md, a.flex_1]}>

From 02cc95ae846a9524159dfb286fa4e5b57669513b Mon Sep 17 00:00:00 2001
From: Samuel Newman <mozzius@protonmail.com>
Date: Fri, 10 Jan 2025 13:28:18 +0000
Subject: [PATCH 2/2] make change handle screen generic

---
 src/lib/strings/handles.ts                             |  4 ++--
 src/screens/Settings/components/ChangeHandleDialog.tsx | 10 ++++------
 2 files changed, 6 insertions(+), 8 deletions(-)

diff --git a/src/lib/strings/handles.ts b/src/lib/strings/handles.ts
index 1672cfb258..bf329a869d 100644
--- a/src/lib/strings/handles.ts
+++ b/src/lib/strings/handles.ts
@@ -45,7 +45,7 @@ export interface IsValidHandle {
 export function validateHandle(
   str: string,
   userDomain: string,
-  serviceHandle?: boolean,
+  isServiceHandle?: boolean,
 ): IsValidHandle {
   const fullHandle = createFullHandle(str, userDomain)
 
@@ -54,7 +54,7 @@ export function validateHandle(
       !str || (VALIDATE_REGEX.test(fullHandle) && !str.includes('.')),
     hyphenStartOrEnd: !str.startsWith('-') && !str.endsWith('-'),
     frontLength: str.length >= 3,
-    totalLength: fullHandle.length <= (serviceHandle ? 30 : 253),
+    totalLength: fullHandle.length <= (isServiceHandle ? 30 : 253),
   }
 
   return {
diff --git a/src/screens/Settings/components/ChangeHandleDialog.tsx b/src/screens/Settings/components/ChangeHandleDialog.tsx
index bb03aace17..37f6ed9eff 100644
--- a/src/screens/Settings/components/ChangeHandleDialog.tsx
+++ b/src/screens/Settings/components/ChangeHandleDialog.tsx
@@ -172,13 +172,11 @@ function ProvidedHandlePage({
   const host = serviceInfo.availableUserDomains[0]
 
   const validation = useMemo(
-    () => validateHandle(subdomain, host),
+    () => validateHandle(subdomain, host, true),
     [subdomain, host],
   )
 
-  const isTooLong = subdomain.length > 18
   const isInvalid =
-    isTooLong ||
     !validation.handleChars ||
     !validation.hyphenStartOrEnd ||
     !validation.totalLength
@@ -231,10 +229,10 @@ function ProvidedHandlePage({
             label={_(msg`Save new handle`)}
             variant="solid"
             size="large"
-            color={validation.overall && !isTooLong ? 'primary' : 'secondary'}
-            disabled={!validation.overall && !isTooLong}
+            color={validation.overall ? 'primary' : 'secondary'}
+            disabled={!validation.overall}
             onPress={() => {
-              if (validation.overall && !isTooLong) {
+              if (validation.overall) {
                 changeHandle({handle: createFullHandle(subdomain, host)})
               }
             }}>