Revolutionise your component management

<!DOCTYPE html> <html> <head> <meta charset="utf-8"/> <title>Revolutionise your component management - Sorry™ Help Center</title> <meta name="viewport" content="width=device-width, maximum-scale=1"/> <meta name="apple-mobile-web-app-capable" content="yes"/> <meta name="format-detection" content="telephone=no"> <meta name="description" content="We've enhanced how you can add, edit, and organise components through our management UI July 12th 2023 Components play a crucial role in creating effective stat"/> <meta name="author" content="SorryApp Ltd"/> <link rel="canonical" href="http://help.sorryapp.com/article/43-revolutionise-your-component-management"/> <meta name="twitter:card" content="summary"/> <meta name="twitter:title" content="Revolutionise your component management" /> <meta name="twitter:description" content="We've enhanced how you can add, edit, and organise components through our management UI July 12th 2023 Components play a crucial role in creating effective stat"/> <link rel="stylesheet" href="//d3eto7onm69fcz.cloudfront.net/assets/stylesheets/launch-1739918333420.css"> <style> body { background: #ffffff; } .navbar .navbar-inner { background: #ffffff; } .navbar .nav li a, .navbar .icon-private-w { color: #1f2937; } .navbar .brand, .navbar .nav li a:hover, .navbar .nav li a:focus, .navbar .nav .active a, .navbar .nav .active a:hover, .navbar .nav .active a:focus { color: #536276; } .navbar a:hover .icon-private-w, .navbar a:focus .icon-private-w, .navbar .active a .icon-private-w, .navbar .active a:hover .icon-private-w, .navbar .active a:focus .icon-private-w { color: #536276; } #serp-dd .result a:hover, #serp-dd .result > li.active, #fullArticle strong a, #fullArticle a strong, .collection a, .contentWrapper a, .most-pop-articles .popArticles a, .most-pop-articles .popArticles a:hover span, .category-list .category .article-count, .category-list .category:hover .article-count { color: #1f2937; } #fullArticle, #fullArticle p, #fullArticle ul, #fullArticle ol, #fullArticle li, #fullArticle div, #fullArticle blockquote, #fullArticle dd, #fullArticle table { color:#1f2937; } </style> <link rel="apple-touch-icon-precomposed" href="//d33v4339jhl8k0.cloudfront.net/docs/assets/6547d03d3a305543bce585fb/images/655cbae75e4e1f0786eb3cec/favicon.png"> <link rel="shortcut icon" type="image/png" href="//d33v4339jhl8k0.cloudfront.net/docs/assets/6547d03d3a305543bce585fb/images/655cbae788e8fb00a8f81d6f/favicon.png">  <script type="application/ld+json"> {"@context":"https://schema.org","@type":"WebSite","url":"http://help.sorryapp.com","potentialAction":{"@type":"SearchAction","target":"http://help.sorryapp.com/search?query={query}","query-input":"required name=query"}} </script> <script type="application/ld+json"> {"@context":"https://schema.org","@type":"BreadcrumbList","itemListElement":[{"@type":"ListItem","position":1,"name":"Sorry™ Help Center","item":"http://help.sorryapp.com"},{"@type":"ListItem","position":2,"name":"What's New","item":"https://help.sorryapp.com/collection/8-whats-new"},{"@type":"ListItem","position":3,"name":"Revolutionise your component management","item":"https://help.sorryapp.com/article/43-revolutionise-your-component-management"}]} </script>  <script async src="https://www.googletagmanager.com/gtag/js?id=G-GKHZ2SCNR5"></script> <script> window.dataLayer = window.dataLayer || []; function gtag(){dataLayer.push(arguments);} gtag('js', new Date()); gtag('config', 'G-GKHZ2SCNR5'); </script> </head> <body> <header id="mainNav" class="navbar"> <div class="navbar-inner"> <div class="container-fluid"> <a class="brand" href="https://www.sorryapp.com/"> <img src="//d33v4339jhl8k0.cloudfront.net/docs/assets/6547d03d3a305543bce585fb/images/678e27efda723500ee30c6bb/Help-Tag-3.png" alt="Sorry™ Help Center" width="331" height="75"> </a> <button type="button" class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse"> <span class="sr-only">Toggle Navigation</span> <span class="icon-bar"></span> <span class="icon-bar"></span> <span class="icon-bar"></span> </button> <div class="nav-collapse collapse"> <nav role="navigation"> <ul class="nav"> <li id="home"><a href="/">Home <b class="caret"></b></a></li> <li id="help-docs"><a href="/collection/118-help-docs">Help Docs <b class="caret"></b></a></li> <li class="active" id="whats-new"><a href="/collection/8-whats-new">What's New <b class="caret"></b></a></li> <li id="incident-tips"><a href="/collection/5-incident-tips">Incident Tips <b class="caret"></b></a></li> <li id="contact"><a href="#" class="contactUs" onclick="window.Beacon('open')">Contact</a></li> <li id="contactMobile"><a href="#" class="contactUs" onclick="window.Beacon('open')">Contact</a></li> </ul> </nav> </div> </div> </div> </header> <section id="contentArea" class="container-fluid"> <div class="row-fluid"> <section id="main-content" class="span9"> <div class="contentWrapper"> <article id="fullArticle"> <h1 class="title">Revolutionise your component management</h1> <a href="javascript:window.print()" class="printArticle" title="Print this article" aria-label="Print this Article"><i class="icon-print"></i></a> <p>We've enhanced how you can add, edit, and organise components through our management UI</p><br> <p><i>July 12th 2023</i></p><br> <p>Components play a crucial role in creating effective status pages that keep your subscribers well-informed about the parts of your product that matter most to them.</p><br> <p>We understand their significance, and that's why we've enhanced how you can add, edit, and organise components through our management UI. The result? A streamlined and efficient process that saves you time and effort.</p><br> <p><a href="https://downloads.intercomcdn.com/i/o/835803412/383d64356979cbf50a5de193/component-ui.png" target="_blank" rel="noreferrer nofollow noopener"><img src="https://downloads.intercomcdn.com/i/o/835803412/383d64356979cbf50a5de193/component-ui.png" style="width: 100%; max-width: 100%; "></a></p> <h1 id="h_897609541a">Improved Grouped Components</h1> <p>Our new update lets you quickly determine which components belong to specific groups or parent components. This visual clarity allows you to organise and structure your status pages in a way that makes sense for your subscribers.</p><br> <h1 id="h_3f447ab685">Inline editing for easy changes</h1> <p>Gone are the days of navigating multiple screens to modify component names and descriptions. With our inline editing functionality, you can make changes directly on one screen. Update the necessary information, save your changes, and witness them take effect immediately.</p><br> <h1 id="h_d1c79f202f">Effortless component organisation</h1> <p>We understand that arranging components in the desired order is essential for effective communication. That's why we've implemented a user-friendly drag-and-drop interface. You can now place components in different positions effortlessly with a swift motion.</p> <p>This intuitive feature allows you to customise the layout of your status pages, ensuring that the most critical information is prominently displayed.</p><br> <h1 id="h_eace2a4d82">Accessibility made simple</h1> <p>We believe in making our features easily accessible to all users. That's why our new component management UI is now readily available by default, requiring no additional action. Experience a smoother workflow and enjoy the benefits of our improved interface from the moment you use it.</p><br> <h1 id="h_9ac4fd6f13">To summarise the changes:</h1> <ul> <li>Quickly group components for clear organisation and better communication.</li> <li>Enjoy inline editing to modify names and descriptions effortlessly.</li> <li>Swiftly organise components with a user-friendly drag-and-drop interface.</li> <li>Access the enhanced component management UI by default; no further action is required.</li> </ul> </article> <div class="articleRatings" data-article-url="https://help.sorryapp.com/article/43-revolutionise-your-component-management"> <span class="articleRatings-question">Did this answer your question?</span> <span class="articleRatings-feedback"> <span class="articleRatings-feedback-tick"> <svg height="20" viewBox="0 0 20 20" width="20" xmlns="http://www.w3.org/2000/svg"> <path d="m8 14a.997.997 0 0 1 -.707-.293l-2-2a.999.999 0 1 1 1.414-1.414l1.293 1.293 4.293-4.293a.999.999 0 1 1 1.414 1.414l-5 5a.997.997 0 0 1 -.707.293" fill="#2CC683" fill-rule="evenodd"/> </svg> </span> <span class="articleRatings-feedback-message">Thanks for the feedback</span> </span> <span class="articleRatings-failure">There was a problem submitting your feedback. Please try again later.</span> <div class="articleRatings-actions"> <button class="rateAction rateAction--positive" data-rating="positive"> <span class="sr-only">Yes</span> <span class="rating-face"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24"> <path fill-rule="evenodd" d="M5.538 14.026A19.392 19.392 0 0 1 12 12.923c2.26 0 4.432.388 6.462 1.103-1.087 2.61-3.571 4.436-6.462 4.436-2.891 0-5.375-1.825-6.462-4.436zm1.847-3.872a1.846 1.846 0 1 1 0-3.692 1.846 1.846 0 0 1 0 3.692zm9.23 0a1.846 1.846 0 1 1 0-3.692 1.846 1.846 0 0 1 0 3.692z"/> </svg> </span> </button> <button class="rateAction rateAction--negative" data-rating="negative"> <span class="sr-only">No</span> <span class="rating-face"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24"> <path fill-rule="evenodd" d="M7.385 13.846a1.846 1.846 0 1 1 0-3.692 1.846 1.846 0 0 1 0 3.692zm9.23 0a1.846 1.846 0 1 1 0-3.692 1.846 1.846 0 0 1 0 3.692zm-.967 4.95a.992.992 0 0 1-.615-.212c-1.701-1.349-4.364-1.349-6.065 0a.998.998 0 0 1-1.36-.123.895.895 0 0 1 .127-1.3A6.897 6.897 0 0 1 12 15.692c1.555 0 3.069.521 4.266 1.467.41.326.467.909.127 1.3a.982.982 0 0 1-.745.335z"/> </svg> </span> </button> </div> </div> <section class="articleFoot"> <i class="icon-contact"></i> <p class="help">Still need help? <a id="sbContact" href="#" class="contactUs" onclick="window.Beacon('open')">Contact Us</a> <a id="sbContactMobile" href="#" class="contactUs" onclick="window.Beacon('open')">Contact Us</a> </p> <time class="lu" datetime=2023-11-21 >Last updated on November 21, 2023</time> </section> </div> </section> <aside id="sidebar" class="span3"> <form action="/search" method="GET" id="searchBar" class="sm" autocomplete="off"> <input type="hidden" name="collectionId" value="655bb7832a1225028fb600ba"/> <input type="text" name="query" title="search-query" class="search-query" placeholder="Search" value="" aria-label="Search" /> <button type="submit"> <span class="sr-only">Toggle Search</span> <i class="icon-search"></i> </button> <div id="serp-dd" style="display: none;" class="sb"> <ul class="result"> </ul> </div> </form> <h3>Categories</h3> <ul class="nav nav-list"> <li ><a href="/category/27-status-page-releases">Status Page Releases <i class="icon-arrow"></i></a></li> <li class="active" ><a href="/category/41-admin-improvements">Admin Improvements <i class="icon-arrow"></i></a></li> <li ><a href="/category/50-security-updates">Security Updates <i class="icon-arrow"></i></a></li> <li ><a href="/category/25-upcoming-features">Upcoming Features <i class="icon-arrow"></i></a></li> <li ><a href="/category/169-feature-sunsets">Feature Sunsets <i class="icon-arrow"></i></a></li> </ul> </aside> </div> <div id="noResults" style="display:none;">No results found</div> <footer> <p>© <a href="https://www.sorryapp.com/">SorryApp Ltd</a> 2025. <span>Powered by <a rel="nofollow noopener noreferrer" href="https://www.helpscout.com/docs-refer/?co=SorryApp+Ltd&utm_source=docs&utm_medium=footerlink&utm_campaign=Docs+Branding" target="_blank">Help Scout</a></span> </p> </footer> </section> <script id="beaconLoader" type="text/javascript">!function(e,t,n){function a(){var e=t.getElementsByTagName("script")[0],n=t.createElement("script");n.type="text/javascript",n.async=!0,n.src="https://beacon-v2.helpscout.net",e.parentNode.insertBefore(n,e)}if(e.Beacon=n=function(t,n,a){e.Beacon.readyQueue.push({method:t,options:n,data:a})},n.readyQueue=[],"complete"===t.readyState)return a();e.attachEvent?e.attachEvent("onload",a):e.addEventListener("load",a,!1)}(window,document,window.Beacon||function(){});</script> <script type="text/javascript">window.Beacon('init', 'e8ca7872-e08b-4602-a908-f3cf0fbe0c42')</script> <script type="text/javascript"> function hashChanged() { var hash = window.location.hash.substring(1); if (hash === 'contact') { window.Beacon('open') } } if (window.location.hash) { hashChanged() } window.onhashchange = function () { hashChanged() } window.addEventListener('hashchange', hashChanged, false); </script> <script src="//d3eto7onm69fcz.cloudfront.net/assets/javascripts/app3.min.js"></script> <script> // keep iOS links from opening safari if(("standalone" in window.navigator) && window.navigator.standalone){ // If you want to prevent remote links in standalone web apps opening Mobile Safari, change 'remotes' to true var noddy, remotes = false; document.addEventListener('click', function(event) { noddy = event.target; while(noddy.nodeName !== "A" && noddy.nodeName !== "HTML") { noddy = noddy.parentNode; } if('href' in noddy && noddy.href.indexOf('http') !== -1 && (noddy.href.indexOf(document.location.host) !== -1 || remotes)){ event.preventDefault(); document.location.href = noddy.href; } },false); } </script> </body> </html>

CINXE.COM

Revolutionise your component management - Sorry™ Help Center