{"version":3,"file":"index-CFWv_5yC.js","sources":["../../../app/components/series-card.tsx","../../../app/routes/series_+/index.tsx"],"sourcesContent":["import { Link } from '@remix-run/react'\nimport { getImageBuilder, getImgProps } from '~/images.tsx'\nimport { useRootData } from '~/utils/use-root-data.ts'\nimport { BlurrableImage } from './blurrable-image.tsx'\nimport { ClipboardCopyButton } from './clipboard-copy-button.tsx'\nimport { MissingSomething } from './kifs.tsx'\nimport { H3 } from './typography.tsx'\n\nfunction SeriesCard({\n  series: { title, bannerCloudinaryId, slug },\n}: {\n  series: {\n    id: string\n    title: string\n    slug: string\n    bannerCloudinaryId?: string\n  }\n}) {\n  const { requestInfo } = useRootData()\n  const permalink = `${requestInfo.origin}/series/${slug}`\n\n  return (\n    <div className=\"relative w-full\">\n      <Link\n        prefetch=\"intent\"\n        className=\"group peer relative block w-full focus:outline-none\"\n        to={`/series/${slug}`}\n      >\n        {bannerCloudinaryId ? (\n          <BlurrableImage\n            key={bannerCloudinaryId}\n            className=\"aspect-square rounded-lg\"\n            img={\n              <img\n                title={title}\n                {...getImgProps(getImageBuilder(bannerCloudinaryId, title), {\n                  widths: [280, 560, 840, 1100, 1300, 1650],\n                  sizes: [\n                    '(max-width:639px) 80vw',\n                    '(min-width:640px) and (max-width:1023px) 40vw',\n                    '(min-width:1024px) and (max-width:1620px) 25vw',\n                    '420px',\n                  ],\n                  transformations: {\n                    background: 'rgb:e6e9ee',\n                    resize: {\n                      type: 'fill',\n                      aspectRatio: '1:1',\n                    },\n                  },\n                })}\n                className=\"focus-ring w-full rounded-lg object-cover object-center transition\"\n                loading=\"lazy\"\n              />\n            }\n          />\n        ) : (\n          <div className=\"aspect-square rounded-lg\">\n            <div className=\"focus-ring w-full rounded-lg transition\">\n              <MissingSomething />\n            </div>\n          </div>\n        )}\n        <H3 as=\"div\" className=\"mt-4\">\n          {title}\n        </H3>\n      </Link>\n\n      <ClipboardCopyButton\n        value={permalink}\n        className=\"absolute right-6 top-6 z-10\"\n      />\n    </div>\n  )\n}\n\nexport { SeriesCard }\n","import slugify from 'slugify'\nimport { flatten, uniqBy } from '~/utils/cjs/lodash.js'\nimport { markdownToHtmlUnwrapped } from '~/utils/markdown.server.ts'\nimport { getBlogMdxListItems } from '~/utils/mdx.server.ts'\nimport { json, type LoaderFunction } from '@remix-run/router'\nimport { useLoaderData } from '@remix-run/react'\nimport { Grid } from '~/components/grid.tsx'\nimport { HeroSection } from '~/components/sections/hero-section.tsx'\nimport { type MetaFunction } from '@remix-run/node'\nimport { type RootLoaderType } from '~/root.tsx'\nimport { getSocialMetas } from '~/utils/seo.ts'\nimport { getSocialImageWithPreTitle, images } from '~/images.tsx'\nimport { getUrl, getDisplayUrl } from '~/utils/misc.tsx'\nimport clsx from 'clsx'\nimport { SeriesCard } from '~/components/series-card.tsx'\nimport { type MdxPage } from '~/types.ts'\n\ntype LoaderData = {\n  posts: Array<{ title: string; descriptionHTML: string; slug: string }>\n  series: NonNullable<MdxPage['frontmatter']['series']>\n}\n\nexport const loader: LoaderFunction = async ({ request }) => {\n  const posts = await getBlogMdxListItems({ request }).then(allPosts =>\n    Promise.all(\n      allPosts\n        .filter(p => !p.frontmatter.draft)\n        .map(async p => ({\n          title: p.frontmatter.title ?? 'Untitled',\n          descriptionHTML: await markdownToHtmlUnwrapped(\n            p.frontmatter.description ?? 'No description',\n          ),\n          slug: p.slug,\n          series: p.frontmatter.series || [],\n        })),\n    ),\n  )\n\n  const allSeries = flatten(posts.map(post => post.series))\n  const series = uniqBy(allSeries, 'id').map(item => ({\n    ...item,\n    slug: slugify(item.title, { lower: true }),\n  }))\n\n  const data: LoaderData = { posts, series }\n\n  return json(data, {\n    headers: {\n      'Cache-Control': 'private, max-age=3600',\n      Vary: 'Cookie',\n    },\n  })\n}\n\nexport const meta: MetaFunction<typeof loader, { root: RootLoaderType }> = ({\n  matches,\n}) => {\n  // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition\n  const requestInfo = matches.find(m => m.id === 'root')?.data.requestInfo\n  return getSocialMetas({\n    title: 'Series - Vinh Nguyen',\n    description:\n      'Explore in-depth series on software development, featuring tutorials, best practices, and guides to enhance your development work.',\n    keywords:\n      'Backend Development, Microservices Architecture, Database Management, Software Development, API Design, Server-Side Programming, Microservices Patterns, SQL Databases, NoSQL Databases, Cloud Backend Services, Distributed Systems, Database Optimization, Backend Frameworks, Service-Oriented Architecture, Data Modeling, Backend Scalability, DevOps for Microservices, Database Security, RESTful Services, Backend Integration',\n    url: getUrl(requestInfo),\n    image: getSocialImageWithPreTitle({\n      url: getDisplayUrl(requestInfo),\n      featuredImage: images.defaultFeaturedImage.id,\n      preTitle: 'Check out my series',\n      title: `Explore in-depth series on software development`,\n    }),\n  })\n}\n\nexport default function Series() {\n  const { series } = useLoaderData<LoaderData>()\n\n  return (\n    <div>\n      <HeroSection title=\"Explore in-depth series\" animatedTitle />\n\n      <Grid as=\"main\" className=\"gap-y-16\">\n        {series.slice(0, 3).map((item, idx) => (\n          <div\n            key={item.id}\n            className={clsx('col-span-4', {\n              'hidden lg:block': idx >= 2,\n            })}\n          >\n            <SeriesCard series={item} />\n          </div>\n        ))}\n      </Grid>\n    </div>\n  )\n}\n"],"names":["SeriesCard","title","bannerCloudinaryId","slug","requestInfo","useRootData","permalink","jsxs","Link","jsx","BlurrableImage","getImgProps","getImageBuilder","MissingSomething","H3","ClipboardCopyButton","meta","matches","find","m","id","data","getSocialMetas","description","keywords","url","getUrl","image","getSocialImageWithPreTitle","getDisplayUrl","featuredImage","images","defaultFeaturedImage","preTitle","Series","series","useLoaderData","children","HeroSection","animatedTitle","Grid","as","className","slice","map","item","idx","clsx"],"mappings":"sUAQA,SAASA,EAAW,CAClB,OAAQ,CAAE,MAAAC,EAAO,mBAAAC,EAAoB,KAAAC,CAAK,CAC5C,EAOG,CACK,KAAA,CAAE,YAAAC,CAAY,EAAIC,EAAY,EAC9BC,EAAY,GAAGF,EAAY,MAAM,WAAWD,CAAI,GAGpD,OAAAI,EAAA,KAAC,MAAI,CAAA,UAAU,kBACb,SAAA,CAAAA,EAAA,KAACC,EAAA,CACC,SAAS,SACT,UAAU,sDACV,GAAI,WAAWL,CAAI,GAElB,SAAA,CACCD,EAAAO,EAAA,IAACC,EAAA,CAEC,UAAU,2BACV,IACED,EAAA,IAAC,MAAA,CACC,MAAAR,EACC,GAAGU,EAAYC,EAAgBV,EAAoBD,CAAK,EAAG,CAC1D,OAAQ,CAAC,IAAK,IAAK,IAAK,KAAM,KAAM,IAAI,EACxC,MAAO,CACL,yBACA,gDACA,iDACA,OACF,EACA,gBAAiB,CACf,WAAY,aACZ,OAAQ,CACN,KAAM,OACN,YAAa,KAAA,CACf,CACF,CACD,EACD,UAAU,qEACV,QAAQ,MAAA,CAAA,CACV,EAvBGC,CAAA,EA2BPO,EAAAA,IAAC,MAAI,CAAA,UAAU,2BACb,SAAAA,EAAAA,IAAC,MAAI,CAAA,UAAU,0CACb,SAAAA,EAAA,IAACI,EAAiB,CAAA,CAAA,CACpB,CAAA,EACF,QAEDC,EAAG,CAAA,GAAG,MAAM,UAAU,OACpB,SACHb,CAAA,CAAA,CAAA,CAAA,CACF,EAEAQ,EAAA,IAACM,EAAA,CACC,MAAOT,EACP,UAAU,6BAAA,CAAA,CACZ,EACF,CAEJ,CCpBO,MAAMU,EAA8DA,CAAC,CAC1EC,QAAAA,CACF,IAAM,OAEE,MAAAb,GAAca,EAAAA,EAAQC,KAAKC,GAAKA,EAAEC,KAAO,MAAM,IAAjCH,YAAAA,EAAoCI,KAAKjB,YAC7D,OAAOkB,EAAe,CACpBrB,MAAO,uBACPsB,YACE,qIACFC,SACE,yaACFC,IAAKC,EAAOtB,CAAW,EACvBuB,MAAOC,EAA2B,CAChCH,IAAKI,EAAczB,CAAW,EAC9B0B,cAAeC,EAAOC,qBAAqBZ,GAC3Ca,SAAU,sBACVhC,MAAO,iDACR,CAAA,CACH,CAAC,CACH,EAEA,SAAwBiC,GAAS,CACzB,KAAA,CAAEC,OAAAA,CAAO,EAAIC,EAA0B,EAE7C,cACG,MACC,CAAAC,SAAA,CAAA5B,EAAA,IAAC6B,EAAY,CAAArC,MAAM,0BAA0BsC,cAAa,EAAC,CAAA,EAE1D9B,EAAA,IAAA+B,EAAA,CAAKC,GAAG,OAAOC,UAAU,WACvBL,SAAAF,EAAOQ,MAAM,EAAG,CAAC,EAAEC,IAAI,CAACC,EAAMC,IAC7BrC,EAAAA,IAAC,MAAA,CAECiC,UAAWK,EAAK,aAAc,CAC5B,kBAAmBD,GAAO,CAC5B,CAAC,EAEDT,SAAA5B,EAAA,IAACT,EAAW,CAAAmC,OAAQU,CAAM,CAAA,CAAA,EALrBA,EAAKzB,EAMZ,CACD,CACH,CAAA,CAAA,CACF,CAAA,CAEJ"}