31 | 32 | {title} 33 | 34 |
35 |
36 |
38 | {excerpt && (
39 | 40 | {excerpt} 41 |
42 | )} 43 | {author &&
14 | {picture?.asset?._ref ? (
15 |
35 | );
36 | }
37 |
--------------------------------------------------------------------------------
/app/(sanity)/icon.svg:
--------------------------------------------------------------------------------
1 |
2 |
8 |
--------------------------------------------------------------------------------
/LICENSE.md:
--------------------------------------------------------------------------------
1 | MIT License
2 |
3 | Copyright (c) 2024 javayhu
4 |
5 | Permission is hereby granted, free of charge, to any person obtaining a copy
6 | of this software and associated documentation files (the "Software"), to deal
7 | in the Software without restriction, including without limitation the rights
8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
9 | copies of the Software, and to permit persons to whom the Software is
10 | furnished to do so, subject to the following conditions:
11 |
12 | The above copyright notice and this permission notice shall be included in all
13 | copies or substantial portions of the Software.
14 |
15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
21 | SOFTWARE.
22 |
--------------------------------------------------------------------------------
/sanity-patch.js:
--------------------------------------------------------------------------------
1 | import { client } from "@/sanity/lib/client";
2 |
3 | // const client = sanityClient.withConfig({ apiVersion: '2024-02-28' });
4 |
5 | const query = `*[_type == 'produt' && featured == true]` //get all of your posts that do not have isHighlighted set
6 |
7 | // https://www.sanity.io/answers/updating-default-field-value-in-sanity-io-using-a-script
8 | const mutateDocs = async (query) => {
9 | const docsToMutate = await client.fetch(query, {});
10 | for (const doc of docsToMutate) {
11 | const mutation = {
12 | featured: false
13 | }
14 | console.log('uploading');
15 | client
16 | .patch(doc._id) // Document ID to patch
17 | .set(mutation) // Shallow merge
18 | .commit() // Perform the patch and return a promise
19 | .then((updatedDoc) => {
20 | console.log('Hurray, the doc is updated! New document:');
21 | console.log(updatedDoc._id);
22 | })
23 | .catch((err) => {
24 | console.error('Oh no, the update failed: ', err.message);
25 | })
26 | }
27 | }
28 |
29 | mutateDocs(query);
--------------------------------------------------------------------------------
/sanity/lib/utils.ts:
--------------------------------------------------------------------------------
1 | import createImageUrlBuilder from "@sanity/image-url";
2 |
3 | import { dataset, projectId } from "@/sanity/lib/api";
4 |
5 | const imageBuilder = createImageUrlBuilder({
6 | projectId: projectId || "",
7 | dataset: dataset || "",
8 | });
9 |
10 | export const urlForImage = (source: any) => {
11 | // Ensure that source image contains a valid reference
12 | if (!source?.asset?._ref) {
13 | return undefined;
14 | }
15 |
16 | return imageBuilder?.image(source).auto("format").fit("max");
17 | };
18 |
19 | export function resolveOpenGraphImage(image: any, width = 1200, height = 627) {
20 | if (!image) return;
21 | const url = urlForImage(image)?.width(1200).height(627).fit("crop").url();
22 | if (!url) return;
23 | return { url, alt: image?.alt as string, width, height };
24 | }
25 |
26 | export function resolveHref(
27 | documentType?: string,
28 | slug?: string,
29 | ): string | undefined {
30 | switch (documentType) {
31 | case "post":
32 | return slug ? `/posts/${slug}` : undefined;
33 | default:
34 | console.warn("Invalid document type:", documentType);
35 | return undefined;
36 | }
37 | }
38 |
--------------------------------------------------------------------------------
/sanity/lib/api.ts:
--------------------------------------------------------------------------------
1 | /**
2 | * As this file is reused in several other files, try to keep it lean and small.
3 | * Importing other npm packages here could lead to needlessly increasing the client bundle size, or end up in a server-only function that don't need it.
4 | */
5 |
6 | function assertValue
16 |
30 | ) : (
31 | By
32 | )}
33 | {name}
34 | {children}
28 | ), 29 | h6: ({ children }) => ( 30 |{children}
31 | ), 32 | }, 33 | marks: { 34 | link: ({ children, value }) => { 35 | return ( 36 | 37 | {children} 38 | 39 | ); 40 | }, 41 | }, 42 | }; 43 | 44 | return ( 45 |
46 |
48 | );
49 | }
50 |
--------------------------------------------------------------------------------
/sanity/defaultDocumentNode.ts:
--------------------------------------------------------------------------------
1 | import { isDev, type SanityDocument } from 'sanity';
2 | import { Iframe } from 'sanity-plugin-iframe-pane';
3 | import type { DefaultDocumentNodeResolver } from 'sanity/structure';
4 |
5 | const previewUrl = 'https://indie-hackers-site-sanity.vercel.app';
6 |
7 | const defaultDocumentNode: DefaultDocumentNodeResolver = (
8 | S,
9 | { schemaType },
10 | ) => {
11 | const editorView = S.view.form();
12 |
13 | switch (schemaType) {
14 | case 'post':
15 | return S.document().views([
16 | editorView,
17 | S.view
18 | .component(Iframe)
19 | .title('Preview')
20 | .options({
21 | url: (
22 | doc: SanityDocument & {
23 | slug?: { current: string }
24 | },
25 | ) => {
26 | const base = isDev ? 'http://localhost:3001' : previewUrl;
27 | const slug = doc?.slug?.current;
28 | const path = slug === 'index' ? '' : slug;
29 | const directory = 'posts';
30 |
31 | console.log('preview, url', [base, directory, path].filter(Boolean).join('/'));
32 | return [base, directory, path].filter(Boolean).join('/');
33 | },
34 | reload: {
35 | button: true,
36 | },
37 | }),
38 | ])
39 |
40 | default:
41 | return S.document().views([editorView])
42 | }
43 | }
44 |
45 | export default defaultDocumentNode
46 |
--------------------------------------------------------------------------------
/sanity-fix.js:
--------------------------------------------------------------------------------
1 | const fs = require('fs');
2 |
3 | const filePath = 'sanity.types.ts';
4 | // const searchString = 'Array<{\n _type: "localizedString";\n en?: string;\n zh?: string;\n }> | null;';
5 | // const searchString = 'Array<{\n\\s*_type:\\s*"localizedString";\n\\s*en?:\\s*string;\n\\s*zh?:\\s*string;\n\\s*}>\\s*\\|\\s*null;';
6 | const searchString = /Array<\{[^{}]*_type:\s*"localizedString";[^{}]*\}>\s*\|\s*null;/g;
7 | const replacementString = 'string;';
8 |
9 | fs.readFile(filePath, 'utf8', (err, data) => {
10 | if (err) {
11 | console.error(err);
12 | return;
13 | }
14 |
15 | // const updatedData = data.replaceAll(searchString, replacementString);
16 |
17 | // const regex = new RegExp(searchString, 'g');
18 | // const updatedData = data.replace(regex, replacementString);
19 |
20 | const regex = new RegExp(searchString, 'g');
21 | let replacementCount = 0;
22 |
23 | const updatedData = data.replace(regex, (match) => {
24 | replacementCount++;
25 | return replacementString;
26 | });
27 | console.log('Replacement count:', replacementCount);
28 |
29 | fs.writeFile(filePath, updatedData, 'utf8', (err) => {
30 | if (err) {
31 | console.error(err);
32 | return;
33 | }
34 |
35 | console.log('Replacement done successfully!');
36 | });
37 | });
38 |
--------------------------------------------------------------------------------
/sanity/lib/demo.ts:
--------------------------------------------------------------------------------
1 | /**
2 | * Demo data used as placeholders and initial values for the blog
3 | */
4 |
5 | export const title = "Blog.";
6 |
7 | export const description = [
8 | {
9 | _key: "9f1a629887fd",
10 | _type: "block",
11 | children: [
12 | {
13 | _key: "4a58edd077880",
14 | _type: "span",
15 | marks: [],
16 | text: "A statically generated blog example using ",
17 | },
18 | {
19 | _key: "4a58edd077881",
20 | _type: "span",
21 | marks: ["ec5b66c9b1e0"],
22 | text: "Next.js",
23 | },
24 | {
25 | _key: "4a58edd077882",
26 | _type: "span",
27 | marks: [],
28 | text: " and ",
29 | },
30 | {
31 | _key: "4a58edd077883",
32 | _type: "span",
33 | marks: ["1f8991913ea8"],
34 | text: "Sanity",
35 | },
36 | {
37 | _key: "4a58edd077884",
38 | _type: "span",
39 | marks: [],
40 | text: ".",
41 | },
42 | ],
43 | markDefs: [
44 | {
45 | _key: "ec5b66c9b1e0",
46 | _type: "link",
47 | href: "https://nextjs.org/",
48 | },
49 | {
50 | _key: "1f8991913ea8",
51 | _type: "link",
52 | href: "https://sanity.io/",
53 | },
54 | ],
55 | style: "normal",
56 | },
57 | ];
58 |
59 | export const ogImageTitle = "A Next.js Blog with a Native Authoring Experience";
60 |
--------------------------------------------------------------------------------
/sanity/schemas/documents/user.ts:
--------------------------------------------------------------------------------
1 | import { UsersIcon } from "@sanity/icons";
2 | import { format, parseISO } from "date-fns";
3 | import { defineField, defineType } from "sanity";
4 |
5 | export default defineType({
6 | name: "user",
7 | title: "User",
8 | icon: UsersIcon,
9 | type: "document",
10 | fields: [
11 | defineField({
12 | name: "name",
13 | title: "Name",
14 | type: "string",
15 | validation: (rule) => rule.required(),
16 | }),
17 | defineField({
18 | name: "id",
19 | title: "Id",
20 | type: "string",
21 | }),
22 | defineField({
23 | name: "email",
24 | title: "Email",
25 | type: "string",
26 | }),
27 | defineField({
28 | name: "avatar",
29 | title: "Avatar",
30 | type: "string",
31 | }),
32 | defineField({
33 | name: "link",
34 | title: "Link",
35 | type: "string",
36 | }),
37 | defineField({
38 | name: "date",
39 | title: "Date",
40 | type: "datetime",
41 | initialValue: () => new Date().toISOString(),
42 | }),
43 | ],
44 | preview: {
45 | select: {
46 | title: "name",
47 | date: "date",
48 | },
49 | prepare({ title, date }) {
50 | // can not show avatar
51 | const subtitles = [
52 | date && `${format(parseISO(date), "yyyy/MM/dd")}`,
53 | ].filter(Boolean);
54 | return { title, subtitle: subtitles.join(" ") };
55 | }
56 | },
57 | });
58 |
--------------------------------------------------------------------------------
/app/(blog)/alert-banner.tsx:
--------------------------------------------------------------------------------
1 | "use client";
2 |
3 | import { useRouter } from "next/navigation";
4 | import { useSyncExternalStore, useTransition } from "react";
5 |
6 | import { disableDraftMode } from "./actions";
7 |
8 | const emptySubscribe = () => () => {};
9 |
10 | export default function AlertBanner() {
11 | const router = useRouter();
12 | const [pending, startTransition] = useTransition();
13 |
14 | const shouldShow = useSyncExternalStore(
15 | emptySubscribe,
16 | () => window.top === window,
17 | () => false,
18 | );
19 |
20 | if (!shouldShow) return null;
21 |
22 | return (
23 |
28 |
51 | );
52 | }
53 |
--------------------------------------------------------------------------------
/sanity/schemas/documents/tag.ts:
--------------------------------------------------------------------------------
1 | import { TagsIcon } from "@sanity/icons";
2 | import { format, parseISO } from "date-fns";
3 | import { defineField, defineType } from "sanity";
4 |
5 | export default defineType({
6 | name: "tag",
7 | title: "Tag",
8 | icon: TagsIcon,
9 | type: "document",
10 | fields: [
11 | defineField({
12 | name: "name",
13 | title: "Name",
14 | type: "string",
15 | validation: (rule) => rule.required(),
16 | }),
17 | defineField({
18 | name: "slug",
19 | title: "Slug",
20 | type: "slug",
21 | options: {
22 | source: "name",
23 | maxLength: 96,
24 | isUnique: (value, context) => context.defaultIsUnique(value, context),
25 | },
26 | validation: (rule) => rule.required(),
27 | }),
28 | defineField({
29 | name: "order",
30 | title: "Order",
31 | type: "number",
32 | initialValue: -1,
33 | }),
34 | defineField({
35 | name: "date",
36 | title: "Date",
37 | type: "datetime",
38 | initialValue: () => new Date().toISOString(),
39 | }),
40 | ],
41 | preview: {
42 | select: {
43 | title: "name",
44 | order: "order",
45 | date: "date",
46 | },
47 | prepare({ title, order, date }) {
48 | const subtitles = [
49 | order && `order:${order}`,
50 | date && `${format(parseISO(date), "yyyy/MM/dd")}`,
51 | ].filter(Boolean);
52 | return { title, subtitle: subtitles.join(" ") };
53 | }
54 | },
55 | });
56 |
--------------------------------------------------------------------------------
/sanity/schemas/documents/group.ts:
--------------------------------------------------------------------------------
1 | import { MenuIcon } from "@sanity/icons";
2 | import { format, parseISO } from "date-fns";
3 | import { defineField, defineType } from "sanity";
4 |
5 | export default defineType({
6 | name: "group",
7 | title: "Group",
8 | icon: MenuIcon,
9 | type: "document",
10 | fields: [
11 | defineField({
12 | name: "name",
13 | title: "Name",
14 | // type: "string",
15 | type: "localizedString",
16 | validation: (rule) => rule.required(),
17 | }),
18 | defineField({
19 | name: "slug",
20 | title: "Slug",
21 | type: "slug",
22 | options: {
23 | source: "name.en",
24 | maxLength: 96,
25 | isUnique: (value, context) => context.defaultIsUnique(value, context),
26 | },
27 | validation: (rule) => rule.required(),
28 | }),
29 | defineField({
30 | name: "order",
31 | title: "Order",
32 | type: "number",
33 | initialValue: -1,
34 | }),
35 | defineField({
36 | name: "date",
37 | title: "Date",
38 | type: "datetime",
39 | initialValue: () => new Date().toISOString(),
40 | }),
41 | ],
42 | preview: {
43 | select: {
44 | title: "name.en",
45 | order: "order",
46 | date: "date",
47 | },
48 | prepare({ title, order, date }) {
49 | const subtitles = [
50 | order && `order:${order}`,
51 | date && `${format(parseISO(date), "yyyy/MM/dd")}`,
52 | ].filter(Boolean);
53 | return { title, subtitle: subtitles.join(" ") };
54 | }
55 | },
56 | });
57 |
--------------------------------------------------------------------------------
/sanity/schemas/documents/appType.ts:
--------------------------------------------------------------------------------
1 | import { ComponentIcon } from "@sanity/icons";
2 | import { format, parseISO } from "date-fns";
3 | import { defineField, defineType } from "sanity";
4 |
5 | export default defineType({
6 | name: "appType",
7 | title: "AppType",
8 | icon: ComponentIcon,
9 | type: "document",
10 | fields: [
11 | defineField({
12 | name: "name",
13 | title: "Name",
14 | // type: "string",
15 | type: "localizedString",
16 | validation: (rule) => rule.required(),
17 | }),
18 | defineField({
19 | name: "slug",
20 | title: "Slug",
21 | type: "slug",
22 | options: {
23 | source: "name.en",
24 | maxLength: 96,
25 | isUnique: (value, context) => context.defaultIsUnique(value, context),
26 | },
27 | validation: (rule) => rule.required(),
28 | }),
29 | defineField({
30 | name: "order",
31 | title: "Order",
32 | type: "number",
33 | initialValue: -1,
34 | }),
35 | defineField({
36 | name: "date",
37 | title: "Date",
38 | type: "datetime",
39 | initialValue: () => new Date().toISOString(),
40 | }),
41 | ],
42 | preview: {
43 | select: {
44 | title: "name.en",
45 | order: "order",
46 | date: "date",
47 | },
48 | prepare({ title, order, date }) {
49 | const subtitles = [
50 | order && `order:${order}`,
51 | date && `${format(parseISO(date), "yyyy/MM/dd")}`,
52 | ].filter(Boolean);
53 | return { title, subtitle: subtitles.join(" ") };
54 | }
55 | },
56 | });
57 |
--------------------------------------------------------------------------------
/sanity/schemas/documents/guide.ts:
--------------------------------------------------------------------------------
1 | import { DocumentIcon, TagsIcon } from "@sanity/icons";
2 | import { format, parseISO } from "date-fns";
3 | import { defineField, defineType } from "sanity";
4 |
5 | export default defineType({
6 | name: "guide",
7 | title: "Guide",
8 | icon: DocumentIcon,
9 | type: "document",
10 | fields: [
11 | defineField({
12 | name: "name",
13 | title: "Name",
14 | type: "string",
15 | validation: (rule) => rule.required(),
16 | }),
17 | defineField({
18 | name: "slug",
19 | title: "Slug",
20 | type: "slug",
21 | options: {
22 | source: "name",
23 | maxLength: 96,
24 | isUnique: (value, context) => context.defaultIsUnique(value, context),
25 | },
26 | validation: (rule) => rule.required(),
27 | }),
28 | defineField({
29 | name: "excerpt",
30 | title: "Excerpt",
31 | type: "string",
32 | }),
33 | defineField({
34 | name: "link",
35 | title: "Link",
36 | type: "string",
37 | }),
38 | defineField({
39 | name: "order",
40 | title: "Order",
41 | type: "number",
42 | initialValue: -1,
43 | }),
44 | defineField({
45 | name: "date",
46 | title: "Date",
47 | type: "datetime",
48 | initialValue: () => new Date().toISOString(),
49 | }),
50 | ],
51 | preview: {
52 | select: {
53 | title: "name",
54 | order: "order",
55 | date: "date",
56 | },
57 | prepare({ title, order, date }) {
58 | const subtitles = [
59 | order && `order:${order}`,
60 | date && `${format(parseISO(date), "yyyy/MM/dd")}`,
61 | ].filter(Boolean);
62 | return { title, subtitle: subtitles.join(" ") };
63 | }
64 | },
65 | });
66 |
--------------------------------------------------------------------------------
/sanity/schemas/documents/category.ts:
--------------------------------------------------------------------------------
1 | import { TiersIcon } from "@sanity/icons";
2 | import { format, parseISO } from "date-fns";
3 | import { defineField, defineType } from "sanity";
4 |
5 | export default defineType({
6 | name: "category",
7 | title: "Category",
8 | icon: TiersIcon,
9 | type: "document",
10 | fields: [
11 | defineField({
12 | name: "name",
13 | title: "Name",
14 | // type: "string",
15 | type: "localizedString",
16 | validation: (rule) => rule.required(),
17 | }),
18 | defineField({
19 | name: "slug",
20 | title: "Slug",
21 | type: "slug",
22 | options: {
23 | source: "name.en",
24 | maxLength: 96,
25 | isUnique: (value, context) => context.defaultIsUnique(value, context),
26 | },
27 | validation: (rule) => rule.required(),
28 | }),
29 | defineField({
30 | name: "group",
31 | title: "Group",
32 | type: "reference",
33 | to: [{ type: "group" }],
34 | }),
35 | defineField({
36 | name: "order",
37 | title: "Order",
38 | type: "number",
39 | initialValue: -1,
40 | }),
41 | defineField({
42 | name: "date",
43 | title: "Date",
44 | type: "datetime",
45 | initialValue: () => new Date().toISOString(),
46 | }),
47 | ],
48 | preview: {
49 | select: {
50 | title: "name.en",
51 | group: "group.name.en",
52 | order: "order",
53 | date: "date",
54 | },
55 | prepare({ title, group, order, date }) {
56 | const subtitles = [
57 | group && `group:${group}`,
58 | order && `order:${order}`,
59 | date && `${format(parseISO(date), "yyyy/MM/dd")}`,
60 | ].filter(Boolean);
61 | return { title, subtitle: subtitles.join(" ") };
62 | }
63 | },
64 | });
65 |
--------------------------------------------------------------------------------
/app/(blog)/more-stories.tsx:
--------------------------------------------------------------------------------
1 | import Link from "next/link";
2 |
3 | import Avatar from "./avatar";
4 | import CoverImage from "./cover-image";
5 | import DateComponent from "./date";
6 |
7 | import type { MoreStoriesQueryResult } from "@/sanity.types";
8 | import { sanityFetch } from "@/sanity/lib/fetch";
9 | import { moreStoriesQuery } from "@/sanity/lib/queries";
10 |
11 | export default async function MoreStories(params: {
12 | skip: string;
13 | limit: number;
14 | }) {
15 | const data = await sanityFetch
29 | {pending ? (
30 | "Disabling draft mode..."
31 | ) : (
32 | <>
33 | {"Previewing drafts. "}
34 |
47 |
48 | )}
49 |
50 |
23 | {data?.map((post) => {
24 | const { _id, title, slug, coverImage, excerpt, author } = post;
25 | return (
26 |
27 |
28 |
45 | );
46 | })}
47 |
48 |
49 | );
50 | }
51 |
--------------------------------------------------------------------------------
/sanity/schemas/documents/submission.ts:
--------------------------------------------------------------------------------
1 | import { DiamondIcon } from "@sanity/icons";
2 | import { format, parseISO } from "date-fns";
3 | import { defineField, defineType } from "sanity";
4 |
5 | export default defineType({
6 | name: "submission",
7 | title: "Submission",
8 | icon: DiamondIcon,
9 | type: "document",
10 | fields: [
11 | defineField({
12 | name: "name",
13 | title: "Name",
14 | type: "string",
15 | }),
16 | defineField({
17 | name: "link",
18 | title: "Link",
19 | type: "string",
20 | }),
21 | defineField({
22 | name: "status",
23 | title: "Status",
24 | type: "string",
25 | initialValue: 'reviewing',
26 | options: {
27 | list: [ 'reviewing', 'rejected', 'approved' ],
28 | layout: 'radio' // <-- defaults to 'dropdown'
29 | }
30 | }),
31 | defineField({
32 | name: "reason",
33 | title: "Reason",
34 | type: "string",
35 | hidden: ({ parent }) => parent?.status !== 'rejected',
36 | options: {
37 | list: [
38 | 'rejected: this product is not for indie hackers',
39 | ],
40 | }
41 | }),
42 | defineField({
43 | name: "user",
44 | title: "User",
45 | type: "reference",
46 | to: [{ type: "user" }],
47 | }),
48 | defineField({
49 | name: "date",
50 | title: "Date",
51 | type: "datetime",
52 | initialValue: () => new Date().toISOString(),
53 | }),
54 | ],
55 | preview: {
56 | select: {
57 | title: "name",
58 | author: "user.name",
59 | status: "status",
60 | date: "date",
61 | },
62 | prepare({ title, author, status, date }) {
63 | const subtitles = [
64 | author && `${author}`,
65 | status && `${status}`,
66 | date && `${format(parseISO(date), "yyyy/MM/dd")}`,
67 | ].filter(Boolean);
68 | return { title, subtitle: subtitles.join(" ") };
69 | },
70 | },
71 | });
72 |
--------------------------------------------------------------------------------
/package.json:
--------------------------------------------------------------------------------
1 | {
2 | "private": true,
3 | "scripts": {
4 | "predev": "npm run typegen",
5 | "dev": "next dev -p 3333",
6 | "prebuild": "npm run typegen",
7 | "build": "next build",
8 | "start": "next start",
9 | "lint": "next lint",
10 | "presetup": "echo 'about to setup env variables, follow the guide here: https://github.com/vercel/next.js/tree/canary/examples/cms-sanity#using-the-sanity-cli'",
11 | "setup": "npx sanity@latest init --env .env.local",
12 | "postsetup": "echo 'create the read token by following the rest of the guide: https://github.com/vercel/next.js/tree/canary/examples/cms-sanity#creating-a-read-token'",
13 | "typegen": "sanity schema extract && sanity typegen generate && node sanity-fix.js",
14 | "sanity-fix": "node sanity-fix.js",
15 | "sanity-patch": "node sanity-patch.js"
16 | },
17 | "dependencies": {
18 | "@sanity/assist": "3.0.3",
19 | "@sanity/code-input": "^4.1.4",
20 | "@sanity/color-input": "^3.1.1",
21 | "@sanity/dashboard": "^3.1.6",
22 | "@sanity/icons": "2.11.8",
23 | "@sanity/image-url": "1.0.2",
24 | "@sanity/preview-url-secret": "1.6.11",
25 | "@sanity/vision": "3.39.0",
26 | "@tailwindcss/typography": "^0.5.13",
27 | "@types/node": "^20.12.7",
28 | "@types/react": "^18.3.1",
29 | "@types/react-dom": "^18.3.0",
30 | "@vercel/speed-insights": "^1.0.10",
31 | "autoprefixer": "^10.4.19",
32 | "date-fns": "^3.6.0",
33 | "easymde": "^2.18.0",
34 | "next": "latest",
35 | "next-sanity": "9.0.10",
36 | "postcss": "^8.4.38",
37 | "react": "^18.3.1",
38 | "react-dom": "^18.3.1",
39 | "rxjs": "^7.8.1",
40 | "sanity": "3.39.0",
41 | "sanity-plugin-asset-source-unsplash": "3.0.1",
42 | "sanity-plugin-iframe-pane": "^3.1.6",
43 | "sanity-plugin-markdown": "^4.1.2",
44 | "sanity-plugin-media": "^2.2.5",
45 | "server-only": "^0.0.1",
46 | "styled-components": "6.1.8",
47 | "tailwindcss": "^3.4.3",
48 | "typescript": "5.4.5"
49 | },
50 | "devDependencies": {
51 | "@next/env": "latest",
52 | "eslint": "^8.57.0",
53 | "eslint-config-next": "latest"
54 | }
55 | }
56 |
--------------------------------------------------------------------------------
/sanity/lib/fetch.ts:
--------------------------------------------------------------------------------
1 | import type { ClientPerspective, QueryParams } from "next-sanity";
2 | import { draftMode } from "next/headers";
3 |
4 | import { client } from "@/sanity/lib/client";
5 | import { token } from "@/sanity/lib/token";
6 |
7 | /**
8 | * Used to fetch data in Server Components, it has built in support for handling Draft Mode and perspectives.
9 | * When using the "published" perspective then time-based revalidation is used, set to match the time-to-live on Sanity's API CDN (60 seconds)
10 | * and will also fetch from the CDN.
11 | * When using the "previewDrafts" perspective then the data is fetched from the live API and isn't cached, it will also fetch draft content that isn't published yet.
12 | */
13 | export async function sanityFetch
22 |
47 |
72 | );
73 | }
74 |
--------------------------------------------------------------------------------
/sanity/schemas/documents/post.ts:
--------------------------------------------------------------------------------
1 | import { DocumentsIcon } from "@sanity/icons";
2 | import { format, parseISO } from "date-fns";
3 | import { defineField, defineType } from "sanity";
4 |
5 | import authorType from "./author";
6 |
7 | // for demo
8 | export default defineType({
9 | name: "post",
10 | title: "Post",
11 | icon: DocumentsIcon,
12 | type: "document",
13 | fields: [
14 | defineField({
15 | name: "title",
16 | title: "Title",
17 | type: "string",
18 | validation: (rule) => rule.required(),
19 | }),
20 | defineField({
21 | name: "slug",
22 | title: "Slug",
23 | type: "slug",
24 | description: "A slug is required for the post to show up in the preview",
25 | options: {
26 | source: "title",
27 | maxLength: 96,
28 | isUnique: (value, context) => context.defaultIsUnique(value, context),
29 | },
30 | validation: (rule) => rule.required(),
31 | }),
32 | defineField({
33 | name: "content",
34 | title: "Content",
35 | type: "array",
36 | of: [
37 | {
38 | type: "block"
39 | },
40 | {
41 | type: 'image'
42 | },
43 | {
44 | type: 'code'
45 | }
46 | ],
47 | }),
48 | defineField({
49 | name: "excerpt",
50 | title: "Excerpt",
51 | type: "text",
52 | }),
53 | // defineField({
54 | // name: "summary",
55 | // title: "Summary",
56 | // type: "text",
57 | // }),
58 | defineField({
59 | name: "coverImage",
60 | title: "Cover Image",
61 | type: "image",
62 | options: {
63 | hotspot: true,
64 | aiAssist: {
65 | imageDescriptionField: "alt",
66 | },
67 | },
68 | fields: [
69 | {
70 | name: "alt",
71 | type: "string",
72 | title: "Alternative text",
73 | description: "Important for SEO and accessiblity.",
74 | validation: (rule) => {
75 | return rule.custom((alt, context) => {
76 | if ((context.document?.coverImage as any)?.asset?._ref && !alt) {
77 | return "Required";
78 | }
79 | return true;
80 | });
81 | },
82 | },
83 | ],
84 | validation: (rule) => rule.required(),
85 | }),
86 | defineField({
87 | name: "date",
88 | title: "Date",
89 | type: "datetime",
90 | initialValue: () => new Date().toISOString(),
91 | }),
92 | defineField({
93 | name: "author",
94 | title: "Author",
95 | type: "reference",
96 | to: [{ type: authorType.name }],
97 | }),
98 | ],
99 | preview: {
100 | select: {
101 | title: "title",
102 | author: "author.name",
103 | date: "date",
104 | media: "coverImage",
105 | },
106 | prepare({ title, media, author, date }) {
107 | const subtitles = [
108 | author && `by ${author}`,
109 | date && `on ${format(parseISO(date), "LLL d, yyyy")}`,
110 | ].filter(Boolean);
111 |
112 | return { title, media, subtitle: subtitles.join(" ") };
113 | },
114 | },
115 | });
116 |
--------------------------------------------------------------------------------
/sanity.config.ts:
--------------------------------------------------------------------------------
1 | "use client";
2 | /**
3 | * This config is used to set up Sanity Studio that's mounted on the `app/(sanity)/studio/[[...tool]]/page.tsx` route
4 | */
5 | import { codeInput } from '@sanity/code-input';
6 | import { colorInput } from '@sanity/color-input';
7 | import { dashboardTool, projectInfoWidget, projectUsersWidget } from "@sanity/dashboard";
8 | import { visionTool } from "@sanity/vision";
9 | import { PluginOptions, defineConfig } from "sanity";
10 | import { unsplashImageAsset } from "sanity-plugin-asset-source-unsplash";
11 | import { markdownSchema } from "sanity-plugin-markdown";
12 | import { media } from 'sanity-plugin-media';
13 | import { presentationTool } from "sanity/presentation";
14 | import { structureTool } from "sanity/structure";
15 |
16 | import defaultDocumentNode from '@/sanity/defaultDocumentNode';
17 | import { apiVersion, dataset, projectId, studioUrl } from "@/sanity/lib/api";
18 | import { locate } from "@/sanity/plugins/locate";
19 | import { pageStructure, singletonPlugin } from "@/sanity/plugins/settings";
20 | import author from "@/sanity/schemas/documents/author";
21 | import post from "@/sanity/schemas/documents/post";
22 | import product from "@/sanity/schemas/documents/product";
23 | import settings from "@/sanity/schemas/singletons/settings";
24 | import application from "./sanity/schemas/documents/application";
25 | import category from "./sanity/schemas/documents/category";
26 | import { comment } from "./sanity/schemas/documents/comment";
27 | import submission from "./sanity/schemas/documents/submission";
28 | import tag from "./sanity/schemas/documents/tag";
29 | import appType from './sanity/schemas/documents/appType';
30 | import user from './sanity/schemas/documents/user';
31 | import group from './sanity/schemas/documents/group';
32 | import guide from './sanity/schemas/documents/guide';
33 | import localizedString from './sanity/schemas/singletons/localizedString';
34 |
35 | export default defineConfig({
36 | basePath: studioUrl,
37 | projectId,
38 | dataset,
39 | schema: {
40 | types: [
41 | // Singletons
42 | settings,
43 | localizedString,
44 |
45 | // Documents
46 | product,
47 | submission,
48 | application,
49 | user,
50 |
51 | guide,
52 |
53 | tag,
54 | category,
55 | group,
56 | appType,
57 |
58 | post,
59 | author,
60 | comment,
61 | ],
62 | },
63 | plugins: [
64 | structureTool({
65 | defaultDocumentNode,
66 | structure: pageStructure([settings]),
67 | }),
68 |
69 | dashboardTool({
70 | widgets: [
71 | projectInfoWidget(),
72 | projectUsersWidget(),
73 | // sanityTutorialsWidget()
74 | ],
75 | }),
76 |
77 | presentationTool({
78 | locate,
79 | previewUrl: { previewMode: { enable: "/api/draft" } },
80 | }),
81 | // https://www.sanity.io/plugins/sanity-plugin-media
82 | media(),
83 | // https://www.sanity.io/plugins/sanity-plugin-markdown
84 | markdownSchema(),
85 | // Configures the global "new document" button, and document actions, to suit the Settings document singleton
86 | singletonPlugin([settings.name]),
87 | // Add an image asset source for Unsplash
88 | unsplashImageAsset(),
89 | // Sets up AI Assist with preset prompts
90 | // https://www.sanity.io/docs/ai-assist
91 | // assistWithPresets(),
92 | colorInput(),
93 | codeInput(),
94 | // Vision lets you query your content with GROQ in the studio
95 | // https://www.sanity.io/docs/the-vision-plugin
96 | // process.env.NODE_ENV === "development" &&
97 | visionTool({
98 | defaultApiVersion: apiVersion
99 | }),
100 | ].filter(Boolean) as PluginOptions[],
101 | });
102 |
--------------------------------------------------------------------------------
/app/(blog)/layout.tsx:
--------------------------------------------------------------------------------
1 | import "../globals.css";
2 |
3 | import { SpeedInsights } from "@vercel/speed-insights/next";
4 | import type { Metadata } from "next";
5 | import {
6 | VisualEditing,
7 | toPlainText,
8 | type PortableTextBlock,
9 | } from "next-sanity";
10 | import { Inter } from "next/font/google";
11 | import { draftMode } from "next/headers";
12 | import { Suspense } from "react";
13 |
14 | import AlertBanner from "./alert-banner";
15 | import PortableText from "./portable-text";
16 |
17 | import type { SettingsQueryResult } from "@/sanity.types";
18 | import * as demo from "@/sanity/lib/demo";
19 | import { sanityFetch } from "@/sanity/lib/fetch";
20 | import { settingsQuery } from "@/sanity/lib/queries";
21 | import { resolveOpenGraphImage } from "@/sanity/lib/utils";
22 |
23 | export async function generateMetadata(): Promise
48 |
53 |
54 | No posts
49 |50 | Get started by creating a new post. 51 |
52 |
55 |
60 |
68 | Create Post
69 |
70 |
71 |
77 |
83 |
113 |
122 |
123 | );
124 | }
125 |
--------------------------------------------------------------------------------
/app/(blog)/page.tsx:
--------------------------------------------------------------------------------
1 | import Link from "next/link";
2 | import { Suspense } from "react";
3 |
4 | import Avatar from "./avatar";
5 | import CoverImage from "./cover-image";
6 | import DateComponent from "./date";
7 | import MoreStories from "./more-stories";
8 | import Onboarding from "./onboarding";
9 | import PortableText from "./portable-text";
10 |
11 | import type { HeroQueryResult, SettingsQueryResult } from "@/sanity.types";
12 | import * as demo from "@/sanity/lib/demo";
13 | import { sanityFetch } from "@/sanity/lib/fetch";
14 | import { heroQuery, settingsQuery } from "@/sanity/lib/queries";
15 |
16 | function Intro(props: { title: string | null | undefined; description: any }) {
17 | const title = props.title || demo.title;
18 | const description = props.description?.length
19 | ? props.description
20 | : demo.description;
21 | return (
22 | 78 | 79 | {settings?.title || demo.title} 80 | 81 |
82 |84 | {post.title} 85 |
86 |
87 | {post.author && (
88 |
91 |
92 |
94 |
95 |
106 | {post.content?.length && (
107 |
96 | {post.author && (
97 |
100 |
101 |
105 |
102 |
104 | 24 | {title || demo.title} 25 |
26 |
27 |
32 |
53 |
72 |
54 |
63 | 55 | 56 | {title} 57 | 58 |
59 |
60 |
62 |
64 | {excerpt && (
65 |
71 | 66 | {excerpt} 67 |
68 | )} 69 | {author &&
98 |
122 | );
123 | }
124 |
--------------------------------------------------------------------------------
/sanity/schemas/documents/product.ts:
--------------------------------------------------------------------------------
1 | import { ProjectsIcon } from "@sanity/icons";
2 | import { format, parseISO } from "date-fns";
3 | import { defineField, defineType } from "sanity";
4 |
5 | export default defineType({
6 | name: "product",
7 | title: "Product",
8 | icon: ProjectsIcon,
9 | type: "document",
10 | fields: [
11 | defineField({
12 | name: "name",
13 | title: "Name",
14 | type: "string",
15 | validation: (rule) => rule.required(),
16 | }),
17 | defineField({
18 | name: "slug",
19 | title: "Slug",
20 | type: "slug",
21 | options: {
22 | source: "name",
23 | maxLength: 96,
24 | isUnique: (value, context) => context.defaultIsUnique(value, context),
25 | },
26 | validation: (rule) => rule.required(),
27 | }),
28 | defineField({
29 | name: "order",
30 | title: "Order",
31 | type: "number",
32 | initialValue: -1,
33 | }),
34 | defineField({
35 | name: "category",
36 | title: "Category",
37 | type: "reference",
38 | to: [{ type: "category" }],
39 | }),
40 | defineField({
41 | name: "tags",
42 | title: "Tags",
43 | type: "array",
44 | of: [
45 | {
46 | type: "reference",
47 | to: [{ type: "tag" }],
48 | }
49 | ],
50 | }),
51 | defineField({
52 | name: "featured",
53 | title: "Featured",
54 | type: "boolean",
55 | initialValue: false,
56 | }),
57 | defineField({
58 | name: "visible",
59 | title: "Visible",
60 | type: "boolean",
61 | initialValue: true,
62 | }),
63 | defineField({
64 | name: "website",
65 | title: "Website",
66 | type: "string",
67 | }),
68 | defineField({
69 | name: "github",
70 | title: "Github",
71 | type: "string",
72 | }),
73 | defineField({
74 | name: "priceLink",
75 | title: "PriceLink",
76 | type: "string",
77 | }),
78 | defineField({
79 | name: "price",
80 | title: "Price",
81 | type: "string",
82 | options: {
83 | list: [
84 | 'Free',
85 | 'Paid',
86 | 'Free & Paid',
87 | ],
88 | }
89 | }),
90 | defineField({
91 | name: "source",
92 | title: "source",
93 | type: "string",
94 | }),
95 | defineField({
96 | name: "submitter",
97 | title: "Submitter",
98 | type: "reference",
99 | to: [{ type: "user" }],
100 | }),
101 | defineField({
102 | name: "desc",
103 | title: "Description",
104 | type: "localizedString",
105 | }),
106 | defineField({
107 | name: "content",
108 | title: "Content",
109 | type: "array",
110 | of: [
111 | {
112 | type: "block"
113 | },
114 | {
115 | type: 'image'
116 | },
117 | {
118 | type: 'code'
119 | }
120 | ],
121 | }),
122 | // defineField({
123 | // name: "content_zh",
124 | // title: "Content_ZH",
125 | // type: "array",
126 | // of: [
127 | // {
128 | // type: "block"
129 | // },
130 | // {
131 | // type: 'image'
132 | // },
133 | // {
134 | // type: 'code'
135 | // }
136 | // ],
137 | // }),
138 | defineField({
139 | name: "logo",
140 | title: "Logo",
141 | type: "image",
142 | }),
143 | defineField({
144 | name: "coverImage",
145 | title: "Cover Image",
146 | type: "image",
147 | options: {
148 | hotspot: true,
149 | },
150 | }),
151 | defineField({
152 | name: "guides",
153 | title: "Guides",
154 | type: "array",
155 | of: [
156 | {
157 | type: "reference",
158 | to: [{ type: "guide" }],
159 | }
160 | ],
161 | }),
162 | defineField({
163 | name: "date",
164 | title: "Date",
165 | type: "datetime",
166 | initialValue: () => new Date().toISOString(),
167 | }),
168 | ],
169 | preview: {
170 | select: {
171 | title: "name",
172 | media: "logo",
173 | order: "order",
174 | date: "date",
175 | },
176 | prepare({ title, media, order, date }) {
177 | const subtitles = [
178 | order && `order:${order}`,
179 | date && `${format(parseISO(date), "yyyy/MM/dd")}`,
180 | ].filter(Boolean);
181 | return { title, media, subtitle: subtitles.join(" ") };
182 | },
183 | },
184 | });
185 |
--------------------------------------------------------------------------------
/README.md:
--------------------------------------------------------------------------------
1 |
2 | 
3 | Open Source Directory Boilerplate
4 | 5 | 6 |
7 |
8 | 
13 | Introduction · 14 | Features · 15 | Tech Stack · 16 | How to use · 17 | Author · 18 | Compare with Mkdirs · 19 | Notice · 20 | License · 21 | Credits 22 |
23 |24 | 25 | ## Introduction 26 | 27 | | Component | Website | Repository | 28 | | --------- | ------- | ---------- | 29 | | Frontend | [free-directory-boilerplate.vercel.app](https://free-directory-boilerplate.vercel.app) | [free-directory-boilerplate](https://github.com/javayhu/free-directory-boilerplate) | 30 | | **Backend (Sanity)** | [free-directory-sanity.vercel.app/studio](https://free-directory-sanity.vercel.app/studio) | [free-directory-sanity](https://github.com/javayhu/free-directory-sanity) | 31 | 32 | ## Features 33 | 34 | - Listings (Tools, Products) 35 | - Item Detail Page 36 | - Categories & Tags 37 | - Authentication (GitHub and Google) 38 | - Submission (built-in) 39 | - Sanity Studio (built-in CMS) 40 | - Blog (hidden by default) 41 | - Documentation (hidden by default) 42 | - Analytics (Umami & Google Analytics) 43 | - SEO (Sitemap, Open Graph) 44 | - Modern UI (Shadcn UI) 45 | - Responsive Design 46 | - Multi-language (English & Chinese) 47 | - Multi-theme (Light & Dark) 48 | 49 | 50 | ## Tech Stack 51 | 52 | - Next.js 14 53 | - NextAuth 54 | - Database (PostgreSQL) 55 | - Tailwind CSS 56 | - Shadcn UI 57 | - Lucide Icons 58 | - Contentlayer 59 | - Sanity 60 | - Vercel 61 | 62 | ## How to use 63 | 64 | 1. Clone the repository 65 | 2. Run `pnpm install` 66 | 3. Configure the `.env` file 67 | 4. Run `pnpm dev` 68 | 69 | ## Author 70 | 71 | This project is created by [Fox](https://x.com/indie_maker_fox), the founder of [Mkdirs](https://mkdirs.com) and [MkSaaS](https://mksaas.com). 72 | 73 | [Mkdirs](https://mkdirs.com) is the best directory boilerplate for anyone who wants to launch a profitable directory website in minutes. 74 | 75 | [MkSaaS](https://mksaas.com) is the best AI SaaS boilerplate, you can launch your next AI SaaS in a weekend with MkSaaS template. 76 | 77 | If you are interested in indie hacking, please follow me on X: [@javay_hu](https://x.com/indie_maker_fox) or BlueSky: [@javayhu.com](https://bsky.app/profile/mksaas.me) 78 | 79 | ### Compare with Mkdirs 80 | 81 | [Mkdirs](https://mkdirs.com) - The best directory boilerplate. 82 | 83 | | Feature | Free Directory Boilerplate | Mkdirs | 84 | | ------- | -------------------------- | ------ | 85 | | Repos | ✅ 2 | ✅ 1 | 86 | | Price | ✅ Free and Open Source | ✅ Paid | 87 | | Auth | ✅ GitHub or Google | ✅ GitHub or Google or Email | 88 | | Listings | ✅ Categories | ✅ Categories, Tags & Filters | 89 | | Database | ✅ Need PostgreSQL | ✅ NO NEED! JUST SANITY! | 90 | | Newsletter | ❌ Not supported | ✅ Supported | 91 | | Payment | ❌ Not supported | ✅ Supported | 92 | | Search | ❌ Not supported | ✅ Supported | 93 | | Pagination | ❌ Not supported | ✅ Supported | 94 | | Email Notification | ❌ Not supported | ✅ Supported | 95 | | Submission | ✅ Built-in (Free) | ✅ Built-in (Free & Paid) | 96 | | Blog | ✅ Contentlayer | ✅ Sanity CMS | 97 | | Analytics | ✅ Umami & Google Analytics | ✅ OpenPanel & Google Analytics | 98 | | SEO | ✅ Sitemap & Open Graph | ✅ Sitemap & Open Graph | 99 | | Multi-language | ✅ English & Chinese | ✅ English | 100 | | Multi-theme | ✅ Light & Dark | ✅ Light & Dark | 101 | 102 | ## Notice 103 | 104 | If you have any questions when using this project, please checkout the [docs of Mkidrs](https://docs.mkdirs.com) for more information, because they have almost the same tech stack. 105 | 106 | ## License 107 | 108 | This project is licensed under the MIT License - see the [LICENSE.md](LICENSE.md) file for details. 109 | 110 | ## Credits 111 | 112 | This project was inspired by [@miickasmt](https://twitter.com/miickasmt)'s [next-saas-stripe-starter](https://github.com/mickasmt/next-saas-stripe-starter) 113 | 114 | ## ⭐ Star History 115 | 116 | [](https://star-history.com/#javayhu/free-directory-sanity&Date) 117 | -------------------------------------------------------------------------------- /sanity/plugins/settings.tsx: -------------------------------------------------------------------------------- 1 | /** 2 | * This plugin contains all the logic for setting up the singletons 3 | */ 4 | 5 | import { CheckmarkCircleIcon, ClockIcon, CloseCircleIcon, ProjectsIcon } from "@sanity/icons"; 6 | import { definePlugin, type DocumentDefinition } from "sanity"; 7 | import { type StructureResolver } from "sanity/structure"; 8 | import application from "../schemas/documents/application"; 9 | import submission from "../schemas/documents/submission"; 10 | import product from "../schemas/documents/product"; 11 | 12 | export const singletonPlugin = definePlugin((types: string[]) => { 13 | return { 14 | name: "singletonPlugin", 15 | document: { 16 | // Hide 'Singletons (such as Settings)' from new document options 17 | // https://user-images.githubusercontent.com/81981/195728798-e0c6cf7e-d442-4e58-af3a-8cd99d7fcc28.png 18 | newDocumentOptions: (prev, { creationContext, ...rest }) => { 19 | if (creationContext.type === "global") { 20 | return prev.filter( 21 | (templateItem) => !types.includes(templateItem.templateId), 22 | ); 23 | } 24 | 25 | return prev; 26 | }, 27 | // Removes the "duplicate" action on the Singletons (such as Home) 28 | actions: (prev, { schemaType }) => { 29 | if (types.includes(schemaType)) { 30 | return prev.filter(({ action }) => action !== "duplicate"); 31 | } 32 | 33 | return prev; 34 | }, 35 | }, 36 | }; 37 | }); 38 | 39 | // The StructureResolver is how we're changing the DeskTool structure to linking to document (named Singleton) 40 | // like how "Home" is handled. 41 | export const pageStructure = ( 42 | typeDefArray: DocumentDefinition[], 43 | ): StructureResolver => { 44 | return (S) => { 45 | // Goes through all of the singletons that were provided and translates them into something the 46 | // Structure tool can understand 47 | const singletonItems = typeDefArray.map((typeDef) => { 48 | return S.listItem() 49 | .title(typeDef.title!) 50 | .icon(typeDef.icon) 51 | .child( 52 | S.editor() 53 | .id(typeDef.name) 54 | .schemaType(typeDef.name) 55 | .documentId(typeDef.name), 56 | ); 57 | }); 58 | 59 | // The default root list items (except custom ones) 60 | const defaultListItems = S.documentTypeListItems().filter( 61 | (listItem) => 62 | !typeDefArray.find((singleton) => singleton.name === listItem.getId()), 63 | ); 64 | 65 | // applications 66 | // sanity has a bug for setting schemaType has no effect, so I have to set _type! 67 | const reviewingAppliactionListItems = S.listItem() 68 | .title('Reviewing Appliactions') 69 | .schemaType(application.name) 70 | .icon(ClockIcon) 71 | .child(S.documentList() 72 | .schemaType(application.name) 73 | .title('Reviewing Appliactions') 74 | .filter('_type == "application" && status == "reviewing"')); 75 | 76 | const rejectedAppliactionListItems = S.listItem() 77 | .title('Rejected Appliactions') 78 | .schemaType(application.name) 79 | .icon(CloseCircleIcon) 80 | .child(S.documentList() 81 | .schemaType(application.name) 82 | .title('Rejected Appliactions') 83 | .filter('_type == "application" && status == "rejected"')); 84 | 85 | const approvedAppliactionListItems = S.listItem() 86 | .title('Approved Appliactions') 87 | .schemaType(application.name) 88 | .icon(CheckmarkCircleIcon) 89 | .child(S.documentList() 90 | .schemaType(application.name) 91 | .title('Approved Appliactions') 92 | .filter('_type == "application" && status == "approved"')); 93 | 94 | const featuredAppliactionListItems = S.listItem() 95 | .title('Featured Appliactions') 96 | .schemaType(application.name) 97 | .icon(CheckmarkCircleIcon) 98 | .child(S.documentList() 99 | .schemaType(application.name) 100 | .title('Featured Appliactions') 101 | .filter('_type == "application" && featured == true')); 102 | 103 | // submissions 104 | const reviewingSubmissionListItems = S.listItem() 105 | .title('Reviewing Submissions') 106 | .schemaType(submission.name) 107 | .icon(ClockIcon) 108 | .child(S.documentList() 109 | .schemaType(submission.name) 110 | .title('Reviewing Submissions') 111 | .filter('_type == "submission" && status == "reviewing"')); 112 | 113 | const rejectedSubmissionListItems = S.listItem() 114 | .title('Rejected Submissions') 115 | .schemaType(submission.name) 116 | .icon(CloseCircleIcon) 117 | .child(S.documentList() 118 | .schemaType(submission.name) 119 | .title('Rejected Submissions') 120 | .filter('_type == "submission" && status == "rejected"')); 121 | 122 | const approvedSubmissionListItems = S.listItem() 123 | .title('Approved Submissions') 124 | .schemaType(submission.name) 125 | .icon(CheckmarkCircleIcon) 126 | .child(S.documentList() 127 | .schemaType(submission.name) 128 | .title('Approved Submissions') 129 | .filter('_type == "submission" && status == "approved"')); 130 | 131 | const featuredProductListItems = S.listItem() 132 | .title('Featured Products') 133 | .schemaType(product.name) 134 | .icon(CheckmarkCircleIcon) 135 | .child(S.documentList() 136 | .schemaType(product.name) 137 | .title('Featured Products') 138 | .filter('_type == "product" && featured == true')); 139 | 140 | const invisibleProductListItems = S.listItem() 141 | .title('Invisible Products') 142 | .schemaType(product.name) 143 | .icon(CheckmarkCircleIcon) 144 | .child(S.documentList() 145 | .schemaType(product.name) 146 | .title('Invisible Products') 147 | .filter('_type == "product" && visible == false')); 148 | 149 | return S.list() 150 | .title("Content") 151 | .items([ 152 | reviewingAppliactionListItems, 153 | rejectedAppliactionListItems, 154 | approvedAppliactionListItems, 155 | featuredAppliactionListItems, 156 | S.divider(), 157 | reviewingSubmissionListItems, 158 | rejectedSubmissionListItems, 159 | approvedSubmissionListItems, 160 | S.divider(), 161 | featuredProductListItems, 162 | invisibleProductListItems, 163 | S.divider(), 164 | // S.documentTypeListItem('product').title('Products'), // List items with same ID found (product) 165 | 166 | // S.documentTypeListItem('product').title('Products'), 167 | 168 | ...defaultListItems, 169 | 170 | ...singletonItems,]); 171 | }; 172 | }; 173 | -------------------------------------------------------------------------------- /sanity/lib/queries.ts: -------------------------------------------------------------------------------- 1 | import { groq } from "next-sanity"; 2 | 3 | /** 4 | * products 5 | */ 6 | const tagFields = /* groq */ ` 7 | ..., 8 | "slug": slug.current, 9 | `; 10 | 11 | const categoryFields = /* groq */ ` 12 | ..., 13 | "slug": slug.current, 14 | "name": coalesce(name[$lang], name[$defaultLocale]), 15 | group-> { 16 | ..., 17 | "slug": slug.current, 18 | "name": coalesce(name[$lang], name[$defaultLocale]), 19 | }, 20 | `; 21 | 22 | const groupFields = /* groq */ ` 23 | ..., 24 | "slug": slug.current, 25 | "name": coalesce(name[$lang], name[$defaultLocale]), 26 | "categories": *[_type=='category' && references(^._id)] | order(order desc, _createdAt asc) 27 | { 28 | ..., 29 | "slug": slug.current, 30 | "name": coalesce(name[$lang], name[$defaultLocale]), 31 | } 32 | `; 33 | 34 | const guideFields = /* groq */ ` 35 | ..., 36 | "slug": slug.current, 37 | `; 38 | 39 | const apptypeFields = /* groq */ ` 40 | ..., 41 | "slug": slug.current, 42 | "name": coalesce(name[$lang], name[$defaultLocale]), 43 | `; 44 | 45 | // for sitemap 46 | export const productListQueryForSitemap = groq`*[_type == "product" && visible == true] | order(order desc, _createdAt asc) { 47 | _id, 48 | "slug": slug.current, 49 | }`; 50 | 51 | // for sitemap 52 | export const categoryListQueryForSitemap = groq`*[_type == "category"] | order(order desc, _createdAt asc) { 53 | _id, 54 | "slug": slug.current, 55 | group-> { 56 | _id, 57 | "slug": slug.current, 58 | }, 59 | }`; 60 | 61 | // for sitemap 62 | export const appListQueryForSitemap = groq`*[_type == "application" && status == "approved"] | order(order desc, _createdAt asc) { 63 | _id, 64 | name, 65 | }`; 66 | 67 | // for sitemap 68 | export const appTypeListQueryForSitemap = groq`*[_type == "appType"] | order(order desc, _createdAt asc) { 69 | _id, 70 | "slug": slug.current, 71 | }`; 72 | 73 | // for metadata 74 | export const categoryQuery = groq`*[_type == "category" && slug.current == $slug] [0] { 75 | _id, 76 | "name": coalesce(name[$lang], name[$defaultLocale]), 77 | }`; 78 | 79 | // for metadata 80 | export const appTypeQuery = groq`*[_type == "appType" && slug.current == $slug] [0] { 81 | _id, 82 | "name": coalesce(name[$lang], name[$defaultLocale]), 83 | }`; 84 | 85 | /** 86 | * 1、user queries 87 | * 2、_id is sanity id, id is database id 88 | */ 89 | const userFields = /* groq */ ` 90 | ... 91 | `; 92 | 93 | const productFields = /* groq */ ` 94 | ..., 95 | "slug": slug.current, 96 | "status": select(_originalId in path("drafts.**") => "draft", "published"), 97 | "desc": coalesce(desc[$lang], desc[$defaultLocale]), 98 | "date": coalesce(date, _createdAt), 99 | category-> { 100 | ${categoryFields} 101 | }, 102 | tags[]-> { 103 | ${tagFields} 104 | }, 105 | guides[]-> { 106 | ${guideFields} 107 | }, 108 | submitter-> { 109 | ${userFields} 110 | }, 111 | `; 112 | 113 | // this query is not used for now 114 | // "name": coalesce(name[$lang], name[$defaultLocale]), 115 | export const groupListQuery = groq`*[_type == "group"] | order(order desc, _createdAt asc) { 116 | ${groupFields} 117 | }`; 118 | 119 | export const groupQuery = groq`*[_type == "group" && slug.current == $slug] [0] { 120 | ${groupFields} 121 | }`; 122 | 123 | // "name": coalesce(name[$lang], name[$defaultLocale]), is working if convert the below to string in sanity.types.ts 124 | // name: Array<{ 125 | // _type: "localizedString"; 126 | // en?: string; 127 | // zh?: string; 128 | // }> | null; 129 | export const groupListWithCategoryQuery = groq`*[_type=="group"] | order(order desc, _createdAt asc) { 130 | ${groupFields} 131 | }`; 132 | 133 | export const categoryListQuery = groq`*[_type == "category"] | order(order desc, _createdAt asc) { 134 | ${categoryFields} 135 | }`; 136 | 137 | export const tagListQuery = groq`*[_type == "tag"] | order(order desc, _createdAt asc) { 138 | ${tagFields} 139 | }`; 140 | 141 | export const categoryListByGroupQuery = groq`*[_type == "category" && references(*[_type == "group" && slug.current == $groupSlug]._id)] | order(order desc, _createdAt asc) { 142 | ${categoryFields} 143 | }`; 144 | 145 | export const productListByGroupQuery = groq`*[_type == "product" && visible == true && category._ref in (*[_type == "category" && group._ref in (*[_type == "group" && slug.current == $groupSlug]._id)]._id)] | order(order desc, _createdAt asc) { 146 | ${productFields} 147 | }`; 148 | 149 | export const productListQuery = groq`*[_type == "product" && visible == true] | order(order desc, _createdAt asc) { 150 | ${productFields} 151 | }`; 152 | 153 | export const productListOfFeaturedQuery = groq`*[_type == "product" && visible == true && featured == true] | order(order desc, _createdAt asc) [0...$limit] { 154 | ${productFields} 155 | }`; 156 | 157 | export const productListByCategoryQuery = groq`*[_type == "product" && visible == true && references(*[_type == "category" && slug.current == $categorySlug]._id)] | order(order desc, _createdAt asc) { 158 | ${productFields} 159 | }`; 160 | 161 | export const productListOfRecentQuery = groq`*[_type == "product" && visible == true] | order(_createdAt desc) [0...$limit] { 162 | ${productFields} 163 | }`; 164 | 165 | export const productQuery = groq`*[_type == "product" && visible == true && slug.current == $slug] [0] { 166 | content, 167 | ${productFields} 168 | }`; 169 | 170 | /** 171 | * applications 172 | */ 173 | const applicationFields = /* groq */ ` 174 | ..., 175 | types[]-> { 176 | ${apptypeFields} 177 | }, 178 | user-> { 179 | ${userFields} 180 | }, 181 | `; 182 | 183 | export const appQuery = groq`*[_type == "application" && name == $slug] [0] { 184 | ${applicationFields} 185 | }`; 186 | 187 | export const appTypeListQuery = groq`*[_type == "appType"] | order(order desc, _createdAt asc) { 188 | ${apptypeFields} 189 | }`; 190 | 191 | export const applicationListOfFeaturedQuery = groq`*[_type == "application" && status == "approved" && featured == true] | order(order desc, _createdAt asc) { 192 | ${applicationFields} 193 | }`; 194 | 195 | export const applicationListOfRecentQuery = groq`*[_type == "application" && status == "approved"] | order(_createdAt desc) [0...$limit] { 196 | ${applicationFields} 197 | }`; 198 | 199 | export const applicationListByCategoryQuery = groq`*[_type == "application" && status == "approved" && references(*[_type == "appType" && slug.current == $categorySlug]._id)] | order(order desc, _createdAt asc) { 200 | ${applicationFields} 201 | }`; 202 | 203 | export const applicationListByUserQuery = groq`*[_type == "application" && references(*[_type == "user" && id == $userid]._id)] | order(_createdAt asc) { 204 | ${applicationFields} 205 | }`; 206 | 207 | export const userQuery = groq`*[_type == "user" && id == $userId][0] { 208 | ${userFields} 209 | }`; 210 | 211 | 212 | /** 213 | * demo queries 214 | */ 215 | const postFields = /* groq */ ` 216 | _id, 217 | "status": select(_originalId in path("drafts.**") => "draft", "published"), 218 | "title": coalesce(title, "Untitled"), 219 | "slug": slug.current, 220 | excerpt, 221 | coverImage, 222 | "date": coalesce(date, _updatedAt), 223 | "author": author->{"name": coalesce(name, "Anonymous"), picture}, 224 | `; 225 | 226 | export const moreStoriesQuery = groq`*[_type == "post" && _id != $skip && defined(slug.current)] | order(date desc, _updatedAt desc) [0...$limit] { 227 | ${postFields} 228 | }`; 229 | 230 | export const postQuery = groq`*[_type == "post" && slug.current == $slug] [0] { 231 | content, 232 | ${postFields} 233 | }`; 234 | 235 | export const settingsQuery = groq`*[_type == "settings"][0]`; 236 | 237 | export const heroQuery = groq`*[_type == "post" && defined(slug.current)] | order(date desc, _updatedAt desc) [0] { 238 | ${postFields} 239 | }`; 240 | -------------------------------------------------------------------------------- /sanity/plugins/assist.ts: -------------------------------------------------------------------------------- 1 | /** 2 | * Sets up the AI Assist plugin with preset prompts for content creation 3 | */ 4 | 5 | import { assist } from "@sanity/assist"; 6 | 7 | import postType from "../schemas/documents/post"; 8 | 9 | export const assistWithPresets = () => 10 | assist({ 11 | __presets: { 12 | [postType.name]: { 13 | fields: [ 14 | { 15 | /** 16 | * Creates Portable Text `content` blocks from the `title` field 17 | */ 18 | path: "content", 19 | instructions: [ 20 | { 21 | _key: "preset-instruction-1", 22 | title: "Generate sample content", 23 | icon: "block-content", 24 | prompt: [ 25 | { 26 | _key: "86e70087d4d5", 27 | markDefs: [], 28 | children: [ 29 | { 30 | _type: "span", 31 | marks: [], 32 | text: "Given the draft title ", 33 | _key: "6b5d5d6a63cf0", 34 | }, 35 | { 36 | path: "title", 37 | _type: "sanity.assist.instruction.fieldRef", 38 | _key: "0132742d463b", 39 | }, 40 | { 41 | _type: "span", 42 | marks: [], 43 | text: " of a blog post, generate a comprehensive and engaging sample content that spans the length of one to two A4 pages. The content should be structured, informative, and tailored to the subject matter implied by the title, whether it be travel, software engineering, fashion, politics, or any other theme. The text will be displayed below the ", 44 | _key: "a02c9ab4eb2d", 45 | }, 46 | { 47 | _type: "sanity.assist.instruction.fieldRef", 48 | _key: "f208ef240062", 49 | path: "title", 50 | }, 51 | { 52 | text: " and doesn't need to repeat it in the text. The generated text should include the following elements:", 53 | _key: "8ecfa74a8487", 54 | _type: "span", 55 | marks: [], 56 | }, 57 | ], 58 | _type: "block", 59 | style: "normal", 60 | }, 61 | { 62 | style: "normal", 63 | _key: "e4dded41ea89", 64 | markDefs: [], 65 | children: [ 66 | { 67 | _type: "span", 68 | marks: [], 69 | text: "1. Introduction: A brief paragraph that captures the essence of the blog post, hooks the reader with intriguing insights, and outlines the purpose of the post.", 70 | _key: "cc5ef44a2fb5", 71 | }, 72 | ], 73 | _type: "block", 74 | }, 75 | { 76 | style: "normal", 77 | _key: "585e8de2fe35", 78 | markDefs: [], 79 | children: [ 80 | { 81 | _type: "span", 82 | marks: [], 83 | text: "2. Main Body:", 84 | _key: "fab36eb7c541", 85 | }, 86 | ], 87 | _type: "block", 88 | }, 89 | { 90 | _type: "block", 91 | style: "normal", 92 | _key: "e96b89ef6357", 93 | markDefs: [], 94 | children: [ 95 | { 96 | _type: "span", 97 | marks: [], 98 | text: "- For thematic consistency, divide the body into several sections with subheadings that explore different facets of the topic.", 99 | _key: "b685a310a0ff", 100 | }, 101 | ], 102 | }, 103 | { 104 | children: [ 105 | { 106 | marks: [], 107 | text: "- Include engaging and informative content such as personal anecdotes (for travel or fashion blogs), technical explanations or tutorials (for software engineering blogs), satirical or humorous observations (for shitposting), or well-argued positions (for political blogs).", 108 | _key: "c7468d106c91", 109 | _type: "span", 110 | }, 111 | ], 112 | _type: "block", 113 | style: "normal", 114 | _key: "ce4acdb00da9", 115 | markDefs: [], 116 | }, 117 | { 118 | _type: "block", 119 | style: "normal", 120 | _key: "fb4572e65833", 121 | markDefs: [], 122 | children: [ 123 | { 124 | _type: "span", 125 | marks: [], 126 | text: "- ", 127 | _key: "5358f261dce4", 128 | }, 129 | { 130 | _type: "span", 131 | marks: [], 132 | text: " observations (for shitposting), or well-argued positions (for political blogs).", 133 | _key: "50792c6d0f77", 134 | }, 135 | ], 136 | }, 137 | { 138 | children: [ 139 | { 140 | marks: [], 141 | text: "Where applicable, incorporate bullet points or numbered lists to break down complex information, steps in a process, or key highlights.", 142 | _key: "3b891d8c1dde0", 143 | _type: "span", 144 | }, 145 | ], 146 | _type: "block", 147 | style: "normal", 148 | _key: "9364b67074ce", 149 | markDefs: [], 150 | }, 151 | { 152 | _key: "a6ba7579cd66", 153 | markDefs: [], 154 | children: [ 155 | { 156 | _type: "span", 157 | marks: [], 158 | text: "3. Conclusion: Summarize the main points discussed in the post, offer final thoughts or calls to action, and invite readers to engage with the content through comments or social media sharing.", 159 | _key: "1280f11d499d", 160 | }, 161 | ], 162 | _type: "block", 163 | style: "normal", 164 | }, 165 | { 166 | style: "normal", 167 | _key: "719a79eb4c1c", 168 | markDefs: [], 169 | children: [ 170 | { 171 | marks: [], 172 | text: "4. Engagement Prompts: Conclude with questions or prompts that encourage readers to share their experiences, opinions, or questions related to the blog post's topic, but keep in mind there is no Comments field below the blog post.", 173 | _key: "f1512086bab6", 174 | _type: "span", 175 | }, 176 | ], 177 | _type: "block", 178 | }, 179 | { 180 | _type: "block", 181 | style: "normal", 182 | _key: "4a1c586fd44a", 183 | markDefs: [], 184 | children: [ 185 | { 186 | marks: [], 187 | text: "Ensure the generated content maintains a balance between being informative and entertaining, to capture the interest of a wide audience. The sample content should serve as a solid foundation that can be further customized or expanded upon by the blog author to finalize the post.", 188 | _key: "697bbd03cb110", 189 | _type: "span", 190 | }, 191 | ], 192 | }, 193 | { 194 | children: [ 195 | { 196 | marks: [], 197 | text: 'Don\'t prefix each section with "Introduction", "Main Body", "Conclusion" or "Engagement Prompts"', 198 | _key: "d20bb9a03b0d", 199 | _type: "span", 200 | }, 201 | ], 202 | _type: "block", 203 | style: "normal", 204 | _key: "b072b3c62c3c", 205 | markDefs: [], 206 | }, 207 | ], 208 | }, 209 | ], 210 | }, 211 | { 212 | /** 213 | * Summarize content into the `excerpt` field 214 | */ 215 | path: "excerpt", 216 | instructions: [ 217 | { 218 | _key: "preset-instruction-2", 219 | title: "Summarize content", 220 | icon: "blockquote", 221 | prompt: [ 222 | { 223 | markDefs: [], 224 | children: [ 225 | { 226 | _key: "650a0dcc327d", 227 | _type: "span", 228 | marks: [], 229 | text: "Create a short excerpt based on ", 230 | }, 231 | { 232 | path: "content", 233 | _type: "sanity.assist.instruction.fieldRef", 234 | _key: "c62d14c73496", 235 | }, 236 | { 237 | _key: "38e043efa606", 238 | _type: "span", 239 | marks: [], 240 | text: " that doesn't repeat what's already in the ", 241 | }, 242 | { 243 | path: "title", 244 | _type: "sanity.assist.instruction.fieldRef", 245 | _key: "445e62dda246", 246 | }, 247 | { 248 | _key: "98cce773915e", 249 | _type: "span", 250 | marks: [], 251 | text: " . Consider the UI has limited horizontal space and try to avoid too many line breaks and make it as short, terse and brief as possible. At best a single sentence, at most two sentences.", 252 | }, 253 | ], 254 | _type: "block", 255 | style: "normal", 256 | _key: "392c618784b0", 257 | }, 258 | ], 259 | }, 260 | ], 261 | }, 262 | ], 263 | }, 264 | }, 265 | }); 266 | -------------------------------------------------------------------------------- /sanity.types.ts: -------------------------------------------------------------------------------- 1 | /** 2 | * --------------------------------------------------------------------------------- 3 | * This file has been generated by Sanity TypeGen. 4 | * Command: `sanity typegen generate` 5 | * 6 | * Any modifications made directly to this file will be overwritten the next time 7 | * the TypeScript definitions are generated. Please make changes to the Sanity 8 | * schema definitions and/or GROQ queries if you need to update these types. 9 | * 10 | * For more information on how to use Sanity TypeGen, visit the official documentation: 11 | * https://www.sanity.io/docs/sanity-typegen 12 | * --------------------------------------------------------------------------------- 13 | */ 14 | 15 | // Source: schema.json 16 | export type SanityImagePaletteSwatch = { 17 | _type: "sanity.imagePaletteSwatch"; 18 | background?: string; 19 | foreground?: string; 20 | population?: number; 21 | title?: string; 22 | }; 23 | 24 | export type SanityImagePalette = { 25 | _type: "sanity.imagePalette"; 26 | darkMuted?: SanityImagePaletteSwatch; 27 | lightVibrant?: SanityImagePaletteSwatch; 28 | darkVibrant?: SanityImagePaletteSwatch; 29 | vibrant?: SanityImagePaletteSwatch; 30 | dominant?: SanityImagePaletteSwatch; 31 | lightMuted?: SanityImagePaletteSwatch; 32 | muted?: SanityImagePaletteSwatch; 33 | }; 34 | 35 | export type SanityImageDimensions = { 36 | _type: "sanity.imageDimensions"; 37 | height?: number; 38 | width?: number; 39 | aspectRatio?: number; 40 | }; 41 | 42 | export type SanityFileAsset = { 43 | _id: string; 44 | _type: "sanity.fileAsset"; 45 | _createdAt: string; 46 | _updatedAt: string; 47 | _rev: string; 48 | originalFilename?: string; 49 | label?: string; 50 | title?: string; 51 | description?: string; 52 | altText?: string; 53 | sha1hash?: string; 54 | extension?: string; 55 | mimeType?: string; 56 | size?: number; 57 | assetId?: string; 58 | uploadId?: string; 59 | path?: string; 60 | url?: string; 61 | source?: SanityAssetSourceData; 62 | }; 63 | 64 | export type Geopoint = { 65 | _type: "geopoint"; 66 | lat?: number; 67 | lng?: number; 68 | alt?: number; 69 | }; 70 | 71 | export type Comment = { 72 | _id: string; 73 | _type: "comment"; 74 | _createdAt: string; 75 | _updatedAt: string; 76 | _rev: string; 77 | name?: string; 78 | email?: string; 79 | comment?: string; 80 | post?: { 81 | _ref: string; 82 | _type: "reference"; 83 | _weak?: boolean; 84 | [internalGroqTypeReferenceTo]?: "product"; 85 | }; 86 | }; 87 | 88 | export type Post = { 89 | _id: string; 90 | _type: "post"; 91 | _createdAt: string; 92 | _updatedAt: string; 93 | _rev: string; 94 | title?: string; 95 | slug?: Slug; 96 | content?: Array<{ 97 | children?: Array<{ 98 | marks?: Array