{"version":3,"file":"ArticleBuddy.stories.jsx","sourceRoot":"","sources":["../../../src/work/ArticleList/ArticleBuddy.stories.tsx"],"names":[],"mappings":"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","sourcesContent":["import type { Meta, StoryFn } from '@storybook/react';\nimport { useMemo, useState } from 'react';\nimport type { ChangeEvent } from 'react';\nimport { action } from '@storybook/addon-actions';\n\nimport { HTML, Card, menuHelpers } from '@pega/cosmos-react-core';\nimport type { OmitStrict, MenuItemProps, MenuProps } from '@pega/cosmos-react-core';\nimport { ArticleBuddy } from '@pega/cosmos-react-work';\nimport type {\n  ArticleBuddyProps,\n  Reaction,\n  BuddyResponseProps,\n  ArticleFeedbackProps,\n  ArticleBuddyListProps\n} from '@pega/cosmos-react-work';\n\nimport { ArticleBuddyMockData } from './ArticleList.mocks';\n\nexport default {\n  title: 'Work/ArticleList',\n  component: ArticleBuddy\n} as Meta;\n\nexport interface ArticleBuddyDemoProps {\n  showDisclaimer: boolean;\n  showReferences: boolean;\n  showActions: boolean;\n  showError: boolean;\n  showFeedback: boolean;\n}\n\ntype MockBuddyArticles = OmitStrict<ArticleBuddyProps, 'query' | 'onSubmit' | 'onClear'>;\n\nexport const ArticleBuddyDemo: StoryFn<ArticleBuddyDemoProps> = (args: ArticleBuddyDemoProps) => {\n  const [searchVal, setSearchVal] = useState('');\n  const [commentVal, setCommentVal] = useState('');\n  const [loading, setLoading] = useState(false);\n  const [searchResult, setSearchResult] = useState<MockBuddyArticles['response']>();\n  const [reaction, setReaction] = useState<Reaction>(undefined);\n  const [showThankYouMessage, setShowThankYouMessage] = useState(false);\n  const [items, setItems] = useState<MenuProps['items']>(() =>\n    Array.from({ length: 10 }, (_, i) => {\n      return {\n        id: `${i + 1}`,\n        primary: `Buddy ${i + 1}`,\n        selected: false\n      };\n    })\n  );\n  const [buddyInfo, setBuddyInfo] = useState('');\n\n  /** updates buddy response */\n  const updateBuddyArticles = (mockBuddyArticle: MockBuddyArticles['response']) => {\n    const actionItems = {\n      items: [\n        { id: '1', text: 'Share' },\n        { id: '2', text: 'Copy' }\n      ]\n    };\n\n    return {\n      title: mockBuddyArticle?.title,\n      content: mockBuddyArticle?.content,\n      references: mockBuddyArticle?.references,\n      disclaimer: mockBuddyArticle?.disclaimer,\n      actions: actionItems\n    };\n  };\n\n  /** async call the response */\n  const fetchSearchResult: () => Promise<{\n    data: BuddyResponseProps;\n  }> = () => {\n    return new Promise(resolve => {\n      setTimeout(() => {\n        resolve({\n          data: updateBuddyArticles(ArticleBuddyMockData)\n        });\n      }, 1000);\n    });\n  };\n\n  /** fetches the response and gets the sets the response */\n  const getResults = async () => {\n    setLoading(true);\n    const res = await fetchSearchResult();\n    setSearchResult(res.data);\n    setLoading(false);\n  };\n\n  const queryParams: ArticleBuddyProps['query'] = {\n    label: 'Ask buddy',\n    placeholder: 'Ask your question here...',\n    value: searchVal,\n    onChange: (e: ChangeEvent<HTMLTextAreaElement>) => setSearchVal(e.target.value),\n    labelHidden: true\n  };\n\n  const commentParams: ArticleFeedbackProps['comment'] = {\n    placeholder: 'How can I improve...',\n    value: commentVal,\n    onChange: (e: ChangeEvent<HTMLTextAreaElement>) => setCommentVal(e.target.value),\n    labelHidden: false\n  };\n\n  const onReaction = (feedback: Reaction) => {\n    setReaction(feedback);\n  };\n\n  const feedbackProps = {\n    question: 'Was this helpful?',\n    reaction,\n    onReaction,\n    comment: commentParams,\n    onSubmit: (response: { reaction: Reaction; comment: string }) => {\n      action('onClick')(`Response sent ${response.reaction} ${response.comment}`);\n      setCommentVal('');\n      setReaction(undefined);\n      setShowThankYouMessage(true);\n    },\n    showThankYouMessage\n  };\n\n  const handleMenuItemClick = (id: MenuItemProps['id']) => {\n    setItems(cur => menuHelpers.toggleSelected(cur, id, 'single-select'));\n    setBuddyInfo(`Buddy ${id}`);\n  };\n\n  const itemsToRender = useMemo(() => {\n    return menuHelpers.mapTree(items, item => {\n      return {\n        ...item,\n        visual: undefined,\n        secondary: undefined\n      };\n    });\n  }, [items]);\n\n  const buttonText = useMemo(() => {\n    const selected = menuHelpers.getSelected(items)[0];\n    return selected ? selected.primary : 'Select buddy';\n  }, [items]);\n\n  const buddyListProps: ArticleBuddyListProps = {\n    text: buttonText,\n    variant: 'text',\n    menu: {\n      items: itemsToRender,\n      onItemClick: handleMenuItemClick\n    },\n    contextualLabel: buttonText === 'Select buddy' ? buttonText : `Selected buddy: ${buttonText}`\n  };\n\n  const onClickRelatedQuestions = (item: { id: string; name: string }) => {\n    setSearchVal(item.name);\n    getResults();\n  };\n\n  const relatedQuestions = {\n    title: 'Related questions',\n    items: [\n      { id: '1', name: 'How to file complaint?', onClick: onClickRelatedQuestions },\n      {\n        id: '2',\n        name: 'How to view profile?',\n        onClick: onClickRelatedQuestions\n      },\n      {\n        id: '3',\n        name: 'How to subscribe bill payment every month?',\n        onClick: onClickRelatedQuestions\n      }\n    ]\n  };\n  return (\n    <Card>\n      <ArticleBuddy\n        query={queryParams}\n        onSubmit={getResults}\n        buddyOptions={{\n          list: buddyListProps,\n          ...(buttonText !== 'Select buddy' && {\n            buddyInfo: {\n              title: buddyInfo,\n              description:\n                'This buddy will provide assistance for customer service related queries.'\n            }\n          })\n        }}\n        onClear={() => {\n          setSearchVal('');\n        }}\n        loading={loading}\n        response={{\n          title: searchResult?.title,\n          actions: args.showActions ? searchResult?.actions : undefined,\n          content:\n            !args.showError && searchResult?.content ? (\n              <HTML content={ArticleBuddyMockData.content} />\n            ) : undefined,\n          disclaimer: args.showDisclaimer ? ArticleBuddyMockData?.disclaimer : undefined,\n          references: args.showReferences ? searchResult?.references : undefined,\n          feedback: args.showFeedback ? feedbackProps : undefined,\n          error: args.showError,\n          relatedQuestions: searchResult ? relatedQuestions : undefined\n        }}\n      />\n    </Card>\n  );\n};\n\nArticleBuddyDemo.args = {\n  showDisclaimer: true,\n  showActions: true,\n  showReferences: true,\n  showError: false,\n  showFeedback: true\n};\n\nArticleBuddyDemo.argTypes = {\n  showDisclaimer: { control: { type: 'boolean' } },\n  showActions: { control: { type: 'boolean' } },\n  showReferences: { control: { type: 'boolean' } },\n  showError: { control: { type: 'boolean' } },\n  showFeedback: { control: { type: 'boolean' } }\n};\n"]}