split list up

Author: kentcdodds

exercises/03.resources/02.problem.template/README.mdx

@@ -17,17 +17,8 @@ import { ResourceTemplate } from '@modelcontextprotocol/sdk/server/mcp.js'
 agent.server.resource(
 	'hello',
 	new ResourceTemplate('hello://{name}', {
-		list: async () => {
-			// Imagine this is a call to your database to get all names
-			const names = await db.getAllNames()
-			return {
-				resources: names.map((name) => ({
-					name,
-					uri: `hello://${name}`,
-					mimeType: 'text/plain',
-				})),
-			}
-		},
+		// this is required to be specified, but we'll implement it later...
+		list: undefined,
 	}),
 	{ description: 'Say hello to anyone by name!' },
 	async (uri, { name }) => {
@@ -44,20 +35,10 @@ agent.server.resource(
 )
 ```
 
-Notice how the `list` callback queries the database and returns a resource
-listing for each name. This pattern is exactly what you'll use to expose entries
-and tags from your own database.
-
-<callout-success>
-	The reason for the `list` callback is to make it easy for clients to get a
-	list of available resources without having to know the exact URIs and without
-	having to request the entire resource (notice we only return the name, URI,
-	and type in the `list` callback).
-</callout-success>
-
 Your goal in this step:
 
 - Use resource templates to expose entries and tags from your database, each
   accessible by a unique URI.
-- Make sure clients can list all available entries and tags (using the `list`
-  callback), and read the details for any specific one.
+
+Test this out by creating a new entry or tag in your database and then using the
+inspector to see the one you created.

exercises/03.resources/02.problem.template/src/resources.ts

@@ -25,7 +25,6 @@ export async function initializeResources(agent: EpicMeMCP) {
 	// 🐨 create two resources with a ResourceTemplate:
 	// - entry - URI: epicme://entries/{id}
 	// - tag - URI: epicme://tags/{id}
-	// 🐨 each should have a list method that returns all the entries and tags (respectively)
 	// 🐨 each should have a description
 	// 🐨 each should have a callback that reads the entry or tag for the given id
 	// 🐨 return contents with mimeType application/json and the entry or tag

exercises/03.resources/02.solution.template/README.mdx

@@ -1,20 +1,17 @@
 # Resource Templates
 
 👨‍💼 Fantastic work! You've just leveled up your MCP server by implementing
-dynamic resource templates with a list callback. Now your server can expose
-entire collections of resources—like entries and tags—making them discoverable
-and accessible to clients and LLMs alike.
+dynamic resource templates. Now your server can expose entire collections of
+resources—like entries and tags—making them discoverable and accessible to
+clients and LLMs alike.
 
 This is a huge step toward building rich, interactive, and context-aware
-applications. By leveraging resource templates and the list callback, you've
-made it possible for clients to browse, search, and retrieve structured data on
-demand.
+applications. By leveraging resource templates, you've made it possible for
+clients to browse, search, and retrieve structured data on demand.
 
 Key takeaways from this step:
 
 - How to define parameterized resource templates
-- How to implement a list callback to dynamically enumerate resources from your
-  database
 - How to make individual resources accessible by unique URIs
 
 You're well on your way to building a truly powerful and flexible MCP server.

exercises/03.resources/02.solution.template/src/resources.ts

@@ -24,16 +24,7 @@ export async function initializeResources(agent: EpicMeMCP) {
 	agent.server.resource(
 		'tag',
 		new ResourceTemplate('epicme://tags/{id}', {
-			list: async () => {
-				const tags = await agent.db.getTags()
-				return {
-					resources: tags.map((tag) => ({
-						name: tag.name,
-						uri: `epicme://tags/${tag.id}`,
-						mimeType: 'application/json',
-					})),
-				}
-			},
+			list: undefined,
 		}),
 		{ description: 'A single tag' },
 		async (uri, { id }) => {
@@ -54,16 +45,7 @@ export async function initializeResources(agent: EpicMeMCP) {
 	agent.server.resource(
 		'entry',
 		new ResourceTemplate('epicme://entries/{id}', {
-			list: async () => {
-				const entries = await agent.db.getEntries()
-				return {
-					resources: entries.map((entry) => ({
-						name: entry.title,
-						uri: `epicme://entries/${entry.id}`,
-						mimeType: 'application/json',
-					})),
-				}
-			},
+			list: undefined,
 		}),
 		{ description: 'A single entry' },
 		async (uri, { id }) => {

exercises/03.resources/03.problem.list/README.mdx

@@ -0,0 +1,45 @@
+# Resource Templates List
+
+👨‍💼 Our users want to be able to see a list of all entries and tags. So let's
+implement the `list` callback for our resource templates.
+
+```ts
+import { ResourceTemplate } from '@modelcontextprotocol/sdk/server/mcp.js'
+
+agent.server.resource(
+	'hello',
+	new ResourceTemplate('hello://{name}', {
+		list: async () => {
+			// Imagine this is a call to your database to get all names
+			const names = await db.getAllNames()
+			return {
+				resources: names.map((name) => ({
+					name,
+					uri: `hello://${name}`,
+					mimeType: 'text/plain',
+					// note this does not include the contents of the resource
+				})),
+			}
+		},
+	}),
+	// ...
+)
+```
+
+Notice how the `list` callback queries the database and returns a resource
+listing for each name. This pattern is exactly what you'll use to expose entries
+and tags from your own database.
+
+<callout-success>
+	The reason for the `list` callback is to make it easy for clients to get a
+	list of available resources without having to know the exact URIs and without
+	having to request the entire resource (notice we only return the name, URI,
+	and type in the `list` callback).
+</callout-success>
+
+Your goal in this step:
+
+- Use resource templates to expose entries and tags from your database, each
+  accessible by a unique URI.
+- Make sure clients can list all available entries and tags (using the `list`
+  callback), and read the details for any specific one.

exercises/03.resources/03.problem.list/package.json

@@ -0,0 +1,28 @@
+{
+  "name": "exercises_03.resources_02.solution.template",
+  "private": true,
+  "type": "module",
+  "scripts": {
+    "dev": "mcp-dev",
+    "dev:mcp": "tsx src/index.ts",
+    "test": "vitest",
+    "typecheck": "tsc",
+    "inspect": "mcp-inspector"
+  },
+  "dependencies": {
+    "@epic-web/invariant": "^1.0.0",
+    "@modelcontextprotocol/sdk": "^1.11.0",
+    "zod": "^3.24.3"
+  },
+  "devDependencies": {
+    "@epic-web/config": "^1.19.0",
+    "@epic-web/mcp-dev": "*",
+    "@faker-js/faker": "^9.8.0",
+    "@modelcontextprotocol/inspector": "^0.13.0",
+    "@types/node": "^22.15.2",
+    "tsx": "^4.19.3",
+    "typescript": "^5.8.3",
+    "vitest": "^3.1.2"
+  },
+  "license": "GPL-3.0-only"
+}