bui(docs-ui): Add discord link to backstage ui docs header (#33108)

* Add discord link to backstage ui docs header

Signed-off-by: AmbrishRamachandiran <ambrish.r@infosys.com>

* Addressing review comments

Signed-off-by: AmbrishRamachandiran <ambrish.r@infosys.com>

---------

Signed-off-by: AmbrishRamachandiran <ambrish.r@infosys.com>

docs-ui/src/components/Toolbar/Toolbar.tsx

@@ -3,6 +3,7 @@
 import { useState, useEffect } from 'react';
 import {
   RiArrowDownSLine,
+  RiDiscordLine,
   RiGithubLine,
   RiMoonLine,
   RiSearchLine,
@@ -95,6 +96,7 @@ export const Toolbar = ({ version }: ToolbarProps) => {
         <a
           href="https://www.npmjs.com/package/@backstage/ui"
           target="_blank"
+          rel="noopener noreferrer"
           className={styles.bubble}
           data-hide-tablet
         >
@@ -103,11 +105,23 @@ export const Toolbar = ({ version }: ToolbarProps) => {
         <a
           href="https://github.com/backstage/backstage/tree/master/packages/ui"
           target="_blank"
+          rel="noopener noreferrer"
           className={styles.bubble}
           data-hide-tablet
+          aria-label="View source on GitHub"
         >
           <RiGithubLine size={16} />
         </a>
+        <a
+          href="https://discord.gg/backstage-687207715902193673"
+          target="_blank"
+          rel="noopener noreferrer"
+          className={styles.bubble}
+          data-hide-tablet
+          aria-label="Join Backstage on Discord"
+        >
+          <RiDiscordLine size={16} />
+        </a>
         <ToggleButtonGroup
           defaultSelectedKeys={['light']}
           selectedKeys={selectedTheme}