Display all the threads in a given location
This component is currently in BETA mode, and its default design and customizability options are subject to change.
The ThreadList component renders the list of threads created with a given location (see the location property in the Thread component). It provides a quick way for users to view multiple conversations.
This component pairs well with:
import { ThreadList } from "@cord-sdk/react";
export const Example = () => {
return (
<ThreadList
location={{ "page": "index" }}
onThreadClick={(threadId) =>
console.log("user clicked on thread:", threadId)
}
/>
);
};
<cord-thread-list location='{{ "page": "index" }}'></cord-thread-list>
optionaldefault: current URLThreads created at this location are displayed in the list.
optionalCallback invoked when one of the threads in the list is clicked.
This event is fired when one of the threads in the list is clicked. The event.detail[0] is the thread-id of the clicked thread.
These can be used to customize the component, you can learn more about customization here
| Name | Default Value |
|---|---|
--cord-thread-background-color |
--cord-color-base#FFFFFF |
--cord-thread-border |
1px solid var(--cord-color-base-x-strong) |
--cord-thread-border-radius |
--cord-border-radius-medium4px |
--cord-thread-list-gap |
24px |
--cord-thread-list-padding |
8px |