summaryrefslogtreecommitdiff
path: root/src/components/jet/shelf/AppPromotionShelf.svelte
blob: 48590cb6146987fd20b1ff66b82559bc6bf013a0 (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
<script lang="ts" context="module">
    import type {
        AppPromotion,
        AppEvent,
        Shelf,
    } from '@jet-app/app-store/api/models';

    interface AppPromotionShelf extends Shelf {
        items: AppPromotion[];
    }

    export function isAppPromotionShelf(
        shelf: Shelf,
    ): shelf is AppPromotionShelf {
        const { contentType, items } = shelf;
        return contentType === 'appPromotion' && Array.isArray(items);
    }
</script>

<script lang="ts">
    import AppEventItem from '~/components/jet/item/AppEventItem.svelte';
    import ShelfItemLayout from '~/components/ShelfItemLayout.svelte';
    import ShelfWrapper from '~/components/Shelf/Wrapper.svelte';
    import mediaQueries from '~/utils/media-queries';

    export let shelf: AppPromotionShelf;

    $: appEventItems = shelf.items.filter(
        (item): item is AppEvent => item.promotionType === 'appEvent',
    );
    $: isArticleContext = shelf.presentationHints?.isArticleContext;
    $: gridType =
        isArticleContext && $mediaQueries !== 'small' ? 'Spotlight' : 'B';
</script>

<ShelfWrapper {shelf} withTopMargin={isArticleContext}>
    <ShelfItemLayout
        shelf={{
            ...shelf,
            items: appEventItems,
        }}
        {gridType}
        let:item
    >
        <AppEventItem {item} {isArticleContext} />
    </ShelfItemLayout>
</ShelfWrapper>