Cleaned up pages

clintonwoo · Mar 28, 2020 · be81320 · be81320
1 parent cf85f47
commit be81320
Show file tree

Hide file tree

Showing 41 changed files with 1,229 additions and 1,217 deletions.
diff --git a/pages/active.tsx b/pages/active.tsx
@@ -5,19 +5,20 @@ import { sampleData } from '../src/data/sample-data';
 import { withDataAndRouter } from '../src/helpers/with-data';
 import { MainLayout } from '../src/layouts/main-layout';
 
-export const ActivePage = withDataAndRouter((props) => {
-  const pageNumber = (props.router.query && +props.router.query.p) || 0;
+export function ActivePage(props): JSX.Element {
+  const { router } = props;
+  const pageNumber = (router.query && +router.query.p) || 0;
 
   return (
-    <MainLayout currentUrl={props.router.pathname}>
+    <MainLayout currentUrl={router.pathname}>
       <NewsFeedView
-        currentUrl={props.router.pathname}
+        currentUrl={router.pathname}
         first={30}
         newsItems={sampleData.newsItems}
         skip={pageNumber * 30}
       />
     </MainLayout>
   );
-});
+}
 
-export default ActivePage;
+export default withDataAndRouter(ActivePage);
diff --git a/pages/ask.tsx b/pages/ask.tsx
@@ -25,19 +25,20 @@ export interface IAskPageProps {
   };
 }
 
-export const AskPage = withDataAndRouter((props) => {
-  const pageNumber = (props.router.query && +props.router.query.p) || 0;
+export function AskPage(props): JSX.Element {
+  const { router } = props;
+  const pageNumber = (router.query && +router.query.p) || 0;
 
   const first = POSTS_PER_PAGE;
   const skip = POSTS_PER_PAGE * pageNumber;
 
   const { data } = useQuery(query, { variables: { first, skip, type: FeedType.ASK } });
 
   return (
-    <MainLayout currentUrl={props.router.pathname}>
-      <NewsFeed data={data} currentUrl={props.router.pathname} first={first} skip={skip} />
+    <MainLayout currentUrl={router.pathname}>
+      <NewsFeed data={data} currentUrl={router.pathname} first={first} skip={skip} />
     </MainLayout>
   );
-});
+}
 
-export default AskPage;
+export default withDataAndRouter(AskPage);
diff --git a/pages/best.tsx b/pages/best.tsx
@@ -25,19 +25,21 @@ export interface IBestNewsFeedProps {
   };
 }
 
-export const BestPage = withDataAndRouter((props) => {
-  const pageNumber = (props.router.query && +props.router.query.p) || 0;
+export function BestPage(props): JSX.Element {
+  const { router } = props;
+
+  const pageNumber = (router.query && +router.query.p) || 0;
 
   const first = POSTS_PER_PAGE;
   const skip = POSTS_PER_PAGE * pageNumber;
 
   const { data } = useQuery(query, { variables: { first, skip, type: FeedType.BEST } });
 
   return (
-    <MainLayout currentUrl={props.router.pathname}>
-      <NewsFeed data={data} currentUrl={props.router.pathname} first={first} skip={skip} />
+    <MainLayout currentUrl={router.pathname}>
+      <NewsFeed data={data} currentUrl={router.pathname} first={first} skip={skip} />
     </MainLayout>
   );
-});
+}
 
-export default BestPage;
+export default withDataAndRouter(BestPage);
diff --git a/pages/bestcomments.tsx b/pages/bestcomments.tsx
@@ -5,19 +5,21 @@ import { sampleData } from '../src/data/sample-data';
 import { withDataAndRouter } from '../src/helpers/with-data';
 import { MainLayout } from '../src/layouts/main-layout';
 
-export const BestCommentsPage = withDataAndRouter((props) => {
-  const pageNumber = (props.router.query && +props.router.query.p) || 0;
+export function BestCommentsPage(props): JSX.Element {
+  const { router } = props;
+
+  const pageNumber = (router.query && +router.query.p) || 0;
 
   return (
-    <MainLayout currentUrl={props.router.pathname}>
+    <MainLayout currentUrl={router.pathname}>
       <NewsFeedView
-        currentUrl={props.router.pathname}
+        currentUrl={router.pathname}
         first={30}
         newsItems={sampleData.newsItems}
         skip={pageNumber * 30}
       />
     </MainLayout>
   );
-});
+}
 
-export default BestCommentsPage;
+export default withDataAndRouter(BestCommentsPage);
diff --git a/pages/bookmarklet.tsx b/pages/bookmarklet.tsx
@@ -3,47 +3,49 @@ import * as React from 'react';
 
 import { NoticeLayout } from '../src/layouts/notice-layout';
 
