Skip to content
agentusehub

Convert React MUI components to Tailwind with Devin

Lumos used Devin for routine tasks like MUI-to-Tailwind conversion, which went well, and its unit-test feedback loop reduced rewrites.

Time saved
Not reported
Setup time
Not reported
Running cost
Not reported
Cost range
Not reported

Use case overview

Lumos used Devin for routine tasks like MUI-to-Tailwind conversion, which went well, and its unit-test feedback loop reduced rewrites.

Reported experience

  1. What they did

    Lumos engineers gave Devin a short prompt to convert React MUI components to Tailwind using their own styles, and it opened a PR. Before that, they let it run unit tests and filled its Knowledge feature with codebase-specific guidance. Engineers then reviewed the PR.

  2. How it went

    The conversion went quite well, but the PR wasn't ready to merge as-is. They think linting and pre-commit hooks might have fixed that. Overall, Devin pushed 44 PRs in 48 days, and 19 were merged.

  3. Worth knowing

    Typical Devin PRs cost $5 to $40, averaging about $20. Each command is capped at 10 ACUs (about $20), and a simple deletion PR cost about $5.

Example prompts

Try with Devin
In [repo name], convert the React components in [folder path] from [current styling library, e.g. MUI] to [target, e.g. Tailwind], keeping the look and behavior the same. Run the existing unit tests after each component and fix failures before moving on. Open a PR when all tests pass, with a short list of components converted and anything you couldn't convert.
Software & DevOps

Port a Chrome extension to Safari

The author had ChatGPT take the Session Buddy extension source from Chrome, port it to Safari and install it, taking about 20 minutes.

ChatGPT