Marc Mintel
5397309103
Some checks failed
Build & Deploy / 🔍 Prepare (push) Successful in 20s
Build & Deploy / 🧪 QA (push) Failing after 34s
Build & Deploy / 🏗️ Build (push) Has started running
Build & Deploy / 🚀 Deploy (push) Has been cancelled
Build & Deploy / 🧪 Smoke Test (push) Has been cancelled
Build & Deploy / ⚡ Lighthouse (push) Has been cancelled
Build & Deploy / 🔔 Notify (push) Has been cancelled
1 line
8.5 KiB
Plaintext
1 line
8.5 KiB
Plaintext
{"version":3,"file":"index.js","names":["React","useEffect","useMemo","useState","FileMeta","baseClass","sortSizes","sizes","imageSizes","length","orderedSizes","forEach","name","PreviewSizeCard","active","alt","meta","onClick","previewSrc","_jsxs","className","filter","Boolean","join","undefined","onKeyDown","e","key","role","tabIndex","_jsx","src","PreviewSizes","doc","imageCacheTag","uploadConfig","filename","setOrderedSizes","selectedSize","setSelectedSize","generateImageUrl","url","encodeURIComponent","mainPreviewSrc","originalImage","filesize","height","mimeType","width","originalFilename","Object","entries","map","val","selected"],"sources":["../../../src/elements/PreviewSizes/index.tsx"],"sourcesContent":["'use client'\nimport type { Data, FileSize, SanitizedCollectionConfig, SanitizedUploadConfig } from 'payload'\n\nimport React, { useEffect, useMemo, useState } from 'react'\n\nimport { FileMeta } from '../FileDetails/FileMeta/index.js'\nimport './index.scss'\n\nconst baseClass = 'preview-sizes'\n\ntype FileInfo = {\n url: string\n} & FileSize\ntype FilesSizesWithUrl = {\n [key: string]: FileInfo\n}\n\nconst sortSizes = (sizes: FilesSizesWithUrl, imageSizes: SanitizedUploadConfig['imageSizes']) => {\n if (!imageSizes || imageSizes.length === 0) {\n return sizes\n }\n\n const orderedSizes: FilesSizesWithUrl = {}\n\n imageSizes.forEach(({ name }) => {\n if (sizes[name]) {\n orderedSizes[name] = sizes[name]\n }\n })\n\n return orderedSizes\n}\n\ntype PreviewSizeCardProps = {\n active: boolean\n alt: string\n meta: FileInfo\n name: string\n onClick?: () => void\n previewSrc: string\n}\nconst PreviewSizeCard: React.FC<PreviewSizeCardProps> = ({\n name,\n active,\n alt,\n meta,\n onClick,\n previewSrc,\n}) => {\n return (\n <div\n className={[`${baseClass}__sizeOption`, active && `${baseClass}--selected`]\n .filter(Boolean)\n .join(' ')}\n onClick={typeof onClick === 'function' ? onClick : undefined}\n onKeyDown={(e) => {\n if (typeof onClick !== 'function') {\n return\n }\n if (e.key === 'Enter') {\n onClick()\n }\n }}\n role=\"button\"\n tabIndex={0}\n >\n <div className={`${baseClass}__image`}>\n <img alt={alt} src={previewSrc} />\n </div>\n <div className={`${baseClass}__sizeMeta`}>\n <div className={`${baseClass}__sizeName`}>{name}</div>\n <FileMeta {...meta} />\n </div>\n </div>\n )\n}\n\nexport type PreviewSizesProps = {\n doc: {\n sizes?: FilesSizesWithUrl\n } & Data\n imageCacheTag?: string\n uploadConfig: SanitizedCollectionConfig['upload']\n}\n\nexport const PreviewSizes: React.FC<PreviewSizesProps> = ({ doc, imageCacheTag, uploadConfig }) => {\n const { imageSizes } = uploadConfig\n const { sizes } = doc\n\n const alt = (doc as { alt?: string })?.alt || doc.filename || ''\n\n const [orderedSizes, setOrderedSizes] = useState<FilesSizesWithUrl>(() =>\n sortSizes(sizes, imageSizes),\n )\n const [selectedSize, setSelectedSize] = useState<null | string>(null)\n\n const generateImageUrl = (doc) => {\n if (!doc.filename) {\n return null\n }\n if (doc.url) {\n return `${doc.url}${imageCacheTag ? `?${encodeURIComponent(imageCacheTag)}` : ''}`\n }\n }\n useEffect(() => {\n setOrderedSizes(sortSizes(sizes, imageSizes))\n }, [sizes, imageSizes, imageCacheTag])\n\n const mainPreviewSrc = selectedSize\n ? generateImageUrl(doc.sizes[selectedSize])\n : generateImageUrl(doc)\n\n const originalImage = useMemo(\n (): FileInfo => ({\n filename: doc.filename,\n filesize: doc.filesize,\n height: doc.height,\n mimeType: doc.mimeType,\n url: doc.url,\n width: doc.width,\n }),\n [doc],\n )\n const originalFilename = 'Original'\n\n return (\n <div className={baseClass}>\n <div className={`${baseClass}__imageWrap`}>\n <div className={`${baseClass}__meta`}>\n <div className={`${baseClass}__sizeName`}>{selectedSize || originalFilename}</div>\n <FileMeta {...(selectedSize ? orderedSizes[selectedSize] : originalImage)} />\n </div>\n <img alt={alt} className={`${baseClass}__preview`} src={mainPreviewSrc} />\n </div>\n <div className={`${baseClass}__listWrap`}>\n <div className={`${baseClass}__list`}>\n <PreviewSizeCard\n active={!selectedSize}\n alt={alt}\n meta={originalImage}\n name={originalFilename}\n onClick={() => setSelectedSize(null)}\n previewSrc={generateImageUrl(doc)}\n />\n\n {Object.entries(orderedSizes).map(([key, val]) => {\n const selected = selectedSize === key\n const previewSrc = generateImageUrl(val)\n\n if (previewSrc) {\n return (\n <PreviewSizeCard\n active={selected}\n alt={alt}\n key={key}\n meta={val}\n name={key}\n onClick={() => setSelectedSize(key)}\n previewSrc={previewSrc}\n />\n )\n }\n\n return null\n })}\n </div>\n </div>\n </div>\n )\n}\n"],"mappings":"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","ignoreList":[]} |