https://techplay.jp/webv2/assets/a5dc16a/build/assets/index-DjeG3ZYH.js

1import{X as _,r as h,t as k,j as a,H as A,c as S,d as r,F as I,e as P,P as D,i as v,aD as F,N as L,k as $,Z as z,T as E,aF as M,Y}from"./app-CQDOLSaW.js";import{A as B}from"./index-CSZfa_xb.js";import O from"./ColumnSearchDialogForm-9R089Uip.js";import{u as R}from"./useColumnSeo-oGrA8iTZ.js";import w from"./ColumnLayout-3Tg87X3T.js";import"./ColumnSearchForm-Duf0qLcS.js";import"./ColumnTagPicker-BXqK3vsv.js";import"./DefaultLayout-BmSOr64O.js";import"./AccountEmailWarning-DBMhECNQ.js";import"./EnqueteLayout-CBihe2sL.js";import"./SimpleLayout-BctIcuGs.js";import"./MypageLayout-Chaoz37D.js";const x="/images/default-thumbnail.jpg",U=1,G=()=>{const j=_().props,{auth:m,columns:t,tags:i,newBlogs:n,popularColumns:l,tag:s,currentUrl:u}=j,[b,d]=h.useState(!1),f=t.meta.current_page||1,y=h.useCallback(async(e,o)=>await k({content:"columns",contentId:e,enabled:o}),[]),{canonicalUrl:N,pageTitle:C}=R({currentPage:f,baseTitle:`「${s.name}」に関連するマガジン - TECH PLAY Magazine`}),T=[{label:"マガジン",href:"/column"},{label:`「${s.name}」に関連するマガジン`}];return a.jsxs(a.Fragment,{children:[a.jsx(A,{title:C,canonical:N,description:`企業やコミュニティが発信する「${s.name}」に関連する記事の一覧です。`}),a.jsxs(w,{tag:s,tagCategories:i,newBlogs:n,popularColumns:l,defaultTagIds:s.id.toString(),children:[a.jsxs("main",{className:"container mx-auto px-4 py-4",children:[a.jsx(S,{currentUrl:u,items:T}),!m&&a.jsxs(a.Fragment,{children:[a.jsxs(r.PageTitle,{className:"mt-8",children:["「",s.name,"」に関連するマガジン"]}),a.jsxs(r.Description,{className:"mt-4",children:["企業やコミュニティが発信する「",s.name,"」に関連する記事の一覧です。"]})]}),a.jsxs("div",{className:"md:hidden flex gap-2 items-center bg-white border-y px-5 py-3 -mx-3 mb-6 mt-6",children:[a.jsx(I,{icon:P,size:"xs"}),a.jsx("button",{type:"button",className:"text-sm text-secondary",onClick:()=>d(!0),children:"絞り込み"})]}),a.jsx("div",{className:"my-6","aria-label":"検索結果情報",children:a.jsx(D,{...t})}),a.jsx("section",{className:"mt-8 grid grid-cols-1 gap-6 sm:grid-cols-2 lg:grid-cols-3","aria-label":"マガジン記事一覧",children:t.data.map(e=>{var o,g,p;return a.jsx(B,{aspectRatio:"3:2",truncateLength:38,label:F(e.category),title:e.title,href:`/column/${e.id}`,src:e.image_url||x,date:e.first_published_at?v.unix(e.first_published_at).format("YYYY/MM/DD"):"",tags:Array.isArray(e.tags)?e.tags.map(c=>({label:c.name,href:`/column/tag/${c.url_path}`})):[],footer:{name:((o=e.organizer)==null?void 0:o.name)||"",src:((g=e.organizer)==null?void 0:g.brand_logo_url)||"",href:(p=e.organizer)!=null&&p.id?`/community/${e.organizer.url_path}/column`:""},bookmark:{auth:m,data:{enabled:e.bookmarked||!1},onClickCallback:c=>y(e.id,c)}},e.id)})}),t.data.length===0&&a.jsx("div",{className:"mt-8 text-center py-12",children:a.jsxs(r.Description,{children:["「",s.name,"」に関連するマガジンが見つかりませんでした。"]})}),t.meta.last_page>U&&a.jsx("div",{className:"mt-8",children:a.jsx(L,{paginate:t.meta})}),a.jsxs("aside",{className:"mt-12 space-y-8 md:hidden","aria-label":"関連コンテンツ",children:[i&&i.length>0&&a.jsxs("section",{className:"space-y-3",children:[a.jsx(r.SectionTitle,{children:"タグからマガジンをさがす"}),a.jsx($,{tagCategories:i,linkTo:e=>`/column/tag/${e.url_path}`})]}),n&&n.length>0&&a.jsxs("section",{className:"space-y-3",children:[a.jsx(r.SectionTitle,{children:"新着技術ブログ"}),a.jsx(z,{blogs:n}),a.jsx("div",{className:"text-right",children:a.jsx(E,{href:"/blog",variant:"primary",icon:M,children:"技術ブログを見る"})})]}),l&&l.length>0&&a.jsxs("section",{className:"space-y-3",children:[a.jsx(r.SectionTitle,{children:"人気のマガジン"}),a.jsx("div",{className:"space-y-3",children:l.map(e=>a.jsx(Y,{src:e.image_url||x,title:e.title,href:`/column/${e.id}`},e.id))})]})]})]}),a.jsx(O,{open:b,onOpenChange:d,tag:s,defaultTagIds:s.id.toString()})]})]})};G.displayName="ColumnTagPage";export{G as default};