Niedzielski has uploaded a new change for review. (
https://gerrit.wikimedia.org/r/378197 )
Change subject: Update: allow URL to be derived from Route
......................................................................
Update: allow URL to be derived from Route
Bug: T173323
Change-Id: I7aa87b563a8348f8d0009cbfe08b0eb5b2f99c0b
---
M src/common/components/app/app.tsx
M src/common/routers/api.ts
M src/common/routers/route.ts
M src/common/routers/router.ts
4 files changed, 57 insertions(+), 38 deletions(-)
git pull ssh://gerrit.wikimedia.org:29418/marvin refs/changes/97/378197/1
diff --git a/src/common/components/app/app.tsx
b/src/common/components/app/app.tsx
index 250e0d0..df006bd 100644
--- a/src/common/components/app/app.tsx
+++ b/src/common/components/app/app.tsx
@@ -1,5 +1,6 @@
import "./app.css";
import { ComponentProps, h } from "preact";
+import { about, index, wiki } from "../../../common/routers/api";
import Link from "../link";
export default function App({ children }: ComponentProps<any>): JSX.Element {
@@ -7,16 +8,16 @@
<div class="App">
<ul>
<li>
- <Link href="/">Home</Link>
+ <Link href={index.url()}>Home</Link>
</li>
<li>
- <Link href="/about">About</Link>
+ <Link href={about.url()}>About</Link>
</li>
<li>
- <Link href="/wiki/Banana">Banana</Link>
+ <Link href={wiki.url({ title: "Banana" })}>Banana</Link>
</li>
<li>
- <Link href="/wiki/Cucumber">Cucumber</Link>
+ <Link href={wiki.url({ title: "Cucumber" })}>Cucumber</Link>
</li>
<li>
<Link href="/404">404</Link>
diff --git a/src/common/routers/api.ts b/src/common/routers/api.ts
index 39c9acc..c4855b2 100644
--- a/src/common/routers/api.ts
+++ b/src/common/routers/api.ts
@@ -1,38 +1,34 @@
-import { Route } from "./route";
+import { AnyRoute, Route, newRoute } from "./route";
import { Props as WikiProps } from "../pages/wiki";
-export const index: Route<void, void> = {
+export const index: Route = newRoute({
path: "/",
endpoint: () =>
import(/* webpackChunkName: "pages/index" */ "../pages/index"),
- chunkName: "pages/index",
- status: 200
-};
+ chunkName: "pages/index"
+});
-export const about: Route<void, void> = {
+export const about: Route = newRoute({
path: "/about",
endpoint: () =>
import(/* webpackChunkName: "pages/about" */ "../pages/about"),
- chunkName: "pages/about",
- status: 200
-};
+ chunkName: "pages/about"
+});
-export const wiki: Route<WikiProps, void> = {
+export const wiki: Route<WikiProps, void, { title: string }> = newRoute({
path: "/wiki/:title",
endpoint: () => import(/* webpackChunkName: "pages/wiki" */ "../pages/wiki"),
- chunkName: "pages/wiki",
- status: 200
-};
+ chunkName: "pages/wiki"
+});
-export const styleGuide: Route<void, void> = {
+export const styleGuide: Route = newRoute({
path: "/dev/style-guide",
endpoint: () =>
import(/* webpackChunkName: "pages/style-guide" */ "../pages/style-guide"),
- chunkName: "pages/style-guide",
- status: 200
-};
+ chunkName: "pages/style-guide"
+});
-export const notFound: Route<void, void> = {
+export const notFound: Route = newRoute({
// `(.*)` is the new `*`. See
// https://github.com/pillarjs/path-to-regexp/issues/37.
path: "(.*)",
@@ -40,12 +36,6 @@
import(/* webpackChunkName: "pages/not-found" */ "../pages/not-found"),
chunkName: "pages/not-found",
status: 404
-};
+});
-export const routes: Route<any, any>[] = [
- index,
- about,
- wiki,
- styleGuide,
- notFound
-];
+export const routes: AnyRoute[] = [index, about, wiki, styleGuide, notFound];
diff --git a/src/common/routers/route.ts b/src/common/routers/route.ts
index fd49c66..af75f4b 100644
--- a/src/common/routers/route.ts
+++ b/src/common/routers/route.ts
@@ -1,10 +1,11 @@
+import * as pathToRegExp from "path-to-regexp";
import { AnyComponent } from "preact";
export interface RouteParameters {
[name: string]: string;
}
-export interface Endpoint<Props, State> {
+export interface Endpoint<Props = void, State = void> {
/** A Preact view component. */
Component: AnyComponent<Props, State>;
@@ -15,9 +16,32 @@
initialProps?: (parameters: RouteParameters) => Promise<Props>;
}
-export interface Route<Props, State> {
+export interface RouteConfiguration<Props = void, State = void> {
path: string;
endpoint: () => Promise<Endpoint<Props, State>>;
chunkName: string;
- status: number;
+ status?: number;
}
+
+export interface Route<Props = void, State = void, Parameters = void>
+ extends RouteConfiguration<Props, State> {
+ status: number;
+
+ /** Generates a URL from parameters. */
+ url: (properties?: Parameters) => string;
+}
+
+export type AnyRoute = Route<any, any, any>;
+
+export const newRoute = <Props, State, Parameters>({
+ path,
+ endpoint,
+ chunkName,
+ status = 200
+}: RouteConfiguration<Props, State>): Route<Props, State, Parameters> => ({
+ path,
+ endpoint,
+ chunkName,
+ status,
+ url: pathToRegExp.compile(path)
+});
diff --git a/src/common/routers/router.ts b/src/common/routers/router.ts
index 2f7c852..695329d 100644
--- a/src/common/routers/router.ts
+++ b/src/common/routers/router.ts
@@ -1,5 +1,9 @@
import * as pathToRegExp from "path-to-regexp";
-import { Endpoint, Route, RouteParameters } from "../../common/routers/route";
+import {
+ AnyRoute,
+ Endpoint,
+ RouteParameters
+} from "../../common/routers/route";
import { AnyComponent } from "preact";
export interface RouteResponse<Props, State> {
@@ -18,13 +22,13 @@
route(url: string): Promise<RouteResponse<any, any>>;
}
-interface ParsedRoute extends Route<any, any> {
+interface ParsedRoute extends AnyRoute {
parameterNames: pathToRegExp.Key[];
regularExpression: RegExp;
}
-const parseRoutes = (routes: Route<any, any>[]) =>
- routes.map((route: Route<any, any>): ParsedRoute => {
+const parseRoutes = (routes: AnyRoute[]) =>
+ routes.map((route: AnyRoute): ParsedRoute => {
const parameterNames: pathToRegExp.Key[] = [];
return {
...route,
@@ -79,7 +83,7 @@
}))
);
-export const newRouter = (routes: Route<any, any>[]): Router => {
+export const newRouter = (routes: AnyRoute[]): Router => {
const parsedRoutes: ParsedRoute[] = parseRoutes(routes);
return {
--
To view, visit https://gerrit.wikimedia.org/r/378197
To unsubscribe, visit https://gerrit.wikimedia.org/r/settings
Gerrit-MessageType: newchange
Gerrit-Change-Id: I7aa87b563a8348f8d0009cbfe08b0eb5b2f99c0b
Gerrit-PatchSet: 1
Gerrit-Project: marvin
Gerrit-Branch: master
Gerrit-Owner: Niedzielski <sniedziel...@wikimedia.org>
Gerrit-Reviewer: Sniedzielski <sniedziel...@wikimedia.org>
_______________________________________________
MediaWiki-commits mailing list
MediaWiki-commits@lists.wikimedia.org
https://lists.wikimedia.org/mailman/listinfo/mediawiki-commits
