@soraiataipa - What do you mean the "preview image"?
@LynetteJH - I know it was a bit ago, but I'm guessing the spacing is in part to the use of the flexible height gallery.
For anyone - Seeing my own question above I should've come back after figuring out how to do this. You can insert an image control in the gallery and reference Microsoft's UI fabric icons for the file types.
First, add this fabric UI component to your app and then you can use the SVG code as your image Image property. Example of what we're using for the image property:
//Excel file types
If(".xls" in htmlAttachments.HtmlText,
"data:image/svg+xml," &
EncodeUrl(
"<svg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' version='1.1' viewBox='-10 0 2068 2048'>
<g transform='matrix(1 0 0 -1 0 2048),rotate(0,1034,1024)'>
<path fill=''
d='M2048 1573v-1445q0 -27 -10 -50t-27.5 -40.5t-40.5 -27.5t-50 -10h-1280q-27 0 -50 10t-40.5 27.5t-27.5 40.5t-10 50v256h-397q-24 0 -44.5 9t-36.5 25t-25 36.5t-9 44.5v922q0 24 9 44.5t25 36.5t36.5 25t44.5 9h397v384q0 27 10 50t27.5 40.5t40.5 27.5t50 10h933q26 0 49.5 -9.5t41.5 -27.5l347 -347q18 -18 27.5 -41.5t9.5 -49.5zM1664 1829v-165h165zM261 624h189q2 4 12.5 23t24.5 45t29.5 55t29 53.5t23 41l9.5 16.5q27 -59 60.5 -118t64.5 -116h187l-209 339l205 333h-179q-31 -57 -60.5 -114t-62.5 -112q-29 57 -57 113t-57 113h-191l199 -335zM640 128h1280v1408h-256q-27 0 -50 10t-40.5 27.5t-27.5 40.5t-10 50v256h-896v-384h397q24 0 44.5 -9t36.5 -25t25 -36.5t9 -44.5v-922q0 -24 -9 -44.5t-25 -36.5t-36.5 -25t-44.5 -9h-397v-256zM1280 1152v128h512v-128h-512zM1280 896v128h512v-128h-512zM1280 640v128h512v-128h-512z' />
</g>
</svg>"
),
//Word file types
If(".doc" in htmlAttachments.HtmlText,
"data:image/svg+xml," &
EncodeUrl(
"<svg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' version='1.1' viewBox='-10 0 2068 2048'>
<g transform='matrix(1 0 0 -1 0 2048),rotate(0,1034,1024)'>
<path fill=''
d='M2048 1573v-1445q0 -27 -10 -50t-27.5 -40.5t-40.5 -27.5t-50 -10h-1280q-27 0 -50 10t-40.5 27.5t-27.5 40.5t-10 50v256h-397q-24 0 -44.5 9t-36.5 25t-25 36.5t-9 44.5v922q0 24 9 44.5t25 36.5t36.5 25t44.5 9h397v384q0 27 10 50t27.5 40.5t40.5 27.5t50 10h933q26 0 49.5 -9.5t41.5 -27.5l347 -347q18 -18 27.5 -41.5t9.5 -49.5zM1664 1829v-165h165zM320 624h161q2 8 9.5 43t17.5 83.5t21.5 103t21.5 100.5t16.5 76t7.5 31l7 -30.5t17.5 -76.5t22.5 -100.5t23 -103t19 -84t10 -42.5h160l148 672h-148l-80 -438l-100 438h-152l-96 -440l-86 440h-150zM640 128h1280v1408h-256q-27 0 -50 10t-40.5 27.5t-27.5 40.5t-10 50v256h-896v-384h397q24 0 44.5 -9t36.5 -25t25 -36.5t9 -44.5v-922q0 -24 -9 -44.5t-25 -36.5t-36.5 -25t-44.5 -9h-397v-256zM1280 1152v128h512v-128h-512zM1280 896v128h512v-128h-512zM1280 640v128h512v-128h-512z' />
</g>
</svg>"
),
//PowerPoint file types
If(".ppt" in htmlAttachments.HtmlText,
"data:image/svg+xml," &
EncodeUrl(
"<svg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' version='1.1' viewBox='-10 0 2068 2048'>
<g transform='matrix(1 0 0 -1 0 2048),rotate(0,1034,1024)'>
<path fill=''
d='M2048 1573v-1445q0 -27 -10 -50t-27.5 -40.5t-40.5 -27.5t-50 -10h-1280q-27 0 -50 10t-40.5 27.5t-27.5 40.5t-10 50v256h-397q-24 0 -44.5 9t-36.5 25t-25 36.5t-9 44.5v922q0 24 9 44.5t25 36.5t36.5 25t44.5 9h397v384q0 27 10 50t27.5 40.5t40.5 27.5t50 10h933q26 0 49.5 -9.5t41.5 -27.5l347 -347q18 -18 27.5 -41.5t9.5 -49.5zM1664 1829v-165h165zM368 1296v-672h150v226h100q52 0 97 15.5t78.5 45.5t53 72.5t19.5 96.5q0 56 -17.5 97t-49.5 67.5t-76 39t-97 12.5h-258zM1920 128v1408h-256q-27 0 -50 10t-40.5 27.5t-27.5 40.5t-10 50v256h-896v-384h397q24 0 44.5 -9t36.5 -25t25 -36.5t9 -44.5v-922q0 -24 -9 -44.5t-25 -36.5t-36.5 -25t-44.5 -9h-397v-256h1280zM1536 1408q79 0 149 -30t122.5 -82.5t82.5 -122.5t30 -149h-384v384zM1408 1280v-384h384q0 -80 -30 -149.5t-82.5 -122t-122.5 -82.5t-149 -30q-33 0 -65 6.5t-63 17.5v720q31 11 63 17.5t65 6.5zM604 980h-86v185h90q47 0 74 -20t27 -70q0 -52 -28 -73.5t-77 -21.5z' />
</g>
</svg>"
),
//Visio file types
If(".vsd" in htmlAttachments.HtmlText,
"data:image/svg+xml," &
EncodeUrl(
"<svg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' version='1.1' viewBox='-10 0 2068 2048'>
<g transform='matrix(1 0 0 -1 0 2048),rotate(0,1034,1024)'>
<path fill=''
d='M2048 1573v-1445q0 -27 -10 -50t-27.5 -40.5t-40.5 -27.5t-50 -10h-1280q-27 0 -50 10t-40.5 27.5t-27.5 40.5t-10 50v256h-397q-24 0 -44.5 9t-36.5 25t-25 36.5t-9 44.5v922q0 24 9 44.5t25 36.5t36.5 25t44.5 9h397v384q0 27 10 50t27.5 40.5t40.5 27.5t50 10h933q26 0 49.5 -9.5t41.5 -27.5l347 -347q18 -18 27.5 -41.5t9.5 -49.5zM1664 1829v-165h165zM493 624h163l255 672h-166l-147 -427q-5 -16 -10.5 -31t-10.5 -31q-41 123 -82.5 244.5t-83.5 244.5h-170l248 -662zM640 128h1280v1408h-256q-27 0 -50 10t-40.5 27.5t-27.5 40.5t-10 50v256h-896v-384h397q24 0 44.5 -9t36.5 -25t25 -36.5t9 -44.5v-922q0 -24 -9 -44.5t-25 -36.5t-36.5 -25t-44.5 -9h-397v-256zM1600 1408l192 -192l-128 -128v-448h-256v-128h-128v384h128v-128h128v320l-128 128z' />
</g>
</svg>"
),
//Outlook file types
If(".eml" in htmlAttachments.HtmlText,
"data:image/svg+xml," &
EncodeUrl(
"<svg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' version='1.1' viewBox='-10 0 2068 2048'>
<g transform='matrix(1 0 0 -1 0 2048),rotate(0,1034,1024)'>
<path fill=''
d='M2048 1043v-929q0 -24 -9 -44.5t-24.5 -36t-36 -24.5t-44.5 -9h-1564q-24 0 -44.5 9t-36 24.5t-24.5 36t-9 44.5v270h-128q-26 0 -49.5 10t-41 27.5t-27.5 41t-10 49.5v1024q0 26 10 49.5t27.5 41t41 27.5t49.5 10h256v256q0 27 10 50t27.5 40.5t40.5 27.5t50 10h1280q27 0 50 -10t40.5 -27.5t27.5 -40.5t10 -50v-776l102 -58q11 -7 18.5 -18t7.5 -25zM1152 1792v-128q26 0 49.5 -10t41 -27.5t27.5 -41t10 -49.5v-256h512v513zM1792 1152h-512v-423l512 295v128zM512 1792v-128h512v128h-512zM638 608q95 0 172 31t131 87t83.5 134t29.5 172q0 91 -28.5 166t-81.5 129t-127.5 84t-165.5 30q-97 0 -175 -30.5t-133 -86t-85 -134t-30 -174.5q0 -92 30 -167t84 -128.5t129.5 -83t166.5 -29.5zM384 128h1429l-558 312q-18 -25 -45 -40.5t-58 -15.5h-768v-256zM1920 215v731l-1 1v-2l-639 -364v-9zM454 1024q0 45 11.5 86t35 72.5t59.5 50t85 18.5q51 0 86 -19t57 -51t31.5 -73.5t9.5 -86.5q0 -46 -10.5 -86.5t-33.5 -70.5t-59 -47.5t-86 -17.5q-49 0 -84 18.5t-57.5 50t-33.5 72t-11 84.5z' />
</g>
</svg>"
),
//Image file types
If(".png" in htmlAttachments.HtmlText Or ".jpeg" in htmlAttachments.HtmlText,
"data:image/svg+xml," &
EncodeUrl(
"<svg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' version='1.1' viewBox='-10 0 2068 2048'>
<g transform='matrix(1 0 0 -1 0 2048),rotate(0,1034,1024)'>
<path fill=''
d='M256 128h1536v-128h-1664v2048h1115l549 -549v-91h-640v512h-896v-1792zM1280 1536h293l-293 293v-293zM2048 1280v-1024h-1408v1024h1408zM768 1152v-421l320 319l416 -416l160 160l256 -256v614h-1152zM1755 384h139l-230 230l-69 -70zM768 384h805l-485 486l-320 -321v-165zM1728 896q-26 0 -45 19t-19 45t19 45t45 19t45 -19t19 -45t-19 -45t-45 -19z' />
</g>
</svg>"
),
//PDF file types
If(".pdf" in htmlAttachments.HtmlText,
"data:image/svg+xml," &
EncodeUrl(
"<svg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' version='1.1' viewBox='-10 0 2068 2048'>
<g transform='matrix(1 0 0 -1 0 2048),rotate(0,1034,1024)'>
<path fill=''
d='M1920 384h-128v-384h-1664v384h-128v1024h128v640h1243l421 -421v-219h128v-1024zM1408 1664h165l-165 165v-165zM256 1408h1408v128h-384v384h-1024v-512zM1664 384h-1408v-256h1408v256zM1792 1280h-1664v-768h1664v768zM448 1152q40 0 75 -15t61 -41t41 -61t15 -75t-15 -75t-41 -61t-61 -41t-75 -15h-64v-128h-128v512h192zM448 896q26 0 45 19t19 45t-19 45t-45 19h-64v-128h64zM896 1152q53 0 99.5 -20t81.5 -55t55 -81.5t20 -99.5t-20 -99.5t-55 -81.5t-81.5 -55t-99.5 -20h-128v512h128zM896 768q27 0 50 10t40.5 27.5t27.5 40.5t10 50t-10 50t-27.5 40.5t-40.5 27.5t-50 10v-256zM1280 1152h320v-128h-192v-128h192v-128h-192v-128h-128v512z' />
</g>
</svg>"
),
//Other file types
"data:image/svg+xml," &
EncodeUrl(
"<svg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' version='1.1' viewBox='-10 0 2068 2048'>
<g transform='matrix(1 0 0 -1 0 2048),rotate(0,1034,1024)'>
<path fill=''
d='M1243 2048l549 -549v-1499h-1664v2048h1115zM1280 1829v-293h293zM256 128h1408v1280h-512v512h-896v-1792zM512 1024v128h896v-128h-896zM512 768v128h896v-128h-896zM512 512v128h896v-128h-896z' />
</g>
</svg>"
)
)
)
)
))))
Once the code is saved you can remove the component from the app. You can then use the SVG code in other apps without installing the component.
The result (note the down arrow on each attachment line is to see the rest of the filename):
Lastly, we came across an issue if there's an apostrophe in the filename - Power Apps will truncate the filename at the apostrophe and it won't load. It seems to be the only character that has this issue. With that, we substitute the URL version of an apostrophe (%27) in our HTML control HTMLText property to cover that rarity:
"<a href='" & Substitute(ThisItem.AbsoluteUri, "'","%27") & "?web=1'>" & ThisItem.DisplayName & "</a>"
In my experience the "target='_blank'" is not needed.
Helpful resources
As we continue to grow and learn together, it's important to reflect on the valuable insights we've shared. For today's #TuesdayTip, we're excited to take a moment to look back at the last 10 tips we've shared in case you missed any or want to revisit them. Thanks for your incredible support for this series--we're so glad it was able to help so many of you navigate your community experience! Getting Started in the Community An overview of everything you need to know about navigating the community on one page! Community Links: ○ Power Apps ○ Power Automate ○ Power Pages ○ Copilot Studio Community Ranks and YOU Have you ever wondered how your fellow community members ascend the ranks within our community? We explain everything about ranks and how to achieve points so you can climb up in the rankings! Community Links: ○ Power Apps ○ Power Automate ○ Power Pages ○ Copilot Studio Powering Up Your Community Profile Your Community User Profile is how the Community knows you--so it's essential that it works the way you need it to! From changing your username to updating contact information, this Knowledge Base Article is your best resource for powering up your profile. Community Links: ○ Power Apps ○ Power Automate ○ Power Pages ○ Copilot Studio Community Blogs--A Great Place to Start There's so much you'll discover in the Community Blogs, and we hope you'll check them out today! Community Links: ○ Power Apps ○ Power Automate ○ Power Pages ○ Copilot Studio Unlocking Community Achievements and Earning Badges Across the Communities, you'll see badges on users profile that recognize and reward their engagement and contributions. Check out some details on Community badges--and find out more in the detailed link at the end of the article! Community Links: ○ Power Apps ○ Power Automate ○ Power Pages ○ Copilot Studio Blogging in the Community Interested in blogging? Everything you need to know on writing blogs in our four communities! Get started blogging across the Power Platform communities today! Community Links: ○ Power Apps ○ Power Automate ○ Power Pages ○ Copilot Studio Subscriptions & Notifications We don't want you to miss a thing in the community! Read all about how to subscribe to sections of our forums and how to setup your notifications! Community Links: ○ Power Apps ○ Power Automate ○ Power Pages ○ Copilot Studio Getting Started with Private Messages & Macros Do you want to enhance your communication in the Community and streamline your interactions? One of the best ways to do this is to ensure you are using Private Messaging--and the ever-handy macros that are available to you as a Community member! Community Links: ○ Power Apps ○ Power Automate ○ Power Pages ○ Copilot Studio Community User Groups Learn everything about being part of, starting, or leading a User Group in the Power Platform Community. Community Links: ○ Power Apps ○ Power Automate ○ Power Pages ○ Copilot Studio Update Your Community Profile Today! Keep your community profile up to date which is essential for staying connected and engaged with the community. Community Links: ○ Power Apps ○ Power Automate ○ Power Pages ○ Copilot Studio Thank you for being an integral part of our journey. Here's to many more Tuesday Tips as we pave the way for a brighter, more connected future! As always, watch the News & Announcements for the next set of tips, coming soon!
This month's Community Ambassador call is on May 9th at 9a & 3p PDT. Please keep an eye out in your private messages and Teams channels for your invitation. There are lots of exciting updates coming to the Community, and we have some exclusive opportunities to share with you! As always, we'll also review regular updates for User Groups, Super Users, and share general information about what's going on in the Community. Be sure to register & we hope to see all of you there!
We're pleased to share the April Community Newsletter, where we highlight the latest news, product releases, upcoming events, and the amazing work of our outstanding Community members. If you're new to the Community, please make sure to follow the latest News & Announcements and check out the Community on LinkedIn as well! It's the best way to stay up-to-date with all the news from across Microsoft Power Platform and beyond. COMMUNITY HIGHLIGHTS Check out the most active community members of the last month! These hardworking members are posting regularly, answering questions, kudos, and providing top solutions in their communities. We are so thankful for each of you--keep up the great work! If you hope to see your name here next month, follow these awesome community members to see what they do! Power AppsPower AutomateCopilot StudioPower PagesWarrenBelzDeenujialexander2523ragavanrajanLaurensMManishSolankiMattJimisonLucas001AmikcapuanodanilostephenrobertOliverRodriguestimlAndrewJManikandanSFubarmmbr1606VishnuReddy1997theMacResolutionsVishalJhaveriVictorIvanidzejsrandhawahagrua33ikExpiscornovusFGuerrero1PowerAddictgulshankhuranaANBExpiscornovusprathyooSpongYeNived_Nambiardeeksha15795apangelesGochixgrantjenkinsvasu24Mfon LATEST NEWS Business Applications Launch Event - On Demand In case you missed the Business Applications Launch Event, you can now catch up on all the announcements and watch the entire event on-demand inside Charles Lamanna's latest cloud blog. This is your one stop shop for all the latest Copilot features across Power Platform and #Dynamics365, including first-hand looks at how companies such as Lenovo, Sonepar, Ford Motor Company, Omnicom and more are using these new capabilities in transformative ways. Click the image below to watch today! Power Platform Community Conference 2024 is here! It's time to look forward to the next installment of the Power Platform Community Conference, which takes place this year on 18-20th September 2024 at the MGM Grand in Las Vegas! Come and be inspired by Microsoft senior thought leaders and the engineers behind the #PowerPlatform, with Charles Lamanna, Sangya Singh, Ryan Cunningham, Kim Manis, Nirav Shah, Omar Aftab and Leon Welicki already confirmed to speak. You'll also be able to learn from industry experts and Microsoft MVPs who are dedicated to bridging the gap between humanity and technology. These include the likes of Lisa Crosbie, Victor Dantas, Kristine Kolodziejski, David Yack, Daniel Christian, Miguel Félix, and Mats Necker, with many more to be announced over the coming weeks. Click here to watch our brand-new sizzle reel for #PPCC24 or click the image below to find out more about registration. See you in Vegas! Power Up Program Announces New Video-Based Learning Hear from Principal Program Manager, Dimpi Gandhi, to discover the latest enhancements to the Microsoft #PowerUpProgram. These include a new accelerated video-based curriculum crafted with the expertise of Microsoft MVPs, Rory Neary and Charlie Phipps-Bennett. If you’d like to hear what’s coming next, click the image below to find out more! UPCOMING EVENTS Microsoft Build - Seattle and Online - 21-23rd May 2024 Taking place on 21-23rd May 2024 both online and in Seattle, this is the perfect event to learn more about low code development, creating copilots, cloud platforms, and so much more to help you unleash the power of AI. There's a serious wealth of talent speaking across the three days, including the likes of Satya Nadella, Amanda K. Silver, Scott Guthrie, Sarah Bird, Charles Lamanna, Miti J., Kevin Scott, Asha Sharma, Rajesh Jha, Arun Ulag, Clay Wesener, and many more. And don't worry if you can't make it to Seattle, the event will be online and totally free to join. Click the image below to register for #MSBuild today! European Collab Summit - Germany - 14-16th May 2024 The clock is counting down to the amazing European Collaboration Summit, which takes place in Germany May 14-16, 2024. #CollabSummit2024 is designed to provide cutting-edge insights and best practices into Power Platform, Microsoft 365, Teams, Viva, and so much more. There's a whole host of experts speakers across the three-day event, including the likes of Vesa Juvonen, Laurie Pottmeyer, Dan Holme, Mark Kashman, Dona Sarkar, Gavin Barron, Emily Mancini, Martina Grom, Ahmad Najjar, Liz Sundet, Nikki Chapple, Sara Fennah, Seb Matthews, Tobias Martin, Zoe Wilson, Fabian Williams, and many more. Click the image below to find out more about #ECS2024 and register today! Microsoft 365 & Power Platform Conference - Seattle - 3-7th June If you're looking to turbo boost your Power Platform skills this year, why not take a look at everything TechCon365 has to offer at the Seattle Convention Center on June 3-7, 2024. This amazing 3-day conference (with 2 optional days of workshops) offers over 130 sessions across multiple tracks, alongside 25 workshops presented by Power Platform, Microsoft 365, Microsoft Teams, Viva, Azure, Copilot and AI experts. There's a great array of speakers, including the likes of Nirav Shah, Naomi Moneypenny, Jason Himmelstein, Heather Cook, Karuana Gatimu, Mark Kashman, Michelle Gilbert, Taiki Y., Kristi K., Nate Chamberlain, Julie Koesmarno, Daniel Glenn, Sarah Haase, Marc Windle, Amit Vasu, Joanne C Klein, Agnes Molnar, and many more. Click the image below for more #Techcon365 intel and register today! For more events, click the image below to visit the Microsoft Community Days website.
It's time for another TUESDAY TIPS, your weekly connection with the most insightful tips and tricks that empower both newcomers and veterans in the Power Platform Community! Every Tuesday, we bring you a curated selection of the finest advice, distilled from the resources and tools in the Community. Whether you’re a seasoned member or just getting started, Tuesday Tips are the perfect compass guiding you across the dynamic landscape of the Power Platform Community. We're excited to announce that updating your community profile has never been easier! Keeping your profile up to date is essential for staying connected and engaged with the community. Check out the following Support Articles with these topics: Accessing Your Community ProfileRetrieving Your Profile URLUpdating Your Community Profile Time ZoneChanging Your Community Profile Picture (Avatar)Setting Your Date Display Preferences Click on your community link for more information: Power Apps, Power Automate, Power Pages, Copilot Studio Thank you for being an active part of our community. Your contributions make a difference! Best Regards, The Community Management Team
Hear from Principal Program Manager, Dimpi Gandhi, to discover the latest enhancements to the Microsoft #PowerUpProgram, including a new accelerated video-based curriculum crafted with the expertise of Microsoft MVPs, Rory Neary and Charlie Phipps-Bennett. If you’d like to hear what’s coming next, click the link below to sign up today! https://aka.ms/PowerUp
It's time for another TUESDAY TIPS, your weekly connection with the most insightful tips and tricks that empower both newcomers and veterans in the Power Platform Community! Every Tuesday, we bring you a curated selection of the finest advice, distilled from the resources and tools in the Community. Whether you’re a seasoned member or just getting started, Tuesday Tips are the perfect compass guiding you across the dynamic landscape of the Power Platform Community. As our community family expands each week, we revisit our essential tools, tips, and tricks to ensure you’re well-versed in the community’s pulse. Keep an eye on the News & Announcements for your weekly Tuesday Tips—you never know what you may learn! Today's Tip: Community User Groups and YOU Being part of, starting, or leading a User Group can have many great benefits for our community members who want to learn, share, and connect with others who are interested in the Microsoft Power Platform and the low-code revolution. When you are part of a User Group, you discover amazing connections, learn incredible things, and build your skills. Some User Groups work in the virtual space, but many meet in physical locations, meaning you have several options when it comes to building community with people who are learning and growing together! Some of the benefits of our Community User Groups are: Network with like-minded peers and product experts, and get in front of potential employers and clients.Learn from industry experts and influencers and make your own solutions more successful.Access exclusive community space, resources, tools, and support from Microsoft.Collaborate on projects, share best practices, and empower each other. These are just a few of the reasons why our community members love their User Groups. Don't wait. Get involved with (or maybe even start) a User Group today--just follow the tips below to get started.For current or new User Group leaders, all the information you need is here: User Group Leader Get Started GuideOnce you've kicked off your User Group, find the resources you need: Community User Group ExperienceHave questions about our Community User Groups? Let us know! We are here to help you!
