From 51252d5e88a1dcdc38f459f78333ab7558df5280 Mon Sep 17 00:00:00 2001 From: Patrick Heneise Date: Sat, 2 Mar 2024 20:22:54 +0000 Subject: [PATCH 1/3] feat: announcements --- src/app.jsx | 49 ++++++++++++++++++++++++-------------------- src/routes/index.jsx | 21 +++++++++---------- 2 files changed, 37 insertions(+), 33 deletions(-) diff --git a/src/app.jsx b/src/app.jsx index 871e964..2fb68b4 100644 --- a/src/app.jsx +++ b/src/app.jsx @@ -1,5 +1,5 @@ // @refresh reload -import { Show, Suspense } from 'solid-js' +import { Show, Suspense, createMemo, createResource } from 'solid-js' import { A } from '@solidjs/router' import { MetaProvider, Title } from '@solidjs/meta' import { Router } from '@solidjs/router' @@ -11,24 +11,24 @@ import graphql from '~/server/graphql.js' import './app.css' -// const destructBody = (body) => { -// const urlRegex = new RegExp(/(((https?:\/\/)|(www\.))[^\s]+)/g) +const destructBody = (body) => { + const urlRegex = new RegExp(/(((https?:\/\/)|(www\.))[^\s]+)/g) -// const [content, link] = body.split('\r\n\r\n') -// const [text] = link.split(':') -// const href = link.match(urlRegex)[0] + const [content, link] = body.split('\r\n\r\n') + const [text] = link.split(':') + const href = link.match(urlRegex)[0] -// return { -// content: content, -// linkText: text, -// linkHref: href -// } -// } + return { + content: content, + linkText: text, + linkHref: href + } +} function Announcement(props) { - // const announcement = createMemo(() => - // destructBody(props?.data?.repository?.discussions.nodes[0].body) - // ) + const announcement = createMemo(() => + destructBody(props.announcement().repository.discussions.nodes[0].body) + ) return (
@@ -56,22 +56,25 @@ function Announcement(props) { }} />
- {/*

+

{announcement()?.content}  - {announcement()?.linkText}  + {announcement()?.linkText}  + -

*/} +

) } export default function App() { - // const [data] = graphql(announcementQuery.gql, announcementQuery.vars) + const [announcement] = createResource(async () => { + return graphql(announcementQuery.gql, announcementQuery.vars) + }) return (
Cyprus Developer Community - Home - {/* - - */} + + + + +
{props.children}
diff --git a/src/routes/index.jsx b/src/routes/index.jsx index b40af0b..5004e4d 100644 --- a/src/routes/index.jsx +++ b/src/routes/index.jsx @@ -50,22 +50,21 @@ function SocialLink(props) { function EventBox(props) { const [local] = splitProps(props, ['event']) - const event = local.event - const issueData = event.parsed + const issueData = createMemo(() => local.event.parsed) return (
- +
- + {issueData['featured-image']?.images?.[0]?.alt} - + Cyprus Developer Community Logo
-

- + - {event.title} + {local.event.title}

From 3551626cfa2dbcf812aab860b4df8b33a122cc7f Mon Sep 17 00:00:00 2001 From: Patrick Heneise Date: Sat, 2 Mar 2024 21:14:35 +0000 Subject: [PATCH 2/3] feat: add events and event detail --- app.config.js | 6 +- src/components/Card.jsx | 16 ++-- src/components/EventLine.jsx | 33 +++++++ src/components/SimpleLayout.jsx | 2 +- src/{to-refactor => routes}/events/[id].jsx | 89 ++++++++--------- src/routes/events/index.jsx | 79 ++++++++++++++++ src/to-refactor/events/index.jsx | 100 -------------------- 7 files changed, 162 insertions(+), 163 deletions(-) create mode 100644 src/components/EventLine.jsx rename src/{to-refactor => routes}/events/[id].jsx (60%) create mode 100644 src/routes/events/index.jsx delete mode 100644 src/to-refactor/events/index.jsx diff --git a/app.config.js b/app.config.js index 47476b5..061f18d 100644 --- a/app.config.js +++ b/app.config.js @@ -9,10 +9,10 @@ export default defineConfig({ preset: 'cloudflare_module', rollupConfig: { external: ['__STATIC_CONTENT_MANIFEST', 'node:async_hooks'] - }, - prerender: { - crawlLinks: true } + // prerender: { + // routes: ['/'] + // } }, vite: { optimizeDeps: { diff --git a/src/components/Card.jsx b/src/components/Card.jsx index 98c7ba9..76e22cf 100644 --- a/src/components/Card.jsx +++ b/src/components/Card.jsx @@ -86,18 +86,16 @@ Card.Eyebrow = function CardEyebrow(props) { class={clsx( local.class, 'relative z-10 order-first mb-3 flex items-center text-sm text-zinc-400 dark:text-zinc-500', - local.decorate && 'pl-3.5' + 'pl-3.5' )} {...other} > - {local.decorate && ( -
- {local.children &&
{local.children}
} +
{local.children}
) } diff --git a/src/to-refactor/events/[id].jsx b/src/routes/events/[id].jsx similarity index 60% rename from src/to-refactor/events/[id].jsx rename to src/routes/events/[id].jsx index 9370ae7..2707415 100644 --- a/src/to-refactor/events/[id].jsx +++ b/src/routes/events/[id].jsx @@ -1,67 +1,56 @@ import graphql from '~/server/graphql.js' import issueQuery from '~/graphql/issue.query.js' -import { useParams, useRouteData } from 'solid-start' -import { Match, Show, Switch, createMemo, createResource } from 'solid-js' +import fileQuery from '~/graphql/file.query.js' +import { Match, Show, Switch, createMemo } from 'solid-js' import bodyParser from '@zentered/issue-forms-body-parser' import { SolidMarkdown } from 'solid-markdown' import { Prose } from '~/components/Prose' import { formatDate } from '~/lib/formatDate' -import fileQuery from '~/graphql/file.query.js' -import { A } from '@solidjs/router' +import { A, useParams, createAsync, cache } from '@solidjs/router' import { SimpleLayout } from '~/components/SimpleLayout' -export function routeData() { +const eventsData = cache(async () => { const params = useParams() - const [data] = graphql(issueQuery.gql, { + const issue = await graphql(issueQuery.gql, { ...issueQuery.vars, repository: 'events', number: parseInt(params.id) }) + issue.parsedBody = await bodyParser(issue.repository.issue.body) + return issue +}, 'eventsData') - const [locationsFile] = graphql(fileQuery.gql('locations.json'), { +const locationsFile = cache(async () => { + const file = await graphql(fileQuery.gql('locations.json'), { ...fileQuery.vars, repository: 'events' }) + return JSON.parse(file.repository.object.text) +}, 'locationsFile') - const [issueData] = createResource(data, async () => { - const issue = await bodyParser(data()?.repository.issue.body) - return issue - }) - - const locations = createMemo(() => { - if (locationsFile()) { - return JSON.parse(locationsFile().repository.object.text) - } - }) - - const location = locations()?.find((l) => l.id === issueData()?.location.text) - - return { - data, - issueData, - location - } +export const route = { + load: () => [eventsData(), locationsFile()] } export default function Event() { - const { data, issueData, location } = useRouteData() + const issueData = createAsync(eventsData) + const locationsList = createAsync(locationsFile) + const location = createMemo(() => { + locationsList()?.find((l) => l.id === issueData()?.parsedBody.location.text) + }) return ( - + - + {issueData()['featured-image']?.images?.[0]?.alt} - + CDC logo
- +
- {location.name}, {location.city} + {location().name}, {location().city}
- + - {location.what3words} + {location().what3words}
@@ -98,10 +87,10 @@ export default function Event() {
- {formatDate(issueData()?.['date'].date)} -{' '} - {issueData()?.['time'].time} + {formatDate(issueData()?.parsedBody.date.date)} -{' '} + {issueData()?.parsedBody['time'].time}
- Duration: {issueData()?.['duration'].text} + Duration: {issueData()?.parsedBody['duration'].text}
When @@ -109,11 +98,11 @@ export default function Event() {
- +
- {issueData()['code-of-conduct'].list[0].text} + {issueData()?.parsedBody['code-of-conduct'].list[0].text}
@@ -123,23 +112,23 @@ export default function Event() {
- +

- {data()?.repository.issue.title} + {issueData()?.repository.issue.title}

- {issueData()?.['event-description'].text} + {issueData()?.parsedBody['event-description'].text}
diff --git a/src/routes/events/index.jsx b/src/routes/events/index.jsx new file mode 100644 index 0000000..4e69bbb --- /dev/null +++ b/src/routes/events/index.jsx @@ -0,0 +1,79 @@ +import upcomingEventsQuery from '~/graphql/upcoming-events.query.js' +// import pastEventsQuery from '~/graphql/past-events.query.js' +import graphql from '~/server/graphql.js' +import { For, Show, Suspense, createResource } from 'solid-js' +import { SimpleLayout } from '~/components/SimpleLayout' +import { createAsync, cache } from '@solidjs/router' +import bodyParser from '@zentered/issue-forms-body-parser' +import { Card } from '~/components/Card' +import { formatDate } from '~/lib/formatDate' + +function EventLine(props) { + const [issueData] = createResource(async () => { + return bodyParser(props.event.body) + }) + + return ( +
+ + + + {props.event.title} + + + {issueData()?.['event-description'].text} + + Event Details + + + +
+ ) +} + +const getEvents = cache(async () => { + return graphql(upcomingEventsQuery.gql, { + ...upcomingEventsQuery.vars, + repository: 'events' + }) +}, 'events') + +// const getPastEvents = cache(async () => { +// return graphql(pastEventsQuery.gql, { +// ...pastEventsQuery.vars, +// repository: 'events' +// }) +// }, 'pastEvents') + +export const route = { + load: () => [getEvents()] +} + +export default function Event() { + const events = createAsync(getEvents) + + return ( + <> + + + + + {(event) => } + + + + + {/* + + {(event) => } + + */} + + ) +} diff --git a/src/to-refactor/events/index.jsx b/src/to-refactor/events/index.jsx deleted file mode 100644 index b698cce..0000000 --- a/src/to-refactor/events/index.jsx +++ /dev/null @@ -1,100 +0,0 @@ -import { Card } from '~/components/Card' -import { formatDate } from '~/lib/formatDate' -import upcomingEventsQuery from '~/graphql/upcoming-events.query.js' -import pastEventsQuery from '~/graphql/past-events.query.js' -import graphql from '~/server/graphql.js' -import { For, createResource } from 'solid-js' -import bodyParser from '@zentered/issue-forms-body-parser' -import { SimpleLayout } from '~/components/SimpleLayout' -import { createAsync, cache } from '@solidjs/router' - -function EventLine(props) { - const [issueData] = createResource(async () => { - const data = await bodyParser(props.event.body) - return data - }) - - return ( -
- - - {props.event.title} - - - {issueData()?.['event-description'].text} - - Event Details - - -
- ) -} - -function EventReduced(props) { - const [issueData] = createResource(async () => { - const data = await bodyParser(props.event.body) - return data - }) - - return ( -
- - - {props.event.title} - - Event Details - - -
- ) -} - -const getEvents = cache(async () => { - const [upcoming] = await graphql(upcomingEventsQuery.gql, { - ...upcomingEventsQuery.vars, - repository: 'events' - }) - const data = upcoming() - console.log(data) - return data -}, 'events') - -export const route = { - load: () => getEvents() -} - -export default function Event() { - const events = createAsync(getEvents) - - // const [past] = graphql(pastEventsQuery.gql, { - // ...pastEventsQuery.vars, - // repository: 'events' - // }) - - return ( - <> - - - {(event) => } - - - {/* - - {(event) => } - - */} - - ) -} From 562e04c79808749efd91a29b6ff1dfdea20ac3bb Mon Sep 17 00:00:00 2001 From: Patrick Heneise Date: Sat, 2 Mar 2024 21:26:15 +0000 Subject: [PATCH 3/3] fix: remove component --- src/components/EventLine.jsx | 33 --------------------------------- 1 file changed, 33 deletions(-) delete mode 100644 src/components/EventLine.jsx diff --git a/src/components/EventLine.jsx b/src/components/EventLine.jsx deleted file mode 100644 index 3bebf38..0000000 --- a/src/components/EventLine.jsx +++ /dev/null @@ -1,33 +0,0 @@ -import bodyParser from '@zentered/issue-forms-body-parser' -import { Suspense, createResource } from 'solid-js' -import { Card } from '~/components/Card' -import { formatDate } from '~/lib/formatDate' - -export function EventLine(props) { - const [issueData] = createResource(async () => { - return bodyParser(props.event.body) - }) - - return ( -
- - - - {props.event.title} - - - {issueData()?.['event-description'].text} - - Event Details - - - -
- ) -}