Merge pull request #127 from Detaysoft/meeting-message

MeetingMessage created

Author: abdurrahmanekr

README.md

@@ -143,6 +143,9 @@ import { MessageBox } from 'react-chat-elements'
 | onTitleClick | none | function | message title on click event |
 | onForwardClick | none | function | message forward on click event |
 | onReplyClick | none | function | message reply on click event |
+| onMeetingMessageClick | none | function | meeting message on click event |
+| onMeetingTitleClick | none | function | meeting title message on click event |
+| onMeetingVideoLinkClick | none | function | meeting video link message on click event |
 | onReplyMessageClick | none | function | reply message on click event |
 | onContextMenu | none | function | message contextmenu click event |
 | forwarded | none | boolean | message forward icon |
@@ -177,6 +180,66 @@ import { MessageBox } from 'react-chat-elements'
 ![reply-message](https://user-images.githubusercontent.com/15075759/80224625-9dbbeb00-8652-11ea-994f-022be0cffe30.png)
 
 
+## MeetingMessage Component
+
+```javascript
+import { MeetingMessage } from 'react-chat-elements'
+
+<MeetingMessage
+    subject={'New Release'}
+    title={'in ullamco'}
+    date={new Date()}
+    collapseTitle={'Commodo aliquip'}
+    participants={[
+        {
+            id: '1',
+            title: 'Facebook',
+        },
+        .
+        .
+        .
+    ]}
+    dataSource={[
+        {
+            id: '1',
+            avatar: 'https://facebook.github.io/react/img/logo.svg',
+            message: 'Lorem ipsum dolor sit amet.',
+            title: 'Elit magna',
+            avatarFlexible: true,
+            date: new Date(),
+            event: {[
+                title: 'Toplantı sona erdi!',
+                avatars={[
+                    src: 'https://facebook.github.io/react/img/logo.svg'
+                ]}
+            ]}
+            record: {[
+                avatar: 'https://facebook.github.io/react/img/logo.svg',
+                title: 'Arama',
+                savedBy: 'Kaydeden: Elit magna',
+                time: new Date(),
+            ]}
+        },
+        .
+        .
+        .
+    ]} />
+```
+
+#### MeetingMessage props
+
+| prop | default | type | description |
+| ---- | ---- | ---- | ---- |
+| subject | none | string | Meeting messagee |
+| title | none | string | Meeting title |
+| date | new Date() | Date | Meeting date |
+| collapseTitle | none | string | Meeting subtitle |
+| participants | [] | array | Meeting participant array |
+| dataSource | [] | array | meeting list array |
+| onMeetingMessageClick | none | function | meeting message on click event (message(object) is returned) |
+| onMeetingTitleClick | none | function | meeting title message on click event (message(object) is returned) |
+| onMeetingVideoLinkClick | none | function | meeting video link message on click event (message(object) is returned) |
+
 ## SystemMessage Component
 
 ```javascript
@@ -569,7 +632,9 @@ import { MeetingItem } from 'react-chat-elements'
 <MeetingItem
     subject={'New Release!!!'}
     avatars={[
-        src: 'https://facebook.github.io/react/img/logo.svg'
+        {
+            src: 'https://facebook.github.io/react/img/logo.svg'
+        }
     ]}
     onMeetingClick={console.log}
     onShareClick={console.log}

example/App.js

@@ -88,6 +88,9 @@ export class App extends Component {
                     case 4:
                         type = 'spotify';
                         break;
+                    case 5:
+                        type = 'meeting';
+                        break;
                     default:
                         type = 'text';
                         status = 'read';
@@ -104,6 +107,36 @@ export class App extends Component {
                         titleColor: this.getRandomColor(),
                         message: loremIpsum({ count: 1, units: 'sentences' }),
                     }) : null,
+                    meeting: this.token() >= 1 ? ({
+                        subject: loremIpsum({ count: 2, units: 'words' }),
+                        title: loremIpsum({ count: 2, units: 'words' }),
+                        date: +new Date(),
+                        collapseTitle: loremIpsum({ count: 2, units: 'words' }),
+                        participants: Array(this.token() + 6).fill(1).map(x => ({
+                            id: parseInt(Math.random() * 10 % 6),
+                            title: loremIpsum({ count: 1, units: 'words' }),
+                        })),
+                        dataSource: Array(this.token() + 5).fill(1).map(x => ({
+                            id: String(Math.random()),
+                            avatar: `data:image/png;base64,${this.photo()}`,
+                            message: loremIpsum({ count: 1, units: 'sentences' }),
+                            title: loremIpsum({ count: 2, units: 'words' }),
+                            avatarFlexible: true,
+                            date: +new Date(),
+                            event: {
+                                title: loremIpsum({ count: 2, units: 'words' }),
+                                avatars: Array(this.token() + 2).fill(1).map(x => ({
+                                    src: `data:image/png;base64,${this.photo()}`,
+                                })),
+                            },
+                            record: {
+                                avatar: `data:image/png;base64,${this.photo()}`,
+                                title: loremIpsum({ count: 1, units: 'words' }),
+                                savedBy: 'Kaydeden: ' + loremIpsum({ count: 2, units: 'words' }),
+                                time: new Date().toLocaleString(),
+                            },
+                        })),
+                    }) : null,
                     type: type,
                     theme: 'white',
                     view: 'list',

package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-chat-elements",
-  "version": "10.10.3",
+  "version": "10.11.0",
   "description": "Reactjs chat components",
   "author": "Avare Kodcu <abdurrahmaneker58@gmail.com>",
   "main": "dist/main.js",