From c8fd2907ca30fe486f287584360cbc61d2c32ca6 Mon Sep 17 00:00:00 2001
From: Roman Timashev <roman@tmshv.ru>
Date: Thu, 27 Feb 2020 16:21:42 +0300
Subject: [PATCH] ArticleGrid no preview fallback (wip)

---
 src/components/ArticleGrid/index.tsx | 46 +++++++++++++++++++++++++---
 1 file changed, 42 insertions(+), 4 deletions(-)

diff --git a/src/components/ArticleGrid/index.tsx b/src/components/ArticleGrid/index.tsx
index 2758ff68..e62aa802 100644
--- a/src/components/ArticleGrid/index.tsx
+++ b/src/components/ArticleGrid/index.tsx
@@ -1,4 +1,4 @@
-import { IArticle } from 'src/types'
+import { IArticle, ImageDefinition } from 'src/types'
 import { Pager } from '../Pager'
 import { CardGrid } from '../CardGrid'
 import { Card, CardLayout } from '../Card'
@@ -6,6 +6,46 @@ import { Date } from './Date'
 import { Block } from '../Block'
 import { Spacer } from '../Spacer'
 
+export interface IResizeImage {
+    w: number
+    h: number
+}
+
+export function resizeImage(src: string, options: IResizeImage): string {
+    return src
+    // return `https://images.weserv.nl/?url=${src}&w=${options.w}&h=${options.h}&n=-1`
+}
+
+function getImage(image?: ImageDefinition) {
+    if (!image) {
+        const defaultSrc = '/static/img/HudozkaMain2014.jpg'
+        const src = resizeImage(defaultSrc, { w: 400, h: 400 })
+        const set = [
+            {
+                density: 2,
+                href: resizeImage(defaultSrc, { w: 800, h: 800 }),
+            }
+        ]
+        const srcSet = set
+            .map(({ href, density }) => `${href} ${density}x`)
+            .join(' ')
+
+        return {
+            src,
+            srcSet,
+        }
+    }
+
+    const preview = image.artifacts.medium
+    const src = preview.src
+    const srcSet = preview.set.map(({ url, density }) => `${url} ${density}x`).join(' ')
+
+    return {
+        src,
+        srcSet,
+    }
+}
+
 export type ArticleGridProps = {
     articles: IArticle[]
     nextPage: number | null
@@ -29,9 +69,7 @@ export const ArticleGrid: React.FC<ArticleGridProps> = ({ articles, nextPage, pr
                 {articles.map((article, i) => {
                     const gridColumn = article.featured ? 'span 2' : 'auto'
                     const layout: CardLayout = article.featured ? 'featured' : 'simple'
-                    const preview = article.preview.artifacts.medium
-                    const src = preview.src
-                    const srcSet = preview.set.map(({ url, density }) => `${url} ${density}x`).join(' ')
+                    const { src, srcSet } = getImage(article.preview)
 
                     const content = !article.featured
                         ? (