Events page redesign

[konopkja]

Is your feature request related to a problem? Please describe.

The events page (https://ethereum.org/en/community/events/) has grown and the current design does not support showing many events at the same time. This hinders usability of the page.

Describe the solution you'd like

The team has proposed following design.

figma designs
https://www.figma.com/design/BEGvi1RiaiFIK4a7MeCl2A/events-page-redesign?node-id=36-67140&t=P9nvjQJW7xAkHsjK-1

Describe alternatives you've considered

NA

Additional context

No response

Would you like to work on this issue?

• Yes
• No

[saurabhburade]

Hey @konopkja, I'm interested in working on this issue

[konopkja]

Hi @saurabhburade, thats exciting! I will assign you the issue then! :) Thank you

[saurabhburade]

@konopkja Thank you for assigning the issue, I wanted to know what's the Editors choice, maybe I can add the first event on the list available.

[wackerow]

Thanks @saurabhburade!

Many of our events are pulled from an external spreadsheet. The details of the logic can be found inside src/scripts/events/ethereum-events-import.ts... The EthereumEventsImport() function is called inside src/scripts/events-import.ts and results assigned to ethereumEvents... These objects here should have an imageUrl property which we're currently not doing anything with... This is not the case for events added separately to this API import, but I would start there and we can figure out a process to get images for other events separately.

[konopkja]

@konopkja Thank you for assigning the issue, I wanted to know what's the Editors choice, maybe I can add the first event on the list available.

its an idea for new type of event that should be more promoted, for example devcon or devconnect. You would have to create new metadata field for it i assume.

[konopkja]

@konopkja Thank you for assigning the issue, I wanted to know what's the Editors choice, maybe I can add the first event on the list available.

its an idea for new type of event that should be more promoted, for example devcon or devconnect. You would have to create new metadata field for it i assume.

do not add first event, this should be manual choice

if no event has it, do not show this section and title

[saurabhburade]

So this needs to be figured out, which event to promote at top, or maybe have a separate metadata

[saurabhburade]

I have rough preview ready as of now

[konopkja]

So this needs to be figured out, which event to promote at top, or maybe have a separate metadata

ok since items are pulled from other sources as well, for now i think lets ship MVP without editor's choice functionality

@saurabhburade

[saurabhburade]

Sounds great!

One thing to be noticed and need help on is that we cannot load external images directly on nextjs and need to whitelist these domains/hostnames through with images that are coming.
I need help to understand what to do with external image URLs?

[konopkja]

Sounds great!

One thing to be noticed and need help on is that we cannot load external images directly on nextjs and need to whitelist these domains/hostnames through with images that are coming. I need help to understand what to do with external image URLs?

@wackerow

[wackerow]

One thing to be noticed and need help on is that we cannot load external images directly on nextjs and need to whitelist these domains/hostnames through with images that are coming. I need help to understand what to do with external image URLs?

Good point... I'm not sure allowlisting will be a sustainable path forward here. We may want to consider iterating on the GitHub action/workflow that pulls in these events to also download and add the event images directly to our repo so we avoid these issues. cc: @pettinarip, thoughts?

[saurabhburade]

As a workaround, I'm using import { Image } from "@chakra-ui/react"

[github-actions]

This issue is stale because it has been open 30 days with no activity.