Skip to content

Commit

Permalink
Merge pull request #25 from reaviz/syang/islast-stories-fix
Browse files Browse the repository at this point in the history 
add isLast property to SessionMessage component
  • Loading branch information
@amcdnl
amcdnl authored Aug 2, 2024
2 parents 90f75db + 77f7678 commit da08dad
Show file tree
Hide file tree
Showing 5 changed files with 40 additions and 21 deletions.
4 changes: 2 additions & 2 deletions package-lock.json
View file

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

1 change: 1 addition & 0 deletions src/SessionMessages/SessionMessage/SessionMessage.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -35,6 +35,7 @@ interface SessionMessageProps extends PropsWithChildren {

/**
* Whether the message is the last one in the list.
* This let's the chat know when to show the loading cursor.
*/
isLast?: boolean;
}
Expand Down
6 changes: 4 additions & 2 deletions stories/Companion.stories.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -81,10 +81,11 @@ export const Basic = () => {
<SessionMessagesHeader />
<SessionMessages>
{conversations =>
conversations.map(conversation => (
conversations.map((conversation, index) => (
<SessionMessage
key={conversation.id}
conversation={conversation}
isLast={index === conversations.length - 1}
/>
))
}
Expand Down Expand Up @@ -130,10 +131,11 @@ export const Empty = () => {
<SessionMessagesHeader />
<SessionMessages>
{conversations =>
conversations.map(conversation => (
conversations.map((conversation, index) => (
<SessionMessage
key={conversation.id}
conversation={conversation}
isLast={index === conversations.length - 1}
/>
))
}
Expand Down
44 changes: 29 additions & 15 deletions stories/Console.stories.tsx
View file
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
import { useState, useRef, FC, useContext, Fragment } from 'react';
import { useState, useRef, FC, useContext } from 'react';
import { Meta } from '@storybook/react';
import {
Chat,
Expand Down Expand Up @@ -86,10 +86,11 @@ export const Basic = () => {
<SessionMessagesHeader />
<SessionMessages>
{conversations =>
conversations.map(conversation => (
conversations.map((conversation, index) => (
<SessionMessage
key={conversation.id}
conversation={conversation}
isLast={index === conversations.length - 1}
/>
))
}
Expand Down Expand Up @@ -139,10 +140,11 @@ export const Embeds = () => {
<SessionMessagesHeader />
<SessionMessages>
{conversations =>
conversations.map(conversation => (
conversations.map((conversation, index) => (
<SessionMessage
key={conversation.id}
conversation={conversation}
isLast={index === conversations.length - 1}
/>
))
}
Expand Down Expand Up @@ -194,10 +196,11 @@ export const DefaultSession = () => {
<SessionMessagesHeader />
<SessionMessages>
{conversations =>
conversations.map(conversation => (
conversations.map((conversation, index) => (
<SessionMessage
key={conversation.id}
conversation={conversation}
isLast={index === conversations.length - 1}
/>
))
}
Expand Down Expand Up @@ -305,10 +308,11 @@ export const FileUploads = () => {
<SessionMessagesHeader />
<SessionMessages>
{conversations =>
conversations.map(conversation => (
conversations.map((conversation, index) => (
<SessionMessage
key={conversation.id}
conversation={conversation}
isLast={index === conversations.length - 1}
/>
))
}
Expand Down Expand Up @@ -360,10 +364,11 @@ export const DefaultInputValue = () => {
<SessionMessagesHeader />
<SessionMessages>
{conversations =>
conversations.map(conversation => (
conversations.map((conversation, index) => (
<SessionMessage
key={conversation.id}
conversation={conversation}
isLast={index === conversations.length - 1}
/>
))
}
Expand Down Expand Up @@ -410,10 +415,11 @@ export const UndeleteableSessions = () => {
<SessionMessagesHeader />
<SessionMessages>
{conversations =>
conversations.map(conversation => (
conversations.map((conversation, index) => (
<SessionMessage
key={conversation.id}
conversation={conversation}
isLast={index === conversations.length - 1}
/>
))
}
Expand Down Expand Up @@ -498,10 +504,11 @@ export const SessionGrouping = () => {
<SessionMessagesHeader />
<SessionMessages>
{conversations =>
conversations.map(conversation => (
conversations.map((conversation, index) => (
<SessionMessage
key={conversation.id}
conversation={conversation}
isLast={index === conversations.length - 1}
/>
))
}
Expand Down Expand Up @@ -568,10 +575,11 @@ export const HundredSessions = () => {
<SessionMessagesHeader />
<SessionMessages>
{conversations =>
conversations.map(conversation => (
conversations.map((conversation, index) => (
<SessionMessage
key={conversation.id}
conversation={conversation}
isLast={index === conversations.length - 1}
/>
))
}
Expand Down Expand Up @@ -642,10 +650,11 @@ export const HundredConversations = () => {
<SessionMessagesHeader />
<SessionMessages>
{conversations =>
conversations.map(conversation => (
conversations.map((conversation, index) => (
<SessionMessage
key={conversation.id}
conversation={conversation}
isLast={index === conversations.length - 1}
/>
))
}
Expand Down Expand Up @@ -708,10 +717,11 @@ export const LongSessionNames = () => {
<SessionMessagesHeader />
<SessionMessages>
{conversations =>
conversations.map(conversation => (
conversations.map((conversation, index) => (
<SessionMessage
key={conversation.id}
conversation={conversation}
isLast={index === conversations.length - 1}
/>
))
}
Expand Down Expand Up @@ -840,10 +850,11 @@ export const MarkdownShowcase = () => {
<SessionMessagesHeader />
<SessionMessages>
{conversations =>
conversations.map(conversation => (
conversations.map((conversation, index) => (
<SessionMessage
key={conversation.id}
conversation={conversation}
isLast={index === conversations.length - 1}
/>
))
}
Expand Down Expand Up @@ -930,10 +941,11 @@ export const CVEExample = () => {
<SessionMessagesHeader />
<SessionMessages>
{conversations =>
conversations.map(conversation => (
conversations.map((conversation, index) => (
<SessionMessage
key={conversation.id}
conversation={conversation}
isLast={index === conversations.length - 1}
/>
))
}
Expand Down Expand Up @@ -1044,10 +1056,11 @@ export const ConversationSources = () => {
<SessionMessagesHeader />
<SessionMessages>
{conversations =>
conversations.map(conversation => (
conversations.map((conversation, index) => (
<SessionMessage
key={conversation.id}
conversation={conversation}
isLast={index === conversations.length - 1}
/>
))
}
Expand Down Expand Up @@ -1330,10 +1343,11 @@ export const ImageFiles = () => {
<SessionMessagesHeader />
<SessionMessages>
{conversations =>
conversations.map(conversation => (
conversations.map((conversation, index) => (
<SessionMessage
key={conversation.id}
conversation={conversation}
isLast={index === conversations.length - 1}
/>
))
}
Expand Down
6 changes: 4 additions & 2 deletions stories/Integration.stories.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -169,10 +169,11 @@ export const _OpenAI = () => {
<SessionMessagesHeader />
<SessionMessages>
{conversations =>
conversations.map(conversation => (
conversations.map((conversation, index) => (
<SessionMessage
key={conversation.id}
conversation={conversation}
isLast={index === conversations.length - 1}
/>
))
}
Expand Down Expand Up @@ -336,10 +337,11 @@ export const VercelAI = () => {
<SessionMessagesHeader />
<SessionMessages>
{conversations =>
conversations.map(conversation => (
conversations.map((conversation, index) => (
<SessionMessage
key={conversation.id}
conversation={conversation}
isLast={index === conversations.length - 1}
/>
))
}
Expand Down

0 comments on commit da08dad

Please sign in to comment.