Skip to content

Commit 6f784ef

Browse files
vitordinovitordino
committed
♻️ use prismic-codegen
1 parent 004e87a commit 6f784ef

File tree

12 files changed

+1033
-435
lines changed

12 files changed

+1033
-435
lines changed

‎.npmrc

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,2 @@
1+
always-auth=false
2+
registry=https://registry.npmjs.org

‎custom_types/page.json

Lines changed: 75 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -1,13 +1,28 @@
11
{
22
"Main": {
3-
"uid": { "type": "UID", "config": { "label": "uid" } },
4-
"background": { "type": "Color", "config": { "label": "background" } },
5-
"foreground": { "type": "Color", "config": { "label": "foreground" } },
3+
"uid": {
4+
"type": "UID",
5+
"config": {
6+
"label": "uid"
7+
}
8+
},
9+
"background": {
10+
"type": "Color",
11+
"config": {
12+
"label": "background"
13+
}
14+
},
15+
"foreground": {
16+
"type": "Color",
17+
"config": {
18+
"label": "foreground"
19+
}
20+
},
621
"body": {
722
"type": "Slices",
823
"fieldset": "Slice zone",
924
"config": {
10-
"labels": {},
25+
"labels": null,
1126
"choices": {
1227
"horizontal": {
1328
"type": "Slice",
@@ -16,13 +31,66 @@
1631
"icon": "swap_horiz",
1732
"display": "grid",
1833
"non-repeat": {
19-
"background": { "type": "Color", "config": { "label": "background" } },
20-
"foreground": { "type": "Color", "config": { "label": "foreground" } }
34+
"background": {
35+
"type": "Color",
36+
"config": {
37+
"label": "background"
38+
}
39+
},
40+
"foreground": {
41+
"type": "Color",
42+
"config": {
43+
"label": "foreground"
44+
}
45+
}
46+
},
47+
"repeat": {
48+
"image": {
49+
"type": "Image",
50+
"config": {
51+
"constraint": {},
52+
"thumbnails": [],
53+
"label": "image"
54+
}
55+
}
56+
}
57+
},
58+
"grid": {
59+
"type": "Slice",
60+
"fieldset": "Grid",
61+
"description": "responsive grid of images",
62+
"icon": "grid_on",
63+
"display": "grid",
64+
"non-repeat": {
65+
"background": {
66+
"type": "Color",
67+
"config": {
68+
"label": "background"
69+
}
70+
},
71+
"foreground": {
72+
"type": "Color",
73+
"config": {
74+
"label": "foreground"
75+
}
76+
},
77+
"container_size": {
78+
"type": "Select",
79+
"config": {
80+
"options": ["large", "medium"],
81+
"default_value": "large",
82+
"label": "container size"
83+
}
84+
}
2185
},
2286
"repeat": {
2387
"image": {
2488
"type": "Image",
25-
"config": { "constraint": {}, "thumbnails": [], "label": "image" }
89+
"config": {
90+
"constraint": {},
91+
"thumbnails": [],
92+
"label": "image"
93+
}
2694
}
2795
}
2896
}

‎package.json

Lines changed: 6 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -18,11 +18,15 @@
1818
"wipe.css": "^1.3.0"
1919
},
2020
"devDependencies": {
21-
"astro": "^1.0.0-beta.5",
21+
"@prismicio/types": "^0.1.27",
22+
"astro": "^1.0.0-beta.37",
23+
"dotenv": "^16.0.1",
2224
"eslint": "^8.12.0",
2325
"eslint-plugin-node": "^11.1.0",
2426
"eslint-plugin-prettier-doc": "^1.1.0",
2527
"prettier": "^2.6.1",
26-
"prettier-plugin-astro": "^0.0.12"
28+
"prettier-plugin-astro": "^0.0.12",
29+
"prismic-ts-codegen": "^0.0.3",
30+
"typescript": "^4.6.3"
2731
}
2832
}

‎prismicCodegen.config.ts

Lines changed: 19 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,19 @@
1+
import 'dotenv/config'
2+
import type { Config } from 'prismic-ts-codegen'
3+
4+
const config: Config = {
5+
repositoryName: process.env.PRISMIC_REPO,
6+
accessToken: process.env.PRISMIC_TOKEN,
7+
customTypesAPIToken: process.env.PRISMIC_TYPES_TOKEN,
8+
locales: {
9+
ids: ['en-us'],
10+
fetchFromRepository: true,
11+
},
12+
models: {
13+
files: ['./custom_types/**/index.json'],
14+
fetchFromRepository: true,
15+
},
16+
output: './src/prismic.generated.ts',
17+
}
18+
19+
export default config

‎src/components/HorizontalSlice.astro

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,9 @@
11
---
2-
import type { HorizontalSlice } from '~/types'
32
import Image from '~/components/Image.astro'
4-
export type Props = HorizontalSlice
3+
import { PageDocumentDataBodyHorizontalSlice } from '~/prismic.generated'
4+
export type Props = PageDocumentDataBodyHorizontalSlice
55
const props = Astro.props as Props
6-
const { fields } = props
6+
const { items } = props
77
---
88

99
<script src="./HorizontalSlice.ts"></script>
@@ -12,7 +12,7 @@ const { fields } = props
1212
<div class="horizontal-slice-middle">
1313
<div class="horizontal-slice-inner" data-map="container">
1414
<div class="horizontal-slice-spacer"></div>
15-
{fields.map(({ image }) => image ? <Image {...image} /> : null )}
15+
{items.map(({ image }) => image ? <Image {...image} /> : null )}
1616
<div class="horizontal-slice-spacer"></div>
1717
</div>
1818
</div>

‎src/components/Section.astro

Lines changed: 25 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,25 @@
1+
---
2+
import { Colors } from '~/types'
3+
export type Props = { renderBackground: boolean } & Colors
4+
const { renderBackground, ...colorProps } = Astro.props as Props
5+
6+
const reducer = (acc: string[], [k, v]: [string, string | null]) => {
7+
if (!v) return acc
8+
return [...acc, `--${k}: ${v}`]
9+
}
10+
11+
const style = Object.entries(colorProps).reduce<string[]>(reducer, []).join('; ')
12+
---
13+
14+
<section class="section" style={style} data-render-background={renderBackground}>
15+
<slot />
16+
</section>
17+
18+
<style is:global>
19+
.section {
20+
color: var(--color);
21+
}
22+
.section[data-render-background="true"] {
23+
background-color: var(--background);
24+
}
25+
</style>

‎src/components/Slice.astro

Lines changed: 3 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,8 @@
11
---
2-
import type { Slice } from '~/types'
32
import HorizontalSlice from '~/components/HorizontalSlice.astro'
4-
export type Props = Slice
3+
import { PageDocument } from '~/prismic.generated'
4+
export type Props = PageDocument['data']['body'][0]
55
const props = Astro.props as Props
6-
const { type } = props
76
---
87

9-
{type === 'horizontal' && <HorizontalSlice {...props} />}
8+
{props?.slice_type === 'horizontal' && <HorizontalSlice {...props} />}

‎src/pages/index.astro

Lines changed: 2 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -3,9 +3,8 @@ import getHomePageData from '~/utils/getHomePageData'
33
import Slice from '~/components/Slice.astro'
44
import DefaultLayout from '~/components/DefaultLayout.astro'
55
6-
const pages = await getHomePageData()
6+
const x = await getHomePageData()
77
---
8-
98
<DefaultLayout>
10-
{pages.map(page => page.body.map(slice => <Slice {...slice} />))}
9+
{x.map(page => page.data.body.map(slice => <Slice {...slice} />))}
1110
</DefaultLayout>

‎src/prismic.generated.ts

Lines changed: 164 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,164 @@
1+
// Code generated by prismic-ts-codegen. DO NOT EDIT.
2+
3+
import type * as prismicT from "@prismicio/types";
4+
5+
type Simplify<T> = {
6+
[KeyType in keyof T]: T[KeyType];
7+
};
8+
/** Content for page documents */
9+
interface PageDocumentData {
10+
/**
11+
* background field in *page*
12+
*
13+
* - **Field Type**: Color
14+
* - **Placeholder**: *None*
15+
* - **API ID Path**: page.background
16+
* - **Documentation**: https://prismic.io/docs/core-concepts/color
17+
*
18+
*/
19+
background: prismicT.ColorField;
20+
/**
21+
* foreground field in *page*
22+
*
23+
* - **Field Type**: Color
24+
* - **Placeholder**: *None*
25+
* - **API ID Path**: page.foreground
26+
* - **Documentation**: https://prismic.io/docs/core-concepts/color
27+
*
28+
*/
29+
foreground: prismicT.ColorField;
30+
/**
31+
* Slice Zone (`body`) field in *page*
32+
*
33+
* - **Field Type**: Slice Zone
34+
* - **Placeholder**: *None*
35+
* - **API ID Path**: page.body[]
36+
* - **Documentation**: https://prismic.io/docs/core-concepts/slices
37+
*
38+
*/
39+
body: prismicT.SliceZone<PageDocumentDataBodySlice>;
40+
}
41+
/**
42+
* Primary content in page → Slice Zone (`body`) → Horizontal → Primary
43+
*
44+
*/
45+
interface PageDocumentDataBodyHorizontalSlicePrimary {
46+
/**
47+
* background field in *page → Slice Zone (`body`) → Horizontal → Primary*
48+
*
49+
* - **Field Type**: Color
50+
* - **Placeholder**: *None*
51+
* - **API ID Path**: page.body[].horizontal.primary.background
52+
* - **Documentation**: https://prismic.io/docs/core-concepts/color
53+
*
54+
*/
55+
background: prismicT.ColorField;
56+
/**
57+
* foreground field in *page → Slice Zone (`body`) → Horizontal → Primary*
58+
*
59+
* - **Field Type**: Color
60+
* - **Placeholder**: *None*
61+
* - **API ID Path**: page.body[].horizontal.primary.foreground
62+
* - **Documentation**: https://prismic.io/docs/core-concepts/color
63+
*
64+
*/
65+
foreground: prismicT.ColorField;
66+
}
67+
/**
68+
* Item in page → Slice Zone (`body`) → Horizontal → Items
69+
*
70+
*/
71+
export interface PageDocumentDataBodyHorizontalSliceItem {
72+
/**
73+
* image field in *page → Slice Zone (`body`) → Horizontal → Items*
74+
*
75+
* - **Field Type**: Image
76+
* - **Placeholder**: *None*
77+
* - **API ID Path**: page.body[].horizontal.items[].image
78+
* - **Documentation**: https://prismic.io/docs/core-concepts/image
79+
*
80+
*/
81+
image: prismicT.ImageField<null>;
82+
}
83+
export type PageDocumentDataBodyHorizontalSlice = prismicT.Slice<"horizontal", Simplify<PageDocumentDataBodyHorizontalSlicePrimary>, Simplify<PageDocumentDataBodyHorizontalSliceItem>>;
84+
/**
85+
* Primary content in page → Slice Zone (`body`) → Grid → Primary
86+
*
87+
*/
88+
interface PageDocumentDataBodyGridSlicePrimary {
89+
/**
90+
* background field in *page → Slice Zone (`body`) → Grid → Primary*
91+
*
92+
* - **Field Type**: Color
93+
* - **Placeholder**: *None*
94+
* - **API ID Path**: page.body[].grid.primary.background
95+
* - **Documentation**: https://prismic.io/docs/core-concepts/color
96+
*
97+
*/
98+
background: prismicT.ColorField;
99+
/**
100+
* foreground field in *page → Slice Zone (`body`) → Grid → Primary*
101+
*
102+
* - **Field Type**: Color
103+
* - **Placeholder**: *None*
104+
* - **API ID Path**: page.body[].grid.primary.foreground
105+
* - **Documentation**: https://prismic.io/docs/core-concepts/color
106+
*
107+
*/
108+
foreground: prismicT.ColorField;
109+
/**
110+
* container size field in *page → Slice Zone (`body`) → Grid → Primary*
111+
*
112+
* - **Field Type**: Select
113+
* - **Placeholder**: *None*
114+
* - **Default Value**: large
115+
* - **API ID Path**: page.body[].grid.primary.container_size
116+
* - **Documentation**: https://prismic.io/docs/core-concepts/select
117+
*
118+
*/
119+
container_size: prismicT.SelectField<"large" | "medium", "filled">;
120+
}
121+
/**
122+
* Item in page → Slice Zone (`body`) → Grid → Items
123+
*
124+
*/
125+
export interface PageDocumentDataBodyGridSliceItem {
126+
/**
127+
* image field in *page → Slice Zone (`body`) → Grid → Items*
128+
*
129+
* - **Field Type**: Image
130+
* - **Placeholder**: *None*
131+
* - **API ID Path**: page.body[].grid.items[].image
132+
* - **Documentation**: https://prismic.io/docs/core-concepts/image
133+
*
134+
*/
135+
image: prismicT.ImageField<null>;
136+
}
137+
export type PageDocumentDataBodyGridSlice = prismicT.Slice<"grid", Simplify<PageDocumentDataBodyGridSlicePrimary>, Simplify<PageDocumentDataBodyGridSliceItem>>;
138+
/**
139+
* Slice for *page → Slice Zone (`body`)*
140+
*
141+
*/
142+
type PageDocumentDataBodySlice = PageDocumentDataBodyHorizontalSlice | PageDocumentDataBodyGridSlice;
143+
/**
144+
* page document from Prismic
145+
*
146+
* - **API ID**: `page`
147+
* - **Repeatable**: `true`
148+
* - **Documentation**: https://prismic.io/docs/core-concepts/custom-types
149+
*
150+
* @typeParam Lang - Language API ID of the document.
151+
*/
152+
export type PageDocument<Lang extends string = "en-us"> = prismicT.PrismicDocumentWithUID<Simplify<PageDocumentData>, "page", Lang>;
153+
/** Content for x documents */
154+
type XDocumentData = Record<string, never>;
155+
/**
156+
* x document from Prismic
157+
*
158+
* - **API ID**: `x`
159+
* - **Repeatable**: `true`
160+
* - **Documentation**: https://prismic.io/docs/core-concepts/custom-types
161+
*
162+
* @typeParam Lang - Language API ID of the document.
163+
*/
164+
export type XDocument<Lang extends string = "en-us"> = prismicT.PrismicDocumentWithoutUID<Simplify<XDocumentData>, "x", Lang>;

0 commit comments

Comments
 (0)