Skip to content
Open
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion examples/tutorial/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -16,7 +16,7 @@
"emoji-mart": "^5.6.0",
"react": "^19.2.6",
"react-dom": "^19.2.6",
"stream-chat": "10.0.0-rc.15",
"stream-chat": "10.0.0-rc.18",
"stream-chat-react": "workspace:^"
},
"devDependencies": {
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -73,7 +73,7 @@ async function seedChannel(contextA: BrowserContext) {
// Send a message with an image attachment that has custom actions
await pageA.evaluate(`(async () => {
var ch = window.channel;
await ch.sendMessage({
await ch.sendMessage({ message: {
text: '',
attachments: [{
type: 'image',
Expand All @@ -85,7 +85,7 @@ async function seedChannel(contextA: BrowserContext) {
{ name: 'vote', value: 'Loathe' },
],
}],
});
} });
})()`);

console.log(' ✅ Channel seeded');
Expand Down
12 changes: 6 additions & 6 deletions examples/vite/docs-playwright/screenshot-misc.ts
Original file line number Diff line number Diff line change
Expand Up @@ -91,21 +91,21 @@ async function captureBaseImageFallbacks(browser: any) {
// Send message with a broken image URL
await page.evaluate(`(async () => {
var ch = window.channel;
await ch.sendMessage({
await ch.sendMessage({ message: {
text: 'Some text',
attachments: [{
type: 'image',
image_url: 'https://invalid-url-that-will-fail.example/broken.jpg',
thumb_url: 'https://invalid-url-that-will-fail.example/broken-thumb.jpg',
title: 'broken-image.jpg',
}],
});
} });
})()`);

// Send message with two images (one broken) for gallery view
await page.evaluate(`(async () => {
var ch = window.channel;
await ch.sendMessage({
await ch.sendMessage({ message: {
text: '',
attachments: [
{
Expand All @@ -119,7 +119,7 @@ async function captureBaseImageFallbacks(browser: any) {
thumb_url: 'https://invalid-url-that-will-fail.example/broken2-thumb.jpg',
},
],
});
} });
})()`);

await page.close();
Expand Down Expand Up @@ -174,7 +174,7 @@ async function captureConnectionStatus(browser: any) {
// Send a message for context
await page.evaluate(`(async () => {
var ch = window.channel;
await ch.sendMessage({ text: 'Hey, how are you?' });
await ch.sendMessage({ message: { text: 'Hey, how are you?' } });
})()`);
await page.close();

Expand Down Expand Up @@ -215,7 +215,7 @@ async function captureCustomNotification(browser: any) {
const page = await createChannel(ctx, channelId, USER_A, USER_A);
await page.evaluate(`(async () => {
var ch = window.channel;
await ch.sendMessage({ text: "Hi! How's it going?!" });
await ch.sendMessage({ message: { text: "Hi! How's it going?!" } });
})()`);
await page.close();

Expand Down
16 changes: 8 additions & 8 deletions examples/vite/docs-playwright/screenshot-reactions.ts
Original file line number Diff line number Diff line change
Expand Up @@ -75,46 +75,46 @@ async function seedChannel(contextA: BrowserContext, contextB: BrowserContext) {
// Send messages
const r1: any = await pageA.evaluate(`(async () => {
var ch = window.channel;
var m = await ch.sendMessage({ text: 'What do you think about the new design?' });
var m = await ch.sendMessage({ message: { text: 'What do you think about the new design?' } });
return { id: m.message.id };
})()`);

await pageB.evaluate(`(async () => {
var ch = window.channel;
await ch.sendMessage({ text: 'I love it! The color scheme is much better.' });
await ch.sendMessage({ message: { text: 'I love it! The color scheme is much better.' } });
})()`);

const r3: any = await pageA.evaluate(`(async () => {
var ch = window.channel;
var m = await ch.sendMessage({ text: 'Great to hear! Should we ship it this week?' });
var m = await ch.sendMessage({ message: { text: 'Great to hear! Should we ship it this week?' } });
return { id: m.message.id };
})()`);

// Add reactions to messages
// Marco reacts to his own first message with 'like'
await pageA.evaluate(`(async () => {
var ch = window.channel;
await ch.sendReaction(${JSON.stringify(r1.id)}, { type: 'like' });
await ch.sendReaction({ id: ${JSON.stringify(r1.id)} }, { reaction: { type: 'like' } });
})()`);
// John reacts to first message with 'love'
await pageB.evaluate(`(async () => {
var ch = window.channel;
await ch.sendReaction(${JSON.stringify(r1.id)}, { type: 'love' });
await ch.sendReaction({ id: ${JSON.stringify(r1.id)} }, { reaction: { type: 'love' } });
})()`);
// John reacts to third message with 'like'
await pageB.evaluate(`(async () => {
var ch = window.channel;
await ch.sendReaction(${JSON.stringify(r3.id)}, { type: 'like' });
await ch.sendReaction({ id: ${JSON.stringify(r3.id)} }, { reaction: { type: 'like' } });
})()`);

// Add upvote/downvote reactions (for custom options variant)
await pageA.evaluate(`(async () => {
var ch = window.channel;
await ch.sendReaction(${JSON.stringify(r3.id)}, { type: 'arrow_up' });
await ch.sendReaction({ id: ${JSON.stringify(r3.id)} }, { reaction: { type: 'arrow_up' } });
})()`);
await pageB.evaluate(`(async () => {
var ch = window.channel;
await ch.sendReaction(${JSON.stringify(r1.id)}, { type: 'arrow_up' });
await ch.sendReaction({ id: ${JSON.stringify(r1.id)} }, { reaction: { type: 'arrow_up' } });
})()`);

console.log(' ✅ Channel seeded');
Expand Down
4 changes: 2 additions & 2 deletions examples/vite/docs-playwright/screenshot-system-message.ts
Original file line number Diff line number Diff line change
Expand Up @@ -70,12 +70,12 @@ async function seedChannel(contextA: BrowserContext, contextB: BrowserContext) {
// Send a few normal messages for context
await pageA.evaluate(`(async () => {
var ch = window.channel;
await ch.sendMessage({ text: 'Hey John, quick question about the project' });
await ch.sendMessage({ message: { text: 'Hey John, quick question about the project' } });
})()`);

await pageB.evaluate(`(async () => {
var ch = window.channel;
await ch.sendMessage({ text: 'Sure, what is it?' });
await ch.sendMessage({ message: { text: 'Sure, what is it?' } });
})()`);

// Inject a system message into channel state via truncate with a system message
Expand Down
45 changes: 23 additions & 22 deletions examples/vite/docs-playwright/screenshot-variants.ts
Original file line number Diff line number Diff line change
Expand Up @@ -77,7 +77,7 @@ async function seedChannel(contextA: BrowserContext, contextB: BrowserContext) {
var client = window.client;

// 1. Marco: opening message
var m1 = await ch.sendMessage({ text: 'Hey, John, how are you doing?' });
var m1 = await ch.sendMessage({ message: { text: 'Hey, John, how are you doing?' } });

return { m1Id: m1.message.id };
})()`);
Expand All @@ -88,7 +88,7 @@ async function seedChannel(contextA: BrowserContext, contextB: BrowserContext) {
var client = window.client;

// 2. John: reply
var m2 = await ch.sendMessage({ text: 'Hey, hey! Doing well \\u2013 how about you?' });
var m2 = await ch.sendMessage({ message: { text: 'Hey, hey! Doing well \\u2013 how about you?' } });

return { m2Id: m2.message.id };
})()`,
Expand All @@ -98,9 +98,9 @@ async function seedChannel(contextA: BrowserContext, contextB: BrowserContext) {
var ch = window.channel;

// 3. Marco: long reply
var m3 = await ch.sendMessage({
var m3 = await ch.sendMessage({ message: {
text: "Ah, thanks for asking! I'm doing quite well, all things considered. Every day brings its own set of challenges and opportunities, but overall, I'm feeling positive and motivated. I've been keeping busy learning new things."
});
} });

return { m3Id: m3.message.id };
})()`);
Expand All @@ -111,16 +111,17 @@ async function seedChannel(contextA: BrowserContext, contextB: BrowserContext) {
var ch = window.channel;
var client = window.client;

var m4 = await ch.sendMessage({
var m4 = await ch.sendMessage({ message: {
text: '@Marco hey! How are you?',
mentioned_users: [${JSON.stringify(USER_A)}]
});
} });

// Edit to trigger "Edited" indicator
await client.updateMessage({
id: m4.message.id,
text: '@Marco hey! How are you?',
mentioned_users: [${JSON.stringify(USER_A)}]
await client.updateMessage({ id: m4.message.id }, {
message: {
text: '@Marco hey! How are you?',
mentioned_users: [${JSON.stringify(USER_A)}]
}
});

return { m4Id: m4.message.id };
Expand All @@ -130,52 +131,52 @@ async function seedChannel(contextA: BrowserContext, contextB: BrowserContext) {
// 5. John: link message
const result5: any = await pageB.evaluate(`(async () => {
var ch = window.channel;
var m5 = await ch.sendMessage({ text: 'Check out this link:\\nhttps://getstream.io/' });
var m5 = await ch.sendMessage({ message: { text: 'Check out this link:\\nhttps://getstream.io/' } });
return { m5Id: m5.message.id };
})()`);

// 6. Marco: markdown message
const result6: any = await pageA.evaluate(`(async () => {
var ch = window.channel;
var m6 = await ch.sendMessage({
var m6 = await ch.sendMessage({ message: {
text: "Here's some ~~styled text~~ **Markdown**, *too*!"
});
} });
return { m6Id: m6.message.id };
})()`);

// 7. Marco: consecutive messages for grouping demo (V5)
await pageA.evaluate(`(async () => {
var ch = window.channel;
await ch.sendMessage({ text: 'This message right here...' });
await ch.sendMessage({ text: '...will be grouped with this one.' });
await ch.sendMessage({ text: 'And this one as well!' });
await ch.sendMessage({ message: { text: 'This message right here...' } });
await ch.sendMessage({ message: { text: '...will be grouped with this one.' } });
await ch.sendMessage({ message: { text: 'And this one as well!' } });
})()`);

// 8. Add a thread reply on the markdown message (for reply_count in V7/V8)
await pageB.evaluate(`(async () => {
var ch = window.channel;
await ch.sendMessage({
await ch.sendMessage({ message: {
text: 'Nice formatting!',
parent_id: ${JSON.stringify(result6.m6Id)}
});
} });
})()`);

// 9. Add reactions on the mention message (for V8)
await pageA.evaluate(`(async () => {
var ch = window.channel;
await ch.sendReaction(${JSON.stringify(result4.m4Id)}, { type: '+1' });
await ch.sendReaction({ id: ${JSON.stringify(result4.m4Id)} }, { reaction: { type: '+1' } });
})()`);
await pageB.evaluate(`(async () => {
var ch = window.channel;
await ch.sendReaction(${JSON.stringify(result4.m4Id)}, { type: '-1' });
await ch.sendReaction({ id: ${JSON.stringify(result4.m4Id)} }, { reaction: { type: '-1' } });
})()`);

// 10. Marco sends one more message, then soft-deletes it (for V7/V8)
const result10: any = await pageA.evaluate(`(async () => {
var ch = window.channel;
var client = window.client;
var m = await ch.sendMessage({ text: 'Actually, never mind about that last point.' });
await client.deleteMessage(m.message.id);
var m = await ch.sendMessage({ message: { text: 'Actually, never mind about that last point.' } });
await client.deleteMessage({ id: m.message.id });
return { deletedId: m.message.id };
})()`);

Expand Down
Loading
Loading