DiscussionList.tsx 1.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263
  1. import { List } from "antd";
  2. import DiscussionItem, { type IComment } from "./DiscussionItem";
  3. interface IWidget {
  4. data: IComment[];
  5. onSelect?: Function;
  6. onDelete?: Function;
  7. onReply?: Function;
  8. onClose?: Function;
  9. }
  10. const DiscussionListWidget = ({
  11. data,
  12. onSelect,
  13. onDelete,
  14. onReply,
  15. onClose,
  16. }: IWidget) => {
  17. return (
  18. <List
  19. pagination={{
  20. onChange: (page) => {
  21. console.log(page);
  22. },
  23. pageSize: 10,
  24. }}
  25. itemLayout="horizontal"
  26. dataSource={data}
  27. renderItem={(item) => (
  28. <List.Item>
  29. <DiscussionItem
  30. data={item}
  31. onSelect={(
  32. e: React.MouseEvent<HTMLSpanElement, MouseEvent>,
  33. data: IComment
  34. ) => {
  35. if (typeof onSelect !== "undefined") {
  36. onSelect(e, data);
  37. }
  38. }}
  39. onDelete={() => {
  40. if (typeof onDelete !== "undefined") {
  41. onDelete(item.id);
  42. }
  43. }}
  44. onReply={() => {
  45. if (typeof onReply !== "undefined") {
  46. onReply(item);
  47. }
  48. }}
  49. onClose={() => {
  50. if (typeof onClose !== "undefined") {
  51. onClose(item);
  52. }
  53. }}
  54. />
  55. </List.Item>
  56. )}
  57. />
  58. );
  59. };
  60. export default DiscussionListWidget;