-export const BookmarkletPage = (props) => (
-  <NoticeLayout>
-    <b>Bookmarklet</b>
-    <br />
-    <br />
-    <div id="main">
-      <p id="first">
-        Thanks to Phil Kast for writing this bookmarklet for submitting links to{' '}
-        <Link href="/">
-          <a>Hacker News</a>
-        </Link>
-        . When you click on the bookmarklet, it will submit the page you&#39;re on. To install, drag
-        this link to your browser toolbar:
-        <br />
-        <br />
-      </p>
-      <div style={{ textAlign: 'center' }}>
-        <a
-          style={{ color: '#777', fontSize: '2em' }}
-          href="javascript:window.location=%22http://news.ycombinator.com/submitlink?u=%22+encodeURIComponent(document.location)+%22&amp;t=%22+encodeURIComponent(document.title)"
-        >
-          post to HN
-        </a>
-      </div>
+export function BookmarkletPage(props): JSX.Element {
+  return (
+    <NoticeLayout>
+      <b>Bookmarklet</b>
       <br />
       <br />
-      <table style={{ padding: '0px', backgroundColor: '#ff6600', width: '100%' }}>
-        <tbody>
-          <tr style={{ height: '0px' }}>
-            <td style={{ padding: '0px' }} />
-          </tr>
-        </tbody>
-      </table>
-      <p style={{ textAlign: 'center' }}>
-        <span className="foot">
+      <div id="main">
+        <p id="first">
+          Thanks to Phil Kast for writing this bookmarklet for submitting links to{' '}
+          <Link href="/">
+            <a>Hacker News</a>
+          </Link>
+          . When you click on the bookmarklet, it will submit the page you&#39;re on. To install,
+          drag this link to your browser toolbar:
           <br />
           <br />
-        </span>
-      </p>
-    </div>
-  </NoticeLayout>
-);
+        </p>
+        <div style={{ textAlign: 'center' }}>
+          <a
+            style={{ color: '#777', fontSize: '2em' }}
+            href="javascript:window.location=%22http://news.ycombinator.com/submitlink?u=%22+encodeURIComponent(document.location)+%22&amp;t=%22+encodeURIComponent(document.title)"
+          >
+            post to HN
+          </a>
+        </div>
+        <br />
+        <br />
+        <table style={{ padding: '0px', backgroundColor: '#ff6600', width: '100%' }}>
+          <tbody>
+            <tr style={{ height: '0px' }}>
+              <td style={{ padding: '0px' }} />
+            </tr>
+          </tbody>
+        </table>
+        <p style={{ textAlign: 'center' }}>
+          <span className="foot">
+            <br />
+            <br />
+          </span>
+        </p>
+      </div>
+    </NoticeLayout>
+  );
+}
 
 export default BookmarkletPage;
diff --git a/pages/changepw.tsx b/pages/changepw.tsx
@@ -3,10 +3,14 @@ import * as React from 'react';
 import { withDataAndRouter } from '../src/helpers/with-data';
 import { MainLayout } from '../src/layouts/main-layout';
 
-export const ChangePasswordPage = withDataAndRouter((props) => (
-  <MainLayout currentUrl={props.router.pathname}>
-    <h1>Change PW</h1>
-  </MainLayout>
-));
+export function ChangePasswordPage(props): JSX.Element {
+  const { router } = props;
 
-export default ChangePasswordPage;
+  return (
+    <MainLayout currentUrl={router.pathname}>
+      <h1>Change PW</h1>
+    </MainLayout>
+  );
+}
+
+export default withDataAndRouter(ChangePasswordPage);
diff --git a/pages/favorites.tsx b/pages/favorites.tsx
@@ -25,19 +25,21 @@ export interface INewestNewsFeedOwnProps {
   };
 }
 
-export const FavoritesPage = withDataAndRouter((props) => {
-  const pageNumber = (props.router.query && +props.router.query.p) || 0;
+export function FavoritesPage(props): JSX.Element {
+  const { router } = props;
+
+  const pageNumber = (router.query && +router.query.p) || 0;
 
   const first = POSTS_PER_PAGE;
   const skip = POSTS_PER_PAGE * pageNumber;
 
   const { data } = useQuery(query, { variables: { first, skip, type: FeedType.NEW } });
 
   return (
-    <MainLayout currentUrl={props.router.pathname}>
-      <NewsFeed data={data} currentUrl={props.router.pathname} first={first} skip={skip} />
+    <MainLayout currentUrl={router.pathname}>
+      <NewsFeed data={data} currentUrl={router.pathname} first={first} skip={skip} />
     </MainLayout>
   );
-});
+}
 
