Skip to content

refac: use emotion for registering fonts#212

Merged
ZuperZee merged 2 commits intomainfrom
zuperzee/do-not-use-direct-css-imports
Nov 10, 2025
Merged

refac: use emotion for registering fonts#212
ZuperZee merged 2 commits intomainfrom
zuperzee/do-not-use-direct-css-imports

Conversation

@ZuperZee
Copy link
Contributor

@ZuperZee ZuperZee commented Nov 6, 2025

Grafana plugin validator has 'no-direct-css-imports' rule: https://github.com/grafana/plugin-validator/blob/7be5debe7d9e2061c382b443ab1b149c59b87d8b/pkg/analysis/passes/coderules/semgrep-rules.yaml#L198 To follow that rule, use emotion to register the fonts instead of direct CSS imports.

Grafana plugin validator has 'no-direct-css-imports' rule:
https://github.com/grafana/plugin-validator/blob/7be5debe7d9e2061c382b443ab1b149c59b87d8b/pkg/analysis/passes/coderules/semgrep-rules.yaml#L198
To follow that rule, use emotion to register the fonts instead of
direct CSS imports.
@github-actions
Copy link

github-actions bot commented Nov 6, 2025

Bundle Size Changes

Hello! 👋 This comment was generated by a Github Action to help you and reviewers understand the impact of your PR on frontend bundle sizes.

Whenever this PR is updated, this comment will update to reflect the latest changes.

EntryPoint Size % Diff
module 51.83 KB (-5.59 KB) -9.74%
Files Total bundle size % Diff
24 1.02 MB (-5.59 KB) -0.53%
View detailed bundle information

Added

Name Size % Diff
static/fonts/OpenSans-SemiBold.woff2 45.48 KB (+45.48 KB) -
static/fonts/OpenSans-Bold.woff2 45.37 KB (+45.37 KB) -
static/fonts/OpenSans-Light.woff2 44.74 KB (+44.74 KB) -
static/fonts/OpenSans-Regular.woff2 43.6 KB (+43.6 KB) -
static/fonts/OFL.txt 4.12 KB (+4.12 KB) -

Removed

Name Size % Diff
fonts/OpenSans-SemiBold+e24264613d8bf484c0aa.woff2 0 Bytes (-45.48 KB) -100.00%
fonts/OpenSans-Bold+b87be75f5095e2b4ffe9.woff2 0 Bytes (-45.37 KB) -100.00%
fonts/OpenSans-Light+1f45c30d2fb99f9a22fd.woff2 0 Bytes (-44.74 KB) -100.00%
fonts/OpenSans-Regular+403af3bc2c6126fb5cef.woff2 0 Bytes (-43.6 KB) -100.00%
fonts/OFL+93e8104d50b4463c903a.txt 0 Bytes (-4.12 KB) -100.00%

Bigger

No assets were bigger

Smaller

Name Size % Diff
module.js 51.83 KB (-5.59 KB) -9.74%
View module information

Added

Name Size % Diff
./registerFonts.ts 1.39 KB (+1.39 KB) -

Removed

Name Size % Diff
./fonts.scss 0 Bytes (-1.74 KB) -100.00%
./fonts/OFL.txt 0 Bytes (-84 Bytes) -100.00%
./fonts/OpenSans-Bold.woff2 0 Bytes (-42 Bytes) -100.00%
./fonts/OpenSans-Light.woff2 0 Bytes (-42 Bytes) -100.00%
./fonts/OpenSans-Regular.woff2 0 Bytes (-42 Bytes) -100.00%
./fonts/OpenSans-SemiBold.woff2 0 Bytes (-42 Bytes) -100.00%

Bigger

No modules were bigger

Smaller

Name Size % Diff
.pnpm 63.45 KB (-12.21 KB) -16.14%
./HTMLPanel.tsx 12.38 KB (-23 Bytes) -0.18%

Instead of registering the font on every render,
it now only registers the fonts when the module is loaded.
@ZuperZee ZuperZee marked this pull request as ready for review November 10, 2025 06:43
@ZuperZee ZuperZee merged commit 5e8e5ff into main Nov 10, 2025
5 checks passed
@ZuperZee ZuperZee deleted the zuperzee/do-not-use-direct-css-imports branch November 10, 2025 06:44
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant