Add feature order cycle guide

src/app/hooks/useAsync.ts

@@ -7,12 +7,15 @@ export function useAsync<R>(
 	fn: () => Promise<R | typeof AsyncCancel>,
 	inputs: Inputs = [],
 	initialState: AsyncState<R> = { loading: true },
-): AsyncState<R> {
+): AsyncState<R> & { refresh: () => Promise<unknown> } {
 	const [state, callback] = useAsyncFn<R, () => Promise<R | typeof AsyncCancel>>(fn, inputs, initialState)
 
 	useEffect(() => {
 		callback()
 	}, [callback])
 
-	return state
+	return {
+		...state,
+		refresh: callback,
+	}
 }

src/app/pages/Guide.tsx

@@ -30,11 +30,17 @@ export function Guide({ id }: Props) {
 	const { version, changeVersion } = useVersion()
 	const { changeTitle } = useTitle()
 
-	const { value: content } = useAsync(async () => {
+	const { value: content, refresh } = useAsync(async () => {
 		const res = await fetch(`../../guides/${id}.md`)
 		return await res.text()
 	}, [id])
 
+	if ((import.meta as any).hot) {
+		(import.meta as any).hot.on('guide-update', (updateId: string) => {
+			if (id === updateId) refresh()
+		})
+	}
+
 	const frontMatter = useMemo(() => {
 		if (!content) return undefined
 		const data = parseFrontMatter(content)