Skip to content

Commit b7e03fe

Browse files
authored
[UK-859] Use this repo as the primary one (#9)
Before, we had internal repos for development and release From now on, we will be developing here Work done: Fix config in pakage.json and rollup to support release process Minor cleanup in README.md
1 parent 36c2431 commit b7e03fe

File tree

8 files changed

+9214
-133
lines changed

8 files changed

+9214
-133
lines changed

.size-snapshot.json

Lines changed: 4614 additions & 54 deletions
Large diffs are not rendered by default.

CHANGELOG.md

Lines changed: 26 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,31 @@
11
# Changelog
22

3+
## [2.4.0]
4+
5+
Move source code to new repo
6+
7+
## [2.3.2] (Aug 19 2021)
8+
9+
- Bugfix:
10+
* Add filtering logics for channel events by custom message list params
11+
* Add filtering logics for channel list events by custom channel list query
12+
13+
## [2.3.0](Jul 27 2021)
14+
15+
- Bugfix:
16+
* Thumbnail image url fix
17+
18+
## [2.3.0.alpha](Jul 27 2021)
19+
20+
- Internal tooling changes:
21+
* npm v7 peer dependency fix
22+
* storybook 6
23+
* jest 27
24+
* typescript 4
25+
* React 17
26+
* rollup 2
27+
28+
329
## [2.2.1](Mar 19 2021)
430

531
- Features:

README.md

Lines changed: 0 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -61,11 +61,6 @@ We use rollupJS for building the production bundle script that you want to use i
6161

6262
We have both esm and commonjs output
6363

64-
```
65-
rollup -c
66-
```
67-
or
68-
6964
```
7065
npm run build
7166
```

SAMPLES.md

Lines changed: 19 additions & 20 deletions
Original file line numberDiff line numberDiff line change
@@ -32,7 +32,7 @@ The minimum requirements for UIKit for React are:
3232

3333
### Implement Chat with App component
3434

35-
The `App` component is a collection of all UIKit components you need to implement chat. This is included in all core component samples, so be sure to set your own APP_ID, USER_ID, and NICKNAME in `const.js` in each to customize your sample. On the [CodeSandbox](https://codesandbox.io/s/1-1-using-sendbird-app-9xum5) link, you will see that the props of the `App` component refer to use the values of the correspondings of `const.js` for initialization.
35+
The `App` component is a collection of all UIKit components you need to implement chat. This is included in all core component samples, so be sure to set your own APP_ID, USER_ID, and NICKNAME in `const.js` in each to customize your sample. On the [CodeSandbox](https://codesandbox.io/s/1-1-using-sendbird-app-9xum5) link, you will see that the props of the `App` component refer to use the values of the correspondings of `const.js` for initialization.
3636

3737
Try setting your own by downloading the Sendbird sample.
3838

@@ -42,7 +42,7 @@ import { App as SendbirdApp } from 'sendbird-uikit'
4242

4343
### Import components to customize UIKit
4444

45-
Here is a list of the essential components that you need to import before you start customizing chat. Note that the names of the components are changed as shown in the code below.
45+
Here is a list of the essential components that you need to import before you start customizing chat. Note that the names of the components are changed as shown in the code below.
4646

4747
Try [importing components on CodeSandbox](https://codesandbox.io/s/1-2-customization-basic-format-q4e6c).
4848

@@ -54,15 +54,15 @@ import {
5454
} from 'sendbird-uikit'
5555
```
5656

57-
### Referring to CodeSandbox
57+
### Referring to CodeSandbox
5858

5959
Each CodeSandbox sample has `App.js` and `CustomizedApp.js` which operate based on the imported `const.js`. CodeSandbox is a code editor that provides an instant live preview. The preview has two buttons placed at the top center. If you click the left button, you will see unaltered `App.js`. If you click the right button, you will see the customized component from `CustomizedApp.js`, and any changes you make on them applied and rendered on the live preview.
6060

61-
If you would like to get a deeper understanding of how CodeSandbox works, refer to **CustomizedMessageItems**, **CustomizedHeader**, **CustomizedMessageInput**, and **CustomizedChannelPreviewItem** which you can find on corresponding CodeSandbox samples.
61+
If you would like to get a deeper understanding of how CodeSandbox works, refer to **CustomizedMessageItems**, **CustomizedHeader**, **CustomizedMessageInput**, and **CustomizedChannelPreviewItem** which you can find on corresponding CodeSandbox samples.
6262

6363
<br />
6464

65-
## Getting Started
65+
## Getting Started
6666

6767
This section explains what you need to know before testing the sample app.
6868

@@ -86,15 +86,15 @@ Try your [message item on CodeSandbox](https://codesandbox.io/s/2-1-customizing-
8686
>
8787
```
8888

89-
> Note: You can try making your own customized message item by using `<CustomizedMessageItem />` on the CodeSandbox sample.
89+
> Note: You can try making your own customized message item by using `<CustomizedMessageItem />` on the CodeSandbox sample.
9090
9191
### Message list params
9292

93-
The **queries.messageListParams** is an `instance` prop in the **channel** component which you can use to retrieve a list of messages by specifying the properties of `MessageListParams`.
93+
The **queries.messageListParams** is an `instance` prop in the **channel** component which you can use to retrieve a list of messages by specifying the properties of `MessageListParams`.
9494

9595
Try your [message list params on CodeSandbox](https://codesandbox.io/s/2-2-customizing-messagelistparams-45573).
9696

97-
> Note: On CodeSandbox’s preview, only the messages you sent will be displayed.
97+
> Note: On CodeSandbox’s preview, only the messages you sent will be displayed.
9898
9999
```javascript
100100
// Pass arguments in JSON data input format to the query instance.
@@ -110,9 +110,9 @@ Try your [message list params on CodeSandbox](https://codesandbox.io/s/2-2-custo
110110
>
111111
```
112112

113-
### Message params
113+
### Message params
114114

115-
The **onBeforeSendUserMessage**, **onBeforeSendFileMessage**, and **onBeforeUpdateUserMessage** are `callback function` props in the **channel** component. The first two execute additional operations for a user message and a file message respectively; the corresponding modified messages are returned through the **text** and the **file** arguments respectively. The **onBeforeUpdateUserMessage** executes additional operations for a user message before updating it.
115+
The **onBeforeSendUserMessage**, **onBeforeSendFileMessage**, and **onBeforeUpdateUserMessage** are `callback function` props in the **channel** component. The first two execute additional operations for a user message and a file message respectively; the corresponding modified messages are returned through the **text** and the **file** arguments respectively. The **onBeforeUpdateUserMessage** executes additional operations for a user message before updating it.
116116

117117
Try your [message params on CodeSandbox](https://codesandbox.io/s/2-3-customizing-messageparams-phqii)
118118

@@ -152,7 +152,7 @@ Try your [chat header on CodeSandbox](https://codesandbox.io/s/2-4-customizing-c
152152
>
153153
```
154154

155-
> Note: You can try making your own customized chat header item by using `<CustomizedHeader />` on the CodeSandbox sample.
155+
> Note: You can try making your own customized chat header item by using `<CustomizedHeader />` on the CodeSandbox sample.
156156
157157
### Message input
158158

@@ -169,11 +169,11 @@ Try your [message input on CodeSandbox](https://codesandbox.io/s/2-5-customizing
169169
>
170170
```
171171

172-
> Note: You can try making your own customized message input item by using `<CustomizedMessageInput />` on the CodeSandbox sample.
172+
> Note: You can try making your own customized message input item by using `<CustomizedMessageInput />` on the CodeSandbox sample.
173173
174174
### Channel preview item
175175

176-
The **renderChannelPreview** is a `ReactElement` prop in the **ChannelList** component which allows you to customize channel preview by setting a function. This prop provides two arguments: **channel** and **onLeaveChannel**. The **channel** refers to a `GroupChannel` object which is a collection of properties necessary to render the current channel view. The **onLeaveChannel** has a callback function as an argument which can be implemented with custom code for events related to the corresponding user action.
176+
The **renderChannelPreview** is a `ReactElement` prop in the **ChannelList** component which allows you to customize channel preview by setting a function. This prop provides two arguments: **channel** and **onLeaveChannel**. The **channel** refers to a `GroupChannel` object which is a collection of properties necessary to render the current channel view. The **onLeaveChannel** has a callback function as an argument which can be implemented with custom code for events related to the corresponding user action.
177177

178178
Try your [channel preview item on CodeSandbox](https://codesandbox.io/s/3-1-customizing-channelpreviewitem-ycsvs)
179179

@@ -193,18 +193,17 @@ You can make your own customized channel preview item component in this file. Yo
193193
function CustomizedChannelPreviewItem(props) {
194194
const { channel, onLeaveChannel } = props;
195195
...
196-
197196
onLeaveChannel(channel);
198197
}
199198
```
200199

201-
> Note: You can try making your own customized channel preview item by using `<CustomizedMessageItem />` and using the **onLeaveChannel** function in the component on the CodeSandbox sample.
200+
> Note: You can try making your own customized channel preview item by using `<CustomizedMessageItem />` and using the **onLeaveChannel** function in the component on the CodeSandbox sample.
202201
203202
### Channel list query
204203

205-
The **queries.channelListQuery** is an `instance` prop in the **ChannelList** component which filters channels by using its options.
204+
The **queries.channelListQuery** is an `instance` prop in the **ChannelList** component which filters channels by using its options.
206205

207-
Try your [channel list query item on CodeSandbox](https://codesandbox.io/s/3-2-customizing-channellistquery-z2y89?file=)
206+
Try your [channel list query item on CodeSandbox](https://codesandbox.io/s/3-2-customizing-channellistquery-z2y89?file=)
208207

209208
> Note: On the CodeSandbox’s preview, the empty channels that you see means that the channels are successfully created and there are no messages sent by users.
210209
@@ -230,7 +229,7 @@ Find out more about `ChannelListQuery` and `ApplicationUserListQuery` on the [AP
230229

231230
The **onBeforeCreateChannel** is a prop of the **ChannelList** component which can be implemented with custom code for events related to the corresponding user actions.
232231

233-
Try your [channel param on CodeSandbox](https://codesandbox.io/s/3-3-customizing-channellist-sg9kx)
232+
Try your [channel param on CodeSandbox](https://codesandbox.io/s/3-3-customizing-channellist-sg9kx)
234233

235234
> Note: you can create a channel using `GroupChannelParams`.
236235
@@ -239,7 +238,7 @@ Try your [channel param on CodeSandbox](https://codesandbox.io/s/3-3-customizing
239238
onBeforeCreateChannel={handleOnBeforeCreateChannel}
240239
>
241240
```
242-
You can get an array of **selectedUsers** in a function argument. In order to complete an operation you intend to carry out with the function, you should return a `GroupchannelParams` object after specifying its properties.
241+
You can get an array of **selectedUsers** in a function argument. In order to complete an operation you intend to carry out with the function, you should return a `GroupchannelParams` object after specifying its properties.
243242

244243
```javascript
245244
const handleOnBeforeCreateChannel = (selectedUsers) => {
@@ -249,7 +248,7 @@ const handleOnBeforeCreateChannel = (selectedUsers) => {
249248
channelParams.overUrl = null;
250249
channelParams.coverImage = null;
251250
channelParams.customType = HIGHLIGHT;
252-
251+
253252
return channelParams;
254253
}
255254
```

0 commit comments

Comments
 (0)