Skip to content

Commit 52770c9

Browse files
ecoscript[bot]ecoscript[bot]
authored
chore(format): 🤖 ✨ (#352)
Co-authored-by: ecoscript[bot] <143032650+ecoscript[bot]@users.noreply.github.com>
1 parent 6fa26b5 commit 52770c9

1 file changed

Lines changed: 100 additions & 127 deletions

File tree

‎CHANGELOG.md‎

Lines changed: 100 additions & 127 deletions
Original file line numberDiff line numberDiff line change
@@ -121,41 +121,36 @@
121121

122122
```ts
123123
// sanity.config.ts
124-
import {
125-
defineArrayMember,
126-
defineConfig,
127-
defineField,
128-
defineType,
129-
} from "sanity";
124+
import {defineArrayMember, defineConfig, defineField, defineType} from 'sanity'
130125

131126
export default defineConfig({
132-
name: "default",
133-
projectId: "abc123",
134-
dataset: "production",
127+
name: 'default',
128+
projectId: 'abc123',
129+
dataset: 'production',
135130
schema: {
136131
types: [
137132
defineType({
138-
name: "post",
139-
type: "document",
133+
name: 'post',
134+
type: 'document',
140135
fields: [
141-
defineField({ name: "title", type: "string" }),
136+
defineField({name: 'title', type: 'string'}),
142137
defineField({
143-
name: "content",
144-
type: "array",
138+
name: 'content',
139+
type: 'array',
145140
of: [
146-
defineArrayMember({ type: "block" }),
141+
defineArrayMember({type: 'block'}),
147142
defineArrayMember({
148-
type: "image",
149-
options: { hotspot: true },
150-
fields: [defineField({ name: "alt", type: "string" })],
143+
type: 'image',
144+
options: {hotspot: true},
145+
fields: [defineField({name: 'alt', type: 'string'})],
151146
}),
152147
],
153148
}),
154149
],
155150
}),
156151
],
157152
},
158-
});
153+
})
159154
```
160155

161156
#### Before: hand-typing handlers
@@ -164,26 +159,24 @@
164159

165160
```tsx
166161
// app/[slug]/page.tsx
167-
import { createClient } from "@sanity/client";
168-
import { createImageUrlBuilder } from "@sanity/image-url";
169-
import { PortableText } from "@portabletext/react";
170-
import { defineQuery } from "groq";
162+
import {createClient} from '@sanity/client'
163+
import {createImageUrlBuilder} from '@sanity/image-url'
164+
import {PortableText} from '@portabletext/react'
165+
import {defineQuery} from 'groq'
171166

172167
const client = createClient({
173-
projectId: "abc123",
174-
dataset: "production",
168+
projectId: 'abc123',
169+
dataset: 'production',
175170
useCdn: true,
176-
apiVersion: "2026-05-04",
177-
});
178-
const builder = createImageUrlBuilder(client);
171+
apiVersion: '2026-05-04',
172+
})
173+
const builder = createImageUrlBuilder(client)
179174

180-
export default async function Page({ slug }: { slug: string }) {
181-
const query = defineQuery(
182-
`*[_type == "post" && slug.current == $slug][0]{title,content}`
183-
);
184-
const data = await client.fetch(query, { slug });
175+
export default async function Page({slug}: {slug: string}) {
176+
const query = defineQuery(`*[_type == "post" && slug.current == $slug][0]{title,content}`)
177+
const data = await client.fetch(query, {slug})
185178

186-
if (!data) return notFound();
179+
if (!data) return notFound()
187180

188181
return (
189182
<article>
@@ -196,37 +189,35 @@
196189
}: {
197190
value: {
198191
asset?: {
199-
_ref: string;
200-
_type: "reference";
201-
_weak?: boolean;
202-
};
192+
_ref: string
193+
_type: 'reference'
194+
_weak?: boolean
195+
}
203196
hotspot?: {
204-
_type: "sanity.imageHotspot";
205-
x?: number;
206-
y?: number;
207-
height?: number;
208-
width?: number;
209-
};
197+
_type: 'sanity.imageHotspot'
198+
x?: number
199+
y?: number
200+
height?: number
201+
width?: number
202+
}
210203
crop?: {
211-
_type: "sanity.imageCrop";
212-
top?: number;
213-
bottom?: number;
214-
left?: number;
215-
right?: number;
216-
};
217-
alt?: string;
218-
_type: "image";
219-
_key: string;
220-
};
221-
}) => (
222-
<img src={builder.image(value).url()} alt={value.alt || ""} />
223-
),
204+
_type: 'sanity.imageCrop'
205+
top?: number
206+
bottom?: number
207+
left?: number
208+
right?: number
209+
}
210+
alt?: string
211+
_type: 'image'
212+
_key: string
213+
}
214+
}) => <img src={builder.image(value).url()} alt={value.alt || ''} />,
224215
},
225216
}}
226217
value={data.content}
227218
/>
228219
</article>
229-
);
220+
)
230221
}
231222
```
232223

@@ -236,26 +227,24 @@
236227

237228
```tsx
238229
// app/[slug]/page.tsx
239-
import { createClient } from "@sanity/client";
240-
import { createImageUrlBuilder } from "@sanity/image-url";
241-
import { PortableText } from "@portabletext/react";
242-
import { defineQuery } from "groq";
230+
import {createClient} from '@sanity/client'
231+
import {createImageUrlBuilder} from '@sanity/image-url'
232+
import {PortableText} from '@portabletext/react'
233+
import {defineQuery} from 'groq'
243234

244235
const client = createClient({
245-
projectId: "abc123",
246-
dataset: "production",
236+
projectId: 'abc123',
237+
dataset: 'production',
247238
useCdn: true,
248-
apiVersion: "2026-05-04",
249-
});
250-
const builder = createImageUrlBuilder(client);
239+
apiVersion: '2026-05-04',
240+
})
241+
const builder = createImageUrlBuilder(client)
251242

252-
export default async function Page({ slug }: { slug: string }) {
253-
const query = defineQuery(
254-
`*[_type == "post" && slug.current == $slug][0]{title,content}`
255-
);
256-
const data = await client.fetch(query, { slug });
243+
export default async function Page({slug}: {slug: string}) {
244+
const query = defineQuery(`*[_type == "post" && slug.current == $slug][0]{title,content}`)
245+
const data = await client.fetch(query, {slug})
257246

258-
if (!data) return notFound();
247+
if (!data) return notFound()
259248

260249
return (
261250
<article>
@@ -264,15 +253,13 @@
264253
components={{
265254
types: {
266255
// value is fully typed from the query result, no annotation needed
267-
image: ({ value }) => (
268-
<img src={builder.image(value).url()} alt={value.alt || ""} />
269-
),
256+
image: ({value}) => <img src={builder.image(value).url()} alt={value.alt || ''} />,
270257
},
271258
}}
272259
value={data.content}
273260
/>
274261
</article>
275-
);
262+
)
276263
}
277264
```
278265

@@ -282,41 +269,37 @@
282269

283270
```tsx
284271
// app/[slug]/page.tsx
285-
import { createClient } from "@sanity/client";
286-
import { createImageUrlBuilder } from "@sanity/image-url";
287-
import { PortableText, type InferComponents } from "@portabletext/react";
288-
import { defineQuery } from "groq";
272+
import {createClient} from '@sanity/client'
273+
import {createImageUrlBuilder} from '@sanity/image-url'
274+
import {PortableText, type InferComponents} from '@portabletext/react'
275+
import {defineQuery} from 'groq'
289276

290277
const client = createClient({
291-
projectId: "abc123",
292-
dataset: "production",
278+
projectId: 'abc123',
279+
dataset: 'production',
293280
useCdn: true,
294-
apiVersion: "2026-05-04",
295-
});
296-
const builder = createImageUrlBuilder(client);
281+
apiVersion: '2026-05-04',
282+
})
283+
const builder = createImageUrlBuilder(client)
297284

298-
export default async function Page({ slug }: { slug: string }) {
299-
const query = defineQuery(
300-
`*[_type == "post" && slug.current == $slug][0]{title,content}`
301-
);
302-
const data = await client.fetch(query, { slug });
285+
export default async function Page({slug}: {slug: string}) {
286+
const query = defineQuery(`*[_type == "post" && slug.current == $slug][0]{title,content}`)
287+
const data = await client.fetch(query, {slug})
303288

304-
if (!data) return notFound();
289+
if (!data) return notFound()
305290

306291
const components = {
307292
types: {
308-
image: ({ value }) => (
309-
<img src={builder.image(value).url()} alt={value.alt || ""} />
310-
),
293+
image: ({value}) => <img src={builder.image(value).url()} alt={value.alt || ''} />,
311294
},
312-
} satisfies InferComponents<typeof data.content>;
295+
} satisfies InferComponents<typeof data.content>
313296

314297
return (
315298
<article>
316299
<h1>{data.title}</h1>
317300
<PortableText components={components} value={data.content} />
318301
</article>
319-
);
302+
)
320303
}
321304
```
322305

@@ -326,56 +309,46 @@
326309

327310
```tsx
328311
// app/[slug]/page.tsx
329-
import { createClient, type SanityQueries } from "@sanity/client";
330-
import { createImageUrlBuilder } from "@sanity/image-url";
331-
import {
332-
PortableText,
333-
type InferStrictComponents,
334-
type InferValue,
335-
} from "@portabletext/react";
336-
import { defineQuery } from "groq";
312+
import {createClient, type SanityQueries} from '@sanity/client'
313+
import {createImageUrlBuilder} from '@sanity/image-url'
314+
import {PortableText, type InferStrictComponents, type InferValue} from '@portabletext/react'
315+
import {defineQuery} from 'groq'
337316

338317
const client = createClient({
339-
projectId: "abc123",
340-
dataset: "production",
318+
projectId: 'abc123',
319+
dataset: 'production',
341320
useCdn: true,
342-
apiVersion: "2026-05-04",
343-
});
344-
const builder = createImageUrlBuilder(client);
321+
apiVersion: '2026-05-04',
322+
})
323+
const builder = createImageUrlBuilder(client)
345324

346325
// Array value type for every Portable Text item shape across all registered queries.
347-
type PortableTextValue = InferValue<SanityQueries[keyof SanityQueries]>;
326+
type PortableTextValue = InferValue<SanityQueries[keyof SanityQueries]>
348327

349-
function CustomPortableText({ value }: { value: PortableTextValue }) {
328+
function CustomPortableText({value}: {value: PortableTextValue}) {
350329
const components = {
351330
types: {
352-
image: ({ value }) => (
353-
<img src={builder.image(value).url()} alt={value.alt || ""} />
354-
),
331+
image: ({value}) => <img src={builder.image(value).url()} alt={value.alt || ''} />,
355332
},
356-
} satisfies InferStrictComponents<PortableTextValue>;
333+
} satisfies InferStrictComponents<PortableTextValue>
357334
// ^ TypeScript errors when the schema gains a custom type, mark, or list
358335
// style without a matching handler defined here
359336

360-
return <PortableText components={components} value={value} />;
337+
return <PortableText components={components} value={value} />
361338
}
362339

363-
export default async function Page({ slug }: { slug: string }) {
364-
const query = defineQuery(
365-
`*[_type == "post" && slug.current == $slug][0]{title,content}`
366-
);
367-
const data = await client.fetch(query, { slug });
340+
export default async function Page({slug}: {slug: string}) {
341+
const query = defineQuery(`*[_type == "post" && slug.current == $slug][0]{title,content}`)
342+
const data = await client.fetch(query, {slug})
368343

369-
if (!data) return notFound();
344+
if (!data) return notFound()
370345

371346
return (
372347
<article>
373348
<h1>{data.title}</h1>
374-
{Array.isArray(data.content) && (
375-
<CustomPortableText value={data.content} />
376-
)}
349+
{Array.isArray(data.content) && <CustomPortableText value={data.content} />}
377350
</article>
378-
);
351+
)
379352
}
380353
```
381354

0 commit comments

Comments
 (0)