From 97793743e25cc775d0b1681a5e1698ba8f12a875 Mon Sep 17 00:00:00 2001 From: anguyen-yext2 <143001514+anguyen-yext2@users.noreply.github.com> Date: Mon, 24 Jun 2024 10:33:27 -0400 Subject: [PATCH] Added storybook stories for generative direct answer component (#442) J=CLIP-1226 TEST=manual ran `npm run storybook` --- .../generativedirectanswer--primary.png | Bin 0 -> 16082 bytes package-lock.json | 4 +- package.json | 2 +- .../data/generativeDirectAnswer.ts | 2 +- .../GenerativeDirectAnswer.stories.tsx | 37 ++++++++++++++++++ 5 files changed, 41 insertions(+), 4 deletions(-) create mode 100644 .storybook/snapshots/__snapshots__/generativedirectanswer--primary.png create mode 100644 tests/components/GenerativeDirectAnswer.stories.tsx diff --git a/.storybook/snapshots/__snapshots__/generativedirectanswer--primary.png b/.storybook/snapshots/__snapshots__/generativedirectanswer--primary.png new file mode 100644 index 0000000000000000000000000000000000000000..8d664ad1ae2d78306b32001e817e7f9ebe422c8c GIT binary patch literal 16082 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 = { + title: 'GenerativeDirectAnswer', + component: GenerativeDirectAnswer, + args: { + answerHeader: 'Answer Title', + citationsHeader: 'Citation Title', + } +}; +export default meta; + +const mockedHeadlessState: RecursivePartial = { + universal: { + verticals: verticalResults + }, + generativeDirectAnswer: { + isLoading: false, + response: generativeDirectAnswerResponse + } +}; + +export const Primary: StoryFn = (args) => { + return ( + + + + ); +};