Merge pull request #1694 from FreeFeed/static-docs

Render Terms and Privacy pages as static HTMLs in the /docs/ catalog
FreeFeed · Aug 26, 2024 · f8ed82e · f8ed82e
2 parents 9158604 + 6a41f40
commit f8ed82e
Show file tree

Hide file tree

Showing 13 changed files with 839 additions and 658 deletions.
diff --git a/package.json b/package.json
@@ -79,6 +79,8 @@
     "eslint-plugin-react-hooks": "~4.6.2",
     "eslint-plugin-unicorn": "~54.0.0",
     "eslint-plugin-you-dont-need-lodash-underscore": "~6.14.0",
+    "glob": "~11.0.0",
+    "gray-matter": "~4.0.3",
     "husky": "~8.0.3",
     "jsdom": "~24.1.1",
     "lint-staged": "~15.2.7",
@@ -87,6 +89,7 @@
     "prettier": "~3.3.3",
     "querystring": "~0.2.1",
     "react-test-renderer": "~18.3.1",
+    "remarkable": "~2.0.1",
     "rimraf": "~5.0.9",
     "sass": "^1.77.8",
     "sinon": "~18.0.0",

diff --git a/public/docs/index.html b/public/docs/index.html
@@ -0,0 +1,14 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <meta charset="UTF-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  <title>FreeFeed Docs</title>
+  <meta http-equiv="refresh" content="0; url=/">
+</head>
+<body>
+  <p>
+    Redirecting to <a href="/t">freefeed.net</a>&hellip;
+  </p>
+</body>
+</html>
diff --git a/public/docs/legal.css b/public/docs/legal.css
@@ -0,0 +1,73 @@
+html {
+  background-color: lightgray;
+}
+
+body {
+  margin: 0 auto;
+  padding: 1em;
+  max-width: 750px;
+  line-height: 1.33;
+  font-size: 1.1em;
+  font-family: Arial, Helvetica, sans-serif;
+  background-color: #fff;
+}
+
+a {
+  color: royalblue;
+  text-decoration: none;
+}
+
+a:hover {
+  text-decoration: underline;
+  text-decoration-color: orange;
+}
+
+.legal-article h1,
+.legal-article h2,
+.legal-article h3,
+.legal-article h4 {
+  font-weight: normal;
+  margin-block: 1em 0;
+}
+
+.legal-article h1 {
+  font-size: 2em;
+}
+
+.legal-article h2 {
+  font-size: 1.5em;
+}
+
+.legal-article p {
+  margin-block: 1em 0;
+}
+
+@counter-style legal {
+  system: cyclic;
+  symbols: a b c d e f g h i j k l m n o p q r s t u v w x y z;
+  prefix: '(';
+  suffix: ') ';
+}
+
+.legal-article p + ol {
+  margin-block-start: 0;
+  list-style-type: lower-alpha;
+  list-style-type: legal;
+  padding-left: 2em;
+}
+
+.legal-article li {
+  margin-block: 0.25em;
+}
+
+.header {
+  font-size: 2em;
+  border-bottom: 1px solid #999;
+  padding-bottom: 0.33em;
+}
+
+.footer {
+  border-top: 1px solid #999;
+  margin-top: 2em;
+  padding-block: 0 3em;
+}
diff --git a/src/app.jsx b/src/app.jsx
@@ -178,16 +178,8 @@ function App() {
             component={lazyLoad(() => import('./components/about'))}
             onEnter={enterStaticPage('About')}
           />
-          <Route
-            path="terms"
-            component={lazyLoad(() => import('./components/terms'))}
-            onEnter={enterStaticPage('Terms')}
-          />
-          <Route
-            path="privacy"
-            component={lazyLoad(() => import('./components/privacy'))}
-            onEnter={enterStaticPage('Privacy')}
-          />
+          <Route path="terms" component={externalRedirect('/docs/terms')} />
+          <Route path="privacy" component={externalRedirect('/docs/privacy')} />
           <Route
             path="stats"
             component={lazyLoad(() => import('./components/stats'))}
@@ -482,3 +474,11 @@ function isCalendarDatePath({ params: { userName, year, month, day } }) {
   const validUsername = typeof userName === 'undefined' || isAccountPath({ params: { userName } });
   return isValidCalendarYear(year) && isValidMonth(month) && isValidDay(day) && validUsername;
 }
+
+function externalRedirect(href) {
+  // A functional component that redirects to a given external URL
+  return () => {
+    window.location.replace(href);
+    return null;
+  };
+}
diff --git a/src/components/footer.jsx b/src/components/footer.jsx
@@ -15,9 +15,9 @@ export default function Footer({ short }) {
           FAQ
         </a>
         {' | '}
-        <Link to="/about/terms">Terms</Link>
+        <a href="/docs/terms">Terms</a>
         {' | '}
-        <Link to="/about/privacy">Privacy</Link>
+        <a href="/docs/privacy">Privacy</a>
         {' | '}
         <Link to="/about/stats">Stats</Link>
         {' | '}

diff --git a/src/components/privacy-popup.jsx b/src/components/privacy-popup.jsx
@@ -15,7 +15,7 @@ export default function PrivacyPopup({ name, days }) {
       <div className={style.box}>
         <div>
           This site uses cookies and other technologies to collect data and enhance your experience.
-          Visit our <a href={'/about/privacy'}>Privacy Policy</a> to learn more. By clicking
+          Visit our <a href={'/docs/privacy'}>Privacy Policy</a> to learn more. By clicking
           &quot;Accept&quot; or by continuing to use our site you agree to this use of cookies and
           data.
         </div>