From 7c902adccd94c356709dcadbeb7a84497ea1d13a Mon Sep 17 00:00:00 2001 From: Rui Sousa Date: Mon, 21 Oct 2024 10:36:33 +0100 Subject: [PATCH 1/9] update data fetching --- .../talks-and-roundtables/[slug]/page.tsx | 27 +++++++------------ 1 file changed, 10 insertions(+), 17 deletions(-) diff --git a/src/app/(pages)/talks-and-roundtables/[slug]/page.tsx b/src/app/(pages)/talks-and-roundtables/[slug]/page.tsx index 9610fb0..7813469 100644 --- a/src/app/(pages)/talks-and-roundtables/[slug]/page.tsx +++ b/src/app/(pages)/talks-and-roundtables/[slug]/page.tsx @@ -1,27 +1,20 @@ -// import { notFound } from 'next/navigation' -// -// import { fetchDoc } from '../../../_api/fetchDoc' +import { fetchContentBySlug } from "@/app/_utilities/contentFetchers"; export const dynamic = 'force-dynamic' -export default async function TalksAndRoundTablesPage() { - /* let content = null - try { - content = await fetchDoc({ - collection: 'talks-and-roundtables', - slug: slug, - }) - } catch (err) {} - if (!content) { - notFound() - } -*/ +export default async function TalksAndRoundTablesPage({params : paramsPromise}) { + const { slug } = await paramsPromise + const talk = await fetchContentBySlug({ + slug: slug, + type: 'talks-and-roundtables', + }) + + return (
- {/*Hello, world! - 
{JSON.stringify(content, null, 2)}
*/} + {/*
{JSON.stringify(talk, null, 2)}
*!/*/}
) } From ba9bc08d76297ee485f87ffae0a17957167929af Mon Sep 17 00:00:00 2001 From: Rui Sousa Date: Mon, 21 Oct 2024 10:40:02 +0100 Subject: [PATCH 2/9] add 'react-youtube' dependency 'react-youtube' will facilitate embeding youtube videos on the talks-and-roundtables page --- package.json | 1 + 1 file changed, 1 insertion(+) diff --git a/package.json b/package.json index ce59f50..e044290 100644 --- a/package.json +++ b/package.json @@ -68,6 +68,7 @@ "react-dom": "^19.0.0-rc-09111202-20241011", "react-hook-form": "7.45.4", "react-share": "^5.1.0", + "react-youtube": "^10.1.0", "sharp": "0.32.6", "tailwind-merge": "^2.3.0", "tailwindcss-animate": "^1.0.7", From 8d0d07255218a91c0891e78bc84f6d46d00edf3e Mon Sep 17 00:00:00 2001 From: Rui Sousa Date: Mon, 21 Oct 2024 11:04:56 +0100 Subject: [PATCH 3/9] add 'get-video-id' dependency this dependency parses URL from multiple video hosting platforms and fetches the video id, to facilitate video embedding --- package.json | 1 + 1 file changed, 1 insertion(+) diff --git a/package.json b/package.json index e044290..1d8b524 100644 --- a/package.json +++ b/package.json @@ -52,6 +52,7 @@ "clsx": "^2.1.1", "cross-env": "^7.0.3", "geist": "^1.3.0", + "get-video-id": "^4.1.7", "graphql": "^16.8.2", "install": "^0.13.0", "isomorphic-dompurify": "^2.16.0", From 19d201cb7591cf1bb02bc9fe0355b8270bbd0a17 Mon Sep 17 00:00:00 2001 From: Rui Sousa Date: Mon, 21 Oct 2024 11:37:35 +0100 Subject: [PATCH 4/9] add content blocks --- .../talks-and-roundtables/[slug]/page.tsx | 75 +++++++++++++++++-- 1 file changed, 67 insertions(+), 8 deletions(-) diff --git a/src/app/(pages)/talks-and-roundtables/[slug]/page.tsx b/src/app/(pages)/talks-and-roundtables/[slug]/page.tsx index 7813469..0686a90 100644 --- a/src/app/(pages)/talks-and-roundtables/[slug]/page.tsx +++ b/src/app/(pages)/talks-and-roundtables/[slug]/page.tsx @@ -1,20 +1,79 @@ import { fetchContentBySlug } from "@/app/_utilities/contentFetchers"; +import getVideoId from "get-video-id"; +import BackButton from "@/app/_components/BackButton"; +import ArchiveButton from "@/app/_components/ArchiveButton"; +import { formatDateTime } from "@/app/_utilities/formatDateTime"; +import Share from "@/app/_components/Share"; +import Categories from "@/app/_components/Categories"; +import AuthorPill from "@/app/_components/AuthorPill"; +import Authors from "@/app/_components/Authors"; +import SocialLinks from "@/app/_components/SocialLinks"; -export const dynamic = 'force-dynamic' +export const dynamic = "force-dynamic"; +export default async function TalksAndRoundTablesPage({ params: paramsPromise }) { + const { slug } = await paramsPromise; - -export default async function TalksAndRoundTablesPage({params : paramsPromise}) { - const { slug } = await paramsPromise const talk = await fetchContentBySlug({ slug: slug, - type: 'talks-and-roundtables', - }) + type: "talks-and-roundtables", + }); + // move this to the collection / store in db? + // @ts-ignore + const videoID = getVideoId(talk.url); return (
- {/*
{JSON.stringify(talk, null, 2)}
*!/*/} + {/*{
{JSON.stringify(talk, null, 2)}
}*/} + {/* Head Block */} +
+ + +

