Skip to content

Commit 00a143a

Browse files
committed
feat: Fetch events on events page via our Luma API proxy instead of using a privacy-gated iframe
Signed-off-by: Felicitas Pojtinger <felicitas@pojtinger.com>
1 parent 672185c commit 00a143a

7 files changed

Lines changed: 182 additions & 143 deletions

File tree

README.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -13,7 +13,7 @@ VanLUG is a non-profit user group for Linux professionals, hobbyists, and curiou
1313
It provides the following:
1414

1515
- Home page with next meeting card (fetched from Luma API via a proxy hosted on Railway), "what to expect" cards, and social links
16-
- Events page with embedded Luma calendar iframe and full past event history
16+
- Events page with upcoming events (fetched from Luma API via a proxy hosted on Railway) and full past event history
1717
- About page with mission, purpose mandates, and board of directors
1818
- Partners page listing library and community venue partners
1919
- Resources page with speaker slides, AGM documents, learning links, and design system

content/privacy.md

Lines changed: 3 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -30,11 +30,9 @@ When accessing our website, the following information is processed for the reaso
3030
- Our website does NOT use cookies or other techniques for user-targeted analytics or advertisements.
3131
- Legal basis for processing this data is a legitimate interest of the website operator (Art. 6.1.f GDPR).
3232

33-
#### 3.2 Luma Calendar Embed
33+
#### 3.2 Luma Event Data
3434

35-
Our Events page offers an optional embed of the Luma event calendar. This embed is **not loaded by default**. It is only activated when you explicitly click "Load events from Luma". Loading it will connect your browser directly to Luma's servers.
36-
37-
Our home page fetches the next upcoming event from Luma's API via our proxy on Railway to display the next meeting card. Your browser connects to our proxy, not directly to Luma.
35+
Our home page and events page fetch event data from Luma's API via our proxy on Railway. Your browser connects to our proxy, not directly to Luma. No data is sent to Luma from your browser.
3836

