refactor: cria um componente para reutilizar o iframe do yt

src/components/embed-yt-video.astro

@@ -0,0 +1,15 @@
+---
+const { src } = Astro.props
+---
+
+Caso você goste mais do formato em vídeo, temos o seguinte conteúdo no nosso canal no Youtube:
+
+<iframe
+	width='100%'
+	height='500px'
+	src={src}
+	title='YouTube video player'
+	allow='accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share'
+	allowfullscreen
+>
+</iframe>

src/content/blog/conheca-control-flow-syntax.mdx

@@ -11,23 +11,15 @@ tags:
 title: 'Angular 17: Conheça a nova Control Flow Syntax'
 ---
 
+import EmbedYtVideo from '../../components/embed-yt-video.astro'
+
 Angular 17 está trazendo muitas novidades para o framework que prometem revolucionar a forma como você pode escrever aplicações Front-End!
 
 E uma das novidades mais interessantes dessa nova versão se chama **Control Flow Syntax**.
 
 Nesse artigo você vai entender da onde veio, por que existe e como essa nova sintaxe melhorará seus projetos Angular.
 
-> Caso você goste mais do formato em vídeo, temos o seguinte conteúdo no nosso canal no Youtube:
->
-> <iframe
-> 	width='100%'
-> 	height='500px'
-> 	src='https://www.youtube.com/embed/bP_Aqc6HQtY?si=OtCTc4kfZK2GRrzr'
-> 	title='YouTube video player'
-> 	frameborder='0'
-> 	allow='accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share'
-> 	allowfullscreen
-> />
+> <EmbedYtVideo src='https://www.youtube.com/embed/bP_Aqc6HQtY?si=OtCTc4kfZK2GRrzr' />
 
 ## Mas o que é Control Flow Syntax?
 

src/content/blog/implementando-facade-patten-com-angular.mdx

@@ -9,6 +9,8 @@ tags:
 draft: false
 ---
 
+import EmbedYtVideo from '../../components/embed-yt-video.astro'
+
 O Angular é um poderoso framework para o desenvolvimento de aplicações web e oferece uma estrutura robusta para organizar e estruturar o código.
 
 À medida que as aplicações crescem em complexidade, é comum lidar com vários serviços, módulos e componentes, tornando a manutenção e a compreensão do código mais desafiadoras.
@@ -17,17 +19,7 @@ O padrão Facade surge como uma solução elegante para simplificar a interaçã
 
 Neste artigo, exploraremos como implementar o padrão Facade em uma aplicação Angular.
 
-> Caso você goste mais do formato em vídeo, temos o seguinte conteúdo no nosso canal no Youtube:
->
-> <iframe
-> 	width='100%'
-> 	height='500px'
-> 	src='https://www.youtube.com/embed/hRNBSNtZ-JU?si=oeEhwk3PkWZrFns5'
-> 	title='YouTube video player'
-> 	frameborder='0'
-> 	allow='accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share'
-> 	allowfullscreen
-> />
+> <EmbedYtVideo src='https://www.youtube.com/embed/hRNBSNtZ-JU?si=oeEhwk3PkWZrFns5' />
 
 ## O que é o padrão Facade?