Skip to content

Commit 80bcc33

Browse files
committed
feat(core): add zustand to manage snippets state
1 parent 8d5645d commit 80bcc33

File tree

11 files changed

+351
-238
lines changed

11 files changed

+351
-238
lines changed

.source/index.ts

Lines changed: 9 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -1,15 +1,15 @@
11
// @ts-nocheck -- skip type checking
2-
import * as docs_10 from "../content/docs/contributing/third-party-apps.mdx?collection=docs&hash=1755673408387"
3-
import * as docs_9 from "../content/docs/contributing/modifying-snippets.mdx?collection=docs&hash=1755673408387"
4-
import * as docs_8 from "../content/docs/contributing/how-to-contribute.mdx?collection=docs&hash=1755673408387"
5-
import * as docs_7 from "../content/docs/contributing/adding-snippets.mdx?collection=docs&hash=1755673408387"
6-
import * as docs_6 from "../content/docs/extensions/quicksnip.mdx?collection=docs&hash=1755673408387"
7-
import * as docs_5 from "../content/docs/extensions/quicksnip-vscode.mdx?collection=docs&hash=1755673408387"
8-
import * as docs_4 from "../content/docs/extensions/quicksnip-raycast.mdx?collection=docs&hash=1755673408387"
9-
import * as docs_3 from "../content/docs/extensions/quicksnip-cli.mdx?collection=docs&hash=1755673408387"
2+
import * as docs_10 from "../content/docs/extensions/quicksnip.mdx?collection=docs&hash=1755673408387"
3+
import * as docs_9 from "../content/docs/extensions/quicksnip-vscode.mdx?collection=docs&hash=1755673408387"
4+
import * as docs_8 from "../content/docs/extensions/quicksnip-raycast.mdx?collection=docs&hash=1755673408387"
5+
import * as docs_7 from "../content/docs/extensions/quicksnip-cli.mdx?collection=docs&hash=1755673408387"
6+
import * as docs_6 from "../content/docs/contributing/third-party-apps.mdx?collection=docs&hash=1755673408387"
7+
import * as docs_5 from "../content/docs/contributing/modifying-snippets.mdx?collection=docs&hash=1755673408387"
8+
import * as docs_4 from "../content/docs/contributing/how-to-contribute.mdx?collection=docs&hash=1755673408387"
9+
import * as docs_3 from "../content/docs/contributing/adding-snippets.mdx?collection=docs&hash=1755673408387"
1010
import * as docs_2 from "../content/docs/installation.mdx?collection=docs&hash=1755673408387"
1111
import * as docs_1 from "../content/docs/index.mdx?collection=docs&hash=1755673408387"
1212
import * as docs_0 from "../content/docs/comparison.mdx?collection=docs&hash=1755673408387"
1313
import { _runtime } from "fumadocs-mdx"
1414
import * as _source from "../source.config"
15-
export const docs = _runtime.docs<typeof _source.docs>([{ info: {"path":"comparison.mdx","absolutePath":"C:/Technophile/Code/projects/quicksnip/content/docs/comparison.mdx"}, data: docs_0 }, { info: {"path":"index.mdx","absolutePath":"C:/Technophile/Code/projects/quicksnip/content/docs/index.mdx"}, data: docs_1 }, { info: {"path":"installation.mdx","absolutePath":"C:/Technophile/Code/projects/quicksnip/content/docs/installation.mdx"}, data: docs_2 }, { info: {"path":"extensions\\quicksnip-cli.mdx","absolutePath":"C:/Technophile/Code/projects/quicksnip/content/docs/extensions/quicksnip-cli.mdx"}, data: docs_3 }, { info: {"path":"extensions\\quicksnip-raycast.mdx","absolutePath":"C:/Technophile/Code/projects/quicksnip/content/docs/extensions/quicksnip-raycast.mdx"}, data: docs_4 }, { info: {"path":"extensions\\quicksnip-vscode.mdx","absolutePath":"C:/Technophile/Code/projects/quicksnip/content/docs/extensions/quicksnip-vscode.mdx"}, data: docs_5 }, { info: {"path":"extensions\\quicksnip.mdx","absolutePath":"C:/Technophile/Code/projects/quicksnip/content/docs/extensions/quicksnip.mdx"}, data: docs_6 }, { info: {"path":"contributing\\adding-snippets.mdx","absolutePath":"C:/Technophile/Code/projects/quicksnip/content/docs/contributing/adding-snippets.mdx"}, data: docs_7 }, { info: {"path":"contributing\\how-to-contribute.mdx","absolutePath":"C:/Technophile/Code/projects/quicksnip/content/docs/contributing/how-to-contribute.mdx"}, data: docs_8 }, { info: {"path":"contributing\\modifying-snippets.mdx","absolutePath":"C:/Technophile/Code/projects/quicksnip/content/docs/contributing/modifying-snippets.mdx"}, data: docs_9 }, { info: {"path":"contributing\\third-party-apps.mdx","absolutePath":"C:/Technophile/Code/projects/quicksnip/content/docs/contributing/third-party-apps.mdx"}, data: docs_10 }], [{"info":{"path":"meta.json","absolutePath":"C:/Technophile/Code/projects/quicksnip/content/docs/meta.json"},"data":{"title":"Docs","pages":["---Introduction---","index.mdx","installation.mdx","comparison.mdx","---Extensions---","...extensions","---Contributing---","...contributing"],"root":true}}, {"info":{"path":"contributing\\meta.json","absolutePath":"C:/Technophile/Code/projects/quicksnip/content/docs/contributing/meta.json"},"data":{"title":"Contributing","pages":["how-to-contribute","adding-snippets","modifying-snippets","third-party-apps"]}}, {"info":{"path":"extensions\\meta.json","absolutePath":"C:/Technophile/Code/projects/quicksnip/content/docs/extensions/meta.json"},"data":{"title":"Extensions","pages":["quicksnip","quicksnip-cli","quicksnip-vscode","quicksnip-raycast"]}}])
15+
export const docs = _runtime.docs<typeof _source.docs>([{ info: {"path":"comparison.mdx","absolutePath":"C:/Technophile/Code/projects/quicksnip/content/docs/comparison.mdx"}, data: docs_0 }, { info: {"path":"index.mdx","absolutePath":"C:/Technophile/Code/projects/quicksnip/content/docs/index.mdx"}, data: docs_1 }, { info: {"path":"installation.mdx","absolutePath":"C:/Technophile/Code/projects/quicksnip/content/docs/installation.mdx"}, data: docs_2 }, { info: {"path":"contributing\\adding-snippets.mdx","absolutePath":"C:/Technophile/Code/projects/quicksnip/content/docs/contributing/adding-snippets.mdx"}, data: docs_3 }, { info: {"path":"contributing\\how-to-contribute.mdx","absolutePath":"C:/Technophile/Code/projects/quicksnip/content/docs/contributing/how-to-contribute.mdx"}, data: docs_4 }, { info: {"path":"contributing\\modifying-snippets.mdx","absolutePath":"C:/Technophile/Code/projects/quicksnip/content/docs/contributing/modifying-snippets.mdx"}, data: docs_5 }, { info: {"path":"contributing\\third-party-apps.mdx","absolutePath":"C:/Technophile/Code/projects/quicksnip/content/docs/contributing/third-party-apps.mdx"}, data: docs_6 }, { info: {"path":"extensions\\quicksnip-cli.mdx","absolutePath":"C:/Technophile/Code/projects/quicksnip/content/docs/extensions/quicksnip-cli.mdx"}, data: docs_7 }, { info: {"path":"extensions\\quicksnip-raycast.mdx","absolutePath":"C:/Technophile/Code/projects/quicksnip/content/docs/extensions/quicksnip-raycast.mdx"}, data: docs_8 }, { info: {"path":"extensions\\quicksnip-vscode.mdx","absolutePath":"C:/Technophile/Code/projects/quicksnip/content/docs/extensions/quicksnip-vscode.mdx"}, data: docs_9 }, { info: {"path":"extensions\\quicksnip.mdx","absolutePath":"C:/Technophile/Code/projects/quicksnip/content/docs/extensions/quicksnip.mdx"}, data: docs_10 }], [{"info":{"path":"meta.json","absolutePath":"C:/Technophile/Code/projects/quicksnip/content/docs/meta.json"},"data":{"title":"Docs","pages":["---Introduction---","index.mdx","installation.mdx","comparison.mdx","---Extensions---","...extensions","---Contributing---","...contributing"],"root":true}}, {"info":{"path":"contributing\\meta.json","absolutePath":"C:/Technophile/Code/projects/quicksnip/content/docs/contributing/meta.json"},"data":{"title":"Contributing","pages":["how-to-contribute","adding-snippets","modifying-snippets","third-party-apps"]}}, {"info":{"path":"extensions\\meta.json","absolutePath":"C:/Technophile/Code/projects/quicksnip/content/docs/extensions/meta.json"},"data":{"title":"Extensions","pages":["quicksnip","quicksnip-cli","quicksnip-vscode","quicksnip-raycast"]}}])

