feat(chalk-to-util-styletext): add workflow

[richiemccoll]

Related issue

Fixes #198

Test cases

• basic
• advanced modifiers
• bg styles
• chained styles
• complex chaining
• commonjs require
• ESM dynamic import
• mixed imports and usage
• warn when un-migratable chalk api is found
• different importing methods
  • const mychalk = require('chalk');
  • const { red } = require('chalk'); maybe hard
  • const { red; foo }. = require("chalk");
  • const foo = await import('chalk');
  • const { red } = await import('chalk')
  • import * as chalk from 'chalk'
  • import { red } from 'chalk';
  • import { red as colorRed } from 'chalk';
• dependency removal(?)

[AugustinMauroy]

don't miss to do a npm I at root of the repo to sync the lock file 😁
Also you can use multiple step codemod to separate job if needed like for https://github.com/nodejs/userland-migrations/tree/main/recipes/node-url-to-whatwg-url

For dependency removal I'm asking the Codemod team. because on V0 when the tools was JS only and there was a simple thing to manage dep

[AugustinMauroy]

some code style

[avivkeller]

@AugustinMauroy the PR is still a draft, no need to nitpick yet

[AugustinMauroy]

@AugustinMauroy the PR is still a draft, no need to nitpick yet

😅 oops I'm flash macqueen. Nop kidding just inattentive

[richiemccoll]

@AugustinMauroy I've pushed a few commits which I believe address some of the earlier comments. From the original Github issue, 7/8 test cases are passing. The one test case remaining is the complex chaining example.

const styles = level === "error" ? chalk.red.bold : chalk.yellow;

const styles =
	level === "error"
		? (text) => styleText(["red", "bold"], text)
		: (text) => styleText("yellow", text);

I have a rough idea/implementation locally for this, but it's a bit nasty and I'm not sure I like it.

But I'm keen to get feedback on this initial approach and understand if there are possibly better ways of implementing.

[AugustinMauroy]

I'm going to review your current code.

[AugustinMauroy]

WOW clean. About complex thing I didn't have any idea now I'm getting tired. But you do a great job here.

Missing tests/support about import.

• const mychalk = require('chalk');
• const { red }. = require(-'chalk'); maybe hard
• const { red; foo }. = require(-"chalk");
• const foo = await import('chalk');
• const { red } = await import('chalk')
• import * as chalk from 'chalk'
• import { red } from 'chalk';
• import { red as colorRed 'chalk';

For dependcy par you I'll need custom thing (new step on workflow.yaml):

• step that have JSSG child_process & fs capacity enabled
• function that use FS to detect which package manager it's use (npm, yarn, pnpm)
• new function on package-json utility that removes dep
  So jssg step will be architecture as:
• get the package manager
• remove dep with the utility function
• run the good child process

for this part I can take over the pr to help you.

https://docs.codemod.com/cli/packages/building-workflows#steps
https://docs.codemod.com/jssg/security

[AugustinMauroy]

LGTM for now the warning si good. Missing some piece that already in the todo.
If you doesn't want to do the dependency part I can do it in follow up pr.

[richiemccoll]

LGTM for now the warning si good. Missing some piece that already in the todo. If you doesn't want to do the dependency part I can do it in follow up pr.

Here's my plan for the remaining work:

• continue working my way through the remaining TODO's unless I run into any blockers.
• pull down some open source projects that use chalk and run the codemod to iron out any unforeseen issues
• take a look at the removal of the dependency

[AugustinMauroy]

Okay nice !

[AugustinMauroy]

the complex chaining handling is clever 👌🏻