{"version":3,"file":"component---src-templates-categories-tsx-65898a0cf9139ccefd7e.js","mappings":"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","sources":["webpack://beaver-help/./src/components/atoms/commonH3.tsx","webpack://beaver-help/./src/components/molecules/categoryCard.tsx","webpack://beaver-help/./src/hooks/useHelpData.ts","webpack://beaver-help/./src/templates/categories.tsx"],"sourcesContent":["import styled from '@emotion/styled'\nimport React from 'react'\n\nconst H3 = styled.h3`\n  font-size: 1em;\n  margin: 0 0 15px;\n  border: none;\n  display: inline-block;\n  span {\n    margin: 0 0 3px;\n    display: inline-block;\n    position: relative;\n    border-bottom: solid 2px #e5e5e5;\n    &:before {\n      position: absolute;\n      bottom: -2px;\n      left: 0;\n      width: 16px;\n      height: 2px;\n      content: '';\n      background: #3ec7b3;\n    }\n  }\n`\n\ntype Props = {\n  /** クラス名 */\n  className?: string\n  /** タイトル */\n  label: string\n}\n\n/**\n * 共通H3タグ\n * @param props\n * @constructor\n */\nconst CommonH3 = (props: Props): JSX.Element => {\n  const { className = '' } = props\n\n  return (\n    <H3 className={className}>\n      <span>{props.label}</span>\n    </H3>\n  )\n}\n\nexport default CommonH3\n","import styled from '@emotion/styled'\nimport { Link } from 'gatsby'\nimport React from 'react'\nimport useHelpData from '../../hooks/useHelpData'\nimport CommonH3 from '../atoms/commonH3'\nimport BreakPoints from '../../styles/breakPoints'\nimport useRouteParam from '../../hooks/useRouteParam'\n\nconst Wrapper = styled.div`\n  background: #ffffff;\n  border-radius: 10px;\n  padding: 25px 30px;\n  width: 500px;\n  min-height: 276px;\n  margin: 15px;\n  float: left;\n  box-shadow: 0 0 5px rgba(0, 0, 0, 0.1);\n\n  h3 {\n    span {\n      font-size: 1.6em;\n      border: none;\n\n      &:before {\n        display: none;\n      }\n    }\n  }\n\n  .category-list {\n    li {\n      margin: 0 0 5px 15px;\n      position: relative;\n\n      &:before {\n        display: block;\n        content: '';\n        position: absolute;\n        width: 0;\n        height: 0;\n        top: 7px;\n        left: -14px;\n        border-left: 8px solid #3ec7b3;\n        border-top: 3px solid transparent;\n        border-bottom: 3px solid transparent;\n      }\n\n      a {\n        max-width: 100%;\n        // overflow: hidden;\n        // text-overflow: ellipsis;\n        // white-space: nowrap;\n        display: inline-block;\n      }\n    }\n  }\n\n  .all-link {\n    display: block;\n    width: fit-content;\n    margin: 0 0 0 auto;\n    text-align: right;\n    color: #00b5a6;\n  }\n\n  @media screen and (max-width: 1074px) {\n    margin: 15px auto;\n    width: 80vw;\n    float: unset;\n    min-height: unset;\n  }\n\n  ${BreakPoints.large} {\n    width: calc(100vw - 45px);\n  }\n\n  ${BreakPoints.medium} {\n    width: calc(100vw - 20px);\n    padding: 15px 15px 15px 5px;\n  }\n}\n`\ntype IProps = {\n  /** カテゴリタイトル */\n  categoryTitle: string\n  /** URL */\n  slug: string\n  /** カテゴリID */\n  helpCategoryId: string\n  /** ページタイトル */\n  limit: number\n  /** すべての記事を表示フラグ */\n  visibleAllLink?: boolean\n}\n\n/**\n * カテゴリカード\n * @constructor\n */\nconst CategoryCard = ({\n  categoryTitle,\n  slug,\n  helpCategoryId,\n  limit,\n  visibleAllLink,\n}: IProps) => {\n  const { helpDetails } = useHelpData()\n  const fixDetails = helpDetails.filter(\n    (val) => val.helpCategoryId.split(',').indexOf(helpCategoryId) !== -1\n  )\n  const morePage = limit < fixDetails.length\n  return (\n    <Wrapper className=\"category-card\">\n      <CommonH3 label={categoryTitle} className=\"category-title\" />\n      <ul className=\"category-list\">\n        {fixDetails.splice(0, limit).map((item) => (\n          <li key={`article-${item.helpId}`}>\n            <Link to={useRouteParam(`/help/article/${item.helpId}`)}>\n              {item.title}\n            </Link>\n          </li>\n        ))}\n      </ul>\n      {visibleAllLink && morePage && (\n        <Link to={useRouteParam(`/help/${slug}`)} className=\"all-link\">\n          <span itemProp=\"headline\">すべての記事を表示</span>\n        </Link>\n      )}\n    </Wrapper>\n  )\n}\n\nexport default CategoryCard\n","import { graphql, useStaticQuery } from 'gatsby'\nimport { useMemo } from 'react'\nimport { CategoryKindType } from '../types/CategoryKind'\n\nexport type IHelpCategory = {\n  /** ヘルプカテゴリID */\n  helpCategoryId: string\n  /** カテゴリ種別 */\n  categoryKind: CategoryKindType\n  /** タイトル */\n  title: string\n  /** スラッグ */\n  slug: string\n}\n\nexport type IHelpCategoryMap = {\n  [helpCategoryId: string]: IHelpCategory\n}\n\nexport type IHelpDetail = {\n  /** ヘルプID */\n  helpId: string\n  /** ソート番号 */\n  sortNo: number\n  /** カテゴリID */\n  helpCategoryId: string\n  /** タイトル */\n  title: string\n  /** スラッグ */\n  slug: string\n}\n\ntype IReturn = {\n  helpCategoryMap: IHelpCategoryMap\n  helpDetails: IHelpDetail[]\n}\n/**\n * ヘルプ情報共通フック\n */\nconst useHelpData = (): IReturn => {\n  const { awsGraphQL } = useStaticQuery<GatsbyTypes.useHelpDataQuery>(\n    graphql`\n      query useHelpData {\n        awsGraphQL {\n          listHelpDetails {\n            items {\n              helpId\n              title\n              sortNo\n              helpCategoryId\n              _deleted\n            }\n          }\n          listHelpCategories {\n            items {\n              helpCategoryId\n              categoryKind\n              title\n              slug\n              _deleted\n            }\n          }\n        }\n      }\n    `\n  )\n\n  const detailItems = awsGraphQL.listHelpDetails?.items || []\n  const categoryItems = awsGraphQL.listHelpCategories?.items || []\n\n  // ヘルプカテゴリIDがキーのマップ情報を作成\n  const helpCategoryMap = useMemo(\n    () =>\n      categoryItems.reduce<IHelpCategoryMap>(\n        // eslint-disable-next-line no-shadow\n        (result, data) => {\n          if (data?._deleted) return result\n          return {\n            ...result,\n            [data?.helpCategoryId || '']: {\n              helpCategoryId: data?.helpCategoryId || '',\n              categoryKind: data?.categoryKind as CategoryKindType,\n              title: data?.title || '',\n              slug: data?.slug || '',\n            },\n          }\n        },\n        {}\n      ),\n    [categoryItems]\n  )\n\n  // ヘルプIDがキーの詳細マップ情報を作成\n  const helpDetails = useMemo(() => {\n    const _result: IHelpDetail[] = []\n    detailItems.forEach((helpDetail) => {\n      if (helpDetail?._deleted) return\n      const _helpCategoryIds = (helpDetail?.helpCategoryId || '').split(',')\n      const _helpId = helpDetail?.helpId || ''\n      _helpCategoryIds.forEach((_helpCategoryId) => {\n        if (helpCategoryMap[_helpCategoryId]) {\n          const category = helpCategoryMap[_helpCategoryId]\n          _result.push({\n            helpId: _helpId,\n            title: helpDetail?.title || '',\n            sortNo: helpDetail?.sortNo || 999999,\n            helpCategoryId: _helpCategoryId,\n            slug: category.slug,\n          })\n        }\n      })\n    })\n    _result.sort((a, b) => a.sortNo - b.sortNo)\n    return _result\n  }, [helpCategoryMap, detailItems])\n\n  return { helpCategoryMap, helpDetails }\n}\n\nexport default useHelpData\n","import styled from '@emotion/styled'\nimport { graphql, PageProps } from 'gatsby'\nimport React from 'react'\nimport SEO from '../components/atoms/seo'\nimport { ITopicPath } from '../components/atoms/topicPath'\nimport CategoryCard from '../components/molecules/categoryCard'\nimport Layout from '../components/organisms/layout'\nimport useHelpData from '../hooks/useHelpData'\nimport BreakPoints from '../styles/breakPoints'\nimport { CategoryKindType } from '../types/CategoryKind'\nimport useRouteParam from '../hooks/useRouteParam'\n\ntype IProps = PageProps<GatsbyTypes.CategoriesPageQuery>\n\nconst Wrapper = styled.div`\n  .category-card {\n    position: relative;\n    margin-top: 40px;\n    display: flex;\n    width: 100%;\n\n    .category-title {\n      left: 10px;\n      position: absolute;\n      top: -40px;\n    }\n\n    .category-list {\n      width: 100%;\n      margin-left: 15px;\n\n      li {\n        line-height: 2rem;\n\n        &::before {\n          top: 40%;\n          left: -15px;\n        }\n      }\n\n      a {\n        font-size: 1.2rem;\n      }\n    }\n  }\n\n  ${BreakPoints.medium} {\n    .category-card {\n      width: calc(100vw - 20px);\n    }\n  }\n`\n\n/**\n * カテゴリ一覧ページ\n * @constructor\n */\nconst CategoriesPage = ({ data, location }: IProps) => {\n  const helpCategoryId = data.awsGraphQL.getHelpCategory?.helpCategoryId || ''\n  const categoryTitle = data.awsGraphQL.getHelpCategory?.title || ''\n  const categoryKind = data.awsGraphQL.getHelpCategory\n    ?.categoryKind as CategoryKindType\n  const slug = data.awsGraphQL.getHelpCategory?.slug || ''\n  const { helpCategoryMap } = useHelpData()\n  const category = helpCategoryMap[helpCategoryId]\n\n  // パンくず情報\n  const paths: ITopicPath[] = [\n    { title: 'TOP', link: useRouteParam('/help') },\n    { title: category?.title },\n  ]\n\n  return (\n    <Wrapper>\n      <Layout location={location} paths={paths} categoryKind={categoryKind}>\n        <SEO title={categoryTitle} />\n        <CategoryCard\n          categoryTitle={categoryTitle}\n          slug={slug}\n          helpCategoryId={helpCategoryId}\n          limit={100}\n        />\n      </Layout>\n    </Wrapper>\n  )\n}\n\nexport default CategoriesPage\n\nexport const pageQuery = graphql`\n  query CategoriesPage($id: ID!) {\n    awsGraphQL {\n      getHelpCategory(id: $id) {\n        helpCategoryId\n        categoryKind\n        title\n        slug\n      }\n    }\n    site {\n      siteMetadata {\n        title\n      }\n    }\n  }\n`\n"],"names":["H3","props","className","label","Wrapper","BreakPoints","categoryTitle","slug","helpCategoryId","limit","visibleAllLink","fixDetails","useHelpData","helpDetails","filter","val","split","indexOf","morePage","length","splice","map","item","key","helpId","Link","to","useRouteParam","title","itemProp","awsGraphQL","useStaticQuery","detailItems","listHelpDetails","items","categoryItems","listHelpCategories","helpCategoryMap","useMemo","reduce","result","data","_deleted","categoryKind","_result","forEach","helpDetail","_helpCategoryIds","_helpId","_helpCategoryId","category","push","sortNo","sort","a","b","location","getHelpCategory","paths","link"],"sourceRoot":""}