No symbols in fold primary tag. Limit Name to 140 chars

functions/src/create-fold.ts

@@ -28,10 +28,12 @@ export const createFold = functions.runWith({ minInstances: 1 }).https.onCall(
     if (!name || typeof name !== 'string')
       return { status: 'error', message: 'Name must be a non-empty string' }
 
+    name = name.trim().slice(0, 140)
+
     if (!about || typeof about !== 'string')
       return { status: 'error', message: 'About must be a non-empty string' }
 
-    about = about.slice(0, 140)
+    about = about.trim().slice(0, 140)
 
     if (!_.isArray(tags))
       return { status: 'error', message: 'Tags must be an array of strings' }

web/components/create-fold-button.tsx

@@ -81,6 +81,7 @@ export function CreateFoldButton() {
             className="input input-bordered resize-none"
             disabled={isSubmitting}
             value={name}
+            maxLength={140}
             onChange={(e) => updateName(e.target.value || '')}
           />
         </div>

web/lib/util/format.ts

@@ -18,7 +18,7 @@ export function formatPercent(zeroToOne: number) {
 }
 
 export function toCamelCase(words: string) {
-  return words
+  const camelCase = words
     .split(' ')
     .map((word) => word.trim())
     .filter((word) => word)
@@ -26,4 +26,8 @@ export function toCamelCase(words: string) {
       index === 0 ? word : word[0].toLocaleUpperCase() + word.substring(1)
     )
     .join('')
+
+  // Remove non-alpha-numeric-underscore chars.
+  const regex = /(?:^|\s)(?:[a-z0-9_]+)/gi
+  return (camelCase.match(regex) || [])[0] ?? ''
 }