►
From YouTube: What's next for the Microsoft Graph Toolkit!
Description
In this 22-minute developer focused demo, Sébastien Levert and Gavin Barron deliver a show-and-tell session focusing on what’s new in MGT v3.0? Refreshed components with Fluent UI, mult-account support, generic picker control, disambiguation built-in, support for Graph JS SDK v3.0, support for sovereign clouds, support for node 14-16. Then what? Conversation component in collaboration with the ACS UI Library - scope is 1:1 and 1:m conversations. Finally, MGT v3.1 and beyond – enhanced File List experience and Search Component.
This PnP Community demo is taken from the weekly Microsoft 365 Platform Community call recorded on February 14, 2023.
Demo Presenters
• Sébastien Levert | @sebastienlevert (Microsoft)
• Gavin Barron (Microsoft) | @gavinbarron
Supporting materials
• Tools - Microsoft Graph Toolkit | aka.ms/mgt
• Playground - Microsoft Graph Toolkit: UI Components and Authentication Providers for Microsoft Graph – next-v3.0 | https://mgt.dev/next/v3/?path=/story/overview--page
Learn more
• Microsoft 365 Unified Sample gallery - https://aka.ms/community/samples
• Microsoft 365 Platform Community in YouTube - https://aka.ms/community/videos
• Microsoft 365 Platform Community - http://aka.ms/community/home
A
B
Let's
talk
a
little
bit
about
the
latest
on
the
Microsoft
craft
toolkit
I'm
joined
today
by
Gavin,
our
principal
software
engineer,
Dev,
lead
on
the
Microsoft
graph
toolkit
side
and
he's
going
to
do
some
pretty
awesome
demos.
So
can't
wait
for
that.
Let's
move
on!
So,
if
you
don't
know
what
the
Microsoft
graph
toolkit
is
toolkit
is
a
collection
of
reusable
framework,
agnostic
components
and
off
providers
that
allows
you
to
access
and
work
with
the
Microsoft
graph
think
about
drop-in
components
for
any
web
apps
that
are
client-side.
B
So
you
want
to
have
a
people
picker
we
have
a
people
bigger,
don't
have
to
build
all
that
functionality
for
yourself.
We
have
it.
We
handle
graph,
we
handle
authentication,
we
handle
throttling,
we
handle
everything,
so
you
don't
have
to
think
about
it
and
just
build
value
for
your
organization.
The
components
are
fully
functional,
so
they're
not
dummy
components.
They
are
fully
working
connected
to
graph,
have
all
the
capabilities
in
there,
but
they
are
fully
customizable
also,
so
they
allow
you
to
change
how
they
behave,
how
they
look
and
they
work
with
any
web
framework.
B
So
if
you're
working
with
react,
if
you're
working
with
angular,
if
you're
working
with
view
with
zvelt
with
any
new
framework
out
there,
anything
they
work
with
them
and
they
also
work
on
all
modern
browsers
and
they
also
work
as
desktop
apps
when
using
electron,
you
would
be
using
the
graph
toolkit
to
cut
on
dev
time,
because
that
way
you
don't
have
to
rebuild
again
and
again
and
again
all
of
these
components.
How
many
time
have
you
built
a
person
component
connected
to
graph
and
bring
the
picture
and
bring
the
presence
of
that
user?
B
How
many
graph
calls
does
that
represent?
Well
in
the
case
of
the
graphical
kit,
it
represents
for
you
zero
calls
because
we
handle
all
of
them.
They're
beautiful,
but
they're
flexible.
Our
components
are
built
to
looks
like
M365
and
you're
gonna
see
in
this
session
that
they
even
look.
They
look
even
more
like
mt65
in
our
future
version,
but
they're
fully
customizable.
So
if
you
want
to
change,
you
want
to
make
them
look
like
your
own
brand.
You
can
do
it
and
they
work
everywhere.
B
B
First
of
all,
we're
going
to
get
a
fully
refreshed
set
of
components,
so
all
of
our
components
are
currently
being
built
with
fluent
UI
in
mind.
For
a
very
long
time,
we
have
been
pretending
to
be
M365
components
because
there
were
no
alternatives
to
the
technology
that
we're
using
we're
using
web
components.
B
There
were
no
libraries
built
for
fluent
UI
in
that
case,
and
now
we
have
the
opportunity
to
use
our
fluent
UI
web
components,
library
that
the
fluent
team
is
building,
and
now
we
have
rebuilt
a
vast
majority
of
the
controls
and
our
components
using
fluent
UI.
So
that
means
that
you're
going
to
get
really
really
cool
dark
mode
capabilities.
B
That
means
that
you
will
be
able
to
swap
from
one
account
to
the
other
the
same
way
you
can
do
it
today
in
the
M365
portals
big,
big,
big
productivity
gain
right
here.
The
second
thing
that
we're
bringing
is
a
generic
picker
control
that
generic
picker
control
will
allow
you
to
pick
any
entity
from
any
graph
endpoint.
So
if
you
want
to
have
an
an
email,
selector
you're
going
to
be
able
to
build
it,
if
you
want
to
have
a
task
list,
selector
you're
going
to
be
able
to
use
it.
B
If
you
want
to
have
a
site,
selector
you're
going
to
be
able
to
use
it
also,
so
anything
you
want
to
connect
to
First
from
a
selection
standpoint
that
will
also
look
very
fluent
to
you.
We're
going
to
be
able
to
do
that
straight
from
our
new
generic,
bigger
control
for
all
of
you,
spans
of
spfx
and
Building
Solutions
as
web
Parts
in
SharePoint.
You
will
be
able
now
to
build
capabilities
that
will
not
impact
other
providers
of
webpart
components
that
are
also
using
MGD.
B
We
had
some
issues
in
the
past
with
the
way
that
we
build
components.
The
way
that
a
SharePoint
framework
registers
these
components.
Now
we
have
a
built-in
disambiguation,
meaning
that
every
single
providers
will
get
their
own
instance
of
the
graph
toolkit
and
their
own
instance
of
the
components
that
they
have
that
way
they
will
not
have
any
collision
with
other
components.
B
It's
a
very,
very,
very
Niche
feature
that
will
save
a
lot
of
time
for
a
lot
of
UR
Building
spfx
Solutions
we're
not
going
to
support
the
graph
JavaScript
SDK
V3,
with
a
vision
on
our
site
to
support
also
our
V4
in
the
future,
not
for
now,
but
for
later
we're
going
to
also
bring
support
for
our
Sovereign
Cloud.
So
you
will
be
able
to
use
the
graph
toolkit
natively
in
any
of
the
community.
B
Tenants
Community
Cloud,
if
you're
doing
also
on
the
dod
one
and
in
the
cloud
in
China,
so
any
Sovereign
clouds
will
now
be
fully
supported.
Thanks
to
the
toolkit
and
finally,
we
bumped
up
our
support
for
node
right
now.
We
support
14
and
16s,
and
we
expect
to
support
18
as
soon
as
the
SharePoint
framework
also
supports
it.
So
we're
going
to
match
our
our
support
metrics
for
node
with
their
SharePoint
framework.
So
that's
what
is
coming
up
in
V3.
So
let
me
do
something
quickly.
Let
me
see
if
I
can
actually
do
that.
B
B
So
a
couple
of
cool
things.
Now,
for
example,
we
have
our
MGT
login
now
that
has
multiple
Account
Support,
so
you
can
go
here
and
see
that
now
Megan
and
Emily
Brown
are
logged
in
and
you
can
swap
from
one
to
the
other.
It's
going
to
reload
the
entire
UI
based
on
that
identity
will
use
their
token
their
cash.
B
Also,
something
that
we
wanted
to
make
sure
not
to
be
support
is
per
user
cache
so
make
sure
that
well,
weird
data
issues
happen
in
the
future,
so
really
really
cool
component
that
we
have
right
there.
We
also
have
an
MGT
picker,
and
our
picker
here
allows,
for
example,
in
this
case,
to
select
a
list
of
tasks
like
in
this
case,
not
exactly
exciting,
because
we
only
have
one
task
list
right
in
this
sandbox
tenant.
B
You
can
task
and
you
you
can
react
to
selection,
react
to
again
the
entire
object
that
was
selected
to
play
with
some
of
that
stuff
there.
But
let
me
show
you
something:
maybe
a
little
bit
more:
let's
see
users,
let's
go
with
users,
and
now
you
can
do
display
so
now,
I
can
actually
select
any
users.
Let
me
I'm
going
to
select
Ben,
Walters
and
I
could
actually
hear
Say
Hey
I
want
to
sort
it
that
way.
I
want
to
filter
I
want
to
do
all
of
these
kind
of
things.
B
Rather
so
that's
a
really
powerful
capability
that
allows
you
to
basically
build
the
app
you
need
so
we're
empowering
developers
in
that
situation.
Couple
of
other
things
that
I
think
are
really
really
really
interesting.
Is
our
person
card.
Our
personal
card
brings
a
revamp
capability.
Very
interesting.
B
Looks
super
super
super
slick,
all
built
with
fluent
UI
right
in
here
and
here,
with
all
of
our
different
components,
with
our
org
chart
component
and
our
files
and
some
about
us,
but
something
that
we're
bringing
also
as
a
new
capability
to
the
person
card
is
when
I
go
to
another
card
here
where
I
can
set
the
user
I'm
logged
in
as
Megan
Bowen.
But
now,
oh,
no,
it's
not
there.
Yet
it's
going
to
come
in
in
our
next
in
our
next
PR.
B
We
need
to
merge
it,
but
we
now
have
the
ability
to
send
a
message
directly
from
here
using
graph,
so
you
have
the
same
ability
that
we
have
in
teams
to
actually
send
a
quick
message
right
from
here.
So
that's
actually
really
really
really
cool
that
we
have
that
capability
now
and
you're
going
to
see
a
lot
of
the
capabilities.
B
Have
been
updated
if
we
look
at
our
team's
Channel
picker
looks
totally
this
one
was
not
merged
yet
so
you're
going
to
see
that
this
branch
is
really
really
really
moving
a
lot,
because
we're
working
really
really
hard
on
the
future
of
this.
So
let
me
give
you
a
glimpse
to
the
file
list,
because
I
think
we're
going
to
touch
on
that
a
little
bit
later
on
around
the
future.
B
But
you
see
here
we
have
our
nice
fire
list
all
fluent
UI
built
the
phallus
has
been
one
of
our
most
popular
capability
and
we
want
to
make
it
even
better
in
the
future
and
we're
going
to
require
feedback
by
the
end
of
the
session.
So
let
me
pause
for
a
second.
Let
me
say
we're
very
excited
to
bring
all
these
capabilities
to
V3.
You
can
install
it
right
away.
B
B
53
is
really
our
upgrade
to
fluent
in
some
of
our
revamp
capabilities,
but
what's
next
what
happens
after
V3?
Well,
let's
have
a
look
what's
next,
we
are
working
right
now
with
the
ACs
team,
their
Azure
communication,
Services
team,
to
bring
a
native
Microsoft
graph
toolkit
component.
That
would
be
scoped
to
one
to
one
or
to
one
to
many
conversations,
so
you
will
be
able
to
use
a
fully
working
chat
component
connected
to
any
conversations
that
you're
having
in
teams
via
graph
powered
by
the
ACs
UI
Library.
B
This
is
very,
very,
very
exciting
because
it
really
unlocks
amazing
scenarios
that
we
have
been
like
customers
have
been
asking
for
this
for
now
for
years.
Now,
we
believe
is
the
time
that
the
API
is
shaped
in
the
way
that
it
will
Empower
us
to
do
these
things.
And
what,
if
show
you
that
today,
or
at
least
where
we're
at
with
that
thing
so
Gavin,
please
take
over
the
screen
absolutely.
A
So
what
we're
going
to
show
today
is
very,
very
early.
I
will
say
that
I
would
classify
this
as
pre-alpha
software.
However,
what
we
have
done
is
we've
worked
with
our
friends
over
in
the
ACs
team
and
we've
used
their
chat
composite
and
provide
some
back-end
Plumbing
to
this,
so
that
we
can
actually
have
an
ACS
front
end
powered
by
chat
from
Microsoft
graph
AKA
teams.
A
A
All
right
and
we
can
send
messages
but
from
teams,
and
they
are
showing
up
in
a
dedicated
web
application.
What
this
means
is
that
us
developers
will
be
able
to
integrate
teams,
powered
chat
scenarios
directly
into
your
applications
and
it'll
work
seamlessly.
Yes,
there's
some
formatting
issues,
our
friends
and
ACS
that
actually
just
push
the
build
that
resolves
some
of
the
formatting
issues.
I
didn't
want
to
tempt
the
demo
Gods
today
and
pull
that
update.
A
So
that's
a
little
sneak
peek
at
what's
coming
in
terms
of
chat,
I
hope,
you're
all
excited
about
the
scenarios
here.
If
you
could
like
share
some
of
the
scenarios
that
you're
thinking
about
using
this
in
in
in
the
chat,
that'd
be
great,
but
we've
still
got
more
things
to
show
you
that's
on
our
roadmap
for
the
future.
B
Absolutely
so
we'd
love
you
as,
as
in
the
saying,
like
we'd
love,
to
learn
about
scenarios
where
you
would
be
using
a
component
like
this
in
your
app.
We
have
tons
of
scenarios
on
the
back
of
our
mind,
but
we'd
love
to
get
some
of
them,
so
either
drop
them
in
the
chat.
Come
to
our
repo
okay.ms,
slash
MGT,
where
you
can
create
a
conversation
and
issue
whatever
shout
out
loud.
What
you'd
love
to
see
what
can
be
done?
B
There
would
be
great
something:
I
just
saw
Ryan
chat
right
now,
we're
focusing
on
private
discussion,
so
one-on-one
discussions
or
group
discussions.
Our
next
big
jump
will
be
Channel
conversations
for
this.
We
need
to
Envision
it
in
a
way
that
is
a
little
bit
different,
but
would
love
to
to
get
scenarios
where
child
conversation
would
be
useful
and
how
we
can
make
it
happen,
and
how
will
you
make
it
happen
in
MGT
super
simple,
an
MGT
conversation,
a
conversation,
ID
and
voila.
The
rest
is
all
handled
by
MGT.
B
All
the
the
capabilities
between
graph
and
MGT
and
ACS
are
all
happening
there.
So
really
really
really
simple,
so
really
excited
about.
Where
we're
going
with
all
of
this
yeah
Jim,
the
the
support
scenario
is
definitely
one
that
comes
up
a
lot
if
we
go
beyond
what's
next
with
ACS,
which
will
be
our
next
main
big
release
after
our
V3
we're
thinking
about
a
couple
of
improvements
or
like
kind
of
very
welcomed
Improvement
to
some
of
our
components,
one
of
them
being
around
our
file
list.
Experience
and
I'd
love
Gavin.
A
A
A
B
Absolutely
let
me
share
my
screen,
so
one
of
the
comments
we've
got
a
lot
in
the
last
couple
of
months
is
there's
a
huge
yeah.
People
are
excited
about
Microsoft
search
and
the
search
endpoints.
They
want
to
use
it,
but
now
you
need
to
go
fully
custom
right.
We
don't
support
that
capability
natively
in
MGT
today,
especially
with
MGT,
get
which
is
kind
of
our
Swiss
army
knife
to
get
access
to
anything.
B
But
the
name
of
the
component
says
it:
it's
MGT
get
we're
not
again
when
we're
doing
search,
we
need
to
do
to
go
via
a
post.
So
let
me
show
you
where
we're
at
with
our
search
component
that
will
provide
the
same
level
of
capabilities
that
MGT
get,
but
specifically
for
search
scenarios.
So
let
me
go
here.
Let
me
heal
this
one
up
here:
I
have
an
a
nice
search,
Center
or
something.
B
B
Query
showing
the
the
latest
the
recent
capabilities
or
files
or
groups
or
people
you
have
been
working
with
in
a
really
really
simple
approach,
but
also
we
want
to
provide
you
with
not
only
a
search
bar,
because
that
would
be
good
but
not
great,
but
also
provides
you
with
an
interesting
search
results
up
capability
or
component
in
in
MGT.
So
now,
let's
see
now,
I
want
to
search
for
contoso.
B
I
can
actually
now
see
at.
All
of
these
results
are
coming
from
any
entities
that
exist
in
M365,
so
we're
not
talking
about
just
SharePoint
files.
Here
we
were
scope
to
drive
items
in
this
scenario,
but
we
can
search
for
messages
conversations
you
can
search
for
list
items
for
connectors
external
data
trade
within
this
capability,
and
now
you
have
all
the
goodness
of
MGT,
because
now
it's
all
built
with
ngt,
but
also
the
integration.
So
now,
for
example,
here
I
can
bring
my
people
card
as
part
of
it.
B
So
we're
really
building
a
rich
capability-
and
one
is
even
better-
is
not
only
we're
building
this
to
allow
developers
to
build
their
own,
but
we're
also
providing
default
templates.
And
that's
what
you
see
here.
This
will
be
our
default
templates
for
a
list
of
Drive
items,
for
example,
where
you're
going
to
have
the
thumbnail
coming
up
directly,
where
you're
going
to
have
all
the
capabilities
around
the
summary
and
all
that
all
thanks
to
M365
and
their
search
capabilities
directly
on
a
Microsoft
graph.
So
we're
all
built
with
this
in
mind.
B
B
So
it's
not
there
in
in
graph
today,
but
it
would
be
if
it
was
available
as
part
of
Microsoft
search
or
anything
that
comes
up
in
search
will
absolutely
be
available
in
there
so
excited
about
the
future.
We
need
to
get
your
feedback
jump
into
our
repo
say
everything
you
need
I
would
love
to
hear
from
your
scenarios.