From 6d93465f3b17b969f7b39ee148539a7d81f83755 Mon Sep 17 00:00:00 2001
From: Shubham Padia <shubham@zulip.com>
Date: Mon, 21 Jul 2025 10:59:41 +0000
Subject: [PATCH] help-beta: Remove header from Zulip note.
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

We don't want to have a title of note and the ⓘ  icon in the note aside.
The only way to do this is to have our custom component called
ZulipNote.
---
 eslint.config.js                         |  6 ++++++
 help-beta/src/components/ZulipNote.astro | 11 +++++++++++
 tools/convert-help-center-docs-to-mdx    |  8 +++-----
 3 files changed, 20 insertions(+), 5 deletions(-)
 create mode 100644 help-beta/src/components/ZulipNote.astro

diff --git a/eslint.config.js b/eslint.config.js
index 6d554f0ed9..3357e86cc7 100644
--- a/eslint.config.js
+++ b/eslint.config.js
@@ -305,4 +305,10 @@ export default tseslint.config(
         },
     },
     ...astroConfigs.recommended,
+    {
+        files: ["help-beta/src/components/ZulipNote.astro"],
+        rules: {
+            "import/unambiguous": "off",
+        },
+    },
 );
diff --git a/help-beta/src/components/ZulipNote.astro b/help-beta/src/components/ZulipNote.astro
new file mode 100644
index 0000000000..d8ed3b403e
--- /dev/null
+++ b/help-beta/src/components/ZulipNote.astro
@@ -0,0 +1,11 @@
+<!-- 
+We wanted to have our note without a header that is the ⓘ followed by a title.
+We can make the title disappear by making the title a single space: " ".
+The default aside component provided by starlight will always have an icon however.
+That is why we needed this custom components.
+-->
+<aside aria-label="Note" class={`starlight-aside starlight-aside--note`}>
+    <div class="starlight-aside__content">
+        <slot />
+    </div>
+</aside>
diff --git a/tools/convert-help-center-docs-to-mdx b/tools/convert-help-center-docs-to-mdx
index 024d018858..f5b81f18ec 100755
--- a/tools/convert-help-center-docs-to-mdx
+++ b/tools/convert-help-center-docs-to-mdx
@@ -446,12 +446,10 @@ def convert_admonitions_to_asides(
                 # implementation.
                 # See https://chat.zulip.org/#narrow/channel/19-documentation/topic/Stage.202.3A.20New.20syntax.20for.20!!!tip.20in.20help-beta/near/2174415
                 # for more details.
-                type = "note"
-                title = ""
-                replacement = (
-                    f'\n<Aside type="{type}" title="{title}">\n{admonition_content}\n</Aside>\n'
+                replacement = f"\n<ZulipNote>\n{admonition_content}\n</ZulipNote>\n"
+                import_statement_set.add(
+                    f"import ZulipNote from '{components_dir_path}/ZulipNote.astro';"
                 )
-                import_statement_set.add("import { Aside } from '@astrojs/starlight/components'")
             elif klass == "tip":
                 type = "tip"
                 title = "Tip"