[Platform] [Outdated design token references] I want a CI check to identify unused Tailwind classes in application code So that I can prevent broken styles

[Enjoy2Live]

User Story

As a developer working on a monorepo with generated design tokens I want a CI check to identify unused Tailwind classes in application code So that I can prevent style inconsistencies and broken styles caused by outdated design token references.

Reasoning

Design tokens are generated from a Figma plugin called tokens studio and transformed into Tailwind classes by the packages/tailwind-constructor. Changes in design tokens can result in the removal of Tailwind classes, leading to broken styles in applications if not detected early. A CI check will proactively identify these issues before they reach production.

Idea

Implement a CI job that:

1. Parses all application code files for Tailwind class usage. (can be achieved with eslint-plugin-tailwindcss found in our global eslint package)
2. Generates a report of unused Tailwind classes along with their locations in the codebase.
3. Fails the CI build if non Tailwind classes are found.

Acceptance Criteria

• The CI job successfully identifies non Tailwind classes in all application code files.
• The generated report accurately lists non Tailwind classes and their file locations.
• The CI build fails when non Tailwind classes are detected.
• The CI job provides clear and actionable output to developers.
• The CI job has reasonable performance.

[dbradham]

@Enjoy2Live is there anyone on the team other than yourself who could take this on?

[Enjoy2Live]

@dbradham

@yacineKahlerras might be interested in this?