3937
Luma, Inc.\
4038
548 Market St PMB 36143\
@@ -52,7 +50,7 @@ San Francisco, CA 94107\
5250
United States\
5351
Privacy policy: [GitHub Privacy Statement](https://docs.github.com/en/site-policy/privacy-policies/github-general-privacy-statement)
5452

55-
Our Luma event API proxy for the home page is hosted by:
53+
Our Luma event API proxy is hosted by:
5654

5755
Railway Corporation\
5856
548 Market St PMB 68956\

layouts/_partials/next-event-template.html

Lines changed: 45 additions & 26 deletions
Original file line numberDiff line numberDiff line change
@@ -1,33 +1,52 @@
11
<template id="next-event-template">
2-
<div class="pf-v6-c-card pf-m-compact">
3-
<div class="pf-v6-c-card__body">
4-
<div class="pf-v6-l-flex pf-m-gap-lg pf-m-align-items-center">
2+
<div class="pf-v6-c-card pf-m-compact pf-m-flat">
3+
<div class="pf-v6-c-card__header">
4+
<div class="pf-v6-c-card__header-main">
55
<div
6-
class="pf-v6-l-flex pf-m-column pf-m-align-items-center pf-m-gap-xs"
6+
class="pf-v6-l-flex pf-m-gap-lg pf-m-align-items-center pf-m-nowrap"
77
>
8-
<span class="pf-v6-c-label pf-m-green pf-m-outline">
9-
<span class="pf-v6-c-label__content">
10-
<span class="pf-v6-c-label__text" data-slot="date"></span>
11-
</span>
12-
</span>
13-
<span class="pf-v6-u-font-size-xs" data-slot="relative"></span>
14-
</div>
15-
<div class="pf-v6-l-flex pf-m-column pf-m-gap-sm">
16-
<div class="pf-v6-c-content">
17-
<h4 data-slot="name"></h4>
18-
<p>
19-
<small data-slot="detail"></small>
20-
</p>
8+
<div
9+
class="pf-v6-l-flex pf-m-gap-lg pf-m-align-items-center pf-m-justify-content-center"
10+
>
11+
<img
12+
data-slot="cover"
13+
alt=""
14+
style="
15+
width: 4rem;
16+
height: 4rem;
17+
object-fit: cover;
18+
border-radius: var(--pf-t--global--border--radius--medium);
19+
flex-shrink: 0;
20+
"
21+
/>
22+
<div
23+
class="pf-v6-l-flex pf-m-column pf-m-align-items-center pf-m-gap-xs"
24+
>
25+
<span class="pf-v6-c-label pf-m-green pf-m-outline">
26+
<span class="pf-v6-c-label__content">
27+
<span class="pf-v6-c-label__text" data-slot="date"></span>
28+
</span>
29+
</span>
30+
<span class="pf-v6-u-font-size-xs" data-slot="relative"></span>
31+
</div>
32+
</div>
33+
<div class="pf-v6-l-flex pf-m-column pf-m-gap-sm">
34+
<div class="pf-v6-c-content">
35+
<h4 data-slot="name"></h4>
36+
<p>
37+
<small data-slot="detail"></small>
38+
</p>
39+
</div>
40+
<a
41+
data-slot="rsvp"
42+
target="_blank"
43+
rel="noopener"
44+
class="pf-v6-c-button pf-m-link pf-m-inline"
45+
><span class="pf-v6-c-button__text">RSVP on Luma</span
46+
><span class="pf-v6-c-button__icon pf-m-end"
47+
><icon-external></icon-external></span
48+
></a>
2149
</div>
22-
<a
23-
data-slot="rsvp"
24-
target="_blank"
25-
rel="noopener"
26-
class="pf-v6-c-button pf-m-link pf-m-inline"
27-
><span class="pf-v6-c-button__text">RSVP on Luma</span
28-
><span class="pf-v6-c-button__icon pf-m-end"
29-
><icon-external></icon-external></span
30-
></a>
3150
</div>
3251
</div>
3352
</div>

layouts/_partials/section-events.html

Lines changed: 27 additions & 40 deletions
Original file line numberDiff line numberDiff line change
@@ -30,49 +30,36 @@ <h3>Upcoming</h3>
3030
>. RSVP there to get reminders.
3131
</p>
3232
</div>
33-
<luma-embed calendar="{{ .Site.Data.links.luma.calendar }}">
34-
<div class="pf-v6-c-empty-state">
35-
<div class="pf-v6-c-empty-state__content">
36-
<div class="pf-v6-c-empty-state__icon">
37-
<i class="fas fa-shield-alt" aria-hidden="true"></i>
38-
</div>
39-
<div class="pf-v6-c-empty-state__title-text">
40-
External content
41-
</div>
42-
<div class="pf-v6-c-empty-state__body">
43-
The event calendar is hosted by Luma. Loading it will
44-
connect your browser to their servers. See Luma's
45-
<a
46-
href="https://luma.com/privacy-policy"
47-
target="_blank"
48-
rel="noopener"
49-
>privacy policy<icon-external></icon-external></a
50-
>.
51-
</div>
52-
<div class="pf-v6-c-empty-state__footer">
53-
<div class="pf-v6-c-empty-state__actions">
54-
<button
55-
class="pf-v6-c-button pf-m-primary"
56-
type="button"
57-
data-slot="load"
58-
>
59-
Load events from Luma
60-
</button>
33+
<luma-upcoming-events
34+
calendar="{{ .Site.Data.links.luma.calendar }}"
35+
proxy="{{ .Site.Data.links.luma.proxy }}"
36+
>
37+
<div class="pf-v6-l-flex pf-m-column pf-m-gap-md">
38+
{{ range (seq 3) }}
39+
<div class="pf-v6-c-card pf-m-compact pf-m-flat">
40+
<div class="pf-v6-c-card__header">
41+
<div class="pf-v6-c-card__header-main">
42+
<div class="pf-v6-l-flex pf-m-gap-lg pf-m-align-items-center pf-m-nowrap">
43+
<div
44+
class="pf-v6-c-skeleton"
45+
style="
46+
--pf-v6-c-skeleton--Height: 4rem;
47+
--pf-v6-c-skeleton--Width: 4rem;
48+
border-radius: var(--pf-t--global--border--radius--medium);
49+
flex-shrink: 0;
50+
"
51+
></div>
52+
<div class="pf-v6-l-flex pf-m-column pf-m-gap-sm pf-m-grow">
53+
<div class="pf-v6-c-skeleton pf-m-text-lg pf-m-width-50"></div>
54+
<div class="pf-v6-c-skeleton pf-m-text-sm pf-m-width-75"></div>
55+
</div>
56+
</div>
57+
</div>
6158
</div>
62-
<a
63-
href="{{ .Site.Data.links.luma.url }}"
64-
target="_blank"
65-
rel="noopener"
66-
class="pf-v6-c-button pf-m-link"
67-
><span class="pf-v6-c-button__text"
68-
>Open on Luma instead</span
69-
><span class="pf-v6-c-button__icon pf-m-end"
70-
><icon-external></icon-external></span
71-
></a>
7259
</div>
73-
</div>
60+
{{ end }}
7461
</div>
75-
</luma-embed>
62+
</luma-upcoming-events>
7663
</div>
7764
</section>
7865

layouts/_partials/section-home.html

Lines changed: 20 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -66,27 +66,31 @@ <h3>{{ $c.next_meeting.title }}</h3>
6666
calendar="{{ .Site.Data.links.luma.calendar }}"
6767
proxy="{{ .Site.Data.links.luma.proxy }}"
6868
>
69-
<div class="pf-v6-c-card pf-m-compact">
70-
<div class="pf-v6-c-card__body">
71-
<div
72-
class="pf-v6-l-flex pf-m-gap-lg pf-m-align-items-flex-start"
73-
>
69+
<div class="pf-v6-c-card pf-m-compact pf-m-flat">
70+
<div class="pf-v6-c-card__header">
71+
<div class="pf-v6-c-card__header-main">
7472
<div
75-
class="pf-v6-c-skeleton"
76-
style="
77-
--pf-v6-c-skeleton--Height: 3rem;
78-
--pf-v6-c-skeleton--Width: 3.5rem;
79-
"
80-
></div>
81-
<div
82-
class="pf-v6-l-flex pf-m-column pf-m-gap-sm pf-m-grow"
73+
class="pf-v6-l-flex pf-m-gap-lg pf-m-align-items-center"
8374
>
8475
<div
85-
class="pf-v6-c-skeleton pf-m-text-lg pf-m-width-50"
76+
class="pf-v6-c-skeleton"
77+
style="
78+
--pf-v6-c-skeleton--Height: 4rem;
79+
--pf-v6-c-skeleton--Width: 4rem;
80+
border-radius: var(--pf-t--global--border--radius--medium);
81+
flex-shrink: 0;
82+
"
8683
></div>
8784
<div
88-
class="pf-v6-c-skeleton pf-m-text-sm pf-m-width-75"
89-
></div>
85+
class="pf-v6-l-flex pf-m-column pf-m-gap-sm pf-m-grow"
86+
>
87+
<div
88+
class="pf-v6-c-skeleton pf-m-text-lg pf-m-width-50"
89+
></div>
90+
<div
91+
class="pf-v6-c-skeleton pf-m-text-sm pf-m-width-75"
92+
></div>
93+
</div>
9094
</div>
9195
</div>
9296
</div>

patternfly-org

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
Subproject commit 5ac239a8ee3460420c61070be7cdd167bb79896c

0 commit comments

Comments
 (0)