package-lock.json

Lines changed: 31 additions & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

package.json

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -38,7 +38,8 @@
3838
"react-markdown": "^10.1.0",
3939
"react-syntax-highlighter": "^15.6.6",
4040
"remark-gfm": "^4.0.1",
41-
"tailwind-merge": "^3.3.1"
41+
"tailwind-merge": "^3.3.1",
42+
"zustand": "^5.0.8"
4243
},
4344
"devDependencies": {
4445
"@eslint/eslintrc": "^3",
Lines changed: 30 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,30 @@
1+
"use client";
2+
3+
import { useRouter } from "next/navigation";
4+
import { use } from "react";
5+
6+
interface Props {
7+
params: Promise<{ category: string; snippet: string }>;
8+
}
9+
10+
export default function SnippetDetail({ params }: Props) {
11+
const router = useRouter();
12+
const { category, snippet } = use(params);
13+
14+
return (
15+
<div className="fixed inset-0 z-50 flex items-center justify-center bg-black/50">
16+
<div className="bg-white p-6 rounded-lg shadow-lg w-[400px]">
17+
<h2 className="text-lg font-bold">{snippet}</h2>
18+
<p className="mt-2 text-sm text-gray-600">
19+
Snippet details for {category}/{snippet}
20+
</p>
21+
<button
22+
onClick={() => router.push("/snippets")}
23+
className="mt-4 px-4 py-2 rounded hover:bg-gray-300"
24+
>
25+
Close
26+
</button>
27+
</div>
28+
</div>
29+
);
30+
}
Lines changed: 18 additions & 23 deletions
Original file line numberDiff line numberDiff line change
@@ -1,31 +1,26 @@
1+
"use client";
2+
13
import SnippetList from "@/components/layouts/snippet-list";
4+
import { unslugify } from "@/lib/utils";
5+
import { useSnippetsStore } from "@/store/useSnippetsStore";
6+
import { use } from "react";
7+
8+
interface Props {
9+
params: Promise<{ category: string }>;
10+
}
211

3-
export default function Categories() {
4-
const sampleData = [
5-
{
6-
id: "truncate-string",
7-
category: "string-manipulation",
8-
title: "Reverse String",
9-
description: "Reverses the characters in a string.",
10-
languages: ["js", "cpp", "py"],
11-
contributors: ["technoph1le", "Vaibhav-kesarwani"],
12-
tags: ["string", "reverse"],
13-
},
14-
{
15-
id: "string-to-camel-case",
16-
category: "string-manipulation",
17-
title: "Convert String to Camel Case",
18-
description: "Converts a given string into camelCase.",
19-
languages: ["js", "java"],
20-
contributors: ["aumirza", "Mcbencrafter"],
21-
tags: ["string", "case"],
22-
},
23-
];
12+
export default function Categories({ params }: Props) {
13+
const { snippets } = useSnippetsStore();
14+
const { category } = use(params);
15+
16+
const filteredSnippets = snippets.filter(
17+
(snippet) => snippet.category === category
18+
);
2419

2520
return (
2621
<section className="space-y-4">
27-
<h2 className="text-2xl font-bold">String Manipulation</h2>
28-
<SnippetList snippets={sampleData} />
22+
<h2 className="text-2xl font-bold">{unslugify(category)}</h2>
23+
<SnippetList snippets={filteredSnippets} />
2924
</section>
3025
);
3126
}

src/app/snippets/page.tsx

Lines changed: 12 additions & 21 deletions
Original file line numberDiff line numberDiff line change
@@ -1,27 +1,18 @@
1+
"use client";
2+
13
import SnippetList from "@/components/layouts/snippet-list";
4+
import { useSnippetsStore } from "@/store/useSnippetsStore";
5+
import { useEffect } from "react";
26

37
export default function SnippetsPage() {
4-
const sampleData = [
5-
{
6-
id: "reverse-string",
7-
category: "string-manipulation",
8-
title: "Reverse String",
9-
description: "Reverses the characters in a string.",
10-
languages: ["js", "cpp", "py"],
11-
contributors: ["technoph1le", "Vaibhav-kesarwani"],
12-
tags: ["string", "reverse"],
13-
},
14-
{
15-
id: "string-to-camel-case",
16-
category: "string-manipulation",
17-
title: "Convert String to Camel Case",
18-
description: "Converts a given string into camelCase.",
19-
languages: ["js", "java"],
20-
contributors: ["aumirza", "Mcbencrafter"],
21-
tags: ["string", "case"],
22-
},
23-
];
8+
const { setSnippets, snippets } = useSnippetsStore();
9+
10+
useEffect(() => {
11+
fetch("/data/snippets/all.json")
12+
.then((res) => res.json())
13+
.then((data) => setSnippets(data));
14+
}, [setSnippets]);
2415

2516
// This is for showing all the snippets
26-
return <SnippetList snippets={sampleData} />;
17+
return <SnippetList snippets={snippets} />;
2718
}

src/components/layouts/snippet-sidebar.tsx

Lines changed: 80 additions & 70 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,5 @@
1+
"use client";
2+
13
import {
24
Sidebar,
35
SidebarContent,
@@ -10,101 +12,109 @@ import {
1012
SidebarMenuSubItem,
1113
SidebarRail,
1214
} from "@/components/ui/sidebar";
15+
import { unslugify } from "@/lib/utils";
16+
import { useSnippetsStore } from "@/store/useSnippetsStore";
1317
import Link from "next/link";
1418

15-
const categories = [
16-
{
17-
title: "Routing",
18-
url: "#",
19-
count: 23,
20-
},
21-
{
22-
title: "Data Fetching",
23-
url: "#",
24-
isActive: true,
25-
count: 86,
26-
},
27-
{
28-
title: "Rendering",
29-
url: "#",
30-
count: 34,
31-
},
32-
{
33-
title: "Caching",
34-
url: "#",
35-
count: 64,
36-
},
37-
{
38-
title: "Styling",
39-
url: "#",
40-
count: 98,
41-
},
42-
{
43-
title: "Optimizing",
44-
url: "#",
45-
count: 45,
46-
},
47-
{
48-
title: "Configuring",
49-
url: "#",
50-
count: 123,
51-
},
52-
{
53-
title: "Testing",
54-
url: "#",
55-
count: 56,
56-
},
57-
{
58-
title: "Authentication",
59-
url: "#",
60-
count: 87,
61-
},
62-
{
63-
title: "Deploying",
64-
url: "#",
65-
count: 234,
66-
},
67-
{
68-
title: "Upgrading",
69-
url: "#",
70-
count: 12,
71-
},
72-
{
73-
title: "Examples",
74-
url: "#",
75-
count: 56,
76-
},
77-
];
19+
// const categories = [
20+
// {
21+
// title: "Routing",
22+
// url: "/routing",
23+
// count: 23,
24+
// },
25+
// {
26+
// title: "Data Fetching",
27+
// url: "#",
28+
// isActive: true,
29+
// count: 86,
30+
// },
31+
// {
32+
// title: "Rendering",
33+
// url: "#",
34+
// count: 34,
35+
// },
36+
// {
37+
// title: "Caching",
38+
// url: "#",
39+
// count: 64,
40+
// },
41+
// {
42+
// title: "Styling",
43+
// url: "#",
44+
// count: 98,
45+
// },
46+
// {
47+
// title: "Optimizing",
48+
// url: "#",
49+
// count: 45,
50+
// },
51+
// {
52+
// title: "Configuring",
53+
// url: "#",
54+
// count: 123,
55+
// },
56+
// {
57+
// title: "Testing",
58+
// url: "#",
59+
// count: 56,
60+
// },
61+
// {
62+
// title: "Authentication",
63+
// url: "#",
64+
// count: 87,
65+
// },
66+
// {
67+
// title: "Deploying",
68+
// url: "#",
69+
// count: 234,
70+
// },
71+
// {
72+
// title: "Upgrading",
73+
// url: "#",
74+
// count: 12,
75+
// },
76+
// {
77+
// title: "Examples",
78+
// url: "#",
79+
// count: 56,
80+
// },
81+
// ];
7882

7983
export default function SnippetSidebar() {
84+
const { setCategory, categories } = useSnippetsStore();
85+
const cats = categories();
86+
8087
return (
8188
<Sidebar collapsible="none" className="border-r border-border">
8289
<SidebarContent>
8390
<SidebarGroup>
8491
<SidebarMenu>
8592
<SidebarMenuItem>
8693
<SidebarMenuButton asChild>
87-
<Link href="/snippets">All</Link>
94+
<Link href="/snippets" onClick={() => setCategory("All")}>
95+
All
96+
</Link>
8897
</SidebarMenuButton>
8998
</SidebarMenuItem>
9099
<SidebarMenuItem>
91100
<SidebarMenuButton asChild>
92101
<Link href="/snippets/categories">Categories</Link>
93102
</SidebarMenuButton>
94-
{categories.length ? (
103+
{cats.length ? (
95104
<SidebarMenuSub>
96-
{categories.map((item) => (
97-
<SidebarMenuSubItem key={item.title}>
105+
{cats.map((item) => (
106+
<SidebarMenuSubItem key={item.name}>
98107
<SidebarMenuSubButton
99108
className="py-4"
100109
asChild
101-
isActive={item.isActive}
110+
isActive={item.name === "current"}
102111
>
103112
<Link
104-
href={item.url}
113+
href={`/snippets/${item.name}`}
114+
onClick={() => setCategory(item.name)}
105115
className="flex items-center justify-between"
106116
>
107-
<span>{item.title}</span>
117+
<span>{unslugify(item.name)}</span>
108118
<span className="text-muted-foreground">
109119
{item.count}
110120
</span>

0 commit comments

Comments
 (0)