+ {formatDateTime(talk.publishedAt)} + Duration in mins +

+ +
+ + {/* Contributors column*/} +
+ {talk.authors.map((author) => ( + <> + + {/* TODO: Enable once most recent PR hits main */} + {/**/} + + ))} + + +
+ + {/* Content column */} +
+ {videoID.service === "youtube" && ( + + )} +
+ + {/* Share & categories column */} +
+ + {talk.categories.length > 0 && ( + + )} +
+
- ) + ); } From 258915f2973356cc3e99c8b9f05f37f656ddde44 Mon Sep 17 00:00:00 2001 From: Rui Sousa Date: Mon, 21 Oct 2024 12:05:33 +0100 Subject: [PATCH 5/9] add styling --- .../talks-and-roundtables/[slug]/page.tsx | 84 +++++++------ .../[slug]/styles.module.css | 112 ++++++++++++++++++ 2 files changed, 158 insertions(+), 38 deletions(-) create mode 100644 src/app/(pages)/talks-and-roundtables/[slug]/styles.module.css diff --git a/src/app/(pages)/talks-and-roundtables/[slug]/page.tsx b/src/app/(pages)/talks-and-roundtables/[slug]/page.tsx index 0686a90..c422f5b 100644 --- a/src/app/(pages)/talks-and-roundtables/[slug]/page.tsx +++ b/src/app/(pages)/talks-and-roundtables/[slug]/page.tsx @@ -6,8 +6,9 @@ import { formatDateTime } from "@/app/_utilities/formatDateTime"; import Share from "@/app/_components/Share"; import Categories from "@/app/_components/Categories"; import AuthorPill from "@/app/_components/AuthorPill"; -import Authors from "@/app/_components/Authors"; +import styles from "./styles.module.css"; import SocialLinks from "@/app/_components/SocialLinks"; +import { Subscribe } from "@/app/_blocks/Subscribe"; export const dynamic = "force-dynamic"; @@ -27,52 +28,59 @@ export default async function TalksAndRoundTablesPage({ params: paramsPromise })
{/*{
{JSON.stringify(talk, null, 2)}
}*/} {/* Head Block */} -
- - +
+ + +
{talk.title}

{formatDateTime(talk.publishedAt)} - Duration in mins + Duration in mins

+
- {/* Contributors column*/} -
- {talk.authors.map((author) => ( - <> - - {/* TODO: Enable once most recent PR hits main */} - {/**/} - - ))} + {/* Contributors column*/} +
+

+ CONTRIBUTORS +

+ {talk.authors.map((author) => ( + <> + + {/* TODO: Enable once most recent PR hits main */} + {/**/} + + ))} +
+ {/* Content column */} +
+ {videoID.service === "youtube" && ( + + )} +
About
+

