jenkins-bot has submitted this change and it was merged. (
https://gerrit.wikimedia.org/r/382449 )
Change subject: New: render pages
......................................................................
New: render pages
Styling will come in T173330. A common component for header, footer, and
last modified will come in T173326.
Bug: T173328
Change-Id: Ib2eeedf4b1f8f73837af332329738c7a3f7c24b3
---
A src/common/components/dynamic-header/dynamic-header.tsx
A src/common/components/section.tsx
M src/common/pages/home.tsx
M src/common/pages/wiki.tsx
4 files changed, 73 insertions(+), 4 deletions(-)
Approvals:
Niedzielski: Looks good to me, approved
jenkins-bot: Verified
diff --git a/src/common/components/dynamic-header/dynamic-header.tsx
b/src/common/components/dynamic-header/dynamic-header.tsx
new file mode 100644
index 0000000..dbca970
--- /dev/null
+++ b/src/common/components/dynamic-header/dynamic-header.tsx
@@ -0,0 +1,12 @@
+import { h } from "preact";
+import { ChildrenProps, ClassProps, classOf } from "../preact-utils";
+
+export default function DynamicHeader({
+ level,
+ children,
+ ...props
+}: { level: number } & ChildrenProps & ClassProps): JSX.Element {
+ const classes = classOf("DynamicHeader", props.class);
+ const Header = level <= 0 ? "div" : `h${Math.min(level, 6)}`;
+ return <Header class={classes}>{children}</Header>;
+}
diff --git a/src/common/components/section.tsx
b/src/common/components/section.tsx
new file mode 100644
index 0000000..dadd74c
--- /dev/null
+++ b/src/common/components/section.tsx
@@ -0,0 +1,20 @@
+import { h } from "preact";
+import { PageSection } from "../models/page/page";
+import Content from "./content/content";
+import DynamicHeader from "./dynamic-header/dynamic-header";
+
+export interface Props {
+ section: PageSection;
+}
+
+export default function Section({ section }: Props): JSX.Element {
+ return (
+ <section class="Section">
+ <DynamicHeader class="Section-title" level={section.level}>
+ <Content dangerouslySetInnerHTML={{ __html: section.titleHTML }} />
+ </DynamicHeader>
+
+ <Content dangerouslySetInnerHTML={{ __html: section.contentHTML }} />
+ </section>
+ );
+}
diff --git a/src/common/pages/home.tsx b/src/common/pages/home.tsx
index 7ca4a95..bb478eb 100644
--- a/src/common/pages/home.tsx
+++ b/src/common/pages/home.tsx
@@ -26,13 +26,25 @@
},
{
title: "Bill_&_Ted's_Excellent_Adventure",
- text: "With two paragraphs"
+ text: "With two paragraphs, unencoded path, and styled title"
}
];
const testPages = [
{
title: "Ice_cream",
text: "A normal article"
+ },
+ {
+ title: "Cake_(disambiguation)",
+ text: "Disambiguation"
+ },
+ {
+ title: "Cheese_cake",
+ text: "Redirect"
+ },
+ {
+ title: "Carrot cake",
+ text: "Encoding redirect"
}
];
return (
diff --git a/src/common/pages/wiki.tsx b/src/common/pages/wiki.tsx
index af7e8d6..b99dc23 100644
--- a/src/common/pages/wiki.tsx
+++ b/src/common/pages/wiki.tsx
@@ -1,7 +1,12 @@
import { h } from "preact";
import App from "../components/app/app";
+import Content from "../components/content/content";
+import { Page as PageModel } from "../models/page/page";
import { PageTitleID, PageTitlePath } from "../models/page/title";
+import Page from "../components/page/page";
import { RouteParams } from "../routers/route";
+import { requestPage } from "../data-clients/page-data-client";
+import Section from "../components/section";
export interface Params extends RouteParams {
/**
@@ -12,10 +17,30 @@
}
export interface Props {
- title: string;
+ page: PageModel;
}
export const getInitialProps = ({ title }: Params): Promise<Props> =>
- Promise.resolve({ title });
+ requestPage({ titlePath: title }).then(page => ({ page }));
-export const Component = ({ title }: Props): JSX.Element => <App>{title}</App>;
+export const Component = ({ page }: Props): JSX.Element => (
+ <App>
+ <Page
+ title={<Title page={page} />}
+ subtitle={page.descriptionText}
+ footer={<Footer page={page} />}
+ >
+ {page.sections.map(section => <Section section={section} />)}
+ </Page>
+ </App>
+);
+
+const Title = ({ page }: Props) => (
+ <Content>
+ <h1 dangerouslySetInnerHTML={{ __html: page.titleHTML }} />
+ </Content>
+);
+
+const Footer = ({ page }: Props) => (
+ <span>Last updated {page.lastModified.toLocaleString("en-GB")}</span>
+);
--
To view, visit https://gerrit.wikimedia.org/r/382449
To unsubscribe, visit https://gerrit.wikimedia.org/r/settings
Gerrit-MessageType: merged
Gerrit-Change-Id: Ib2eeedf4b1f8f73837af332329738c7a3f7c24b3
Gerrit-PatchSet: 3
Gerrit-Project: marvin
Gerrit-Branch: master
Gerrit-Owner: Niedzielski <[email protected]>
Gerrit-Reviewer: Jhernandez <[email protected]>
Gerrit-Reviewer: Niedzielski <[email protected]>
Gerrit-Reviewer: Sniedzielski <[email protected]>
Gerrit-Reviewer: jenkins-bot <>
_______________________________________________
MediaWiki-commits mailing list
[email protected]
https://lists.wikimedia.org/mailman/listinfo/mediawiki-commits
