Merge pull request stakwork#2296 from saithsab877/edit-modal

[Edit Node]: Labels' First Letter Should Be `Capitalized` and Remove Underscores(`_`) Between Words

src/components/ModalsContainer/EditNodeNameModal/Title/index.tsx

@@ -10,6 +10,7 @@ import { useFeatureFlagStore } from '~/stores/useFeatureFlagStore'
 import { useSelectedNode } from '~/stores/useGraphStore'
 import { useModal } from '~/stores/useModalStore'
 import { colors } from '~/utils'
+import { formatLabel } from '../utils'
 
 export const TitleEditor = () => {
   const { open: openAddItemNodeModal } = useModal('changeNodeType')
@@ -66,7 +67,7 @@ export const TitleEditor = () => {
                 marginBottom: 8,
               }}
             >
-              {key}
+              {formatLabel(key)}
             </LabelText>
             <TextInput
               id={`cy-${key}`}

src/components/ModalsContainer/EditNodeNameModal/utils/__tests__/index.ts

@@ -1,4 +1,4 @@
-import { validateImageInputType } from '../index'
+import { formatLabel, validateImageInputType } from '../index'
 
 describe('validateImageInputType function', () => {
   it('should return true for valid image URLs', () => {
@@ -31,3 +31,12 @@ describe('validateImageInputType function', () => {
     expect(validateImageInputType('pbs.twimg.com/profile_images/1729542498006294529/AjwhArl6_normal.svg')).toBe(false)
   })
 })
+
+describe('formatLabel function', () => {
+  it('should format labels correctly', () => {
+    expect(formatLabel('name')).toBe('Name')
+    expect(formatLabel('image_url')).toBe('Image Url')
+    expect(formatLabel('twitter_handle')).toBe('Twitter Handle')
+    expect(formatLabel('date')).toBe('Date')
+  })
+})

src/components/ModalsContainer/EditNodeNameModal/utils/index.ts

@@ -7,3 +7,10 @@ export function validateImageInputType(url: string): boolean {
 
   return false
 }
+
+export function formatLabel(label: string): string {
+  return label
+    .split('_')
+    .map((word) => word.charAt(0).toUpperCase() + word.slice(1))
+    .join(' ')
+}