async local storage

exercises/05.middle/01.problem.middle/server/rsc.js

@@ -17,7 +17,9 @@ app.use(compress())
 const moduleBasePath = new URL('../src', import.meta.url).href
 
 async function renderApp(res, returnValue) {
-	const root = h(Document)
+	const shipId = '6c86fca8b9086'
+	const search = ''
+	const root = h(Document, { shipId, search })
 	// For client-invoked server actions we refresh the tree and return a return value.
 	const payload = returnValue ? { returnValue, root } : root
 	const { pipe } = renderToPipeableStream(payload, moduleBasePath)

exercises/05.middle/01.problem.middle/src/app.js

@@ -4,7 +4,7 @@ import { SearchResults, SearchResultsFallback } from './ship-search-results.js'
 
 const shipFallbackSrc = '/img/fallback-ship.png'
 
-export async function Document() {
+export async function Document({ shipId, search }) {
 	return h(
 		'html',
 		{ lang: 'en' },
@@ -20,13 +20,15 @@ export async function Document() {
 			h('link', { rel: 'stylesheet', href: '/style.css' }),
 			h('link', { rel: 'icon', type: 'image/svg+xml', href: '/favicon.svg' }),
 		),
-		h('body', null, h('div', { className: 'app-wrapper' }, h(App))),
+		h(
+			'body',
+			null,
+			h('div', { className: 'app-wrapper' }, h(App, { shipId, search })),
+		),
 	)
 }
 
-export function App() {
-	const shipId = '6c86fca8b9086'
-	const search = ''
+export function App({ shipId, search }) {
 	return h(
 		'div',
 		{ className: 'app' },

exercises/06.server-context/01.problem.async-local-storage/.gitignore

@@ -0,0 +1 @@
+node_modules

exercises/06.server-context/01.problem.async-local-storage/.prettierignore

@@ -0,0 +1,3 @@
+node_modules
+package-lock.json
+built_node_modules

exercises/06.server-context/01.problem.async-local-storage/.prettierrc

@@ -0,0 +1,28 @@
+{
+	"arrowParens": "avoid",
+	"bracketSameLine": false,
+	"bracketSpacing": true,
+	"embeddedLanguageFormatting": "auto",
+	"endOfLine": "lf",
+	"htmlWhitespaceSensitivity": "css",
+	"insertPragma": false,
+	"jsxSingleQuote": false,
+	"printWidth": 80,
+	"proseWrap": "always",
+	"quoteProps": "as-needed",
+	"requirePragma": false,
+	"semi": false,
+	"singleAttributePerLine": false,
+	"singleQuote": true,
+	"tabWidth": 2,
+	"trailingComma": "all",
+	"useTabs": true,
+	"overrides": [
+		{
+			"files": ["**/*.json"],
+			"options": {
+				"useTabs": false
+			}
+		}
+	]
+}

exercises/06.server-context/01.problem.async-local-storage/README.mdx

@@ -0,0 +1 @@
+# Async Local Storage

exercises/06.server-context/01.problem.async-local-storage/db/ship-api.js

@@ -0,0 +1,47 @@
+import fs from 'node:fs/promises'
+
+const shipData = JSON.parse(
+	String(await fs.readFile(new URL('./ships.json', import.meta.url))),
+)
+
+export async function searchShips({
+	query,
+	delay = Math.random() * 200 + 300,
+}) {
+	const endTime = Date.now() + delay
+	const ships = shipData
+		.filter(ship => ship.name.toLowerCase().includes(query.toLowerCase()))
+		.slice(0, 13)
+	await new Promise(resolve => setTimeout(resolve, endTime - Date.now()))
+	return {
+		ships: ships.map(ship => ({ name: ship.name, id: ship.id })),
+	}
+}
+
+export async function getShip({ shipId, delay = Math.random() * 200 + 300 }) {
+	const endTime = Date.now() + delay
+	if (!shipId) {
+		throw new Error('No shipId provided')
+	}
+	const ship = shipData.find(ship => ship.id === shipId)
+	await new Promise(resolve => setTimeout(resolve, endTime - Date.now()))
+	if (!ship) {
+		throw new Error(`No ship with the id "${shipId}"`)
+	}
+	return ship
+}
+
+export async function updateShipName({
+	shipId,
+	shipName,
+	delay = Math.random() * 200 + 300,
+}) {
+	const endTime = Date.now() + delay
+	const ship = shipData.find(ship => ship.id === shipId)
+	await new Promise(resolve => setTimeout(resolve, endTime - Date.now()))
+	if (!ship) {
+		throw new Error(`No ship with the id "${shipId}"`)
+	}
+	ship.name = shipName
+	return ship
+}