paulmataruso/zulip
1
0
Fork 0
mirror of https://github.com/zulip/zulip.git synced 2025-10-30 11:33:51 +00:00
Code Issues Packages Projects Releases Wiki Activity

help-beta: Add support for displaying zulip icons.

Browse Source 
We're using unplugin-icons to do so.
This commit is contained in:
Shubham Padia
2025-05-09 20:56:56 +00:00
committed by Tim Abbott
parent c97cd1c5dd
commit 68ec074a84
2 changed files with 44 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files

19
help-beta/astro.config.mjs
View File

@@ -1,3 +1,5 @@
import * as fs from "node:fs";
import starlight from "@astrojs/starlight";
import {defineConfig} from "astro/config";
import Icons from "unplugin-icons/vite";
@@ -14,6 +16,23 @@ export default defineConfig({
// them look larger than the text around them.
scale: 1,
defaultStyle: "display: inline; vertical-align: text-bottom;",
customCollections: {
// unplugin-icons has a FileSystemIconLoader which is more
// versatile. But it only supports one directory path for
// a single set of icons. We should start using that loader
// if they add support for multiple paths in the future.
async "zulip-icon"(iconName) {
const sharedIconsPath = `../web/shared/icons/${iconName}.svg`;
const webOnlyIconsPath = `../web/images/icons/${iconName}.svg`;
if (fs.existsSync(sharedIconsPath)) {
return await fs.promises.readFile(sharedIconsPath, "utf8");
} else if (fs.existsSync(webOnlyIconsPath)) {
return await fs.promises.readFile(webOnlyIconsPath, "utf8");
}
throw new Error("Zulip icon not found.");
},
},
}),
],
},

30
tools/convert-help-center-docs-to-mdx
View File

@@ -98,6 +98,19 @@ def append_str_to_line(text: str, destination_str: str, n: int) -> str:
return "\n".join(lines)
def replace_icon_with_unplugin_component(
match: re.Match[str],
icon_package_name: str,
icon_component_prefix: str,
import_statement_set: set[str],
) -> str:
icon_name = match.group(1)
component_name = icon_component_prefix + to_pascal(icon_name).replace("-", "")
import_statement = f'import {component_name} from "~icons/{icon_package_name}/{icon_name}"'
import_statement_set.add(import_statement)
return f"<{component_name} />"
def replace_icons(markdown_string: str, import_statement_set: set[str]) -> str:
"""
Write some examples here and some assumptions we made about
@@ -108,16 +121,23 @@ def replace_icons(markdown_string: str, import_statement_set: set[str]) -> str:
)
def replace_font_awesome_icon_with_unplugin_component(match: re.Match[str]) -> str:
icon_name = match.group(1)
component_name = "Fa" + to_pascal(icon_name).replace("-", "")
import_statement = f'import {component_name} from "~icons/fa/{icon_name}"'
import_statement_set.add(import_statement)
return f"<{component_name} />"
return replace_icon_with_unplugin_component(match, "fa", "Fa", import_statement_set)
result = re.sub(
font_awesome_pattern, replace_font_awesome_icon_with_unplugin_component, markdown_string
)
zulip_icon_pattern = re.compile(
r'<i[^>]*class="(?:[^"]*\s)?zulip-icon(?:\s+zulip-icon-([a-z0-9\-]+))(?:\s[^"]*)?"[^>]*>(?:\s[^<]*)?</i>',
)
def replace_zulip_icon_with_unplugin_component(match: re.Match[str]) -> str:
return replace_icon_with_unplugin_component(
match, "zulip-icon", "ZulipIcons", import_statement_set
)
result = re.sub(zulip_icon_pattern, replace_zulip_icon_with_unplugin_component, markdown_string)
return result