refactor: Swap in useRoute where possible

Author: rschristian

src/components/controllers/blog-page.jsx

@@ -1,4 +1,4 @@
-import { useRoute, useLocation } from 'preact-iso';
+import { useRoute } from 'preact-iso';
 import { useContent } from '../../lib/use-resource';
 import { useTitle, useDescription } from './utils';
 import { NotFound } from './not-found';
@@ -20,7 +20,7 @@ export default function BlogPage() {
 }
 
 function BlogLayout() {
-	const { path } = useLocation();
+	const { path } = useRoute();
 	const [lang] = useLanguage();
 
 	const { html, meta } = useContent([lang, path === '/' ? 'index' : path]);

src/components/controllers/doc-page.jsx

@@ -1,4 +1,4 @@
-import { useRoute, useLocation } from 'preact-iso';
+import { useRoute } from 'preact-iso';
 import { useContent } from '../../lib/use-resource';
 import { useTitle, useDescription } from './utils';
 import config from '../../config.json';
@@ -24,7 +24,7 @@ export function DocPage() {
 }
 
 export function DocLayout({ isGuide = false }) {
-	const { path } = useLocation();
+	const { path } = useRoute();
 	const [lang] = useLanguage();
 
 	const { html, meta } = useContent([lang, path === '/' ? 'index' : path]);

src/components/controllers/markdown-region.jsx

@@ -1,4 +1,4 @@
-import { useLocation } from 'preact-iso';
+import { useRoute } from 'preact-iso';
 import EditThisPage from '../edit-button';
 import ContentRegion from '../content-region';
 import BlogMeta from '../blog-meta';
@@ -10,7 +10,7 @@ import BlogMeta from '../blog-meta';
  * @propery {any} [components]
  */
 export function MarkdownRegion({ html, meta, components }) {
-	const { path } = useLocation();
+	const { path } = useRoute();
 
 	const canEdit = path !== '/' && !path.startsWith('/tutorial');
 	const isBlogArticle = path.startsWith('/blog/');

src/components/controllers/tutorial-page.jsx

@@ -1,4 +1,4 @@
-import { useRoute, useLocation } from 'preact-iso';
+import { useRoute } from 'preact-iso';
 import { SolutionProvider } from './tutorial/contexts';
 import { useContent } from '../../lib/use-resource';
 import { useTitle, useDescription } from './utils';
@@ -19,8 +19,7 @@ export default function TutorialPage() {
 }
 
 function TutorialLayout() {
-	const { path } = useLocation();
-	const { params } = useRoute();
+	const { path, params } = useRoute();
 	const [lang] = useLanguage();
 
 	const { html, meta } = useContent([lang, !params.step ? 'tutorial/index' : path]);

src/components/controllers/tutorial/index.jsx

@@ -8,7 +8,7 @@ import {
 	useMemo,
 	useCallback
 } from 'preact/hooks';
-import { useLocation } from 'preact-iso';
+import { useRoute } from 'preact-iso';
 import linkState from 'linkstate';
 import { TutorialContext, SolutionContext } from './contexts';
 import cx from '../../../lib/cx';
@@ -168,7 +168,7 @@ function TutorialView({
 
 	const [showCodeOverride, toggleCode] = useReducer(s => !s, true);
 
-	const { url } = useLocation();
+	const { path } = useRoute();
 	const [lang] = useLanguage();
 	const { solved } = useContext(SolutionContext);
 
@@ -183,7 +183,7 @@ function TutorialView({
 		if (!loading && !initialLoad) {
 			content.current.scrollTo(0, 0);
 		}
-	}, [url, loading, initialLoad]);
+	}, [path, loading, initialLoad]);
 
 	const reRun = useCallback(() => {
 		let code = tutorial.state.code;
@@ -211,7 +211,7 @@ function TutorialView({
 								<div class={style.output} key="output">
 									{!initialLoad && (
 										<Runner
-											key={url}
+											key={path}
 											ref={tutorial.runner}
 											onSuccess={tutorial.onSuccess}
 											onRealm={tutorial.onRealm}
@@ -226,7 +226,7 @@ function TutorialView({
 												close
 											</button>
 											<ErrorOverlay
-												key={'e:' + url}
+												key={'e:' + path}
 												class={style.error}
 												name={error.name}
 												message={error.message}
@@ -298,7 +298,7 @@ function TutorialView({
 			</Splitter>
 
 			<InjectPrerenderData
-				name={url}
+				name={path}
 				data={{
 					html,
 					meta

src/components/doc-version/index.jsx

@@ -10,8 +10,9 @@ export const AVAILABLE_DOCS = ['10', '8'];
  * Select box to switch the currently displayed docs version
  */
 export default function DocVersion() {
-	const { path, route } = useLocation();
-	const { version, name } = useRoute().params;
+	const { route } = useLocation();
+	const { params, path } = useRoute();
+	const { version, name } = params;
 
 	const onChange = useCallback(
 		e => {

src/components/edit-button/index.jsx

@@ -1,9 +1,9 @@
-import { useLocation } from 'preact-iso';
+import { useRoute } from 'preact-iso';
 import { useLanguage } from '../../lib/i18n';
 import style from './style.module.css';
 
 export default function EditThisPage({ isFallback }) {
-	let { path } = useLocation();
+	let { path } = useRoute();
 	const [lang] = useLanguage();
 
 	path = !isFallback ? path + '.md' : '';

src/components/footer/index.jsx

@@ -1,6 +1,6 @@
 import config from '../../config.json';
 import { useState, useEffect, useCallback } from 'preact/hooks';
-import { useLocation } from 'preact-iso';
+import { useRoute } from 'preact-iso';
 import style from './style.module.css';
 import { useLanguage } from '../../lib/i18n';
 
@@ -42,8 +42,8 @@ function useContributors(deps) {
 }
 
 export default function Footer() {
-	const { url } = useLocation();
-	const contrib = useContributors([url]);
+	const { path } = useRoute();
+	const contrib = useContributors([path]);
 	const [lang, setLang] = useLanguage();
 
 	const onSelect = useCallback(e => setLang(e.target.value), [setLang]);

src/components/sidebar/sidebar-nav.jsx

@@ -1,4 +1,4 @@
-import { useLocation } from 'preact-iso';
+import { useRoute } from 'preact-iso';
 import cx from '../../lib/cx';
 import style from './sidebar-nav.module.css';
 
@@ -13,7 +13,7 @@ import style from './sidebar-nav.module.css';
  * @param {SidebarNavProps} props
  */
 export default function SidebarNav({ items, onClick }) {
-	const { path } = useLocation();
+	const { path } = useRoute();
 
 	return (
 		<nav