►
From YouTube: PWA Studio Community Sync June 26, 2020
Description
Updated Venia Styling, New Mini-Cart, Form Errors, Alpha Release, Merge Carts, and an exciting demo from the team at SimiCart with their new Fashion theme.
A
B
A
A
So
we
will
pick
things
back
up
the
week
after
next.
So
up.
First,
let's,
let's
I'd
said
before
we
got
the
reporting
started
that
we
would
do
a
couple
of
intros
there's
a
couple
new
faces
that
you'll
see
on
the
Adobe
side
and
likely
see
either
in
in
the
project
working
on
PRS
or
in
the
community
slack.
So
I'd
like
to
give
an
opportunity
for
those
new
team
members
to
introduce.
A
Quickly,
alright
max
I'm
gonna
meet
you
real
fast,
sorry
about
that,
so
they
David
obsessive,
owls
team.
You
might
if
you've
been
familiar
and
been
working
as
a
community
member
and
the
page
builder
project.
You
probably
already
know
the
obsessive
allas
team,
but
I'd
like
to
give
them
an
opportunity,
introduce
themselves
they're
going
to
be
working
with
us
on
the
PWA
project.
Moving
forward
for
some
indeterminate
amount
of
time
to
help
us
kind
of
deliver
features
even
faster
for
the
community
yeah.
C
I'm
Dave
McCauley
I've
been
with
Magento
for
three
years
now.
I
came
on
board
with
the
blue
position
and
I.
Let
the
page
builder
project
until
a
few
months
ago,
when
I
handed
it
off
to
one
of
my
colleagues
I'm,
the
team
lead
for
obsessive
house
and
I'm
excited
to
be
on
this
project.
We've
already
done
some
cool
stuff,
so
hopefully
we'll
we'll
excite
you
when
we
show
you
that
in
a
little
bit
I'm
doing.
D
C
A
He
is
so
yep,
so
we
have
some
extra
firepower
here
on
the
on
the
PWA
studio
team
internally,
so
you
guys
will
obviously
start
seeing
the
results
of
having
and
through
love
having
Dave
and
the
rest
of
the
episodes
evolved.
Team
with
us,
it's
gonna
be
a
really
great
thing
for
us
moving
forward
so
to
kick
get
things
started.
Let's,
let's
go
with
some
demos
here,
I
think
up
front.
We
have
an
hula,
that's
gonna
actually
start
us
off
with
a
demo.
For
some
other
reason,
work
they've
been
doing
with
tokens
and
headers.
D
Awesome
yeah,
so
we've
been
working
on
an
epic
related
to
updating
the
venue
UI,
so
it
matches
the
style
guide,
and
that
includes
some
foundational
work
with
tokens,
design,
tokens,
meaning
values
for
colors,
typography,
layouts
and
some
components.
So
we
can
apply
those
things
over
time
consistently
using
the
new
design.
So
I
will
show
some
of
that.
D
So
the
first
thing
we
tackled
was
a
new
header
for
veneno
UI.
This
is
this
is
a
current
header
and
the
updated
header
looks
more
like
this
with
a
new
logo.
It's
the
left,
a
lighter
header.
We
have
a
so
the
search
function
and
the
mini
cart.
Icon
hasn't
been
updated,
so
it
looks
pretty
good
with
mobile
as
well,
and
then,
alongside
that,
we
also
updated
things
like
buttons
and
inputs
so
you'll
see.
For
example,
we
updated
a
search
to
more
of
a
this
drop-down
box
shadow.
D
D
D
A
A
E
E
Yes,
awesome?
Okay,
so
this
is
a
new
new
mini
cart.
Pr.
This
is
2494
is
still
open
for
review.
If
you
want
to
get
your
review
in
Brandon
fell,
Patsy
had
some
good
feedback,
which
we
incorporated
so
always
encourage
folks
to
jump
in
and
make
their
opinions
heard.
But
this
is
the
new
mini,
cart
and
so
I'm,
actually
not
demoing
2494.
That
was
kind
of
a
skeleton
which
had
some
dummy
content
in
it.
E
E
It
opens
up.
It's
got
this
like
blue
little
focus
indicator
looking
thing
underneath
it
to
you
know:
draw
the
users
attention
inside
that
icon
to
the
actual,
open,
mini
cart.
So
this
thing,
let's
see
so
we're
gonna,
fill
in
we're
in
the
middle
of
a
mini,
cart.
Epic.
Right
now,
with
a
bunch
of
stories
in
it,
obviously
so
this
stuff
will
come
in
soon,
but
I
I'm,
just
showing
off
the
PR.
That
has
the
items
in
it,
so
you
can
kind
of
scroll.
E
There's
only
a
handful
of
items
in
here
right
now,
but
you
can
scroll,
shows
things
is
kind
of
a
limited
interaction
view.
This
footer
will
eventually
have
calls
to
action
to
go
to
the
checkout
page
since
merchants
are
gonna
want
to
send
people
there,
obviously,
and
then
also
a
little
call-out
I.
Think
back
to
the
cart
page,
to
do
more
interactions
like
hey
I
want
to
change
the
size
or
the
color
of
one
of
these
things.
E
So
if
you'll
remember
the
old
mini
cart,
you
could
edit
items
inline
we've
removed
that
functionality
here,
just
you
can
kind
of
drop
things
from
this
quick
mini
cart
view
one
other
thing
I
should
mention.
This
is
only
a
desktop
this.
This
mini
cart
now
only
shows
up
in
desktop
if
I
switch
over
to
mobile
view.
E
This
clicking
that
will
take
you
right
to
the
new
cart
page.
So
that's
something
worth
knowing
go
back
to
the
desktop
you
just
so
we
can
see
it
what's.
Gonna
say
something
else
about
that
now:
I
can't
remember
something
about
checkout
man.
I
can't
remember
brain
fart!
Sorry,
let's
see!
Oh,
you
probably
want
to
know
what
happened
to
the
old
mini
cart.
So
we
didn't
remove
the
old
mini
cart.
Oh
that's
what
I
was
gonna
say
about
check
out,
so
this
mini
cart
no
longer
includes
a
kind
of
streamlined,
checkout
experience.
E
E
So,
let's
see
the
old
mini
cart
is
still
around.
We
renamed
it
to
legacy
mini
cart,
so
you
can
go
in
and
hook
that
up
again
if
you'd
like
we're
working
on
a
document,
I'm
working
on
a
document
right
now
for
how
you
might
go
about
doing
that,
this
will
not
come
out
with
the
release.
The
next
release.
That's
coming
out.
B
E
After
that,
this
is
a
major
breaking
change,
because
we've
renamed
the
mini
car
component
to
legacy
mini
cart
and
we've
got
this
new
mini
cart
component.
So
it
is
a
major,
but
it's
not
coming
out
in
the
very
next
release.
So
don't
worry
about
having
to
scramble
to
do
that,
but
hopefully
it'll
be
a
pretty
easy
transition
for
you
to
get
this
new
mini
card
in
and
then
I've
got
some
merge,
e-type
conflicts
here
this
grave
any
border
that
anthology
showed
is
actually
not
supposed
to
be
grey.
E
F
We've
looked
at
that
most
recently
when
I
was
trying
to
implement
a
critical
CSS
plug
and
I
saw
that
many
cards
consists
of
both
the
UI
that
isn't
visible
yet
on
first
load
and
also
the
trigger,
and
therefore
the
actions
for
like
showing
the
card.
And
then
you
know
that
cascades
into
static
requires
for
pretty
much
everything
in
the
mini
card.
It's
probably
pretty
easy
to
change,
but
it
would
take
a
lot
of
careful
regression.
F
D
A
Really
quick
I
just
want
to
make
sure
I
touch
on
a
couple
points
that
Andy
Andy
made,
or
at
least
give
maybe
UX
an
opportunity
to
jump
in
here
some
you're
Scott,
but
generally
I.
Think
if
you
know
there's
been
a
lot
of
work,
that's
happened
with
cart,
checkout
and
now
this
new
mini
cart
and
making
the
old
mini
card
legacy
mini
cart.
So
I
was
wondering
if
we
saw
me
or
Scott,
if
you
guys
wanted
to
jump
in
and
give
kind
of
some
quick
thinking
on.
While
we've
made
certain
changes.
B
G
G
So
you
know,
as
someone
shopping,
they
can
see
things
quickly
in
their
desktop
kind
of
quickly
review
their
basket.
Make
sure
things
are
there
there's
limited
functionality
there,
as
you
can
see
from
this,
essentially
remove
it's
kind
of
all,
that's
there,
but
you
can
verify
some
of
the
some
of
the
configuration
of
that
product
and
and
then
either
jump
right
into
to
check
out
or
or
kind
of,
if
you
wanted
to
into
the
the
entire
shopping
cart,
if
you
wanted
to
make
some
edits,
apply,
coupons,
etc.
G
So,
but
given
the
nature
of
kind
of
the
mobile
experience,
and
that
you
know
cart,
if
you
click
that
you
know,
the
real
estate
is
such
that.
If
you
were
on
cart
and
had
mini
cart,
you
just
have
kind
of
a
slimmed
down
version
of
cart
and
then
click.
You
know,
go
to
cart
and
then
end
up
essentially
in
just
a
robust
experience.
So
we
thought
in
that
case
just
send
people
straight
to
cart.
There
it'll
still
have
the
ability
to
you
know,
jump
right
into
Express.
G
A
I
Hey,
thank
you
yes,
so
for
the
upcoming
release,
there's
kind
of
been
this
known
problem
where
our
air
handling
has
kind
of
been
all
over
the
place.
So
before
we
officially
got
that
in
everybody's
hands,
we
wanted
to
make
sure
that
you're
provided
some
sort
of
consistent
way
to
handle
airs,
specifically
with
forms
so
kind
of
very
briefly.
I
just
want
to
go
over
this
new
component
that
we've
added
what
a
few
cij's
and
how
you
could
start
using
it
once
this
release
comes
out,
so
the
new
component
is
former.
I
It
is
really
simple
that
it
just
takes
a
collection
of
raw,
gradual
airs.
It
Stalin
will
go
through
those
airs
and
kind
of
merge
them
all
together
into
a
single
error
message
to
return
that
to
the
component
and
then
there's
some
fancy
functionality
to
automatically
scroll
you
to
the
top
of
the
form,
because
likely,
if
there
is
an
error,
there's
something
with
between
the
top
of
the
form
and
the
buttons
that
you
need
to
fix.
So
a
simple
demo
of
that
is
have
something
in
my
cart.
I
I
We're
working
on
like
some
context,
aware
error
messages,
but
right
now
it's
just
a
general
error
message
at
the
top
so
very
easily.
Now
you
can
add
that
into
your
components
as
I
mentioned,
the
talent
itself
goes
through
the
collection
of
errors,
verify
checks
to
see
if
it's
a
graph,
QL
error,
just
general
air
merge.
B
I
All
together
and
makes
it
really
easy
kind
of
to
handle
any
airs
that
you
might
encounter
with
submitting
forms
collecting
data
anything
in
the
app
pretty
straightforward
doesn't
just
landed
in
the
release.
I
think
yesterday,
so
I
think
it
it's
in
the
alpha
2
package,
which
actually
segues
into
my
next
topic.
Unless
there's
any
questions
first
about
warm
air
or
I,
move
on.
I
I
H
I
I
Where
that
error
message
may
be
a
little
technical
in
nature,
so
something
you
would
want
to
look
out
for,
if
you
don't
want
to
render
some
technical
like
QT
y,
exceeds
maximum
allowed
limits.
You
can
kind
of
massage
that
into
your
your
own,
nicer
error
message
and
this
talent
here
would
be
a
perfect
place
to
put
that
logic
to
put
in
like
an
air
mapping
logic
that
just
goes
through
and
automatically
maps
technical
error
messages
to
human
readable.
One.
I
I
Are
closely
following
them
in
their
regression
cycle,
so
700
is
the
official
release.
Number
were
major
revving
like
crazy,
so
we
have
published
alpha
1
and
alpha
2
already
I
think
it's
largely
gone
through
a
lot
of
regressions
so
far
with
only
one
minor
bug
found
related
to
like
payments
or
the
payments
not
out
of
selected
with
very
minor.
I
So
if
you're
interested
in
like
pre-release
versions,
we
have
published
as
the
NPM
just
go
out,
and
look
for
the
alpha
alpha
to
700
alpha
to
release
and
you
could
start
poking
around
and
what
new
features
are
there
very
soon
we
should
have
those
release
notes
consolidated
together
to
so
you
can
go
through
and
see
all
the
new
stuff
that
we
got
going
on.
It's
gonna
be
the
cart
page
checkout
page.
We
got
a
lot
of
neat
stuff
under
the
hood,
detect
that
coming
up.
Not
this
next
Friday
we're
off,
but
the
following.
A
A
A
Like
last
week
of
July,
so
keep
an
eye
out,
for
that
will,
of
course,
is
that
timeline
is
approaching
and
we'll
make
sure
that
on
these
calls,
where
we're
kind
of
plenty
over
no,
no
and
of
course,
you'll
see
in
the
project
the
release,
notes
and
everything
else
happening.
So
that's
it
for
my
blabbering
Tommy.
Thank
you
Steven.
We
have
a
demo
from
you
well
from
the
community,
I
guess
from
mirjana's
yeah
yeah.
J
J
Believe
his
name
is
Christopher
I,
don't
know
if
he
goes
by
Chris
or
Danny
here,
but
a
really
cool
little
piece
of
functionality.
That
I
think
we
we
all
were
wanting,
but
didn't
just
didn't
get
done
yet
so
this
just
merges
carts
wouldn't
want
to
user
logs
in
and
it
uses
the
graph
QL
mutation
for
see
emerging
carts.
Here's
the
docs
on
the
dev
Doc's
page,
really
simple:
you
just
take
a
source
card
ID
and
a
destination
card
ID.
J
We
now
have
the
scarf
and
then,
if
I
go
and
I
sign
in
as
a
user,
that
was
my
last
pass
plug-in
there
you'll
see,
there's
two
items
because
I
had
a
I
had
some
pants
in
there.
But
now
you
see
the
scarf
is
in
the
cart,
so
this
route
really
simple
on
the
surface
and
but
now,
but
now,
instead
of
maybe
being
in
a
confusing
state
where
you,
you
had
an
item
in
your
cart
and
needs.
Oh
I
actually
have
an
account
here.
J
J
Yeah
I,
don't
know
if
that
was
the
question
or
not,
but
let's
see
I'll
show
the
code
real
quick.
This
is
a
callback
for
the
sign-in
and
this
was
done
in
a
few
places,
they're
similar
logic,
but
basically
we
just
fetched
that
source
card.
Id,
though
that
you
saw
for
the
mutation
we
sign
in,
so
that
the
next
mutation
we
make
is
authorized.
J
We
cleared
any
data
that
we
in
redux
and
the
cash
just
to
make
sure
that
scale
data
isn't
around
when
you,
when
you
create
the
new
cart,
then
we
get
the
new
cart
ID.
Then
we
just
call
the
merge
carts
so
a
pretty
simple
little
callback
here
that
just
handles
that
logic
on
sign-in
or
when
you
go
to
create
an
account
from
a
page.
So
if
you're,
if
you're
signed
out
and
if
you're
on
a
guest,
let's
see
your
guests
have
an
item
in
your
cart.
You
don't
have
an
account,
but
you
create
one.
J
A
Awesome
thanks
Steven
and
thanks
Chris
for
that
contribution
into
the
project.
Right
super
super
valuable
and
you
know
I'd
say
people
talk
about
a
little
bit
on
community
corner,
maybe
Tommy
and
Lars,
but
you
know
obviously
we're
trying
to
make
sure
that
we
keep
up
with
all
of
the
contributions
that
are
coming
in
the
project.
A
We
have
some
things
that
we've
been
doing
to
kind
of
streamline
some
of
that
there's
some
of
those
feedback
loops
and
that's
obviously,
a
focus
for
us
because
we're
getting
some
really
high
value
contribution
from
the
larger
community,
and
so
that's
something
that's
really
important
to
the
team.
So
maybe
we'll
save
that
for
a
later
topic,
but
for
right
now,
let's
get
to
the
exciting
part
of
today's
demo,
not
that
everything
I
say
this.
Every
time
I
feel
like
I
always
stick
my
foot
in
the
mouth.
A
A
B
Right,
I'm
very
excited
to
be
here
to
be
sharing
with
you
guys
the
results
of
what
our
team
has
been
working
on
lately.
So
a
brief
introduction,
I'm
Dominic
from
scenic
our
team
and
we've
been
working
on
PW
for
about
two
or
three
years
now,
and
until
very
recently,
we
have
launched
theme
music
on
DIY
studio
and
we
call
it
recently.
It
is
a
beautiful
fashion
industry,
so
I'm
gonna
be
sharing
my
screen.
B
Right
I
understand
the
today's
a
genuine
speedy
fact,
so
I'm
gonna
try
to
be
brief.
In
my
demo,
the
probably
introduction
of
the
technology
that
we've
used,
we
have
been
using
Magento
2.3.5
for
period
PWI
studio.
We
have
been
using
version
5,
but
we
have
status.
Ok
on
version
6,
so
I
think
in
the
near
future
is
gonna,
adapt
PWL,
studio
version,
6,
alright.
B
So
let's
go
to
the
for
the
demo.
So
for
the
header
you
can
see
on
the
left
side
of
the
header
we
have
the
search.
Is
it
instant
search
for
the
wait?
I
call
the
right
side.
We
have
my
accounts
region
with
the
log
in
register.
For
this
thing
we
use
minimalist
design,
so
everything
is
looks
pretty
minimal
and
I
see
up.
Here
we
have
a
card.
We
used
a
quick
card
concept
for
the
cards.
Here
we
have
the
star
view
with
each
currency
and
in
language.
B
B
And
here
we
have
the
menu
with
a
category
image
and
the
sub
categories.
On
the
left
side
we
have
banner,
which
is
a
slider,
but
here,
for
the
sake
of
these
stabilizers
upload
one
image
for
the
banners.
So
if
you
put
upload
more
banners,
it
will
be
turned
into
a
slider
and
the
same
goes
to
categories
people
upload
more.
If
you
turn
into
a
slider
and
there's
the
arrows
over
here
down.
Here
we
have
product
slides,
which
is
the
product
list,
and
this
is
all
configure
go
in
the
backend.
B
For
the
footer
is
pretty
basic:
we
adapt
the
luma
theme
for
Magento,
so
we
have
the
SUBSCRIBE
box
and
the
cm8
pages
down
here
the
Siena
pages,
which
is
also
configurable
using
the
default
Magento
GMs.
By
going
to
content
and
pages,
this
is
all
configurable
using
HTML
CSS
all
right.
Let's
try
to
go
to
your
category.
B
B
B
B
And
things
going
on
all
right,
we
got
PayPal
if
we
use
PayPal
in
place.
Otto
is
retailer,
goes
to
the
PayPal
checkout
page
yeah
purchase
order
and
check
money
order
for,
for
the
sake
of
this
demo,
I'm
just
gonna
use
check
money,
order.
This
order
and
hopefully
use
assess,
yeah
assess
all
right
and
the
user
can
go
to
view
other
details
to
view
the
orders.
So
this
is
the
layout
of
in
my
accounts,
which
is
pretty
basic.
It's
just
like
the
luma
theme,
but
with
an
elegant
touch
of
our
fishing
team.
B
All
right,
I'm
gonna
talk
a
little
bit
about
what
we
have
been
doing
for
the
optimization
of
the
fish
feed,
so
we've
been
using
some
library
for
react
when
we
act,
loadable,
which
is
oscillating,
react,
lazy,
load
image
is
also
a
big
problem
when
we
comes
to
the
to
the
picture,
so
we
optimize
every
image
before
we
upload
them
onto
the
site.
Mostly
it
in
tiny
PNG
also
is
get
site
for
fql
for
food
packaging
and
also
for
food
package.
B
We
use
varnish
cache
one
more
thing
that
I
think
that
you
guys
might
be
asking
which
is
the
here
coverage,
though
this
is
the
part
where
we
are
using
graph
here,
which
is
a
stock
on
three
categories:
product
listings
product
details,
URL
resolved.
We
also
use
it
in
the
customer
information
like
orders
address
subscription
and
also
for
PayPal
payments
artist.
I
have.
B
The
place
be
strong
here,
so
you
see
your
way
up
doing
a
pretty
good
job
on
desktop,
but
on
mobile
the
score
is
still
pretty
low,
so
we
still
have
a
lot
of
work
to
do
in
mobile,
optimization
and
for
the
future.
We
I
think
we
gonna
use
our
graph
here
on
cart
and
checkout.
Hopefully,
when
PwC
do
version,
seven
is
out
alright
I
think
that's
it.
For
my
demo,
come
to
you
Andrew
I'm,
ready
to.
A
B
A
A
Alright
awesome,
so
thanks
Dominic
thanks
for
sharing
with
us,
we
look
forward
to
you
know
all
the
all.
The
work
that
you
guys
will
continue
to
do
on
on
your
semi,
cart
and
fashion
theme.
Definitely
keep
us
in
a
in
the
loop
and
let
us
know
how
we
can
help
well,
of
course,
keep
pinging
you
for
contributing
things
back
in
the
project
like
Stephen
says,
and
you
know,
but
we're
really
excited
for
what
you
guys
have
done.
B
A
I
I
So
if
anybody
is
ever
looking
to
contribute
back
to
the
project
or
if
you're
just
bored
one
day
and
looking
for
stuff
to
do,
we
have
a
community
backlog
project
board
on
github,
we
have
Anna
groomed
from
our
backlog
that
we
deem
a
priority
and
things
that
we
tagged
it
Help
Wanted,
there's
a
new
initiative.
It's
you've
done
contributions
in
the
past
related
to
points
they're
kind
of
based
on
priority
and
severity.
Now,
so
we
got
priority
and
severity
on
all
of
our
bugs.
I
We
got
special
achievements
if
you
want
to
pick
up
new
ones
but
yeah
if
you're
interested
in
any
work.
This
is
where
you
go.
If
you
have
any
questions
about
anything,
we
are
available
on
black
as
well.
I
think
I'm
at
two
evil,
so
yeah.
If
anybody's
interested
in
contributing,
we
have
the
bandwidth,
we
have
the
resources,
go
out
and
pick
up
a
ticket,
and
if
you
have
any
questions,
please
let
Andrew
well
I
know.
A
Thanks
Tommy,
yeah
and,
of
course,
of
course,
continue
to
reach
out
to
larger
Jordan
here
on
our
community
maintainer
z--
right
as
a
resource
community
slack
also
I'd
say
like
you
know,
that
board
is
really
really
I
think
valuable
in
terms
of
looking
at
what
we
are
prioritize,
an
internal
team
of
secret
contribution
on.
Of
course,
we
continue
to
accept
things
that
that
come
in
kind
of
that
are
that
are
not
identified
on
that
board
contribution
comes
in.
A
That's
that's
not
identify
on
that
board
will
take
those
things
in,
as
we
have
bandwidth,
but
I
think
if
you're
looking
for
a
great
way
to
streamline
some
contribution
or
get
some
get
some
points
for
contribution,
that's
the
that's
the
best
place
to
start
so
that
is
all
I
think
that
we
have
for
today
I'll
quickly
just
open
up
the
floor
and
anyone
on
the
on
the
line.
Anybody
on
the
team
that
has
any
other
thing
to
add
for
today's
meeting
before
we
adjourn
for
the
next
two
weeks
right.