/
NewForYouArtworksGrid.tsx
58 lines (55 loc) · 1.52 KB
/
NewForYouArtworksGrid.tsx
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
48
49
50
51
52
53
54
55
56
57
58
import { Text } from "@artsy/palette"
import React, { FC } from "react"
import { createFragmentContainer, graphql } from "react-relay"
import ArtworkGrid from "Components/ArtworkGrid/ArtworkGrid"
import { NewForYouArtworksGrid_viewer$data } from "__generated__/NewForYouArtworksGrid_viewer.graphql"
interface NewForYouArtworksGridProps {
viewer: NewForYouArtworksGrid_viewer$data
}
export const NewForYouArtworksGrid: FC<NewForYouArtworksGridProps> = ({
viewer,
}) => {
return (
<>
{viewer.artworksForUser &&
(viewer.artworksForUser.totalCount ?? 0) > 0 ? (
<ArtworkGrid
artworks={viewer.artworksForUser}
columnCount={[2, 3, 4]}
/>
) : (
<Text variant="lg-display" mt={4} color="black60">
Nothing yet.
</Text>
)}
</>
)
}
export const NewForYouArtworksGridFragmentContainer = createFragmentContainer(
NewForYouArtworksGrid,
{
viewer: graphql`
fragment NewForYouArtworksGrid_viewer on Viewer
@argumentDefinitions(
first: { type: "Int" }
includeBackfill: { type: "Boolean!" }
version: { type: "String" }
maxWorksPerArtist: { type: "Int" }
) {
artworksForUser(
first: $first
includeBackfill: $includeBackfill
version: $version
maxWorksPerArtist: $maxWorksPerArtist
) {
totalCount
...ArtworkGrid_artworks
pageInfo {
hasNextPage
endCursor
}
}
}
`,
}
)