feat: farcaster account in profile

e2e/specs/stateless/profileEditor.spec.ts

@@ -725,7 +725,7 @@ test.describe('unwrapped', () => {
     await profilePage.profileEditorInput('eth').fill('')
     await expect(await profilePage.profileEditorInput('eth')).toHaveAttribute(
       'placeholder',
-      '0xD9hbQK...',
+      '0xb8c2C2...',
     )
     await profilePage.profileEditorClearButton('eth').click()
     await profilePage.profileEditorInput('btc').fill('')
@@ -854,7 +854,7 @@ test.describe('wrapped', () => {
     await profilePage.profileEditorInput('eth').fill('')
     await expect(await profilePage.profileEditorInput('eth')).toHaveAttribute(
       'placeholder',
-      '0xD9hbQK...',
+      '0xb8c2C2...',
     )
     await profilePage.profileEditorClearButton('eth').click()
     await profilePage.profileEditorInput('btc').fill('')

public/locales/en/register.json

@@ -58,26 +58,28 @@
           "social": {
             "label": "Social",
             "items": {
-              "com.twitter": "Twitter",
-              "com.github": "GitHub",
+              "email": "Email",
               "com.discord": "Discord",
-              "org.telegram": "Telegram",
-              "email": "Email"
+              "com.github": "GitHub",
+              "com.twitter": "Twitter",
+              "eth.farcaster": "Farcaster",
+              "org.telegram": "Telegram"
             },
             "placeholder": {
-              "com.twitter": "e.g. ensdomains",
-              "com.github": "e.g. ensdomains",
+              "email": "e.g. hello@example.com",
               "com.discord": "e.g. nickjohnson",
-              "org.telegram": "e.g. nicksdjohnson",
-              "email": "e.g. hello@example.com"
+              "com.github": "e.g. ensdomains",
+              "com.twitter": "e.g. ensdomains",
+              "eth.farcaster": "e.g. ensdomains",
+              "org.telegram": "e.g. nicksdjohnson"
             }
           },
           "address": {
             "label": "Address",
             "itemLabel": "{{coin}} address",
             "placeholder": {
               "default": "Add address here",
-              "eth": "0xD9hbQK...",
+              "eth": "0xb8c2C2...",
               "bnb": "bnb1grpf...",
               "btc": "3FZbgi29...",
               "ltc": "ltc1qdp7p...",

public/locales/en/transactionFlow.json

@@ -54,11 +54,12 @@
           "noOptions": "No account options available",
           "placeholder": {
             "default": "Add username here",
-            "com.twitter": "e.g. nicksdjohnson",
-            "com.github": "e.g. arachnid",
+            "email": "e.g. hello@example.com",
             "com.discord": "e.g. nickjohnson",
-            "org.telegram": "e.g. nicksdjohnson",
-            "email": "e.g. hello@example.com"
+            "com.github": "e.g. arachnid",
+            "com.twitter": "e.g. nicksdjohnson",
+            "eth.farcaster": "e.g. nick.eth",
+            "org.telegram": "e.g. nicksdjohnson"
           }
         },
         "address": {
@@ -67,10 +68,10 @@
           "noOptions": "No address options available",
           "placeholder": {
             "default": "Add address here",
-            "eth": "0xD9hbQK...",
-            "bnb": "0xD9hbQK...",
+            "eth": "0xb8c2C2...",
+            "bnb": "bnb1grpf...",
             "btc": "3FZbgi29...",
-            "ltc": "3FZbgi29...",
+            "ltc": "ltc1qdp7p...",
             "sol": "D4kA7VzHnmV...",
             "dot": "1D4kA7VxH...",
             "doge": "DFabcd12..."
@@ -219,7 +220,8 @@
         "title_one": "You do not own this name",
         "title_other": "You do not own all these names",
         "description_one": "Extending this name will extend the current owner's registration length. This will not give you ownership of it.",
-        "description_other": "Extending these names will extend the current owner's registration length. This will not give you ownership if you are not already the owner"      },
+        "description_other": "Extending these names will extend the current owner's registration length. This will not give you ownership if you are not already the owner"
+      },
       "invoice": {
         "extension": "{{count}} year extension",
         "transaction": "Transaction fee",

public/locales/nl/transactionFlow.json

@@ -63,13 +63,13 @@
           "noOptions": "Geen adres opties beschikbaar",
           "placeholder": {
             "default": "Voeg adres hier toe",
-            "ETH": "0xD9hbQK...",
-            "BNB": "0xD9hbQK...",
-            "BTC": "3FZbgi29...",
-            "LTC": "3FZbgi29...",
-            "SOL": "D4kA7VzHnmV...",
-            "DOT": "1D4kA7VxH...",
-            "DOGE": "DFabcd12..."
+            "eth": "0xb8c2C2...",
+            "bnb": "bnb1grpf...",
+            "btc": "3FZbgi29...",
+            "ltc": "ltc1qdp7p...",
+            "sol": "D4kA7VzHnmV...",
+            "dot": "1D4kA7VxH...",
+            "doge": "DFabcd12..."
           }
         },
         "contentHash": {

public/locales/zh/register.json

@@ -77,7 +77,7 @@
             "itemLabel": "{{coin}} 地址",
             "placeholder": {
               "default": "在此添加地址",
-              "eth": "0xD9hbQK...",
+              "eth": "0xb8c2C2...",
               "bnb": "bnb1grpf...",
               "btc": "3FZbgi29...",
               "ltc": "ltc1qdp7p...",
@@ -161,10 +161,7 @@
         "等待计时器完成 60 秒计时",
         "完成第二笔交易来获得该名称"
       ],
-      "moonpayItems": [
-        "创建或登录现有的 Moonpay 账户", 
-        "使用信用卡或借记卡完成单笔交易"
-      ],
+      "moonpayItems": ["创建或登录现有的 Moonpay 账户", "使用信用卡或借记卡完成单笔交易"],
       "setupProfile": "我希望先创建我的个人资料",
       "paymentMethod": "支付方式",
       "notEnoughEth": "钱包中的 ETH 不足",

public/locales/zh/transactionFlow.json

@@ -66,13 +66,13 @@
           "noOptions": "没有可用的地址",
           "placeholder": {
             "default": "在此添加地址",
-            "ETH": "0xD9hbQK...",
-            "BNB": "0xD9hbQK...",
-            "BTC": "3FZbgi29...",
-            "LTC": "3FZbgi29...",
-            "SOL": "D4kA7VzHnmV...",
-            "DOT": "1D4kA7VxH...",
-            "DOGE": "DFabcd12..."
+            "eth": "0xb8c2C2...",
+            "bnb": "bnb1grpf...",
+            "btc": "3FZbgi29...",
+            "ltc": "ltc1qdp7p...",
+            "sol": "D4kA7VzHnmV...",
+            "dot": "1D4kA7VxH...",
+            "doge": "DFabcd12..."
           }
         },
         "contentHash": {
@@ -344,7 +344,7 @@
       "invalidResolver": {
         "title": "未经授权的解析器",
         "description": "要使用此名称作为您的主名称，您需要先设置一个有效的解析器并更新该名称的 ETH 地址记录。"
-      }     
+      }
     },
     "multiStepSubnameDelete": {
       "title": "删除子名称",

src/assets/social/DynamicSocialIcon.tsx

@@ -4,27 +4,29 @@ import dynamic from 'next/dynamic'
 import { QuestionCircleSVG } from '@ensdomains/thorin'
 
 export const socialIconTypes = {
+  email: dynamic(() => import('@ensdomains/thorin').then((m) => m.EnvelopeSVG)),
   'com.discord': dynamic(() => import('./SocialDiscord.svg')),
   'com.discourse': dynamic(() => import('./SocialDiscourseColour.svg')),
   'com.github': dynamic(() => import('./SocialGithub.svg')),
   'com.medium': dynamic(() => import('./SocialMedium.svg')),
   'com.twitter': dynamic(() => import('./SocialX.svg')),
   'com.youtube': dynamic(() => import('./SocialYoutube.svg')),
+  'eth.farcaster': dynamic(() => import('./SocialFarcaster.svg')),
   'org.telegram': dynamic(() => import('./SocialTelegram.svg')),
   'xyz.mirror': dynamic(() => import('./SocialMirrorColour.svg')),
-  email: dynamic(() => import('@ensdomains/thorin').then((m) => m.EnvelopeSVG)),
 }
 
 export const socialIconColors = {
+  email: '#000000',
   'com.discord': '#5A57DD',
   'com.discourse': undefined,
   'com.github': '#000000',
   'com.medium': '#000000',
   'com.twitter': '#000000',
   'com.youtube': '#FF0000',
+  'eth.farcaster': '#8A63D2',
   'org.telegram': '#2BABEE',
   'xyz.mirror': undefined,
-  email: '#000000',
 }
 
 export const DynamicSocialIcon = ({

src/constants/supportedSocialRecordKeys.ts

@@ -1,7 +1,8 @@
 export const supportedSocialRecordKeys = [
-  'com.twitter',
-  'com.github',
+  'email',
   'com.discord',
+  'com.github',
+  'com.twitter',
+  'eth.farcaster',
   'org.telegram',
-  'email',
 ] as const

src/constants/textRecords.ts

@@ -1,14 +1,15 @@
 export const textRecords = [
-  'email',
-  'url',
   'avatar',
   'description',
-  'notice',
+  'email',
   'keywords',
+  'notice',
+  'url',
   'com.discord',
   'com.github',
   'com.reddit',
   'com.twitter',
-  'org.telegram',
+  'eth.farcaster',
   'eth.ens.delegate',
+  'org.telegram',
 ] as const

src/hooks/useProfileEditorForm.test.ts

@@ -266,6 +266,18 @@ describe('useProfileEditorForm', () => {
         username: 'test@example',
         isValid: 'steps.profile.errors.invalidValue',
       },
+      {
+        platform: 'Farcaster',
+        key: 'eth.farcaster',
+        username: 'valid-fname',
+        isValid: true,
+      },
+      {
+        platform: 'Farcaster',
+        key: 'eth.farcaster',
+        username: 'invalid_fname',
+        isValid: 'steps.profile.errors.invalidValue',
+      },
     ]
 
     testCases.forEach(({ platform, key, username, isValid }) => {

src/utils/getSocialData.ts

@@ -1,14 +1,21 @@
 export const getSocialData = (iconKey: string, value: string) => {
   switch (iconKey) {
-    case 'twitter':
-    case 'com.twitter':
+    case 'email':
       return {
-        icon: 'com.twitter',
+        icon: 'email',
         color: '#000000',
-        label: 'X',
-        value: `@${value.replace(/^@/, '')}`,
-        type: 'link',
-        urlFormatter: `https://x.com/${value.replace(/^@/, '')}`,
+        label: 'Email',
+        value,
+        type: 'copy',
+      }
+    case 'discord':
+    case 'com.discord':
+      return {
+        icon: 'com.discord',
+        color: '#5A57DD',
+        label: 'Discord',
+        value,
+        type: 'copy',
       }
     case 'github':
     case 'com.github':
@@ -20,15 +27,30 @@ export const getSocialData = (iconKey: string, value: string) => {
         type: 'link',
         urlFormatter: `https://github.com/${value}`,
       }
-    case 'discord':
-    case 'com.discord':
+    case 'twitter':
+    case 'com.x':
+    case 'com.twitter': {
+      const formattedValue = value.replace(/^@/, '')
       return {
-        icon: 'com.discord',
-        color: '#5A57DD',
-        label: 'Discord',
-        value,
-        type: 'copy',
+        icon: 'com.twitter',
+        color: '#000000',
+        label: 'X',
+        value: `@${formattedValue}`,
+        type: 'link',
+        urlFormatter: `https://x.com/${formattedValue}`,
+      }
+    }
+    case 'eth.farcaster': {
+      const formattedValue = value.toLowerCase()
+      return {
+        icon: 'eth.farcaster',
+        color: '#8A63D2',
+        label: 'Farcaster',
+        value: formattedValue,
+        type: 'link',
+        urlFormatter: `https://warpcast.com/${formattedValue}`,
       }
+    }
     case 'telegram':
     case 'org.telegram':
       return {
@@ -39,14 +61,6 @@ export const getSocialData = (iconKey: string, value: string) => {
         type: 'link',
         urlFormatter: `https://t.me/${value}`,
       }
-    case 'email':
-      return {
-        icon: 'email',
-        color: '#000000',
-        label: 'Email',
-        value,
-        type: 'copy',
-      }
     default:
       return null
   }