help-beta: Remove header from Zulip note.

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

@@ -305,4 +305,10 @@ export default tseslint.config(
         },
     },
     ...astroConfigs.recommended,
+    {
+        files: ["help-beta/src/components/ZulipNote.astro"],
+        rules: {
+            "import/unambiguous": "off",
+        },
+    },
 );

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>

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"
+                replacement = f"\n<ZulipNote>\n{admonition_content}\n</ZulipNote>\n"
-                title = ""
+                import_statement_set.add(
-                replacement = (
+                    f"import ZulipNote from '{components_dir_path}/ZulipNote.astro';"
-                    f'\n<Aside type="{type}" title="{title}">\n{admonition_content}\n</Aside>\n'
                 )
-                import_statement_set.add("import { Aside } from '@astrojs/starlight/components'")
             elif klass == "tip":
                 type = "tip"
                 title = "Tip"