Copying from #769 to implement mock service worker

This commit is contained in:
Keith Stevens
2023-01-28 20:09:04 +09:00
parent b2eb94962c
commit 2e1abd3f69
6 changed files with 1682 additions and 2 deletions
@@ -71,6 +71,8 @@ export function MessageTableEntry({ message, enabled, highlight }: MessageTableE
sendEmojiChange({ op: state ? "add" : "remove", emoji });
};
console.log(emojiState);
console.log(message);
return (
<HStack w={["full", "full", "full", "fit-content"]} gap={2}>
{!inlineAvatar && avatar}
@@ -93,7 +95,7 @@ export function MessageTableEntry({ message, enabled, highlight }: MessageTableE
style={{ float: "right", position: "relative", right: "-0.3em", bottom: "-0em", marginLeft: "1em" }}
onClick={(e) => e.stopPropagation()}
>
{Object.entries(emojiState.emojis).map(([emoji, count]) => (
{Object.entries(emojiState?.emojis || {}).map(([emoji, count]) => (
<MessageEmojiButton
key={emoji}
emoji={{ name: emoji, count }}
@@ -158,7 +160,7 @@ const MessageActions = ({
<MenuGroup title={t("reactions")}>
<SimpleGrid columns={4}>
{["+1", "-1"].map((emoji) => (
<EmojiMenuItem key={emoji} emoji={emoji} checked={userEmoji.includes(emoji)} react={react} />
<EmojiMenuItem key={emoji} emoji={emoji} checked={userEmoji?.includes(emoji)} react={react} />
))}
</SimpleGrid>
</MenuGroup>
@@ -0,0 +1,99 @@
import { rest } from "msw";
import { MessageWithChildren } from "./MessageWithChildren";
// eslint-disable-next-line import/no-anonymous-default-export
export default {
title: "Messages/MessageWithChildren",
component: MessageWithChildren,
parameters: {
layout: "fullscreen",
msw: {
handlers: {
messagesDefault: [
rest.get("/api/messages/id-1", (req, res, ctx) => {
return res(
ctx.json({
text: "Some message Text",
is_assistant: false,
id: "id-1",
})
);
}),
rest.get("/api/messages/id-1/children", (req, res, ctx) => {
return res(ctx.json([]));
}),
],
},
},
},
};
const Template = (args) => <MessageWithChildren {...args} />;
export const NoChildren = Template.bind({});
NoChildren.args = {
id: "id-1",
maxDepth: 2,
};
export const WithChildren = Template.bind({});
WithChildren.args = {
id: "id-1",
maxDepth: 1,
};
WithChildren.parameters = {
msw: {
handlers: {
additionalMessages: [
rest.get("/api/messages/id-2", (req, res, ctx) => {
return res(
ctx.json({
text: "Some child message Text",
is_assistant: false,
id: "id-2",
})
);
}),
rest.get("/api/messages/id-3", (req, res, ctx) => {
return res(
ctx.json({
text: "Some child message Text",
is_assistant: false,
id: "id-3",
})
);
}),
rest.get("/api/messages/id-1/children", (req, res, ctx) => {
return res(
ctx.json([
{
text: "Some child message Text",
is_assistant: false,
id: "id-2",
},
{
text: "another child message Text",
is_assistant: false,
id: "id-3",
},
])
);
}),
rest.get("/api/messages/id-2/children", (req, res, ctx) => {
return res(
ctx.json([
{
text: "another message Text",
is_assistant: false,
id: "id-4",
},
])
);
}),
rest.get("/api/messages/id-3/children", (req, res, ctx) => {
return res(ctx.json([]));
}),
],
},
},
};