feat: Create component to merge contacts (#2412)

Co-authored-by: Pranav Raj S <pranav@chatwoot.com>

app/javascript/dashboard/modules/contact/stories/ContactIntro.stories.js

@@ -10,7 +10,7 @@ const Template = (args, { argTypes }) => ({
   props: Object.keys(argTypes),
   components: { ContactIntro },
   template:
-    '<contact-intro v-bind="$props" :user="user" @edit="onEdit" @message="onNewMessage" />',
+    '<contact-intro v-bind="$props" @edit="onEdit" @message="onNewMessage" />',
 });
 
 export const DefaultContactIntro = Template.bind({});

app/javascript/dashboard/modules/contact/stories/MergeContact.stories.js

@@ -0,0 +1,32 @@
+import { action } from '@storybook/addon-actions';
+import MergeContact from 'dashboard/modules/contact/components/MergeContact';
+
+export default {
+  title: 'Components/Contact/MergeContacts',
+  component: MergeContact,
+  argTypes: {
+    'primary-contact': {
+      defaultValue: '{}',
+      control: {
+        type: 'object',
+      },
+    },
+  },
+};
+
+const Template = (args, { argTypes }) => ({
+  props: Object.keys(argTypes),
+  components: { MergeContact },
+  template:
+    '<merge-contact v-bind="$props" @submit="onSearch" @search="onSubmit"></merge-contact>',
+});
+
+export const List = Template.bind({});
+List.args = {
+  primaryContact: {
+    id: 12,
+    name: 'Mason Mount',
+  },
+  onSearch: action('Search'),
+  onSubmit: action('Submit'),
+};