►
From YouTube: Microsoft 365 PnP – General Microsoft 365 Developer SIG community call – 27th of May, 2021
Description
Microsoft 365 PnP Community - General SIG call on May 27th. Demos: 1) Getting started with HTWOO UI, 2) Gain your users attention with the Microsoft Teams Activity API, and 3) Deep linking from List Formatting to Power Automate solution. Recent PnP project releases - yo Teams generator-teams v3.1.0 GA and v3.2.0 Preview, yo teams-build-core v1.2.0 Preview, and Microsoft Graph Toolkit v2.2.0 GA. Join Viva Connections private preview! Visit Microsoft Teams samples gallery, preview Microsoft 365 Extensibility look book gallery, and register for June trainings on Sharing-is-caring. The host of this call was David Warner II (Catapult Systems) |@DavidWarnerII. Q&A takes place in chat throughout the call.
Learn more:
• See the full blog post for this call at: https://aka.ms/m365pnp/community/blog
• Download invite for bi-weekly General M365 Dev SIG call: http://aka.ms/spdev-sig-call
• Learn more about the Microsoft 365 Patterns and Practices community at: http://aka.ms/m365pnp
• Visit the Microsoft 365 Patterns and Practices community YouTube channel: https://aka.ms/m365pnp-videos
A
A
Our
agenda
for
the
call
today
includes
the
reviewing
of
updates
for
our
pnp
initiatives,
we're
going
to
go
through
the
gamut
of
those
that
are
relevant
for
this
call:
powershell
pnp
framework,
core
sdk,
yo
teams,
microsoft
graph
toolkit,
oh
my
so
many
more
tims
team
samples
and
then,
of
course,
the
favorite
optional
picture
time
we're
going
to
be
all
involved
with.
So
we
look
forward
to
that
and
then
we've
got
three
incredible
demos
from
stefan,
thomas
and
chris,
so
we
look
forward
to
all
of
those.
A
Let's
begin,
though,
with
the
opportunities
to
participate
in
the
community,
we
have
an
inclusive
open
source
community,
so
we
would
love
to
see
you
get
more
involved
that
could
include
demoing
a
solution
on
these
calls.
We
would
love
to
see
you
demo
a
solution
or
a
sample
that
you've
created
if
you've
not
yet
created
a
sample.
Well,
that's
the
next
opportunity
provide
or
contribute
to
github.
We
have
a
lot
of
sample
repositories
which
we'll
show
you
that
are
available
to
you
all
open
source,
all
available
for
you
to
contribute
to.
A
Of
course,
we
always
welcome
feedback
and,
as
patrick
says,
we
love
positive
feedback,
but
we
want
to
know
about
all
feedback.
So
if
you
have
any
constructive
criticism
or
feedback
that
you
would
like
to
see
us
bank
in
terms
of
changes
for
these
calls
or
within
the
community,
please
let
us
know
we
want
everyone
to
feel,
welcome
and
empowered
to
make
the
community
yours
as
well.
A
Let's
go
to
our
plethora
of
links.
There
are
a
ton
of
resources
and
opportunities
available
for
everyone,
whether
it
be
starting
with
developer
videos.
If
you'd
like
to
learn
more
about
some
of
the
features
and
resources
and
tools
and
initiatives
available
to
us
within
this
community,
you
can
go
to
aka.msm365dev
youtube
and
then,
of
course,
we've
got
our
microsoft,
pnp
community
videos
at
aka.ms4,
m365,
pnp
videos.
Now
we
have
a
whole
host
of
open
source
sharepoint
related
items.
You
can
see
all
those
links
there.
A
The
list
keeps
on
growing
as
we
move
to
the
right
sample
galleries,
aplenty
team
samples
web
part,
samples,
power
platform,
samples,
extensions
list
formatting
the
list
goes
on,
so
please
don't
hesitate
to
take
advantage
of
those
if
you
are
feeling
overwhelmed
by
that
and
need
one
place
to
go
aka.ms
forward.
Slash
m365pnp
is
your
landing
spot.
That
will
take
you
to
all
these
variety
of
resources
that
are
available
to
you
in
one
stop.
A
Next
up
is
our
viva
connections,
private
preview.
So
if
you
would
like
to
register
for
this
preview,
then
take
advantage
of
that
aka.ms
link
at
the
bottom.
You
can
build
optimize
mobile
experiences
for
microsoft,
viva
connections
so
go
to
that
link
and
register.
If
you're
interested
in
becoming
part
of
that
private
preview,
the
microsoft
teams
toolkit
version
2
is
now
available,
so
you
can
access
that
at
aka.ms
forward.
A
Slash
teams
hyphen
toolkit,
works
within
visual
studio
code
to
allow
you
to
create
debug
and
deploy
teams
apps
directly
within
vs
code,
so
kind
of
consolidates
that
experience
to
a
nice
packaged
experience,
samples
of
plenty
when
teams
are
is
on
the
shelf.
So
if
you
would
like
to
use
or
contribute,
this
is
a
sample
gallery
that
is
again
available
to
everyone
in
the
community.
You
can
take
advantage
of
it
by
going
to
aka
dot.
Ms
forward
slash
teams
dash
samples.
Again
this
is
open
source,
so
it's
not
just
for
using.
A
You
can
absolutely
contribute
back
to
it.
We
invite
you
to
do
that
and
we'll
see
a
few
samples
here
at
the
end
of
the
intro
slides
today.
In
fact,
now,
if
you're
looking
to
see
how
you
could
get
some
inspiration
or
how
others
have
created
solutions
and
samples
in
a
more
consumable
lookbook
like
way,
the
new
microsoft
365
extensibility
lookbook
gallery
is
available
so
aka
dot.
Ms
forward
slash
m365
for
slash
extensibility,
it's
going
to
show
you
a
different
verticals
in
which
the
platform
has
been
extended.
A
Sharepoint
onedrive
power,
automate,
powerapps,
microsoft
teams,
you're
going
to
be
able
to
see
it
from
a
technology
perspective
scenarios.
It's
a
really
enjoyable
experience
to
get
ideas
on
how
you
can
extend
your
sharepoint
experience
now.
All
of
these
things
combined
may
feel
a
little
overwhelming.
A
Well,
if
you
call
now,
we
have
even
more
for
you,
but
in
this
case
we're
going
to
provide
you
hands-on
guidance.
Now
the
sharing
is
caring
is
an
initiative
or
a
program
within
the
patterns
of
practices,
community
that
provides
hands-on
guidance
on
how
to
take
advantage
of
whether
it's
using
the
resources
that
are
available
to
you
or
contributing
back.
You
may
just
simply
want
to
start
getting
started
with
the
resources
that
are
available
and
not
quite
sure
how
to
do
that.
A
There's
a
lot
of
resources
available,
such
as
spf
x,
samples,
not
quite
sure
how
to
use
all
of
them.
They
span
the
spectrum
of
versions.
So
how
would
I
take
advantage
of
those
different
versions?
How
do
I
manage
them?
We
have
sessions
that
provide
you
guidance
on
how
to
do
that
when
you
move
beyond
that,
you
want
to
start
contributing
back
well,
there
may
be
some
hurdles
there
as
well
around
how
to
utilize
github.
A
Perhaps
you
would
like
to
demo
on
a
call
but
you're
a
little
nervous,
wide
spectrum
of
opportunity
for
sessions
that
are
available
to
you
now.
These
are
hands-on
guidance
sessions
that
are
safe
space,
inclusive
opportunities.
We
do
not
record
the
sessions
they're,
absolutely
free
and
they're,
scheduled
every
month,
all
throughout
the
month,
for
you
to
join
and
take
advantage
of
in
a
collaborative
space.
A
We
also
have
the
ask
me
anything's,
coming
up
in
june
for
graph
and
mgt
as
well
as
teams
dev,
so
two
popular
topics
that
we'll
actually
see
a
little
bit
more
about
today
and
then
topics
coming
soon
are
how
to
contribute
back
to
those
repos
cli
for
microsoft,
365
and
then
the
power
platform.
So
we
invite
you
to
take
advantage
of
all
these
sessions
again
free,
safe
space
opportunities,
all
right,
let's
move
into
pnp.net
libraries-
and
I
believe
bert,
is
on
the
call
and
going
to
cover
this
for
us.
B
Yes,
thank
you
david,
so
in
the
pmp.net
world,
what
had
happened
for
the
pnp
framework
library,
so
our
kind
of
older
libraries
to
say
we
are
prepping
for
1.5
which
come
out
next
week.
That's
the
plan
and
for
1.5
there
was
several
improvements,
actually
a
ton
of
fixes
and
small
improvements
from
patrick
goten,
christian,
anton
and
nick
and
myself
over
the
last
week.
So
one
bigger
improvement
is
around
the
people
as
a
gay
interrupt.
So
now
you
can.
B
So
there's
like
schemers
from
2015
still
in
there,
so
you
will
see
us
drop
those
and
the
supported
ones
are
2019
and
later
so,
just
to
be
aware,
if
you're,
using
really
old,
publishing
templates,
you
might
want
to
need
to
upgrade
those
if
you
want
to
use
them
in
combination
with
the
latest
libraries
on
the
pp
core.
As
the
gay
side,
we
had
several
good
improvements
in
this
period.
B
Kyle
daley
built
a
way
to
kind
of
when
you
just
like
when
you
load
the
pnp
core
context,
so
because
he
works
with
pnp
context
when
you
load
that
you
get
like
a
default
web
and
site
object
being
loaded
with
the
change
by
kyle.
You
can
now
plug
in
your
own
additional
data
loads.
So,
with
the
same
request
going
to
the
server
you
just
get
more
data
back,
so
it's
a
way
to
improve
performance.
B
If
you
want
to
make
your
own
rest
and
graph
calls,
you
can
do
that
as
well.
Right
now,
super
easy
to
do
that.
We
have
several
model
improvements,
additional
properties
on
on
this
item
and
file,
and
several
small
fixes
done
by
various
folks
as
well.
So,
overall,
things
are
moving
good
there
and
again
also
this
one
will
release
next
week,
as
version
1.2.
A
C
I'm
here
so
all
the
the
wonderful
changes,
the
pp
framework
that
bet
just
presented
will
drill
down
automatically
to
pnp
powershell
we're
working
also
on
version
1.6
and
as
bad
already
mentioned,
the
the
schemas
for
the
provisioning
engine.
Basically,
everything
before
2019
will
be
deprecated
and
gone
now.
What
is
not
on
this
slide,
but
I
want
to
like
get
some
feedback
from
the
people
here
and
in
the
today
listening
I'm.
I
would
be
interested
in
hearing
what
your
thoughts
are.
C
Would
that
be
a
complete
and
total
blocker
for
you,
or
would
you
say
like
okay,
this
could
work
the
the
reasoning
behind
this
is
that
we
then
probably
will
introduce
more
command.
Let's
there,
where,
typically,
you
would
do
things
directly
with
the
object
model,
you
would
have
to
then
start
to
use
command
list
instead.
So
I
would
like
to
get
your
feedback
there.
A
All
right,
excellent,
thank
you.
Erwin
moving
into
yo
teams,
all
right
so
3.1
was
released
last
week
with
support
for
viva
connection,
app
creation
and
a
new
preview
was
made
available
today
with
github
code
spaces
support.
Now
this
is
going
to
make
it
easy
for
everyone
moving
forward.
So
there's
going
to
be
more
on
this
coming
soon,
but
again,
3.1
released
last
week
and
code
spaces
support
released
today,
in
fact,
so
take
advantage.
Aka
dot,
ms
forward
slash,
yo
teams,
a
fantastic
opportunity
to
create
teams
apps
within
spfx,
all
right.
Moving
into
microsoft.
D
Hey
folks,
good
morning,
good
evening,
good
afternoon,
so
microsoft
graph
toolkit
had
one
of
the
biggest
updates
last
week,
version
2.2,
which
had
really
good
things
for
folks.
First
one
was
the
m
cell
2
provider,
which
is
built
on
top
of
ansel
browser
which
allows
us
to
have
some
really
cool
experiences
like
multi
login,
that's
going
to
be
coming
into
the
future.
D
We
also
release
new
components,
the
file
components,
the
file
components,
allow
developers
to
quickly
add
representations
of
files
or
file
lists.
You
can
also
use
things
like
insights
and
shared
files
to
quickly
get
the
files.
For
you
know,
files
are
shared
with
a
person
or
the
most
recent
files
for
somebody
to
create
like
a
file
picker,
we
also
released
a
sharepoint
framework
library
for
microsoft,
graph
toolkit,
which
solves
the
issue
of
using
multiple
web
parts
on
the
page
and
leveraging
the
same
graph
toolkit
instance.
D
D
Things
like
mgt
person,
get
added
support
for
using
the
presence
apis
inside
of
the
inside
of
the
templating
and
inside
of
the
the
different
lines
that
people
can
choose.
We
also
added
support
for
a
fuel
picker,
so
you
can
use
you
can
select
what
kind
of
user
types
you
want
to
select,
or
you
know
just
select
and
default
group
ids
updates
to
the
channel
picker
to
update
to
the
latest
permission.
D
D
We
are
starting
to
work
on
a
file,
picker
experience
that
makes
it
easy
to
kind
of
select
the
file
and
attach
a
file.
You
also
have
a
proposal
for
uploading
files
as
well
and
something
we're
going
to
be
looking
into
and
as
a
something
that's
long
term
for
that
next
3.0
release
in
the
future.
We're
looking
into
updating
all
our
components
to
be
built
on
top
of
the
new
fluent
ui
web
components.
D
Take
a
dependency
on
the
new
teaming
support
that
they
have
there
and
kind
of
make
it
more
cohesive
with
the
rest
of
the
experience,
and
if
you
do
want
to
try
multi-login
experience
right
now,
you
can
use
our
preview
for
multi-login,
which
allows
you
to
have
a
user
sign
in
multiple
times.
Multiple
accounts
and
switch
between
between
those
accounts
really
quickly
inside
of
the
application,
and
the
line
component
is
updated
to
work
alongside
the
mslt
provider.
To
do
that
so
really
good
stuff.
I'm
kind
of
looking
forward
to
do
all
the
work
that
we're
doing.
A
Excellent,
thank
you
so
much.
That's
really
exciting,
as
well.
All
right!
Last
but
not
least,
microsoft
team
samples.
Now
we've
got
two
new
samples
this
week.
The
first
is
from
marcus
mohler.
Now
it's
a
bare-bones
sample
showing
how
a
messaging
extension
can
drop
an
adaptive
card
into
a
team's
channel
and
then
an
action
on
the
card
updates
right
in
the
card
in
place.
So
it's
a
useful
scenario
for
embedding
and
updating
application
data
right
in
that
team's
conversation
and
then
why
didn't
anybody
think
of
this
sooner
well?
A
Of
course,
we
we
go
to
sebastian
levert
to
help
us
out
with
that.
It's
a
tab
that
dumps
out
the
team's
context
into
the
screen.
So
he
shared
this
one
and
it
works
with
all
kinds
of
tabs
personal
group
chat
and
channel.
So
you
can
easily
see
what
information
you'll
have
access
to
again.
These
are
all
samples
that
are
available
to
you
for
free.
In
fact,
you
can
use
these
unique
short
urls
that
will
take
you
directly
to
the
sample
individually,
which
is
a
nice
little
touch
that
bob
has
added
for
us.
A
You
can
see
them
all
at
aka.ms
forward.
Slash
team
samples-
and
of
course
it
is
open
and
samples
are
welcome,
so
please
don't
hesitate
to
reach
out,
even
if
you
have
any
questions
or
want
to
get
more
involved.
Take
advantage
of
that
sharing
is
caring,
opportunity
to
learn
how
to
submit
to
these
repos
as
well
all
right
now,
it's
time
for
the
optional
picture
time.
So,
if
you'd
like
to
share
your
camera,
we
will
go
into
together
mode.
A
I
think
todd
was
kind
of
rubbing
the
noggin.
For
me,
there
excellent
all
right,
great
great
stuff,
everybody
excellent
all
right.
Now,
let's
move
into
the
the
best
part
of
the
call,
our
demos,
so
we're
going
to
hand
it
over
to
stefan
bauer
who's
going
to
show
us
his
new
framework
for
fluent
design
in
html
and
css.
So,
stefan,
if
you'd
like
to
take
over.
E
Sure,
thank
you,
hello.
My
name
is
stephan
bauer,
I'm
an
office
development
mvp
from
austria
and
I
created.
Let
me
share
my
screen,
a
new
framework
which
is
named
h2o,
which
is
an
alternative
to
fluent
ui.
That
doesn't
require
any
framework
at
all,
so
you
can
use
it.
As
you
see
here
on
the
left
side,
you
can
use
it
in
angular
elements.
You
can
use
it
with
no
framework.
You
can
use
react,
so
it's
just
plain
html
and
css.
E
So
these
are
actually
the
samples
that,
if
you
want
to
get
started
with
it,
but
we
all-
I
also
have
implemented
the
complete
component
library
and
and
so
for
a
style
guide.
So
when
we
go
over
here,
what
is
included
already
in
there?
What
you
see
here
on
the
first
page
is
just
all
the
colors
that
are
used
by
the
microsoft
themes
in
sharepoint,
so
I
directly
extracted
them
from
sharepoint
and
use
it
here
and
then
plain
html
fashion.
E
I
also
have
included
then
and
redesigned
the
fluent
ui
components,
just
in
html
and
css,
and
you
always
have
on
the
right
side.
You
have
an
expand
button
and
you
see
here
actually
how
this
is
spelled
out
and
we
have.
I
have,
of
course,
the
the
default
things
in
here
like
check
boxes,
the
input
fields
with
pre
and
suffix.
I
have
the
radio
buttons
in
here.
I
have
interactive
search
boxes
in
here,
select
drop-downs.
E
Of
course,
for
our
applications,
we
need
loading
animations,
and
this
is
works
exactly
the
same
way
like
like
to
the
bootstrap.
So
you
have
a
stylesheet
that
you
reference
you
can
go
in
here,
expand
it
extract
the
html
out
of
here,
put
it
in
a
sharepoint
framework,
application
for
example,
or
or
another
whatever
web
application,
that
you're
building,
and
you
see
exactly
the
same-
the
styles
here.
E
Of
course,
there
are
some
nice
things
in
here
like,
for
example,
motions
there's,
also
the
typography
documented
in
here.
What
fonts
weights
do
we
have?
The
h2o
also
includes
a
grid
framework
which
works
exactly
the
way
as
microsoft
defined
it
for
their
sharepoint
applications.
So
right
now
you
see
here.
E
Of
course,
also
important
for
an
application.
I
have
also
the
standard
buttons
in
here
with
all
the
effects
we
have
the
action
buttons
in
here
the
drop
down
buttons.
This
also
requires
a
little
bit
of
javascript
there
compound
binary
compound
buttons
and
all
these
things
that
are
actually,
I
guess
I
I
currently
have
a
coverage
of
eighty
percent
of
what
it
was
available
in
fluent
ui,
and
we
also
have
avatars
in
here.
So
this
is
all
what
is
currently
provided
by
h2
by
the
framework.
E
E
E
E
Dialog
and
when
I
close
it
down,
then
it
it's
it's
back
again
and
what
I
I
mean,
the
fluent
design
itself
says
that
that
it
should
have
some
class
stained
glass,
look
at
the
background,
and
this
is
also
implemented
because
it's
currently
supported
by
all
modern
browsers,
like
microsoft
edge,
where
I'm
currently
in
and
also
by
google
chrome.
So
you
can
make
this
really
match
101
what
you
see
on
the
desktop
applications
for
microsoft
and
windows,
so
you
can
have
this
class
overlay,
which
then
blurs
out
the
background
on
sharepoint
as
well.
E
Of
course,
you
see
also
here
the
building
components
we
have
here
the
molecules,
dialog
header.
So
if
you
need
something
else,
then
you
you
can
directly
customize
this
in
your
code,
then
what
the
dialog
header
looks
like
how
the
content
looks
like,
of
course-
and
there
are
a
lot
of
options
to
use
this
also,
the
same
mockup
that
I
have
done
here
with
the
html
is
also
used
for
the
test
sidebar.
So
when
I
click
here
show
dialog,
it
actually
opens
up
a
sidebar-
and
I
have
this
all
documented
in
these
components
here.
E
So
the
sidebar
on
the
left
actually
shows
like
this.
The
sidebar
on
the
right
just
has
a
css
different
css
class
applied
to
it.
So
you
directly
can
see
this
just
is
side
by
right
and
then
it
will
be
placed
on
the
right
side.
I
also
played
around
with
some
new
components
that
not
exist
in
fluent
ui.
For
example,
I
have
a
dialogue,
error,
dialog
success
or
a
dialogue
warning
in
there.
So
it
gives
me
because
I
built
this
up
from
small
building
blocks
to
bigger
components.
E
It
gives
me
a
lot
of
free
time
to
experience
to
build
out
a
new
experience
and,
of
course,
what
we
also
see
saw
before
was
the
the
the
avatar
images,
and
I
can
do
also
some
things
like
facepile
that
you
will
see
later
on.
So
how
can
you
use
this?
Of
course?
It's
it's
an
npm
package
that
you
can
install
to
your
sharepoint
framework
solution
or
to
any
other
system
that
uses
npm
as
the
base
package
solution.
E
I
don't
have
a
nuget
package
yet
and
I'm
not
sure
if
I
will
do
this,
but
let's
get
over
to
a
regular
spfx
solution,
and
this
is
really
a
plain
html
solution.
So
this
is,
I
created
previous
already
a
web
part
which
just
used
no
framework
as
a
default.
So
there's
no
reactant
there
there's
nothing
else
in.
E
E
So
you
have
to
add
some
on
on
in
it.
You
need
to
request
the
same
scope
so
and
all
the
h2o
components
automatically
will
also
apply
in
sharepoint
with
the
correct
theme
in
there,
but
you
have
to
add
some
coding
here,
the
actual
one.
What
we
have
in
here
in
the
render
function
I
just
copied
over
the
html
from
h2o
directly
in
here.
I
just
picked
here
the
the
standard
button
and
the
primary
button.
Okay.
E
So
if
you,
for
example,
have
a
react
control,
then
you
would
actually
encapsulate
this
in
the
react
button
in
the
react.
Separate
react
control
that
you
had
then
added
to
your
user
interface
and
the
really
once
you
have
mpm
installed
the
h2o
package,
then
you
have
to
do
the
following,
so
you
have
just
import
here:
the
node
modules
at
nad
h2o,
core
lib
component
space,
which
actually
just
handles
all
the
mix,
ins
and
functions
that
are
required
for
the
other
components
that
you
run
and
then
in
your
web
part
code.
E
This
is
the
regular
webpart
h2o
sample,
which
is
the
default
container
where
the
webpart
is
rendered
in
and
then
you
have
to
define
it
as
a
global
one,
because
I
use
global
stylings
and
this
avoids
actually
that
mic
that
the
sharpened
framework
replaces
my
class
names
with
some
random
hashtag
at
the
end.
So
we
then
have
components
in
here
like
import
the
avatar.
So
if
you
just
want,
if
your
application
just
use
the
avatars,
then
you
just
have
to
import
this
file.
You
can
just
use
the
buttons
cards.
E
Dialogues,
forms,
icons,
menus
tables
and
topography
and
web
parts
so
for
the
web
parts,
let's
quickly
go
back
to
the
h2o
documentation
here
again,
so
I
have
here
in
molecules.
I
have
your
webpart
related
things,
and
what
I
actually
have
in
here
is
the
webpart
title
that
you
can
also
use,
and
this
works
exactly
like
the
microsoft
webpart
title
just
with
html,
so
you
see
the
placeholder
here,
which
is
the
default
one.
At
microsoft,
the
most
web
parts
are.
A
E
E
Let
me
save
this
quickly
and
now
that
we
have
the
styles
registered
and
now
that
we
have
in
our
web
part
the
button
in
it
should
let's
head
over
to
sharepoint.
So
I
have
here
already.
My
web
part
deployed
have
a
sharepoint
site
running
and
what
you
see
in
here
is
the
h2o
buttons,
which
is
just
the
primary
button
and
the
standard
button
I
can
edit
this
page.
I
can
also
switch
here.
E
If
you
have
experienced
some
issues,
then
you
can
go
over
here.
It's
on
github
nad
design,
slash
h2o
and
to
the
issue
list.
If
you
have
some
ideas
that
are
because,
if
they
are
seeing
something's
missing
and
there's
already
an
and
request
here
with
the
pivot
bar
that
how
it
managed
the
overflow
just
join
the
discussion
in
here,
what
you
see
also
on
the
h2o
landing
page,
you
get
here
a
complete
documentation,
which
is
my
dot
nad
dot
at
slash
h2o
and
it's
completely
free
open
source.
E
A
Awesome
steph-
and
this
is
very,
very
cool
stuff-
a
lot
of
great
comments
in
the
chat.
I
love
how
simplistic
it
is
to
implement
and
use
within
our
favorite
space
of
developing
in
the
microsoft
365
ecosystem,
so
excellent
job
super
super
cool
stuff.
All
right,
tommy
is
up
next
he's
going
to
show
us
how
to
gain
your
users,
attention
with
the
microsoft
teams,
activity
api,
so
tommy
whenever
you're
ready
to
take
over.
F
Yep,
just
let
me
share
my
screen
here.
We
are,
let's
start:
okay,
hello,
everyone
tommy
girl
is
my
name
tommy
or
thomas
depends
on
what
you
prefer.
You
can
reach
me
at
this
url,
I'm
an
mvp
for
office
development
and
I'm
working
as
a
team
lead
for
modern
workplace
solutions
for
a
company
in
austria
called
solvian.
So
stefan
and
I
know
each
other-
and
we
will
see
the
reference
later
on
in
the
presentation
as
well.
Today's
topic,
microsoft
teams,
activity
feed
api.
F
Let's
have
a
look
at
the
structure
of
an
item
in
the
activity
feed.
You
see
here
next
to
me
how
an
application
or
your
application
is
represented
in
the
activity
feed
inside
of
microsoft
teams
and
yeah.
I
was
a
little
bit
surprised
how
many
metadata
or
description
you
can
create
around
such
a
short
pixel
area
and
the
interesting
part
is
we
have
an
actor,
that's
basically
a
person
or
an
application,
because
you
can
use
the
activity
feed
api
as
a
person
or
as
an
application.
We
will
see
it
later
on.
F
We
will
use
an
application
for
that,
so
there
will
be
the
icon
of
our
teams
manifest
file
there.
That
is
the
actor
of
the
action.
Then
you
have
a
smaller
icon
that
represents.
We
all
know
that
from
someone
clicked
on
like
someone
clicked
on
an
emoji
or
or
mentioned
you,
then
you
have
this
icons
there
and
then
there's
actor
plus
a
reason,
so
a
short
text
that
is
used
to
tell
you
a
little
bit.
What's
behind
the
notification,
a
timestamp,
of
course,
a
location.
F
We
will
see
that
that's
basically
and
a
hint
where
this
notification
is
coming
from
is
it
from
a
team?
Is
it
from
a
channel,
in
our
case
our
own
application?
So
we
will
we'll
show
you
how
you
can
basically
just
write
a
string
there
to
have
your
own
location
in
there
and
then
text
preview
for
more
details,
and
probably
I
think
it's
20
minutes,
explanation
of
all
in
details
check
out
this
youtube
link
and
recalled
it.
F
F
So
with
the
installment,
of
course,
an
administrator
can
roll
out
certain
apps.
So
you
have
that
somehow
automatic
as
well.
That's
the
one
thing,
then:
you
need
to
have
an
azure
active
directory
application
associated
inside
your
teams,
manifest
that
has
the
correct
permissions
to
call
the
graph
endpoint,
and
we
will
see
it
later
on
in
the
manifest
of
your
team's
definition.
F
So,
for
example,
if
your
application
a
has
three
or
four
activities,
you
really
need
to
call
those
by
name
again.
Otherwise
the
system
will
tell
you,
okay,
you
called
me,
but
you
didn't,
provide
the
correct
activity
type,
so
I
cannot
notify
the
end
user.
What
does
that
look
like
here?
You
see
the
example
we're
going
to
use
later
on
in
my
microsoft
teams
app
manifest.
F
F
The
simple
one
we
will
see
later
on
just
is
more
like
a
demo
case
for
me
to
see.
Okay,
if
I
write
something
here,
where
does
it
pop
out
in
teams?
So
we
will
see
description,
template
text
and
all
those
things
popping
up
in
teams
to
really
make
sure
we
understand
what
fields
are
used
in
what
context
and
then
down
here
you
see
the
definition
of
an
actor,
so
there
are
templating
available
that
we
can
say.
F
Okay,
an
actor
needs
a
stock
item
and
we
can
actually
create
a
graph
key
value
pair
and
add
that
to
our
request
that
we
sent
to
the
graph
with
a
stock
item,
for
example,
then
the
api
takes
the
manifest
fills
it
with
the
values.
You
send
open
your
request
and
the
user
gets
notified
with
that
set
sentence,
but
with
those
two
strings
replaced
with
actual
values.
F
Also,
the
actor
is
a
system
value.
So
you
don't
need
to
care
about
that.
But
stock
item
is
something
that
I
created.
So
I
need
to
provide
a
value
for
that
here
in
the
active
directory
again
the
web
application
with
the
id
I
have
in
my
azure
tenant.
You
see
same
id,
an
application
registration
there
and
I
consented
to
those
permissions
so
that
the
graph
allows
calls
from
my
application
id
and
I
consented
because
this
is
just
my
demo
tenant
for
the
whole
organization,
and
I
think
it's
read
and
sent
you
for
sending.
F
You
just
would
need
to
have
the
center
permission
here,
but
you
need
to
configure
those
in
order
to
be
able
to
really
send
that
out
again
those
two
types.
What
does
this
look
like?
The
simple
one
that
was
in
the
demo
is
just
okay
template
text
manifest
you
see
here,
that's
the
template
text
and
the
value
and
the
content
we
will
add
by
code,
because
we
will
use
c-sharp
later
on
to
really
make
this
pop
and
see
okay.
F
I
was
looking
for
the
description
part
quite
some
time
and
then
I
realized
okay.
I
have
notification
settings
in
teams,
of
course,
as
well.
If
you
install
an
application
manifest
that
includes
those
activity,
types
for
notifications.
You
will
see
here-
and
this
is
the
case-
we
will
call
it
because
we
have
a
demo
around
pizza.
So
it's
called
giuseppe.
F
F
We
have
here
an
application
prepared.
The
use
case
basically,
is
that
we
are
a
pizza
restaurant.
We
call
it
pizza
factory
and
the
idea
is
that,
okay,
you
can
go
in
there
and
see
all
the
orders
that
are
there.
I
can
create
some
demo
orders
just
for
for
the
fun
of
it,
so
multiple
different
types
of
pizza
and
if
I
would
go
through
the
whole
demo,
it's
more
like
okay,
it's
something
like
a
supply
chain.
F
Basically,
we
have
something
that
gets
created,
the
pizza
that
needs
some
items,
and
sooner
or
later
we
will
run
out
of
certain
ingredients.
So
if
a
dashboard
here
we
see
okay,
we
have
yeah
whatever.
Whatever
item
you,
you
choose,
but
I
think
in
our
case
it's
always
pineapple
that
is
gonna,
be
very
low,
so
the
system
will
start
and
say:
okay,
I
need
more
pineapples
in
order
to
serve
our
customers.
F
This
is
an
application
that
lives
outside
of
teams,
but
the
idea
is:
how
can
we
integrate
the
notification
and
other
parts
of
the
implication
inside
of
teams?
For
that,
let
me
jump
over
to
my
team's
client.
Of
course
we
have
the
option
to
create
static
tabs.
So
again,
that's
just
a
few
in
the
application
and
we
have
a
chat
here
and
we
also
have
a
bob
that
you
can
use
to
call
or
order
pizza
or
a
bob.
That
also
is
capable
to
say.
F
F
You
will
see.
Okay,
I
got
a
notification
down
here
and
in
my
activity
feed
and
it's
saying,
okay,
you
see
template
text
from
the
manifest
value
code,
content
and
code.
If
I
click
on
advanced
activity
graph
call
again
and
then
it
says:
okay,
giuseppe
needs
pineapples
to
keep
the
kitchen
running.
You
see.
The
application
actually
also
has
something
inside
the
uh.net
world,
where
some
information
pops
out
and
says.
F
Okay,
we
need
pineapples,
it's
just
like
okay,
it's
not
in
the
logic,
but
it's
just
a
click
of
a
button
again
graph
call-
and
I
will
create
the
element
here.
If
I
click
here
yep
now,
it's
there,
it
will
open
up
my
static
themes,
application
with
a
configured
tab.
Allowing
me
to
see.
Okay
pineapple
is
really
on
zero.
So
we
need
to
do
something
about
that.
How
is
that
implemented?
F
This
notify
page?
First
of
all,
it's
just
for
my
case.
It's
a
blaze
application,
but
you
can
create
that
in
in
the
way
you
want
place
application
short
reference,
I'm
already
using
stefan's
work
around
h2o
outside
the
context.
He
first
thought
about
it,
so
I'm
using
it
also
in
my
blazer
applications,
already
two
simple
buttons,
simple
and
advanced.
F
Of
course,
I
need
to
create
a
graph
client,
in
my
case
as
a
place
application
living
on
the
server
side.
So
I'm
fine
with
having
a
client
id
in
the
client
secret,
because
it's
secure
it's
on
the
server,
it's
not
in
the
client,
I'm
creating
the
graph
client
in
my
initialized
method
and
then
it's
in
the
simple
case,
I'm
creating
topic
a
body
and
I
call
microsoft
graph
with
for
a
certain
user
and
I
hand
over
to
the
send
activity
notification
method,
the
topic
my
activity
name,
the
null
value,
basically
is
an
integer
value.
F
If
you
have
a
chain
of
activities,
my
body
and
also
null
in
a
simple
way,
because
for
my
simple
notification,
I
don't
have
any
special
parameters
for
the
advanced
one
down
here.
You
see
the
difference,
I'm
creating
template
parameters
and
I
hand
over
those
template
parameters.
In
my
call
with
stock
item,
so
if
we
have
again
a
look
at
the
manifest,
you
see
here
stock
item
and
that's
basically
how
those
things
come
together.
You
need
to
create,
or
you
need
to
create
a
request,
a
call
with
the
parameters
and
the
correct
names.
F
So
basically
like
a
a
string
parsing,
you
have
a
name
and
you
have
a
value
and
the
system
will
take
care
of
that
and
create
actor
on
its
own
and
then
fill
out
your
brackets
with
whatever
you
choose
from
here.
So
that's
an
easy
way
to
notify
your
customers
or
your
users,
and
you
can
go
even
a
little
bit
yeah
more
sophisticated
because
in
our
case
now
we
are
just
linking
to
an
to
an
url
to
our
dashboard.
F
F
F
That's
a
little
bit
trickier
than
just
providing
a
new
url
parameter.
You
need
to
go
the
way
that
teams
deep
linking
operates,
so
you
would
need
to
create
an
additional
url
parameter
with
a
context
value
and
you
will
get
back
that
context
value
from
the
teams
sdk.
So
it's
not
directly
from
the
url.
You
would
need
to
ask
the
javascript
teams
sdk
for
your
static
tab
or
for
your
tab
for
that
parameter,
and
then
you
can
act
on
inside
of
your
application
and
with
that
I'm
happy
to
hand
over
to
chris.
A
Excellent
awesome,
tommy!
Thank
you
fantastic
demo.
This
is
really
cool,
stuff
love.
The
integration
of
staphon's
h2o
as
well
shows
the
community
collaboration,
which
is
which
is
awesome.
I
think
you've
officially
and
effectively
helped
the
pizza
industry
today
as
well
everyone's
going
to
leave
this
session
here
today
and
order
some
pizza
for
breakfast
lunch
or
dinner.
All
right
up
next,
of
course,
is
the
one.
The
one
and
only
chris
kent
who's
gonna,
bring
us
straight
from
the
horse's
mouth
list:
formatting
magic.
G
Yo
yo
yo
all
right,
let's
get
started,
then:
let's
take
a
look
at
a
few
things
here,
all
right,
so
we
head
over
to
our
classic
warrior
horses
site,
of
course,
and
the
warrior
horses
they've
got
a
couple
of
lists
here.
I've
got
a
list
called
battles
and
in
this
list
all
they're
doing
is
they've
got
a
battle
and
they've
got
the
commander
for
that
battle
and
then
they've
got
this
related
list
over
here
called
spoils
right,
and
so
it's
got
to
look
up
to
that
battle
and
it's
just
got
detail.
G
So
it's
a
real
master.
You
know
parent-child
kind
of
situation
there.
Okay.
Now
because
the
the
warrior
horses
love
all
things,
you
know
horrible
and
painful
they've
recently
started
getting
to
power
apps.
So
let's
take
a
look.
They
built
a
little
power
app
around.
This
called
spoils
tracker
3000
right,
so
we
run
that
little
thing,
a
very
exciting
and
beautiful
app.
That
makes
you
all
weep
at
its
beauty
comes
up
here
right.
It
lists
those
battles
and
if
you
click
on
one
of
them
right,
you'll
get
just
the
spoils
for
that
battle.
G
Wow
right!
So
that's
cool
right
and
that's
awesome
now.
How
do
we
kind
of
integrate
this
right?
So
we've
got
this
idea
of
lists.
We've
got
this
idea
of
list
formatting.
How
do
we
kind
of
create
a
unique
or
a
shared
experience
here
right?
What
are
some
of
the
things
we
can
do
to
make
that
a
little
better,
so
one
of
the
things
we
can
do
right
first
off
is
add
a
way
to
launch
directly
into
that
app
right.
G
G
Okay,
now
I'm
head
over
to
our
samples
repo,
where
we
have
a
sample
for
you
called
a
generic
launch
power
app
I'm
going
to
copy
that
just
paste
that
in
here
in
advanced
mode,
all
right
get
rid
of
that
junk
paste.
This
very
beautiful
format.
Let's
make
this
a
little
bigger,
so
we
can
see
it.
The
whole
idea
is
here:
it
just
creates
a
button
and
if
I
preview
that
you
can
see
it
creates
this
beautiful
button
that
says
open
an
app
and
then
it's
got
this
link
here
now.
G
What
first
thing
I
need
to
do
is
make
sure
it's
pointed
to
my
power
app.
So
if
I
go
back
to
powerapps
pick
the
power,
if
I
want
to
link
to
go
to
details,
I
get
this
beautiful
web
link
here.
If
I
right
click
on
that-
and
I
say
copy
link,
I'm
just
going
to
head
back
to
that
format,
and
just
everywhere,
that's
in
these
first
set
of
quotes
all
the
way
up
to
the
ampersand
before
hide
nav
bar,
and
I'm
just
going
to
paste
that
in
now
you'll
notice.
G
This
actually
happened
to
already
be
my
power
up,
so
it
didn't
change
a
lot,
but
then
I've
got
this
hide
now
bar
equals,
true,
which
will
go
to
the
little
powerapps
sweet
bar
junk
right
and
then
I
have
this
item
id
equals
id
and
we'll
talk
about
that.
That's
deep
linking
and
I'm
going
to
show
you
that
briefly,
but
the
idea
here
is
that's
pretty
good.
One
of
the
things,
though,
is
I
don't
really
like
that
icon.
G
So
if
I
head
over
here
to
flykin
so
flykin.io,
where
I
can
search
for
icon,
I
have
no
there's
one
that
I
want.
It's
called
crown.
I'm
gonna
hit
this
to
copy
the
name
and
I'm
going
to
head
back
in
here
to
this
guy
and
I'm
just
going
to
paste
over
this
icon
name
with
crown,
if
I
preview
that
ooh
so
pretty
now,
if
I
save
that-
and
I
can
click
on
this
guy
right
and
it's
going
to
launch
the
app
now-
it
just
goes
straight
to
the
main
page
because
it
launched
the
app
right.
G
So
what
is
this
item
id
equals
one
all
about?
Well,
let's
see
if
we
can
handle
that
now
this
isn't
a
powerapps
class
or
anything,
but
I
can
show
you
briefly
how
we
handle
this.
So
we
go
to
the
app
we
go
to
the
onstart
event,
I'm
just
going
to
copy
the
code
to
handle
my
parameter
right.
So
let
me
copy
down
I'll
paste
that
sucker
in
here,
let's
make
it
a
little
bigger,
so
we
can
all
see
it,
and
so
the
whole
idea
is
I'm
just
looking
for
parameter
item
id.
G
If
it's
not
blank
and
it's
a
number,
then
I'm
going
to
load
something
in
my
I've
got
a
variable
called
battle
item
right
and
all
it's
going
to
do
is
going
to
go.
Look
it
up
from
the
battles
list
and
stick
it
in
there
and
then
it's
going
to
navigate
directly
into
the
spoils
screen
very
exciting.
Let's
save
that!
Let's
publish
and
hope
that
our
publish
catches
up
here-
yes
publish
this
beautiful
version
all
right,
so
we're
going
to
publish
that
we'll
give
that
just
a
minute.
G
While
we
look
at
a
couple
of
other
items
here,
all
right
so
we'll
come
back
to
see
the
deep
link
working.
But
what
if
I
want
to
do
some
other
stuff
like?
If
I
look
at
my
spoils
list?
Well,
that's
kind
of
fancy.
I've
got
a
little
icon
here
again,
another
icon
from
the
the
fluent
ui
and
that's
cool.
If
I
want
that
same
experience
over
in
powerapps
right,
so
I
can
do
that.
All
I
need
to
do
is
find
those
icons,
and
so,
let's
see
diamond
was
one
of
them.
G
Let's
grab
diamond
hover
over
that
we
go
to
export
and
we're
going
to
save
it
as
svg.
That's
just
going
to
download
it
for
us
and
then
we'll
do
the
same
thing
for
the.
I
think
it
was.
Let's
see
the
six
box
product
variant
there.
It
is
very
exciting
name
all
right.
We're
just
export
we're
going
to
save
that
one
as
svg
as
well
and
then
you
know
we
need
money.
G
G
Recycle
bin
and
we're
gonna
export
that
guy
okay.
So
now
we've
got
all
those
that's
exciting.
We
head
back
into
our
power
app
right.
We
go
over
to
media
and
we're
just
gonna
upload
and
go
to
my
downloads.
Where
here
they
all
are,
I'm
gonna
grab
the
ones
I
just
did
I'm
going
to
open
them
and
stick
them
in
right
there,
just
as
the
svg
they
are
now.
If
I
had
wanted-
and
I
I
just
kind
of
forgot-
but
you
can
actually
set
the
color
of
these
within
flycon
here.
G
So
if
you
go
to
the
advanced
color
options,
all
right,
you
could
pick
any
number
of
options
and
they'll
export
that
way,
all
right.
So
if
I
didn't
want
it
to
be,
you
know
the
standard
kind
of
black.
I
could
do
orange
whatever.
I
want
all
right,
but
let's
go
back
here
so
now.
If
I
click
on
this
little
template
guy
instead
of
sample
image,
I
can
actually
write
a
switch
statement.
That's
almost
identical
to
the
switch
statement,
I've
written
in
the
format
all
right.
G
So
if
I
just
paste
that
guy
bam,
so
you
see
I'm
now
using
the
fluent.
You
icons
right
here,
it's
great,
it
works.
Well,
I'm
excited
all
right.
I
can
go
back.
I
can
see
how
they
know
what
is
in
here.
I
don't
know
invasion
of
the
grasslands,
all
right,
beautiful
right,
but
that's
the
idea.
That's
one
idea!
So
now
we've
got
some
integration
here.
G
It's
a
similar
kind
of
look
and
feel,
and
all
I've
done
is
just
put
an
svg
directly
in
there
and
that's
that's
all
right,
but
what
if
we
do
something
a
little
further
right?
What
if
back
in
our
list?
We
add
another
column.
Now
we
go
we're
going
to
do
another
format,
only
column,
that
is
the
hiding
columns.
G
So
I'm
going
to
go
more
and
we're
going
to
go
with
another
calculated
column
which
is
right
there
and
we're
just
going
to
call
this
one
support
all
right
so
and
we'll
say
again
equals
double
quote
just
so
we
don't
have
to
stare
at
that
sucker
all
right.
So
now
we
got
that
and
I'm
going
to
take
another
sample.
We've
got
so
format
this
column
advanced
mode
and
I'm
just
going
to
paste
in
our
other
sample,
which
is
a
generic
mail
to
button
right.
G
So
all
this
is
going
to
do
if
I
paste
this
guy
in
here
preview
it
it
creates
this
lovely
thing
right
and
if
you
hit
it,
it's
going
to
launch
in
an
email
right.
So
let's
save
that
and
we'll
see
what
that
looks
like.
If
I
click
that
guy
I
get
an
email
launched.
You
know
it's
got
information
from
the
list
right,
so
it
goes
to
the
person
that
it's
for,
and
it
looks
great.
G
So
that's
nice
again,
that's
a
sample,
we're
not
going
to
go
into
details
on
how
that's
put
together,
but
that
sample
is
available
for
you.
Now.
If
I
look
inside
here,
I
actually
have
the
same
thing
down
here,
so
I
have
that
same
kind
of
support
button
and
that's
cool
and
they
even
have
a
similar
icon,
because
I've
got
I
picked
one.
That
purposely
is
also
in
power.
Amps
now
you'll
find
that
actually
power,
we've
got
about
2,
000,
plus
icons
available
in
fluent
ui
and
in
powerapps.
G
You've
got
about
a
hundred,
so
big
difference
there.
So
if
I
wanted
to
change
this
icon
right
so
say
someone
comes
down
here
and
they're
like
we
don't
like
envelopes
anymore
right.
This
is
for
automated
chat,
bot
supporters.
I
don't
know
what
all
right
we're
just
gonna
put
robot
and
let's
preview,
that
hey
there's
a
beautiful
robot
icon.
So
that's
great!
But
what
do
I
do
about
powerapps
now
now
powerapps
no
longer
matches
right.
I
want
to
use
the
same
icon
there.
G
G
So
if
I
want
to
add
a
guy,
what
I
could
do
is,
I
could
add,
an
image
right.
So
if
I
did
the
exact
same
thing
I
did
before,
where
I'm
going
to
upload,
you
know
I've
already
downloaded
robot,
let's
go
ahead
and
grab
it
all
right.
It's
the
same
way
from
flycon.
I
upload
that
that's
great
right,
I'm
just
going
to
grab
I'm
just
going
to
stick
it
in
there
right,
and
so
that
seems
okay
at
first
right,
okay,
well
good!
G
Now
I've
got
that
and
I
grabbed
this
guy
and
I
grabbed
the
on
select,
which
is
just
the
launch
for
the
email.
Does
the
exact
same
thing-
and
I
paste
it
in
here
all
right?
Oh
not
settings
go
to
action.
I've
got
on
select,
I
paste
the
exact
same,
very
beautiful,
launch
right
so
now
I
mean
it
works,
so
I
click
it
all
right.
We're
gonna,
get
that
same
email
experience,
that's
great,
but
one
of
the
one
of
the
problems
I've
got
here
is
you
know
it
doesn't
quite
act,
the
same
all
right.
G
So,
if
I
hit
play
on
this,
it's
a
little
more
obvious
right.
We
got
a
a
nice
hover,
color
dirt,
nothing
right
there
right!
So,
what's
going
on
all
right,
let's
see
if
we
can
fix
that.
Oh
thanks!
Okay,
if
I
click
that
guy
right
now,
I
click
color.
It
says
color
here
you
click
it.
It's
actually
the
fill.
It's
a
lie
right.
G
So
it's
the
fill
and
right
here
you
can
see
the
fill
is
transparent
right,
but
I
don't
actually
have
a
color
because
that's
coming
from
that
svg
and
I
have
a
hover
fill
right.
So
I
could
say
the
hover
fill
is
going
to
be
color
dot
red
right.
Let's
see
what
that
looks
like
so
now,
if
I
hold
alt
well,
that
is
not
what
I
want
at
all
right.
That
is
pretty
lame.
In
fact,
I'm
going
from
there
to
this
right
instead
of
showing
the
line
is
red.
So
what
can
we
do
about
that?
G
Well,
that's
what
we're
going
to
figure
out
in
four
minutes.
We
can
do
it
all
right.
There
is
a
blog
explaining
this,
so
I'm
going
to
fly
through
it,
but
you
can
check
out
the
whole
blog.
It
has
all
the
steps
right
in
there,
but
what
we're
going
to
do
is
we're
going
to
download
that
icon.
So
again,
I've
already
downloaded
the
robot
all
right.
So
let's
go
back
into
our
power
app
area
there.
It
is,
and
let's
go
over
this
guy
where's.
G
My
downloads
got
my
downloads,
I'm
just
going
to
open
up
robot
in
something
called
inkscape.
Inkscape
is
a
free,
svg
editor,
it's
open
source
check
it
out,
there's
a
link
in
the
blog
to
it,
and
it's
free
and
it's
exciting,
and
you
will
love
it
and
leave
that
as
beauty.
Okay
and
all
that,
so
the
idea
here
is
we're
going
to
take
this
icon
and
we're
going
to
make
it
so
we
can
use
it
and
the
way
we
do
that
is
the
first
thing.
G
We're
going
to
do
is
we're
going
to
draw
a
square
we're
going
to
draw
any
kind
of
square
it
doesn't
matter.
We
don't
want
a
stroke
on
it,
though,
and
I'm
just
going
to
tap
on
this
icon
and
we're
going
to
find
out
which
one's
bigger
height
or
width
copy
it,
whichever
one
with
bigger
and
we're
going
to
apply
that
same
thing
to
the
block,
all
right
so
same
thing
beautiful
now
we
pick
them
both.
G
Now
we're
going
to
go
to
our
line
and
distribute
align
relative
to
page
that
way
we
just
kind
of
center
them
together
and
we're
going
to
go
up
to
path
again.
I'm
going
really
fast,
but
there's
a
blog
about
it.
Exclusion
and
the
only
thing
I'm
other
thing
I'm
going
to
do
is
go
to
document
properties,
we'll
bring
them
over
here
and
I'm
going
to
resize
the
page
to
the
content.
That's
it
so
that's
exciting!
G
G
G
We
don't
need
we
hit
okay
and
then,
if
we
look
in
our
now
our
downloads
folder
we've
got
a
robot
special
to
which
I'm
just
going
to
open
up
and
say
notepad
right
here,
so
robot
special
too,
and
the
only
thing
I'm
going
to
do
is
I'm
going
to
find
and
replace
all
of
those
double
quotes
with
single
quotes,
because
I
want
to
use
it
inside
powerapps,
so
I'm
going
to
replace
all
so.
I've
got
that
got
this
beautiful
thing
here.
The
only
thing
I'm
going
to
add.
G
Well,
let's
grab
that,
let's
just
grab
that
guy,
let's
head
back
over
here
to
our
power
app,
we
can
leave
that
alone.
So
in
our
power
app
now,
instead
of
this
image,
one
of
the
nice
things
is,
we
can
actually
set
this
to
a
data
url
right.
So
in
this
case,
what's
exactly
we're
going
to
do
we're
going
to
grab
some
of
this?
G
We
just
got
to
start
it
off,
instead
of
calling
it
the
actual
image,
we're
going
to
go
there,
we're
going
to
say
and
add
in
code
url
and
here's
where
we're
just
going
to
paste
in
our
svg
that
we
just
copied.
That
is
not
what
we
just
copied.
Let's
grab
there.
We
go
this
all
right
and
we'll
close
that
out.
So
now,
we've
pasted
our
svg.
That
looks
interesting
right
because
it's
got
that
black.
G
G
Let's
pick
the
correct
color,
that's
kind
of
important
all
right
grab
that
and
we'll
paste
that
in
instead
now
what
you'll
see
is
a
little
weird.
It
actually
disappears
right
and
that's
okay,
because
now
we
can
use
the
fill,
because
we've
basically
created
a
reverse
image
here.
If
we
go
up
to
fill
all
right,
let's
set
that
to
you
know
just
be
black
for
now.
It's
fine
all
right!
So
it's
black!
But
if
we
play
this
now
we
get
a
nice
hover
effect.
G
We
actually
get
the
real
hover
effect
because
we
are
essentially
just
setting
the
background.
The
fill
value
of
the
svg
and
the
svg
itself
is
actually
a
negative
of
the
icon.
Okay,
everyone
got
all
that:
okay,
real,
quick,
let's
wrap
up
and
summarize
so
for
deep
linking
you
can
build
a
button
using
the
sample
just
to
pin
your
id
or
whatever
else
you
need
to
that
href
and
you
can
handle
those
parameters
directly.
The
power
up.
G
It
creates
a
really
nice
integration
piece,
especially
if
you're
using
those
lists,
and
you
want
to
be
able
to
drive
those
directly
or
you
want
to
be
able
to
link
those.
You
know
all
over
the
place
throughout
sharepoint
then,
if
you
want
to
use
the
same
icons
everywhere
that
fluent
or
the
flykn.I
flycom.io
is
your
friend
it's
going
to
make
it
a
lot
easier
to
find
those.
Then
you
can
edit
them
with
inkscape
as
you
export
them
and
whatever
you
need,
and
it's
very
exciting.
G
A
A
You
can
always
see
this
will
be
available
24
hours
after
the
call
at
aka
dot,
ms4
m365,
pnp
sport
forward,
slash
videos,
and
you
can
also
see
all
the
other
developer
community
calls
there's
going
to
be
some
consolidation
of
this
coming
after
the
summer
months
of
july
and
august.
So
we
look
forward
to
that,
but
as
of
right
now,
you
can
find
all
these
different
community
calls
here
thanks.
Everybody
have
a
great
week.