{"version":3,"file":"static/chunks/5429.d2f71963662cf0ef.js","mappings":"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","sources":["webpack://_N_E/./src/components/tanya-similar-question/tanya-similar-question.styles.tsx","webpack://_N_E/./src/components/tanya-similar-question/tanya-similar-question.tsx","webpack://_N_E/<anon>"],"sourcesContent":["import styled from \"styled-components\";\nimport { breakpoints } from \"styles\";\n\nexport const TanyaSimilarQuestionCard = styled.div`\n  padding: 16px;\n  border-radius: 8px;\n  background-color: ${({ theme }) => theme.colors.white};\n  box-shadow: 0px 2px 8px 0px ${({ theme }) => theme.colors.neutral[100]};\n  display: flex;\n  flex-direction: column;\n  justify-content: space-between;\n  cursor: pointer;\n`;\n\nexport const TanyaSimilarQuestionPlayIcon = styled.div`\n  color: ${({ theme }) => theme.colors.brand[500]};\n  width: 40px;\n  height: 40px;\n`;\nexport const TanyaSimilarQuestionCardTitle = styled.a`\n  display: block;\n  text-decoration: none;\n  color: ${({ theme }) => theme.colors.black};\n  font-family: ${({ theme }) => theme.fonts.secondary};\n  font-size: ${({ theme }) => theme.fontSizes.xs};\n  font-weight: normal;\n  line-height: 1.25;\n  margin: 0;\n\n  @media ${breakpoints.tablet} {\n    font-size: ${({ theme }) => theme.fontSizes.md};\n  }\n`;\n\nexport const TanyaSimilarQuestionHeader = styled.div`\n  display: flex;\n  align-items: center;\n  gap: 10px;\n`;\n\nexport const TanyaSimilarQuestionLink = styled.p`\n  font-family: ${({ theme }) => theme.fonts.primary};\n  font-size: ${({ theme }) => theme.fontSizes.xs};\n  margin: 24px 0 0 8px;\n  display: inline-flex;\n  align-items: center;\n  font-weight: bold;\n  color: ${({ theme }) => theme.colors.brand[500]};\n  text-decoration: none;\n`;\n\nexport const TanyaSimilarQuestionsCardContainer = styled.div`\n  display: flex;\n  gap: 16px;\n  flex-direction: column;\n\n  @media ${breakpoints.laptop} {\n    display: grid;\n    grid-template-columns: 1fr 1fr;\n  }\n`;\n\nexport const TanyaSimilarQuestionTitle = styled.h2`\n  font-family: ${({ theme }) => theme.fonts.primary};\n  font-size: ${({ theme }) => theme.fontSizes[\"lg\"]};\n  color: ${({ theme }) => theme.colors.black};\n  line-height: 1.5;\n`;\n","import { Button } from \"components/atoms/button/button\";\nimport React from \"react\";\nimport { SimilarQuestion } from \"services/api/api.types\";\n\nimport {\n  MoreVideosContainer,\n  VideoRecommendationsContainer,\n  VideoRecommendationsListContainer\n} from \"styles/pages/tanya-video-detail.styles\";\nimport {\n  TanyaSimilarQuestionCard,\n  TanyaSimilarQuestionHeader,\n  TanyaSimilarQuestionLink,\n  TanyaSimilarQuestionPlayIcon,\n  TanyaSimilarQuestionTitle,\n  TanyaSimilarQuestionCardTitle,\n  TanyaSimilarQuestionsCardContainer\n} from \"./tanya-similar-question.styles\";\nimport { Play } from \"components/icons/play\";\nimport { trimString } from \"utils/utils\";\n\nimport { Chevron } from \"components/icons/chevron\";\n\ntype ITanyaSimilarQuestions = {\n  similarQuestions: SimilarQuestion[];\n  topicName: string;\n  handleViewMore: () => void;\n};\n\nconst TanyaSimilarQuestions: React.FC<ITanyaSimilarQuestions> = ({\n  similarQuestions,\n  topicName,\n  handleViewMore\n}) => {\n  if (!similarQuestions || similarQuestions.length === 0) {\n    return <></>;\n  }\n  return (\n    <VideoRecommendationsContainer>\n      <VideoRecommendationsListContainer>\n        <TanyaSimilarQuestionTitle>\n          Pertanyaan lainnya untuk {topicName}\n        </TanyaSimilarQuestionTitle>\n        <TanyaSimilarQuestionsCardContainer>\n          {similarQuestions.map((question, idx) => {\n            return (\n              <TanyaSimilarQuestionCard\n                key={question.id}\n                data-testid={`tanya-video-similar-question-${idx}`}\n              >\n                <TanyaSimilarQuestionHeader>\n                  <TanyaSimilarQuestionPlayIcon>\n                    <Play width=\"40px\" height=\"40px\" />\n                  </TanyaSimilarQuestionPlayIcon>\n\n                  <TanyaSimilarQuestionCardTitle\n                    href={`/tanya/${question.id}/${question.slug}`}\n                  >\n                    {trimString(question.title, 60)}\n                  </TanyaSimilarQuestionCardTitle>\n                </TanyaSimilarQuestionHeader>\n\n                <TanyaSimilarQuestionLink>\n                  Tonton video{\" \"}\n                  <Chevron width=\"14px\" height=\"14px\" direction=\"right\" />\n                </TanyaSimilarQuestionLink>\n              </TanyaSimilarQuestionCard>\n            );\n          })}\n        </TanyaSimilarQuestionsCardContainer>\n      </VideoRecommendationsListContainer>\n      <MoreVideosContainer>\n        <Button\n          onClick={handleViewMore}\n          variant=\"primary\"\n          data-testid=\"tanya-page-view-more-questions\"\n        >\n          Cek video lainnya\n        </Button>\n      </MoreVideosContainer>\n    </VideoRecommendationsContainer>\n  );\n};\n\nexport default TanyaSimilarQuestions;\n"],"names":["TanyaSimilarQuestionCard","styled","div","withConfig","theme","param","colors","white","neutral","TanyaSimilarQuestionPlayIcon","brand","TanyaSimilarQuestionCardTitle","a","black","fonts","secondary","fontSizes","xs","breakpoints","tablet","md","TanyaSimilarQuestionHeader","TanyaSimilarQuestionLink","p","primary","TanyaSimilarQuestionsCardContainer","laptop","TanyaSimilarQuestionTitle","h2","tanya_similar_question","similarQuestions","topicName","handleViewMore","length","jsx_runtime","jsxs","VideoRecommendationsContainer","VideoRecommendationsListContainer","jsx","map","question","idx","Play","width","height","href","id","concat","slug","trimString","title","Chevron","direction","MoreVideosContainer","Button","onClick","variant","Fragment"],"sourceRoot":""}