From 6fa5f8ef1d3b455b0475d31dd834aba28bcad5eb Mon Sep 17 00:00:00 2001 From: Alex Patterson Date: Mon, 27 Sep 2021 18:40:20 -0400 Subject: [PATCH 1/4] allow github to populate from next.js --- frontend/main/package-lock.json | 37 ++-- frontend/main/package.json | 2 +- .../src/components/admin/EditPostEditor.tsx | 17 ++ frontend/main/src/models/post.model.ts | 2 + frontend/main/src/models/rehype-prism.d.ts | 1 + frontend/main/src/pages/[...permalink].tsx | 20 +- .../src/pages/course/[coursePath]/index.tsx | 191 ++++++++++++++++-- 7 files changed, 240 insertions(+), 30 deletions(-) diff --git a/frontend/main/package-lock.json b/frontend/main/package-lock.json index e987dd1f5..6debea994 100644 --- a/frontend/main/package-lock.json +++ b/frontend/main/package-lock.json @@ -38,7 +38,7 @@ "react": "^17.0.2", "react-beautiful-dnd": "^13.0.0", "react-dom": "^17.0.2", - "react-firebaseui": "^4.1.0", + "react-firebaseui": "^5.0.2", "react-gtm-module": "^2.0.11", "react-icons": "^4.2.0", "react-instantsearch-dom": "^6.8.2", @@ -4794,12 +4794,15 @@ "integrity": "sha512-bKnO8Rcj03i6JTzweabq96k29uVNcXGB0bkwjVQTFagDgxxNged18281AZ0nTMHl+aFpPPWyPrk4Z3+NtW/z5w==" }, "node_modules/firebaseui": { - "version": "4.7.3", - "resolved": "https://registry.npmjs.org/firebaseui/-/firebaseui-4.7.3.tgz", - "integrity": "sha512-KKeZQS2fO2SrZFIsEmG6GrTm/+Na8Vk+OM9wnNgP8FtUw6h4S5oCPtebBREr9ETlDFvIK88gaHvp5bvF96yogA==", + "version": "4.8.1", + "resolved": "https://registry.npmjs.org/firebaseui/-/firebaseui-4.8.1.tgz", + "integrity": "sha512-Qh8kfqGjMIiVJ2X8MUFsmlf43QFcVc8ungD+kw5T8ACuhQ68IAyUHExlItAfumrcLlqEgyo1MjH0O9fZZAMOKw==", "dependencies": { "dialog-polyfill": "^0.4.7", "material-design-lite": "^1.2.0" + }, + "peerDependencies": { + "firebase": ">=8.2.4" } }, "node_modules/flat-cache": { @@ -9873,11 +9876,15 @@ "integrity": "sha512-rtGImPZ0YyLrscKI9xTpV8psd6I8VAtjKCzQDlzyDvqJA8XOW78TXYQwNRNd8g8JZnDu8q9Fu/1v4HPAVwVdHA==" }, "node_modules/react-firebaseui": { - "version": "4.1.0", - "resolved": "https://registry.npmjs.org/react-firebaseui/-/react-firebaseui-4.1.0.tgz", - "integrity": "sha512-Y5pAom+W6/R5xZeF4xdvYiP7tObo7GDGWra1Pf2td+FxhtXtGQXQTKdW5Rs4js5zIuN0A3fApZzO+3sa1MHl9Q==", + "version": "5.0.2", + "resolved": "https://registry.npmjs.org/react-firebaseui/-/react-firebaseui-5.0.2.tgz", + "integrity": "sha512-ZfIWfRKlKAkMwEI+41rMPkwdNEQEfBLXV6TVaN5er3cdwMD0vQecWt6YOE4/v1ELziaj10NNRB8yB42V56QBMQ==", "dependencies": { - "firebaseui": "^4.1.0" + "firebaseui": "^4.8.0" + }, + "peerDependencies": { + "firebase": "^8.2.4", + "react": ">=15 <=17" } }, "node_modules/react-gtm-module": { @@ -15960,9 +15967,9 @@ } }, "firebaseui": { - "version": "4.7.3", - "resolved": "https://registry.npmjs.org/firebaseui/-/firebaseui-4.7.3.tgz", - "integrity": "sha512-KKeZQS2fO2SrZFIsEmG6GrTm/+Na8Vk+OM9wnNgP8FtUw6h4S5oCPtebBREr9ETlDFvIK88gaHvp5bvF96yogA==", + "version": "4.8.1", + "resolved": "https://registry.npmjs.org/firebaseui/-/firebaseui-4.8.1.tgz", + "integrity": "sha512-Qh8kfqGjMIiVJ2X8MUFsmlf43QFcVc8ungD+kw5T8ACuhQ68IAyUHExlItAfumrcLlqEgyo1MjH0O9fZZAMOKw==", "requires": { "dialog-polyfill": "^0.4.7", "material-design-lite": "^1.2.0" @@ -20009,11 +20016,11 @@ "integrity": "sha512-rtGImPZ0YyLrscKI9xTpV8psd6I8VAtjKCzQDlzyDvqJA8XOW78TXYQwNRNd8g8JZnDu8q9Fu/1v4HPAVwVdHA==" }, "react-firebaseui": { - "version": "4.1.0", - "resolved": "https://registry.npmjs.org/react-firebaseui/-/react-firebaseui-4.1.0.tgz", - "integrity": "sha512-Y5pAom+W6/R5xZeF4xdvYiP7tObo7GDGWra1Pf2td+FxhtXtGQXQTKdW5Rs4js5zIuN0A3fApZzO+3sa1MHl9Q==", + "version": "5.0.2", + "resolved": "https://registry.npmjs.org/react-firebaseui/-/react-firebaseui-5.0.2.tgz", + "integrity": "sha512-ZfIWfRKlKAkMwEI+41rMPkwdNEQEfBLXV6TVaN5er3cdwMD0vQecWt6YOE4/v1ELziaj10NNRB8yB42V56QBMQ==", "requires": { - "firebaseui": "^4.1.0" + "firebaseui": "^4.8.0" } }, "react-gtm-module": { diff --git a/frontend/main/package.json b/frontend/main/package.json index 7a3254f69..9339c2ba6 100644 --- a/frontend/main/package.json +++ b/frontend/main/package.json @@ -91,4 +91,4 @@ "tailwindcss": "^2.0.2", "typescript": "^4.3.5" } -} \ No newline at end of file +} diff --git a/frontend/main/src/components/admin/EditPostEditor.tsx b/frontend/main/src/components/admin/EditPostEditor.tsx index 715728eb5..c5ebf0a90 100644 --- a/frontend/main/src/components/admin/EditPostEditor.tsx +++ b/frontend/main/src/components/admin/EditPostEditor.tsx @@ -55,6 +55,12 @@ export default function EditPostEditor({ updateContent$.next({ ...update, historyId: history?.id }); } + function onUrlContent(urlContent: string) { + const update: Post = { ...history, urlContent } as Post; + setHistory(update); + updateContent$.next({ ...update, historyId: history?.id }); + } + return (
{/* Top Inputs */} @@ -89,6 +95,17 @@ export default function EditPostEditor({ > Slug is not unique
+
+

+ URL: +

+ onUrlContent(e.target.value)} + > +
diff --git a/frontend/main/src/models/post.model.ts b/frontend/main/src/models/post.model.ts index d64a8aad2..be9d8a93f 100644 --- a/frontend/main/src/models/post.model.ts +++ b/frontend/main/src/models/post.model.ts @@ -31,6 +31,8 @@ export interface Post { authors?: UserInfoExtended[]; authorIds?: string[]; //uid list of authors + urlContent?: string; //Used for remote data + // Payment Fields accessSettings?: AccessSettings; // Navigation Experience diff --git a/frontend/main/src/models/rehype-prism.d.ts b/frontend/main/src/models/rehype-prism.d.ts index b51c4aae1..3a4420140 100644 --- a/frontend/main/src/models/rehype-prism.d.ts +++ b/frontend/main/src/models/rehype-prism.d.ts @@ -1 +1,2 @@ declare module '@mapbox/rehype-prism'; +declare module 'remark-react'; diff --git a/frontend/main/src/pages/[...permalink].tsx b/frontend/main/src/pages/[...permalink].tsx index dd8fa4496..b23dd9f8b 100644 --- a/frontend/main/src/pages/[...permalink].tsx +++ b/frontend/main/src/pages/[...permalink].tsx @@ -12,6 +12,8 @@ import { import { Post as PostModel, PostType } from '@/models/post.model'; import matter from 'gray-matter'; import rehypePrism from '@mapbox/rehype-prism'; +import parse from 'remark-parse'; +import remark2react from 'remark-react'; import renderToString from 'next-mdx-remote/render-to-string'; import { Source } from 'next-mdx-remote/hydrate'; import PostLayout from '@/components/PostLayout'; @@ -223,12 +225,26 @@ export async function getStaticProps({ ]); let source: Source | null; + let allContent = ''; + + if (post && post.urlContent) { + const c = await (await fetch(post.urlContent)).text(); + const { content } = matter(c); + + allContent = content.replaceAll( + '
- {content} +
{content}
-
+
{post.type === PostType.course && ( -
+
{post.coverPhoto?.path ? ( <> code, + pre { + background-color: transparent !important; + background-image: linear-gradient(to bottom, #2a2139 75%, #34294f); + } + + /* Inline code */ + :not(pre) > code { + padding: 0.1em; + border-radius: 0.3em; + white-space: normal; + } + + .token.comment, + .token.block-comment, + .token.prolog, + .token.doctype, + .token.cdata { + color: #8e8e8e; + } + + .token.punctuation { + color: #ccc; + } + + .token.tag, + .token.attr-name, + .token.namespace, + .token.number, + .token.unit, + .token.hexcode, + .token.deleted { + color: #e2777a; + } + + .token.property, + .token.selector { + color: #72f1b8; + text-shadow: 0 0 2px #100c0f, 0 0 10px #257c5575, 0 0 35px #21272475; + } + + .token.function-name { + color: #6196cc; + } + + .token.boolean, + .token.selector .token.id, + .token.function { + color: #fdfdfd; + text-shadow: 0 0 2px #001716, 0 0 3px #03edf975, 0 0 5px #03edf975, + 0 0 8px #03edf975; + } + + .token.class-name { + color: #fff5f6; + text-shadow: 0 0 2px #000, 0 0 10px #fc1f2c75, 0 0 5px #fc1f2c75, + 0 0 25px #fc1f2c75; + } + + .token.constant, + .token.symbol { + color: #f92aad; + text-shadow: 0 0 2px #100c0f, 0 0 5px #dc078e33, 0 0 10px #fff3; + } + + .token.important, + .token.atrule, + .token.keyword, + .token.selector .token.class, + .token.builtin { + color: #f4eee4; + text-shadow: 0 0 2px #393a33, 0 0 8px #f39f0575, 0 0 2px #f39f0575; + } + + .token.string, + .token.char, + .token.attr-value, + .token.regex, + .token.variable { + color: #f87c32; + } + + .token.operator, + .token.entity, + .token.url { + color: #67cdcc; + } + + .token.important, + .token.bold { + font-weight: bold; + } + + .token.italic { + font-style: italic; + } + + .token.entity { + cursor: help; + } + + .token.inserted { + color: green; + } `} ); @@ -338,16 +485,36 @@ export async function getServerSideProps({ } } - const source: Source | null = - post && post.content - ? await renderToString(post.content, { - mdxOptions: { - // remarkPlugins: [parse, mdx], - rehypePlugins: [rehypePrism], - }, - }) - : null; + let source: Source | null; + let allContent = ''; + + if (post && post.urlContent) { + const c = await (await fetch(post.urlContent)).text(); + const { content } = matter(c); + if (post.urlContent.includes('next.js')) { + allContent = content.replaceAll( + ' Date: Mon, 27 Sep 2021 19:47:43 -0400 Subject: [PATCH 2/4] update tags --- .../src/components/global/icons/AJ404.tsx | 92 +++---- .../src/components/global/icons/AJLoading.tsx | 235 ++++++++++-------- 2 files changed, 167 insertions(+), 160 deletions(-) diff --git a/frontend/main/src/components/global/icons/AJ404.tsx b/frontend/main/src/components/global/icons/AJ404.tsx index a3a0569af..16754a956 100644 --- a/frontend/main/src/components/global/icons/AJ404.tsx +++ b/frontend/main/src/components/global/icons/AJ404.tsx @@ -9,7 +9,7 @@ export default function AJ404({ width="3292" height="1405" viewBox="0 0 3292 1405" - fill="none" + fill="black" xmlns="http://www.w3.org/2000/svg" > - - - - - - - - - - - - + + + + + + + + + - + - + - - - ); diff --git a/frontend/main/src/components/global/icons/AJLoading.tsx b/frontend/main/src/components/global/icons/AJLoading.tsx index f9e10406e..cc9b314b9 100644 --- a/frontend/main/src/components/global/icons/AJLoading.tsx +++ b/frontend/main/src/components/global/icons/AJLoading.tsx @@ -13,147 +13,168 @@ export default function AJLoading({ viewBox="0 0 1743 1484" > - + d="M711.834 1379.31C961.328 1379.31 1209.94 1155.07 1209.94 920.293C1209.94 585.119 961.328 610.194 711.834 610.194C607.039 610.194 510.578 637.023 433.939 684.412C500.925 481.747 389.621 315.51 260.086 294.461C130.551 273.412 22.0693 419.137 2.63928 501.714C-16.7907 584.292 124.077 595.624 140.268 530.857C156.46 466.09 239.038 355.989 324.853 453.139C393.506 530.859 371.68 683.952 352.186 750.783C294.396 812.403 260.086 891.379 260.086 981.799C260.086 1201.34 462.341 1379.31 711.834 1379.31Z" + fill="black" + /> + + /> + /> + /> + /> + + - - - - - - - - - - - - - + /> + + + + + + + + + + + + + /> + /> + /> + d="M1092.59 366.047L1157.07 336.15L1267.73 317.773L1280.77 320.812L1293.78 322.006C1293.78 322.006 1300.69 320.198 1297.31 317.532C1293.94 314.866 1289.38 313.077 1289.38 313.077L1278.41 308.043L1267.01 303.569C1267.01 303.569 1265.03 302.917 1264.86 301.873C1264.69 300.829 1267.07 299.077 1267.07 299.077L1269.84 298.089C1269.84 298.089 1274.37 298.033 1276.87 298.649C1279.38 299.264 1316.24 312.5 1325.14 316.359C1334.05 320.217 1342.54 326.481 1351.96 333.471C1361.38 340.462 1371.28 348.738 1371.89 349.223C1372.5 349.708 1373.39 348.589 1373.39 348.589C1373.39 348.589 1373.83 348.03 1373.66 346.986C1373.49 345.942 1347.12 325.102 1346.73 324.337C1346.34 323.573 1344.41 321.597 1344.41 321.597C1344.41 321.597 1341.18 318.13 1341.09 317.608C1341 317.086 1341.72 314.924 1343.52 314.532C1345.32 314.141 1346.94 315.875 1348.22 315.52C1349.5 315.166 1354.45 317.72 1354.45 317.72L1415.97 369.077L1435.51 392.247L1456.73 424.012L1474.24 459.205L1482.82 465.991L1511.93 472.646L1552.24 472.703L1600.48 457.681C1600.48 457.681 1654.78 432.462 1657.46 434.121C1660.13 435.78 1655.93 460.628 1655.93 460.628L1645.34 498.598L1611.76 557.464L1580.84 601.622L1531 670.348L1536.25 743.102L1534.92 744.78L1533.39 743.568L1527.68 713.612L1507.42 762.562L1484.31 808.808L1473.54 809.833L1427.33 804.65L1426.22 806.048L1438.1 811.808L1446.35 816.506L1455.54 823.776C1459.84 827.168 1449.8 831.045 1449.8 831.045C1449.8 831.045 1241.02 850.412 1196.76 843.638C1152.49 836.864 1096.08 805.997 1034.26 776.975L1018.93 764.858C998.219 745.096 988.055 732.958 972.724 709.252C947.467 659.291 936.258 625.521 920.138 557.74L919.197 512.929L922.127 477.083C924.601 459.964 927.503 454.528 928.915 453.373C930.327 452.217 940.486 450.707 956.292 444.575L981.082 434.64L1092.59 366.047Z" + fill="black" + /> + d="M1250.7 713.638C1318.45 785.863 1335.05 834.053 1345.55 927.634C1331.4 833.165 1314.54 784.439 1249.2 714.272L1250.7 713.638Z" + fill="white" + /> + + + /> + d="M1350.4 529.383C1298.83 498.571 1211.48 599.888 1250.99 627.946C1290.51 656.003 1401.96 560.196 1350.4 529.383Z" + fill="black" + /> + rx="5.47115" + ry="4.98964" + transform="rotate(38.3256 1290.1 618.588)" + fill="white" + /> + /> + d="M1162.19 398.349C1125.82 375.048 1043.76 463.737 1071.04 485.304C1098.33 506.872 1198.57 421.651 1162.19 398.349Z" + fill="black" + /> + rx="5.47084" + ry="4.98975" + transform="rotate(38.3256 1103.98 471.362)" + fill="white" + /> + + + + d="M1048.25 649.907L1084.8 603.359L1079.65 599.402L1043.1 645.949C1020.01 653.808 1005.9 643.049 978.805 598.71C978.055 597.548 976.174 599.608 976.832 601.773C977.49 603.938 985.642 617.994 996.307 632.525C1006.97 647.056 1019.35 650.725 1019.35 650.725C1019.35 650.725 1037.96 652.501 1040.15 651.969C1042.33 651.438 1044.17 652.851 1044.19 655.079C1044.21 657.306 1049.13 671.307 1052.33 674.906C1055.53 678.504 1070.56 691.282 1077.2 694.543C1083.83 697.804 1103.13 705.387 1110.35 705.959C1117.56 706.53 1121.65 703.284 1113.33 702.166C1105 701.048 1045.33 681.942 1048.25 649.907Z" + fill="white" + /> - - - - - + /> ); } From 438d46e416d9ee8f2cc7ba0a026954af65c398d6 Mon Sep 17 00:00:00 2001 From: Alex Patterson Date: Mon, 27 Sep 2021 19:58:16 -0400 Subject: [PATCH 3/4] add slug --- .../components/admin/EditPostCourseSections.tsx | 16 ++++++++++++---- 1 file changed, 12 insertions(+), 4 deletions(-) diff --git a/frontend/main/src/components/admin/EditPostCourseSections.tsx b/frontend/main/src/components/admin/EditPostCourseSections.tsx index 1fa9362b6..e62731019 100644 --- a/frontend/main/src/components/admin/EditPostCourseSections.tsx +++ b/frontend/main/src/components/admin/EditPostCourseSections.tsx @@ -294,9 +294,14 @@ export default function EditPostCourseSections({ - - {lesson.title} - +
+ + {lesson.title} + +

+ {lesson?.slug} +

+
)} From fff27fe05424b372192f704b0ddb8fb2742e9dda Mon Sep 17 00:00:00 2001 From: Alex Patterson Date: Mon, 27 Sep 2021 20:22:58 -0400 Subject: [PATCH 4/4] add cmd k and escape for search --- .../src/components/algolia/SearchModal.tsx | 25 ++++++++++++++++++- 1 file changed, 24 insertions(+), 1 deletion(-) diff --git a/frontend/main/src/components/algolia/SearchModal.tsx b/frontend/main/src/components/algolia/SearchModal.tsx index 600f6258e..ea8da6f29 100644 --- a/frontend/main/src/components/algolia/SearchModal.tsx +++ b/frontend/main/src/components/algolia/SearchModal.tsx @@ -1,4 +1,4 @@ -import React, { useState } from 'react'; +import React, { useCallback, useEffect, useState } from 'react'; import AlgoliaInstantSearch from './algoliaInstantSearch'; export default function SearchModal(): JSX.Element { @@ -12,6 +12,29 @@ export default function SearchModal(): JSX.Element { setShow(false); }; + const escFunction = useCallback((e) => { + e.preventDefault(); + if (e.keyCode === 27) { + setShow(false); + } + }, []); + + const cmdKFunction = useCallback((e) => { + e.preventDefault(); + if ((e.metaKey || e.ctrlKey) && e.code === 'KeyK') { + setShow(true); + } + }, []); + + useEffect(() => { + document.addEventListener('keydown', escFunction, false); + document.addEventListener('keydown', cmdKFunction, false); + return () => { + document.removeEventListener('keydown', escFunction, false); + document.removeEventListener('keydown', cmdKFunction, false); + }; + }, []); + const Modal = ({ handleClose, show, children }: any) => { const showHideclassNameName = show ? 'fixed inset-0 z-50 bg-basics-900 dark:bg-basics-900 dark:bg-opacity-50 bg-opacity-50 grid place-items-center h-screen'