{talk.summary}

+
+ {/* Share & categories column */} +
+ + {talk.categories.length > 0 && ( + + )} +
- - {/* Content column */} -
- {videoID.service === "youtube" && ( - - )} -
- - {/* Share & categories column */} -
- - {talk.categories.length > 0 && ( - - )} -
+
); diff --git a/src/app/(pages)/talks-and-roundtables/[slug]/styles.module.css b/src/app/(pages)/talks-and-roundtables/[slug]/styles.module.css new file mode 100644 index 0000000..e1b82e3 --- /dev/null +++ b/src/app/(pages)/talks-and-roundtables/[slug]/styles.module.css @@ -0,0 +1,112 @@ + +.headContainer { + display: flex; + flex-direction: column; + background-color: var(--sub-purple-400); + color: var(--soft-white-100); + border-bottom-right-radius: 16px; + border-bottom-left-radius: 16px; + padding: 40px 80px; + gap: 20px; +} + +.headContainer p { + display: flex; + gap: 40px; +} + +.backButton { + display: block; + font-family: Colfax, sans-serif; + padding-top: 40px; + padding-left: 15px; + padding-bottom: 40px; +} + + +.contentContainer { + display: grid; + grid-template-rows: 2fr; + font-family: var(--colfax); + padding-bottom: 40px; +} + +.contributors { + display: flex; + flex-direction: column; + gap: 20px; + padding: 16px; +} + +.sharingAndCategories { + grid-row-start: 2; + +} + +.videoPlayer { + padding: 20px; +} + +.videoPlayer iframe { + width: 100%; + border-radius: 25px; + margin-bottom: 16px; +} + +.videoPlayer p { + margin-top: 16px; + text-align: justify; +} +@media (min-width: 1080px) { + + .headContainer { + width: calc(100% - 40px); + margin: 0 auto; + } + + .backButton { + padding-left: 95px; + color: var(--soft-white-100); + } + + .contentContainer { + width: calc(100% - 40px); + margin: 20px auto; + display: grid; + grid-template-columns: 0.3fr 0.6fr 0.3fr; + } + + .videoPlayer { + margin: auto; + width: calc(100% - 40px); + border-radius: 25px; + } + + .videoPlayer iframe { + width: 100%; + aspect-ratio: 16 / 9; + border-radius: 25px; + margin-bottom: 40px; + } + + .videoPlayer p { + text-align: justify; + } + + .contributors { + display: flex; + flex-direction: column; + gap: 20px; + padding: 40px 40px 40px 80px; + } + + .sharingAndCategories { + justify-content: left; + padding-left: 40px; + grid-column: 3 / 3; + } + + +} + + From deb2bf4c2dea8f49fb86acf84c53e4feaf2cabc2 Mon Sep 17 00:00:00 2001 From: Rui Sousa Date: Mon, 21 Oct 2024 12:15:51 +0100 Subject: [PATCH 6/9] fix styling - fix positioning and responsiveness; - temporarily supress typescript warnings; --- src/app/(pages)/talks-and-roundtables/[slug]/page.tsx | 8 +++++++- .../talks-and-roundtables/[slug]/styles.module.css | 10 +++++++++- src/app/_components/Categories/styles.module.css | 2 -- src/app/_components/Share/styles.module.css | 2 -- 4 files changed, 16 insertions(+), 6 deletions(-) diff --git a/src/app/(pages)/talks-and-roundtables/[slug]/page.tsx b/src/app/(pages)/talks-and-roundtables/[slug]/page.tsx index c422f5b..061d4fa 100644 --- a/src/app/(pages)/talks-and-roundtables/[slug]/page.tsx +++ b/src/app/(pages)/talks-and-roundtables/[slug]/page.tsx @@ -31,8 +31,10 @@ export default async function TalksAndRoundTablesPage({ params: paramsPromise })
+ {/* @ts-ignore */}
{talk.title}

+ {/* @ts-ignore */} {formatDateTime(talk.publishedAt)} Duration in mins

@@ -42,9 +44,10 @@ export default async function TalksAndRoundTablesPage({ params: paramsPromise }) {/* Contributors column*/}
-

+

CONTRIBUTORS

