Meeting of the Experience Builder Initiative 2024-05-23 [#3449517]

:wave: Hi, and welcome to the fortnightly meeting of the Experience Builder initiative. :tada: (edited)

Gábor Hojtsy (he/him)	Hm, is it monthly, every other week or every Thursday? :slightly_smiling_face: Here you wrote monthly, in https://drupal.slack.com/archives/C072JMEPUS1/p1716195425070489 you wrote both every other week and every Thursday :slightly_smiling_face:
Griffyn Heels	Hahaha :exploding_head:
Griffyn Heels	That's confusing, I'll clarify tomorrow.
Griffyn Heels	Lets go with fortnightly for now, then can see if it needs to be more frequent.

0️⃣ Who is here today? Comment in the thread to introduce yourself. We’ll keep the meeting open for 24 hours to allow for all timezones.

kimb0	Kim :wave::skin-tone-2:
larowlan	:wave: Lee :flag-au: :palm_tree:
Griffyn Heels	Griff Aus :wave:
acbramley	Adam :wave:
DanielVeza	Daniel :wave:
sime	:eyes: Si, Aust (edited)
thejimbirch	Jim
VladimirAus	Vladimir :wave:
lauriii	Lauri :wave:
nod_	:wave:
wimleers (he/him)	:wave:
mattgyver	matthieu :blob_wave:
penyaskito	Christian :wave::skin-tone-4:
baddysonja	Curious to learn what is going on here, reading through the threads now. Greetings from Europe :smile:
Danish Shah	danish :wave:
raubin	Rob, Hello everyone :wave:
pfrilling	Hello :wave:
Andrei Zvonkov	:wave:
Chris Greatens	Chris :wave:
Kristen Pol (she/her)	Kristen, California, catching up :wave: (edited)
e0ipso	Mateu, from Mallorca :desert_island:
dharizza	Dharizza, from Costa Rica! Hi! :wave:
Dennis A. Torres	Dennis, from Zaragoza :spock-hand:

1️⃣ Do you have suggested topics you are looking to discuss? Post in this thread and we’ll open threads for them as appropriate.

larowlan	SortableJS for drag and drop
larowlan	Standing item for 'what sync meetings do we need in the next month'?
VladimirAus	Documentation: separate guide or part of the existing guide?
catch	Next steps for #3365551: Add the notion of a 'configured layout builder block' to solve a number of content-editor and performance pain points
penyaskito	same as catch
larowlan	Should we start doing regular sprints and ceremonies

2️⃣ Discussion of 0.1 milestones breakdown document

larowlan	I tried to breakdown the requirements/milestones (see channel bookmarks) into smaller chunks. Interested in feedback on the items
lauriii	I reviewed what was there yesterday. It looked like a really good start
wimleers (he/him)	Will also take a look!
penyaskito	added to the channel bookmarks if you dont mind
wimleers (he/him)	@Jesse :point_up: Could you review this too?
wimleers (he/him)	:table_tennis_paddle_and_ball: — thanks, @larowlan, I’ve responded to everything.@bnjmnm, can you chime in on 3.0 Real time preview in there? :pray:
Kristen Pol (she/her)	New to this initiative… I find it interesting that Google doc is used rather than issues but maybe I’m missing something or this was already discussed
Kristen Pol (she/her)	I love spreadsheets btw :heart_eyes:
larowlan	Spreadsheet is to plan issues before making them
Kristen Pol (she/her)	Gotcha

3️⃣ Subtopic 1: Theme builder

lauriii	I don't think we have talked about too many specifics around Theme Builder (yet). Maybe I should record a short video where I talked through the vision for this
wimleers (he/him)	I think that’d be very valuable — we should remove the mystery as much as we can. Will the upcoming wireframes cover the Theme Builder part too?
lauriii	I don't think there's anything in progress for Theme Builder yet. We are still working on the high level concept wireframes which means that it's not going to describe any workflows in detail yet.
penyaskito	@e0ipso
e0ipso	:wave::skin-tone-4: I am interested in this. What is the status of this? Is this still in product development phase? I would like to be involved as early as possible in the technical conversations and prototypes.
penyaskito	+1
Kristen Pol (she/her)	Would love to see the video once it’s ready

4️⃣ Subtopic 2: Page builder frontend

DanielVeza	Has it been decided if this will be using Layout Builder as a base or be completely separate? I feel like I've heard both options floated. May still be an open decision?
lauriii	The frontend needs quite a heavy lift. I'd anticipate that's one of the parts where there's less for us to re-use from what we have today.
wimleers (he/him)	@lauriii Maybe you can elaborate a bit more?AFAIK the UX we need to achieve (per your investigation over the preceding months) requires a different approach. Hence an JS-powered UI was the conclusion. That’s also where the current (super rough!) outline of a PoC is headed.See the screenshot of the current UI-outline-PoC at https://git.drupalcode.org/project/experience_builder/-/merge_requests/8...
wimleers (he/him)	:point_up: @Jesse
catch	If it's a completely new layer does that mean the existing layout builder UX remains for view mode overrides and other use cases (navigation) or would you try to replace that too?
lauriii	The experience for editing view modes and creating pages should be the similar
lauriii	otherwise you end up in the same situation that you have today when you use Layout Builder and Paragraphs where you have two different ecosystems that can work alongside but don't integrate well together so that you could use the same building blocks in both.
catch	So it is more or less a new layout builder front end and ditch the old one then?
lauriii	Yes, I would think so.
catch	OK sounds good :slightly_smiling_face:
Kristen Pol (she/her)	Wow… that sounds like a lot of work but starting from scratch means we can “do anything” which is exciting
Kristen Pol (she/her)	I saw a demo of Mercury Editor at Stanford Webcamp which was pretty slick https://webcamp.stanford.edu/session/mercury-editor-easy-to-use-drag-and...
catch	It won't be entirely from scratch because this layout builder/layouts underneath.
Kristen Pol (she/her)	Gotcha but visually from scratch?

5️⃣ Subtopic 3: Data model/persistence layer

larowlan	There's a branch from @wimleers (he/him) for review/feedback here https://git.drupalcode.org/project/experience_builder/-/tree/field_storage
larowlan	Reviews sought on #3343634: Add "json" as core data type to Schema and Database API#comment-15606058 too
DanielVeza	I'll add these to my list :eyes:
wimleers (he/him)	:partyparrot:
wimleers (he/him)	That field_storage branch has an MR associated with it now, making reviews possible: https://git.drupalcode.org/project/experience_builder/-/merge_requests/1... pushed additional commits — more to come!

6️⃣ I’m not sure where to start, but want to contribute to Experience Builder.

acbramley	This is where I'm sitting. Things seem very much up in the air at the moment, feeling a little out of my depth! Lots of cool chats going on but really don't feel like I can get involved anywhere yet
sime	For starshot (aside from trying to help on project browser) I'm planning to do some content like this "Project Browser local dev" to make it easier for people to get up to speed with stuff - and it helps me to learn about it too.So yeah i take video requests, if you think the format is useful.
lauriii	One area we could use help with is defining how to represent components as SDCs: #3446933: SDC incorrectly throws an exception about embedded slots
acbramley	I haven't even opened the lid on SDC tbh, it's something that I don't think we'd use much in day to day so haven't had much of a reason to. Is XB going to be tightly coupled to SDC? (edited)
lauriii	SDC will be the primary way for developers to define components via code
wimleers (he/him)	I totally get where you’re coming from. We’ve got so many things up in the air simultaneously, and a fairly good sense of the big picture, but that’s very hard to convey.It all needs to become much more concrete, which is where the wireframes (due next week!) come in.
wimleers (he/him)	Every person looking to contribute, please:Look at recent commits for https://git.drupalcode.org/project/experience_builder/-/commits/0.x, and skim those commits’ contents, which ones did you find interesting?Look at the conceptual areas defined in CODEOWNERS (https://git.drupalcode.org/project/experience_builder/-/blob/0.x/CODEOWNERS), which ones do you find interesting?Which conceptual areas do you have the strongest opinions about or the most/unique expertise in?(After next week) Which areas of the wireframes interest you the most?:point_up: Answering those 4 questions (currently 3) should allow us to help you start contributing! :rocket: I’d love to make more people co-owners of conceptual areas — i.e. I’d love to add many of you to CODEOWNERS. :nerd_face: Help own the area that you have expertise in, strong opinions about!Especially initially it’ll still be rather vague though, because a lot of precise decisions still need to be made. That means you can also influence more! IOW: early contributors will need to be more comfortable with vagueness and help make it more concrete.(@Griffyn Heels — if these 4 questions end up working well for @acbramley, then maybe we could make that part of every meeting? :crossed_fingers: Let’s wait and see — and refine.)
raubin	@wimleers (he/him) aside from code contributors, my team also has the ability to help with documentation, visual design and graphics for documentation, and feedback/guidance on UX.
wimleers (he/him)	@raubin Thanks!When you say “documentation”, do you mean end-user documentation or developer documentation? We’ll need the latter soon (and it should be written by those writing the code), the former only much later.Visual design → I defer to @lauriii and @Jesse but given that we don’t even have wireframes yet, I don’t quite know how to put those valuable skills to good use just yet :sweat_smile: Graphics for documentation: does this include making much better versions of things poorly drawn on a piece of paper by somebody who can barely still write (:wave: I need to practice writing my own name for writing birthday cards :joy: )
Chris Greatens	This category fits me. Trying to learn more about each part of Starshot so I can figure out where I can help and what I’m most interested. This thread, especially @wimleers (he/him) comments, is helpful.
Kristen Pol (she/her)	New to initiative… thanks for the list @wimleers (he/him) I think I’m missing where to review all the wireframes… but I’m on my phone so harder to navigate around
ctrladel	@wimleers (he/him) @lauriii that code owners list feels like an attempt to identify epics and their owners. With the number of things happening in parallel perhaps we need an issue just to identify all the different tracks of work and whose owning them
raubin	@wimleers (he/him)On docs: both! We can review readme's for clarity and stub out d.o pages that can be filled out more completely later. We have at least a couple people that love writing documentation of all types and are technical folksSounds good on visual design - we can also help with wires and other early conceptingHa! Yes, though it's tough to beat a good hand drawing. :smile: I work at a keyboard because my hand writing is so bad, so I hear ya there! Happy to pass that low fidelity stuff to the right people on the team though.
Jesse	@raubin I’m going away for a few days (in about 30 minutes!) until next Wednesday by which time we hope to have some wireframes. I will review those once I’m back. But yes, I’d be very keen to work with you/your team on visual design and UX stuff as that will pair very well with my skillset of frontend and UI development.
raubin	Awesome, @Jesse thanks for connecting. Enjoy your time away and we can sync when you're back and have had a chance to review
Andrei Zvonkov	Hi @Jesse I am in the same team with @raubin. I would definitely be interested in helping with Design, Wires, UI and/or FE tasks. Please keep me in the loop as well when you are back.

7️⃣ Any feedback on the meeting format. Early days, so very happy to amend based on feedback.

wimleers (he/him)	Suggestion at the end of https://drupal.slack.com/archives/C072JMEPUS1/p1716469272981229?thread_t... — depending on how that turns out to work, that is :sweat_smile:
Kristen Pol (she/her)	Gábor does a celebrations thread which is nice for people to put good stuff that’s landed (in #d11readiness) (edited)
Griffyn Heels	Fab, will incorporate those elements. Thanks.

8️⃣ @larowlan: “SortableJS for drag and drop”

larowlan	In https://docs.google.com/spreadsheets/d/1hJ8Bd78MIzqJZsmyF0oOb1hajGIfA97k... @Jesse indicated there's a working prototype with SortableJS and iframes to prevent CSS bleeding. Wondering what branch that is in so can give it a try
DanielVeza	SortableJS is the existing library used in LB for moving blocks, I'm interested to see how this is different for XB
larowlan	Yeah same
larowlan	Especially in the context of previous comms that there would be some sort of FE framework in use
DanielVeza	Part of the decoupled LB work was saving the changes client side and pushing a chunk to Drupal rather than doing a round trip every time something changed on the page. I'd be interested in exploring if thats an option too. I imagine we would need a way to manage state. Most of the mature FE frameworks already have state libraries, I'm unsure about a vanilla JS state library. (edited)
darvanen	@DanielVeza if we were using graphQL as the transport Apollo could do that task?
Jesse	Hello!If you enable the https://git.drupalcode.org/project/experience_builder module (and the Experience Builder Vite Integration submodule) you should get a new button in the navigation that will take you to the very W.I.P P.o.C I’ve been working on.The code for it is already merged into 0.x branch and sits in the /ui directory.So far it uses React, Redux, Typescript as a basis, sortableJS for drag and drop and Radix UI and CSS Modules for styling. The requests to the backend are faked/mocked using MirageJS.It demonstrates early versions of interactionsDragging a new component on to the page from a list (in the left sidebar) into either the visual preview or the tree view (on the right sidebar)Dragging/sorting/nesting existing components via the visual previewDragging/sorting/nesting existing components via the tree viewDeleting componentsVERY limited Edit functionality - click the edit and the name will change to Foo.
wimleers (he/him)	I’d be interested in exploring if thats an option too. I imagine we would need a way to manage state. Most of the mature FE frameworks already have state libraries, I’m unsure about a vanilla JS state library.@DanielVeza Does that mean you’re interested in the “wire format” (i.e. data sent back-and-forth between client and server), or in the client-side state management, or both?
wimleers (he/him)	@DanielVeza @Jesse Related to the reply just before this one: see this comment thread WRT OpenAPI on the doc @larowlan made: https://docs.google.com/spreadsheets/d/1hJ8Bd78MIzqJZsmyF0oOb1hajGIfA97k...
larowlan	This sounds really promising @Jesse - I must admit when I heard 'SortableJS and iframes' I was concerned . Will have a look at the demo today :tada: . I think Dan was hinting that he was expecting something redux toolkit and RTK to be in the mix. So Jesse has confirmed that Redux is in
larowlan	@Jesse any opinion on mirage (which is 0.1, 280k weekly downloads) vs msw (2.3.0, 2.8M weekly)? MSW is our goto for jest tests and mocking. Decoupled LB examples use it in Storybook and tests - https://project.pages.drupalcode.org/decoupled_lb/?path=/story/component...
DanielVeza	Does that mean you’re interested in the “wire format” (i.e. data sent back-and-forth between client and server), or in the client-side state management, or both?Yeah essentially what @larowlan said, I got a bit lost with some of the original implementation details :slightly_smiling_face:. Jesses response has cleared things up. I'll spin up a copy of the demo and have a play.

9️⃣ What sync meetings do we need in the next month?

wimleers (he/him)	Weren’t this going to every other week? i.e. twice a month? :thinking_face:
Kristen Pol (she/her)	Given the aggressive timeframe, wouldn’t meeting weekly make sense?

1️⃣ 0️⃣ @VladimirAus: “Documentation: separate guide or part of the existing guide?”

Kristen Pol (she/her)	What’s the existing?
VladimirAus	Start as a one pager on the existing guide
Kristen Pol (she/her)	What is the “existing guide” is what I’m wondering?

1️⃣1️⃣ Next steps for #3365551: Add the notion of a 'configured layout builder block' to solve a number of content-editor and performance pain points via catch

larowlan	This so gnarly we have a trello board to manage the tasks. Its like a project on its own
larowlan	We have 14 open tasks
larowlan	Our last discussion around this was that perhaps it would be easier to do as a standalone module rather than integrating it directly into core. That way it could be experimental
larowlan	Let me know if you want access to the trello board https://trello.com/b/2LKRwaYO/preconfigured-block-lb
timplunkett (he/him)	clicked for access (sorry if that's extra noise)
larowlan	fair bit of overlap between this and the two config entities you're working on in #3444417: "Developer-created components": mark which SDCs should be exposed in XB - I mentally mapped 3444417 as 'oh so that's layout builder browser' - it has two config entities for category and allowed blocks :sweat_smile:
larowlan	I worked out how to make that board public so it should be visible now
penyaskito	@larowlan are the todos in order and are there any blocker relationships between them? I might be able to look at this during the weekend, but not sure where could I start.Can't do my homework of getting up to date right now, even if I've been following it, and you might be AFK on weekend if I have questions (hope you get deserved rest!) (edited)
penyaskito	I'm guessing the legacy mode options changes are affordable and not blocked on anything, might be a good start for me
larowlan	It has been a while since I looked at it
larowlan	happy for you to ask me questions, I'll answer if/when I can
DanielVeza	We made some really good progress on this particular issue and our POC was working well. The main problem at the time was that it became too big to realistically get into core. We need to either split it into smaller bite sized pieces or as @larowlan said, complete it in contrib first with the goal to get it into core after it's complete.A new approach was suggested in comment 18 of that issue, I haven't picked it up again to review that (edited)

1️⃣2️⃣ Should we start regular sprints with ceremonies (sprint review demos, planning, retros)

larowlan	Running this like a real life project sounds appealing. We have the requisite PM resources available.
larowlan	Not everyone is FT but sprint planning could reflect that
Kristen Pol (she/her)	Sounds fantastic but I’m not the one doing anything (at least yet) :sunglasses:

Participants:

Gábor Hojtsy, Griffyn Heels, larowlan, VladimirAus, catch, penyaskito, lauriii, Wim Leers, Kristen Pol, e0ipso, DanielVeza, acbramley, sime, raubin, Chris Greatens, ctrladel, Jesse, Andrei Zvonkov, darvanen, timplunkett (he/him)