fix(integrations): address RB2B PR review

- email_to_activity now has its own plaintext Email field (canonicalParamId) instead of sharing the Email-or-MD5 input, since it does not accept MD5 hashes
- RB2BIcon uses useId() for its clipPath id instead of a hardcoded id, matching the convention used by other icons

Author: waleedlatif1

apps/docs/components/icons.tsx

@@ -1575,9 +1575,11 @@ export function ExaAIIcon(props: SVGProps<SVGSVGElement>) {
 }
 
 export function RB2BIcon(props: SVGProps<SVGSVGElement>) {
+  const id = useId()
+  const clipId = `rb2b_clip_${id}`
   return (
     <svg viewBox='0 0 165 48' fill='none' xmlns='http://www.w3.org/2000/svg' {...props}>
-      <g clipPath='url(#clip0_551_23712)'>
+      <g clipPath={`url(#${clipId})`}>
         <path d='M95.975 8.40234H87.5703V16.8057H95.975V8.40234Z' fill='#0C1316' />
         <path d='M121.405 8.40234H113V16.8057H121.405V8.40234Z' fill='#0C1316' />
         <path d='M112.998 16.8066H104.594V25.21H112.998V16.8066Z' fill='#0C1316' />
@@ -1606,7 +1608,7 @@ export function RB2BIcon(props: SVGProps<SVGSVGElement>) {
         <path d='M38.7953 8.40234H30.3906V19.7973H38.7953V8.40234Z' fill='#0C1316' />
       </g>
       <defs>
-        <clipPath id='clip0_551_23712'>
+        <clipPath id={clipId}>
           <rect width='165' height='48' fill='white' />
         </clipPath>
       </defs>

apps/sim/blocks/blocks/rb2b.ts

@@ -8,7 +8,6 @@ const EMAIL_OPERATIONS = [
   'hem_to_best_linkedin',
   'hem_to_linkedin',
   'hem_to_maid',
-  'email_to_activity',
 ]
 
 const LINKEDIN_OPERATIONS = [
@@ -80,13 +79,23 @@ export const RB2BBlock: BlockConfig<Rb2bResponse> = {
       condition: { field: 'operation', value: 'ip_to_hem' },
     },
     {
-      id: 'email',
+      id: 'emailOrHash',
       title: 'Email or MD5 Hash',
       type: 'short-input',
+      canonicalParamId: 'email',
       placeholder: 'jane@example.com or an MD5 hash',
       condition: { field: 'operation', value: EMAIL_OPERATIONS },
       required: { field: 'operation', value: EMAIL_OPERATIONS },
     },
+    {
+      id: 'emailAddress',
+      title: 'Email Address',
+      type: 'short-input',
+      canonicalParamId: 'email',
+      placeholder: 'jane@example.com',
+      condition: { field: 'operation', value: 'email_to_activity' },
+      required: { field: 'operation', value: 'email_to_activity' },
+    },
     {
       id: 'linkedin_slug',
       title: 'LinkedIn Slug or URL',

apps/sim/components/icons.tsx

@@ -1575,9 +1575,11 @@ export function ExaAIIcon(props: SVGProps<SVGSVGElement>) {
 }
 
 export function RB2BIcon(props: SVGProps<SVGSVGElement>) {
+  const id = useId()
+  const clipId = `rb2b_clip_${id}`
   return (
     <svg viewBox='0 0 165 48' fill='none' xmlns='http://www.w3.org/2000/svg' {...props}>
-      <g clipPath='url(#clip0_551_23712)'>
+      <g clipPath={`url(#${clipId})`}>
         <path d='M95.975 8.40234H87.5703V16.8057H95.975V8.40234Z' fill='#0C1316' />
         <path d='M121.405 8.40234H113V16.8057H121.405V8.40234Z' fill='#0C1316' />
         <path d='M112.998 16.8066H104.594V25.21H112.998V16.8066Z' fill='#0C1316' />
@@ -1606,7 +1608,7 @@ export function RB2BIcon(props: SVGProps<SVGSVGElement>) {
         <path d='M38.7953 8.40234H30.3906V19.7973H38.7953V8.40234Z' fill='#0C1316' />
       </g>
       <defs>
-        <clipPath id='clip0_551_23712'>
+        <clipPath id={clipId}>
           <rect width='165' height='48' fill='white' />
         </clipPath>
       </defs>