+ {/* @ts-ignore */} {talk.authors.map((author) => ( <> @@ -69,13 +72,16 @@ export default async function TalksAndRoundTablesPage({ params: paramsPromise }) > )}
About
+ {/* @ts-ignore */}

{talk.summary}

{/* Share & categories column */}
+ {/* @ts-ignore */} {talk.categories.length > 0 && ( + // @ts-ignore )}
diff --git a/src/app/(pages)/talks-and-roundtables/[slug]/styles.module.css b/src/app/(pages)/talks-and-roundtables/[slug]/styles.module.css index e1b82e3..94a28c5 100644 --- a/src/app/(pages)/talks-and-roundtables/[slug]/styles.module.css +++ b/src/app/(pages)/talks-and-roundtables/[slug]/styles.module.css @@ -39,8 +39,11 @@ } .sharingAndCategories { + display: flex; + flex-direction: column; grid-row-start: 2; - + padding-left: 20px; + gap: 30px; } .videoPlayer { @@ -101,9 +104,14 @@ } .sharingAndCategories { + display: flex; + flex-direction: column; justify-content: left; padding-left: 40px; + padding-top: 40px; + gap: 40px; grid-column: 3 / 3; + grid-row: 1 / 1; } diff --git a/src/app/_components/Categories/styles.module.css b/src/app/_components/Categories/styles.module.css index 7cc5c4e..2c5616d 100644 --- a/src/app/_components/Categories/styles.module.css +++ b/src/app/_components/Categories/styles.module.css @@ -2,8 +2,6 @@ display: flex; flex-direction: column; gap: 20px; - padding-top: 30px; - padding-bottom: 20px; } .categories { diff --git a/src/app/_components/Share/styles.module.css b/src/app/_components/Share/styles.module.css index 3f4ef66..4640c9e 100644 --- a/src/app/_components/Share/styles.module.css +++ b/src/app/_components/Share/styles.module.css @@ -1,6 +1,4 @@ .container { - padding: 20px; - margin: 20px auto; color: var(--dark-rock-800); } From e6e6ac21a5c6109ef1a80b57ef9f7c250de7f9fb Mon Sep 17 00:00:00 2001 From: Rui Sousa Date: Mon, 21 Oct 2024 12:16:13 +0100 Subject: [PATCH 7/9] regenerate types and importmap --- yarn.lock | 43 +++++++++++++++++++++++++++++++++++++++---- 1 file changed, 39 insertions(+), 4 deletions(-) diff --git a/yarn.lock b/yarn.lock index a12b1ac..b721dea 100644 --- a/yarn.lock +++ b/yarn.lock @@ -1384,7 +1384,7 @@ dependencies: regenerator-runtime "^0.14.0" -"@babel/runtime@^7.16.3", "@babel/runtime@^7.20.7": +"@babel/runtime@^7.16.3", "@babel/runtime@^7.20.7", "@babel/runtime@^7.23.9": version "7.25.7" resolved "https://registry.yarnpkg.com/@babel/runtime/-/runtime-7.25.7.tgz#7ffb53c37a8f247c8c4d335e89cdf16a2e0d0fb6" integrity sha512-FjoyLe754PMiYsFaN5C94ttGiOmBNYTf6pLr4xXHAT5uctHb092PBszndLDR5XA/jghQvn4n7JMHl7dmTgbm9w== @@ -5277,7 +5277,7 @@ debug@4, debug@4.x, debug@^4.3.1, debug@^4.3.2, debug@^4.3.4, debug@^4.3.5: dependencies: ms "^2.1.3" -debug@^2.1.3: +debug@^2.1.3, debug@^2.6.6: version "2.6.9" resolved "https://registry.yarnpkg.com/debug/-/debug-2.6.9.tgz#5d128515df134ff327e90a4c93f4e077a536341f" integrity sha512-bC7ElrdJaJnPbAP+1EotYvqZsb3ecl5wi6Bfi6BJTUcNowp6cvspg0jXznRTKDjm/E7AdgFBVeAPVMNcKGsHMA== @@ -6190,7 +6190,7 @@ fast-copy@^3.0.2: resolved "https://registry.yarnpkg.com/fast-copy/-/fast-copy-3.0.2.tgz#59c68f59ccbcac82050ba992e0d5c389097c9d35" integrity sha512-dl0O9Vhju8IrcLndv2eU4ldt1ftXMqqfgN4H1cpmGV7P6jeB9FwpN9a2c8DPGE1Ys88rNUJVYDHq73CGAGOPfQ== -fast-deep-equal@^3.1.1, fast-deep-equal@^3.1.3: +fast-deep-equal@3.1.3, fast-deep-equal@^3.1.1, fast-deep-equal@^3.1.3: version "3.1.3" resolved "https://registry.yarnpkg.com/fast-deep-equal/-/fast-deep-equal-3.1.3.tgz#3a7d56b559d6cbc3eb512325244e619a65c6c525" integrity sha512-f3qQ9oQy9j2AhBe/H9VC91wLmKBCCU/gDOnKNAYG5hswO7BLKj09Hc5HYNz9cGI++xlpDCIgDaitVs03ATR84Q== @@ -6466,6 +6466,13 @@ get-tsconfig@^4.7.2, get-tsconfig@^4.7.5: dependencies: resolve-pkg-maps "^1.0.0" +get-video-id@^4.1.7: + version "4.1.7" + resolved "https://registry.yarnpkg.com/get-video-id/-/get-video-id-4.1.7.tgz#71c0b209dc85b808fc1be1c7e2b6e2b4f88a3bd3" + integrity sha512-bYHXe3BTbFbiViuNFyfFnZPnSDVWBu5N06p35LW7dD/ul4O1sdPSs3Brw8U/m5JlQUnkj3tht3luSz0k05vEYg== + dependencies: + "@babel/runtime" "^7.23.9" + github-from-package@0.0.0: version "0.0.0" resolved "https://registry.yarnpkg.com/github-from-package/-/github-from-package-0.0.0.tgz#97fb5d96bfde8973313f20e8288ef9a167fa64ce" @@ -7585,6 +7592,11 @@ lines-and-columns@^1.1.6: resolved "https://registry.yarnpkg.com/lines-and-columns/-/lines-and-columns-1.2.4.tgz#eca284f75d2965079309dc0ad9255abb2ebc1632" integrity sha512-7ylylesZQ/PV29jhEDl3Ufjo6ZX7gCqJr5F7PKrqc93v7fzSymt1BpwEU8nAUXs8qzzvqhbjhK5QZg6Mt/HkBg== +load-script@^1.0.0: + version "1.0.0" + resolved "https://registry.yarnpkg.com/load-script/-/load-script-1.0.0.tgz#0491939e0bee5643ee494a7e3da3d2bac70c6ca4" + integrity sha512-kPEjMFtZvwL9TaZo0uZ2ml+Ye9HUMmPwbYRJ324qF9tqMejwykJ5ggTyvzmrbBeapCAbk98BSbTeovHEEP1uCA== + locate-path@^6.0.0: version "6.0.0" resolved "https://registry.yarnpkg.com/locate-path/-/locate-path-6.0.0.tgz#55321eb309febbc59c4801d931a72452a681d286" @@ -8820,7 +8832,7 @@ promzard@^2.0.0: dependencies: read "^4.0.0" -prop-types@^15.6.0, prop-types@^15.6.1, prop-types@^15.6.2, prop-types@^15.7.2, prop-types@^15.8.1: +prop-types@15.8.1, prop-types@^15.6.0, prop-types@^15.6.1, prop-types@^15.6.2, prop-types@^15.7.2, prop-types@^15.8.1: version "15.8.1" resolved "https://registry.yarnpkg.com/prop-types/-/prop-types-15.8.1.tgz#67d87bf1a694f48435cf332c24af10214a3140b5" integrity sha512-oj87CgZICdulUohogVAR7AjlC0327U4el4L6eAvOqCeudMDVU0NThNaV+b9Df4dXgSP1gXMTnPdhfe/2qDH5cg== @@ -9039,6 +9051,15 @@ react-transition-group@4.4.5, react-transition-group@^4.3.0: loose-envify "^1.4.0" prop-types "^15.6.2" +react-youtube@^10.1.0: + version "10.1.0" + resolved "https://registry.yarnpkg.com/react-youtube/-/react-youtube-10.1.0.tgz#7e5670c764f12eb408166e8eb438d788dc64e8b5" + integrity sha512-ZfGtcVpk0SSZtWCSTYOQKhfx5/1cfyEW1JN/mugGNfAxT3rmVJeMbGpA9+e78yG21ls5nc/5uZJETE3cm3knBg== + dependencies: + fast-deep-equal "3.1.3" + prop-types "15.8.1" + youtube-player "5.5.2" + react@18.2.0: version "18.2.0" resolved "https://registry.yarnpkg.com/react/-/react-18.2.0.tgz#555bd98592883255fa00de14f1151a917b5d77d5" @@ -9527,6 +9548,11 @@ simple-wcswidth@^1.0.1: resolved "https://registry.yarnpkg.com/simple-wcswidth/-/simple-wcswidth-1.0.1.tgz#8ab18ac0ae342f9d9b629604e54d2aa1ecb018b2" integrity sha512-xMO/8eNREtaROt7tJvWJqHBDTMFN4eiQ5I4JRMuilwfnFcV5W9u7RUkueNkdw0jPqGMX36iCywelS5yilTuOxg== +sister@^3.0.0: + version "3.0.2" + resolved "https://registry.yarnpkg.com/sister/-/sister-3.0.2.tgz#bb3e39f07b1f75bbe1945f29a27ff1e5a2f26be4" + integrity sha512-p19rtTs+NksBRKW9qn0UhZ8/TUI9BPw9lmtHny+Y3TinWlOa9jWh9xB0AtPSdmOy49NJJJSSe0Ey4C7h0TrcYA== + sisteransi@^1.0.5: version "1.0.5" resolved "https://registry.yarnpkg.com/sisteransi/-/sisteransi-1.0.5.tgz#134d681297756437cc05ca01370d3a7a571075ed" @@ -10655,3 +10681,12 @@ yocto-queue@^0.1.0: version "0.1.0" resolved "https://registry.yarnpkg.com/yocto-queue/-/yocto-queue-0.1.0.tgz#0294eb3dee05028d31ee1a5fa2c556a6aaf10a1b" integrity sha512-rVksvsnNCdJ/ohGc6xgPwyN8eheCxsiLM8mxuE/t/mOVqJewPuO1miLpTHQiRgTKCLexL4MeAFVagts7HmNZ2Q== + +youtube-player@5.5.2: + version "5.5.2" + resolved "https://registry.yarnpkg.com/youtube-player/-/youtube-player-5.5.2.tgz#052b86b1eabe21ff331095ffffeae285fa7f7cb5" + integrity sha512-ZGtsemSpXnDky2AUYWgxjaopgB+shFHgXVpiJFeNB5nWEugpW1KWYDaHKuLqh2b67r24GtP6HoSW5swvf0fFIQ== + dependencies: + debug "^2.6.6" + load-script "^1.0.0" + sister "^3.0.0" From 1e1f6d0610dd638f7942878207f4d23eb18bf064 Mon Sep 17 00:00:00 2001 From: Rui Sousa Date: Mon, 21 Oct 2024 12:19:35 +0100 Subject: [PATCH 8/9] re-enable talks and roundtables on hub home page --- src/app/_blocks/HubContentGrid/NavBar/index.tsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/app/_blocks/HubContentGrid/NavBar/index.tsx b/src/app/_blocks/HubContentGrid/NavBar/index.tsx index 3e6d35e..7be7e12 100644 --- a/src/app/_blocks/HubContentGrid/NavBar/index.tsx +++ b/src/app/_blocks/HubContentGrid/NavBar/index.tsx @@ -77,7 +77,7 @@ export default function ContentNavBar({ activeButton === 'CaseStudies' ? 'var(--dark-rock-800)' : 'var(--soft-white-100)' } /> - + */} */} +
) } From a25bb3b2ac17c5c40d8d4c37c59246e72ea14d68 Mon Sep 17 00:00:00 2001 From: Rui Sousa Date: Tue, 22 Oct 2024 14:34:15 +0100 Subject: [PATCH 9/9] fix merge conflicts --- .../talks-and-roundtables/[slug]/page.tsx | 46 +++++++++---------- .../[slug]/styles.module.css | 9 +++- 2 files changed, 29 insertions(+), 26 deletions(-) diff --git a/src/app/(pages)/talks-and-roundtables/[slug]/page.tsx b/src/app/(pages)/talks-and-roundtables/[slug]/page.tsx index 7a7a1ed..6e4365d 100644 --- a/src/app/(pages)/talks-and-roundtables/[slug]/page.tsx +++ b/src/app/(pages)/talks-and-roundtables/[slug]/page.tsx @@ -5,37 +5,41 @@ import ArchiveButton from "@/app/_components/ArchiveButton"; import { formatDateTime } from "@/app/_utilities/formatDateTime"; import Share from "@/app/_components/Share"; import Categories from "@/app/_components/Categories"; -import AuthorPill from "@/app/_components/AuthorPill"; import styles from "./styles.module.css"; -import SocialLinks from "@/app/_components/SocialLinks"; import { Subscribe } from "@/app/_blocks/Subscribe"; +import Contributors from "@/app/_blocks/EpisodeContent/Contributors"; +import { TalksAndRoundtable } from "@/payload-types"; +import { Metadata } from "next"; +import { generateMeta } from "@/utilities/generateMeta"; export const dynamic = "force-dynamic"; export default async function TalksAndRoundTablesPage({ params: paramsPromise }) { const { slug } = await paramsPromise; - const talk = await fetchContentBySlug({ + // @ts-expect-error + const talk: TalksAndRoundtable = await fetchContentBySlug({ slug: slug, type: "talks-and-roundtables", }); + const { title, authors, summary, url, publishedAt, categories } = talk; + // move this to the collection / store in db? // @ts-ignore const videoID = getVideoId(talk.url); return (
- {/*{
{JSON.stringify(talk, null, 2)}
}*/} {/* Head Block */}
{/* @ts-ignore */} -
{talk.title}
+
{title}

{/* @ts-ignore */} - {formatDateTime(talk.publishedAt)} + {formatDateTime(publishedAt)} Duration in mins

@@ -43,18 +47,10 @@ export default async function TalksAndRoundTablesPage({ params: paramsPromise })
{/* Contributors column*/} -
-

- CONTRIBUTORS -

+
+ {/* @ts-ignore */} - {talk.authors.map((author) => ( - <> - - {/* TODO: Enable once most recent PR hits main */} - {/**/} - - ))} +
{/* Content column */} @@ -73,31 +69,31 @@ export default async function TalksAndRoundTablesPage({ params: paramsPromise }) )}
About
{/* @ts-ignore */} -

{talk.summary}

+

{summary}

{/* Share & categories column */}
{/* @ts-ignore */} - {talk.categories.length > 0 && ( + {categories.length > 0 && ( // @ts-ignore - + )}
- ) + ); } -export async function generateMetadata({ params: paramsPromise}): Promise { - const { slug } = await paramsPromise +export async function generateMetadata({ params: paramsPromise }): Promise { + const { slug } = await paramsPromise; const talk = await fetchContentBySlug({ slug: slug, type: "talks-and-roundtables", - }) + }); // @ts-ignore - return generateMeta({doc: talk}) + return generateMeta({ doc: talk }); } diff --git a/src/app/(pages)/talks-and-roundtables/[slug]/styles.module.css b/src/app/(pages)/talks-and-roundtables/[slug]/styles.module.css index 94a28c5..d4ff117 100644 --- a/src/app/(pages)/talks-and-roundtables/[slug]/styles.module.css +++ b/src/app/(pages)/talks-and-roundtables/[slug]/styles.module.css @@ -60,6 +60,13 @@ margin-top: 16px; text-align: justify; } + +.contributors { + display: flex; + flex-direction: column; + gap: 20px; +} + @media (min-width: 1080px) { .headContainer { @@ -100,7 +107,7 @@ display: flex; flex-direction: column; gap: 20px; - padding: 40px 40px 40px 80px; + padding: 40px 40px 40px 80px; } .sharingAndCategories {