-export default FavoritesPage;
+export default withDataAndRouter(FavoritesPage);
diff --git a/pages/forgot.tsx b/pages/forgot.tsx
@@ -1,5 +1,4 @@
-import gql from 'graphql-tag';
-import { withRouter, NextRouter } from 'next/router';
+import { NextRouter } from 'next/router';
 import React, { useState } from 'react';
 
 import { withDataAndRouter } from '../src/helpers/with-data';
@@ -9,7 +8,7 @@ export interface IForgotPageProps {
   router: NextRouter; // { how: UserLoginErrorCode }
 }
 
-function ForgotPageView(props: IForgotPageProps): JSX.Element {
+function ForgotPage(props: IForgotPageProps): JSX.Element {
   const [username, setUsername] = useState<string>('');
 
   return (
@@ -30,8 +29,4 @@ function ForgotPageView(props: IForgotPageProps): JSX.Element {
   );
 }
 
-export const ForgotPage = withDataAndRouter(
-  withRouter((props) => <ForgotPageView router={props.router} />)
-);
-
-export default ForgotPage;
+export default withDataAndRouter(ForgotPage);
diff --git a/pages/formatdoc.tsx b/pages/formatdoc.tsx
@@ -3,12 +3,14 @@ import * as React from 'react';
 import { MainLayout } from '../src/layouts/main-layout';
 import { withDataAndRouter } from '../src/helpers/with-data';
 
-export const FormatDocPage = withDataAndRouter((props) => {
+export function FormatDocPage(props): JSX.Element {
+  const { router } = props;
+
   return (
     <MainLayout
       isFooterVisible={false}
       isNavVisible={false}
-      currentUrl={props.router.pathname}
+      currentUrl={router.pathname}
       title="Formatting Options"
     >
       <tr>
@@ -45,6 +47,6 @@ export const FormatDocPage = withDataAndRouter((props) => {
       </tr>
     </MainLayout>
   );
-});
+}
 
-export default FormatDocPage;
+export default withDataAndRouter(FormatDocPage);
diff --git a/pages/front.tsx b/pages/front.tsx
@@ -3,10 +3,13 @@ import * as React from 'react';
 import { withDataAndRouter } from '../src/helpers/with-data';
 import { MainLayout } from '../src/layouts/main-layout';
 
-export const FrontPage = withDataAndRouter((props) => (
-  <MainLayout currentUrl={props.router.pathname}>
-    <span>total</span>
-  </MainLayout>
-));
+export function FrontPage(props): JSX.Element {
+  const { router } = props;
+  return (
+    <MainLayout currentUrl={router.pathname}>
+      <span>total</span>
+    </MainLayout>
+  );
+}
 
-export default FrontPage;
+export default withDataAndRouter(FrontPage);
diff --git a/pages/hidden.tsx b/pages/hidden.tsx
@@ -5,19 +5,21 @@ import { sampleData } from '../src/data/sample-data';
 import { withDataAndRouter } from '../src/helpers/with-data';
 import { MainLayout } from '../src/layouts/main-layout';
 
-export const HiddenPage = withDataAndRouter((props) => {
-  const pageNumber = (props.router.query && +props.router.query.p) || 0;
+export function HiddenPage(props): JSX.Element {
+  const { router } = props;
+
+  const pageNumber = (router.query && +router.query.p) || 0;
 
   return (
-    <MainLayout currentUrl={props.router.pathname}>
+    <MainLayout currentUrl={router.pathname}>
       <NewsFeedView
-        currentUrl={props.router.pathname}
+        currentUrl={router.pathname}
         first={30}
         newsItems={sampleData.newsItems}
         skip={pageNumber * 30}
       />
     </MainLayout>
   );
-});
+}
 
-export default HiddenPage;
+export default withDataAndRouter(HiddenPage);
diff --git a/pages/index.tsx b/pages/index.tsx
@@ -25,19 +25,21 @@ export interface ITopNewsFeedProps {
   };
 }
 
-export const IndexPage = withDataAndRouter((props) => {
-  const pageNumber = (props.router.query && +props.router.query.p) || 0;
+export function IndexPage(props): JSX.Element {
+  const { router } = props;
+
+  const pageNumber = (router.query && +router.query.p) || 0;
 
   const first = POSTS_PER_PAGE;
   const skip = POSTS_PER_PAGE * pageNumber;
 
   const { data } = useQuery(query, { variables: { first, skip, type: FeedType.TOP } });
 
   return (
-    <MainLayout currentUrl={props.router.pathname}>
-      <NewsFeed data={data} currentUrl={props.router.pathname} first={first} skip={skip} />
+    <MainLayout currentUrl={router.pathname}>
+      <NewsFeed data={data} currentUrl={router.pathname} first={first} skip={skip} />
     </MainLayout>
   );
-});
+}
 
-export default IndexPage;
+export default withDataAndRouter(IndexPage);