@wise/wds-codemods 1.0.0-experimental-d309319 → 1.0.0-experimental-e09ad51
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/{helpers-Bgz_nSwk.js → helpers-kGjqIu3N.js} +142 -157
- package/dist/helpers-kGjqIu3N.js.map +1 -0
- package/dist/index.js +49 -61
- package/dist/index.js.map +1 -1
- package/dist/transforms/button/transformer.js +1 -1
- package/package.json +15 -19
- package/dist/chunk-CInkuQNp.js +0 -43
- package/dist/helpers-Bgz_nSwk.js.map +0 -1
- package/dist/transformer-CFJ7Jq1h.js +0 -434
- package/dist/transformer-CFJ7Jq1h.js.map +0 -1
- package/dist/transforms/list-item/config.json +0 -6
- package/dist/transforms/list-item/transformer.js +0 -3
|
@@ -1,434 +0,0 @@
|
|
|
1
|
-
const require_chunk = require('./chunk-CInkuQNp.js');
|
|
2
|
-
let node_child_process = require("node:child_process");
|
|
3
|
-
let node_path = require("node:path");
|
|
4
|
-
let ora = require("ora");
|
|
5
|
-
ora = require_chunk.__toESM(ora);
|
|
6
|
-
let node_https = require("node:https");
|
|
7
|
-
node_https = require_chunk.__toESM(node_https);
|
|
8
|
-
let __anthropic_ai_claude_agent_sdk = require("@anthropic-ai/claude-agent-sdk");
|
|
9
|
-
let node_fs = require("node:fs");
|
|
10
|
-
let diff = require("diff");
|
|
11
|
-
|
|
12
|
-
//#region src/constants.ts
|
|
13
|
-
const CONSOLE_ICONS = {
|
|
14
|
-
info: "\x1B[34mℹ\x1B[0m",
|
|
15
|
-
focus: "\x1B[34m➙\x1B[0m",
|
|
16
|
-
success: "\x1B[32m✔\x1B[0m",
|
|
17
|
-
warning: "\x1B[33m⚠\x1B[0m",
|
|
18
|
-
error: "\x1B[31m✖\x1B[0m",
|
|
19
|
-
claude: "\x1B[35m💬\x1B[0m"
|
|
20
|
-
};
|
|
21
|
-
|
|
22
|
-
//#endregion
|
|
23
|
-
//#region src/transforms/list-item/constants.ts
|
|
24
|
-
const DEPRECATED_COMPONENT_NAMES = [
|
|
25
|
-
"ActionOption",
|
|
26
|
-
"NavigationOption",
|
|
27
|
-
"NavigationOptionsList",
|
|
28
|
-
"Summary",
|
|
29
|
-
"SwitchOption",
|
|
30
|
-
"CheckboxOption",
|
|
31
|
-
"RadioOption"
|
|
32
|
-
];
|
|
33
|
-
const MIGRATION_RULES = `Migration rules:
|
|
34
|
-
# Legacy Component → ListItem Migration Guide
|
|
35
|
-
|
|
36
|
-
## Universal Rules
|
|
37
|
-
|
|
38
|
-
1. \`title\` → \`title\` (direct)
|
|
39
|
-
2. \`content\` or \`description\` → \`subtitle\`
|
|
40
|
-
3. \`disabled\` stays on \`ListItem\` (not controls)
|
|
41
|
-
4. Keep HTML attributes (\`id\`, \`name\`, \`aria-label\`), remove: \`as\`, \`complex\`, \`showMediaAtAllSizes\`, \`showMediaCircle\`, \`isContainerAligned\`
|
|
42
|
-
5. In strings, don't convert \`\`to\`'\`or\`"\`. Preserve what is there.
|
|
43
|
-
|
|
44
|
-
---
|
|
45
|
-
|
|
46
|
-
## ActionOption → ListItem.Button
|
|
47
|
-
|
|
48
|
-
- \`action\` → Button children
|
|
49
|
-
- \`onClick\` → Button \`onClick\`
|
|
50
|
-
- Priority: default/\`"primary"\` → \`"primary"\`, \`"secondary"\` → \`"secondary-neutral"\`, \`"secondary-send"\` → \`"secondary"\`, \`"tertiary"\` → \`"tertiary"\`
|
|
51
|
-
|
|
52
|
-
\`\`\`tsx
|
|
53
|
-
<ActionOption title="Title" content="Text" action="Click" priority="secondary" onClick={fn} />
|
|
54
|
-
→
|
|
55
|
-
<ListItem title="Title" subtitle="Text" control={<ListItem.Button priority="secondary-neutral" onClick={fn}>Click</ListItem.Button>} />
|
|
56
|
-
\`\`\`
|
|
57
|
-
|
|
58
|
-
---
|
|
59
|
-
|
|
60
|
-
## CheckboxOption → ListItem.Checkbox
|
|
61
|
-
|
|
62
|
-
- \`onChange\`: \`(checked: boolean)\` → \`(event: ChangeEvent)\` use \`event.target.checked\`
|
|
63
|
-
- \`name\` move to Checkbox
|
|
64
|
-
- Don't move \`id\` to Checkbox
|
|
65
|
-
|
|
66
|
-
\`\`\`tsx
|
|
67
|
-
<CheckboxOption id="x" name="y" title="Title" content="Text" checked={v} onChange={(c) => set(c)} />
|
|
68
|
-
→
|
|
69
|
-
<ListItem title="Title" subtitle="Text" control={<ListItem.Checkbox name="y" checked={v} onChange={(e) => set(e.target.checked)} />} />
|
|
70
|
-
\`\`\`
|
|
71
|
-
|
|
72
|
-
---
|
|
73
|
-
|
|
74
|
-
## RadioOption → ListItem.Radio
|
|
75
|
-
|
|
76
|
-
- \`name\`, \`value\`, \`checked\`, \`onChange\` move to Radio
|
|
77
|
-
- Don't move \`id\` to Radio
|
|
78
|
-
|
|
79
|
-
\`\`\`tsx
|
|
80
|
-
<RadioOption id="x" name="y" value="v" title="Title" content="Text" checked={v==='v'} onChange={set} />
|
|
81
|
-
→
|
|
82
|
-
<ListItem title="Title" subtitle="Text" control={<ListItem.Radio name="y" value="v" checked={v==='v'} onChange={set} />} />
|
|
83
|
-
\`\`\`
|
|
84
|
-
|
|
85
|
-
---
|
|
86
|
-
|
|
87
|
-
## SwitchOption → ListItem.Switch
|
|
88
|
-
|
|
89
|
-
- \`onChange\` → \`onClick\`, toggle manually
|
|
90
|
-
- \`aria-label\` moves to Switch
|
|
91
|
-
|
|
92
|
-
\`\`\`tsx
|
|
93
|
-
<SwitchOption title="Title" content="Text" checked={v} aria-label="Toggle" onChange={set} />
|
|
94
|
-
→
|
|
95
|
-
<ListItem title="Title" subtitle="Text" control={<ListItem.Switch checked={v} aria-label="Toggle" onClick={() => set(!v)} />} />
|
|
96
|
-
\`\`\`
|
|
97
|
-
|
|
98
|
-
---
|
|
99
|
-
|
|
100
|
-
## NavigationOption → ListItem.Navigation
|
|
101
|
-
|
|
102
|
-
- \`onClick\` or \`href\` move to Navigation
|
|
103
|
-
|
|
104
|
-
\`\`\`tsx
|
|
105
|
-
<NavigationOption title="Title" content="Text" onClick={fn} />
|
|
106
|
-
→
|
|
107
|
-
<ListItem title="Title" subtitle="Text" control={<ListItem.Navigation onClick={fn} />} />
|
|
108
|
-
\`\`\`
|
|
109
|
-
|
|
110
|
-
---
|
|
111
|
-
|
|
112
|
-
## Option → ListItem
|
|
113
|
-
|
|
114
|
-
- Wrap \`media\` in \`ListItem.AvatarView\`
|
|
115
|
-
|
|
116
|
-
\`\`\`tsx
|
|
117
|
-
<Option media={<Icon />} title="Title" />
|
|
118
|
-
→
|
|
119
|
-
<ListItem title="Title" media={<ListItem.AvatarView><Icon /></ListItem.AvatarView>} />
|
|
120
|
-
\`\`\`
|
|
121
|
-
|
|
122
|
-
---
|
|
123
|
-
|
|
124
|
-
## Summary → ListItem
|
|
125
|
-
|
|
126
|
-
**Basic:**
|
|
127
|
-
|
|
128
|
-
- \`icon\` → wrap in \`ListItem.AvatarView\` with \`size={32}\` as \`media\`
|
|
129
|
-
- Remove \`size\` from child \`<Icon />\`
|
|
130
|
-
|
|
131
|
-
**Status:**
|
|
132
|
-
|
|
133
|
-
- \`Status.DONE\` → \`badge={{ status: 'positive' }}\`
|
|
134
|
-
- \`Status.PENDING\` → \`badge={{ status: 'pending' }}\`
|
|
135
|
-
- \`Status.NOT_DONE\` → no badge
|
|
136
|
-
|
|
137
|
-
**Action:**
|
|
138
|
-
|
|
139
|
-
- \`action.text\` → \`action.label\` in \`ListItem.AdditionalInfo\` as \`additionalInfo\`
|
|
140
|
-
|
|
141
|
-
**Info (requires state):**
|
|
142
|
-
|
|
143
|
-
- \`MODAL\` → \`ListItem.IconButton partiallyInteractive\` + \`<Modal>\` in \`control\`
|
|
144
|
-
- \`POPOVER\` → \`<Popover>\` wrapping \`ListItem.IconButton partiallyInteractive\` in \`control\`
|
|
145
|
-
- Use \`QuestionMarkCircle\` icon (import from \`@transferwise/icons\`)
|
|
146
|
-
|
|
147
|
-
\`\`\`tsx
|
|
148
|
-
// Basic
|
|
149
|
-
<Summary title="T" description="D" icon={<Icon />} />
|
|
150
|
-
→
|
|
151
|
-
<ListItem title="T" subtitle="D" media={<ListItem.AvatarView size={32}><Icon /></ListItem.AvatarView>} />
|
|
152
|
-
|
|
153
|
-
// Status
|
|
154
|
-
<Summary title="T" description="D" icon={<Icon />} status={Status.DONE} />
|
|
155
|
-
→
|
|
156
|
-
<ListItem title="T" subtitle="D" media={<ListItem.AvatarView size={32} badge={{status:'positive'}}><Icon /></ListItem.AvatarView>} />
|
|
157
|
-
|
|
158
|
-
// Action
|
|
159
|
-
<Summary title="T" description="D" icon={<Icon />} action={{text:'Go', href:'/go'}} />
|
|
160
|
-
→
|
|
161
|
-
<ListItem title="T" subtitle="D" media={<ListItem.AvatarView size={32}><Icon /></ListItem.AvatarView>} additionalInfo={<ListItem.AdditionalInfo action={{label:'Go', href:'/go'}} />} />
|
|
162
|
-
|
|
163
|
-
// Modal (add: const [open, setOpen] = useState(false))
|
|
164
|
-
<Summary title="T" description="D" icon={<Icon />} info={{title:'Help', content:'Text', presentation:'MODAL', 'aria-label':'Info'}} />
|
|
165
|
-
→
|
|
166
|
-
<ListItem title="T" subtitle="D" media={<ListItem.AvatarView size={32}><Icon /></ListItem.AvatarView>} control={<ListItem.IconButton partiallyInteractive aria-label="Info" onClick={()=>setOpen(!open)}><QuestionMarkCircle /><Modal open={open} title="Help" body="Text" onClose={()=>setOpen(false)} /></ListItem.IconButton>} />
|
|
167
|
-
|
|
168
|
-
// Popover
|
|
169
|
-
<Summary title="T" description="D" icon={<Icon />} info={{title:'Help', content:'Text', presentation:'POPOVER', 'aria-label':'Info'}} />
|
|
170
|
-
→
|
|
171
|
-
<ListItem title="T" subtitle="D" media={<ListItem.AvatarView size={32}><Icon /></ListItem.AvatarView>} control={<Popover title="Help" content="Text" onClose={()=>setOpen(false)}><ListItem.IconButton partiallyInteractive aria-label="Info"><QuestionMarkCircle /></ListItem.IconButton></Popover>} />
|
|
172
|
-
\`\`\`
|
|
173
|
-
|
|
174
|
-
---
|
|
175
|
-
|
|
176
|
-
## DefinitionList → Multiple ListItem
|
|
177
|
-
|
|
178
|
-
- Array → individual \`ListItem\`s
|
|
179
|
-
- \`value\` → \`subtitle\`
|
|
180
|
-
- \`key\` → React \`key\` prop
|
|
181
|
-
- Action type: "Edit"/"Update"/"View" → \`ListItem.Button priority="secondary-neutral"\`, "Change"/"Password" → \`ListItem.Navigation\`, "Copy" → \`ListItem.IconButton\`
|
|
182
|
-
|
|
183
|
-
\`\`\`tsx
|
|
184
|
-
<DefinitionList definitions={[
|
|
185
|
-
{title:'T1', value:'V1', key:'k1'},
|
|
186
|
-
{title:'T2', value:'V2', key:'k2', action:{label:'Edit', onClick:fn}}
|
|
187
|
-
]} />
|
|
188
|
-
→
|
|
189
|
-
|
|
190
|
-
<ListItem key="k1" title="T1" subtitle="V1" />
|
|
191
|
-
<ListItem key="k2" title="T2" subtitle="V2" control={<ListItem.Button priority="secondary-neutral" onClick={fn}>Edit</ListItem.Button>} />
|
|
192
|
-
|
|
193
|
-
\`\`\`
|
|
194
|
-
`;
|
|
195
|
-
const SYSTEM_PROMPT = `You are a code migration assistant that helps migrate TypeScript/JSX code from deprecated Wise Design System (WDS) components to the new ListItem component and ListItem subcomponents from '@transferwise/components'.
|
|
196
|
-
|
|
197
|
-
Process each file individually, before reading the next file, making a single comprehensive edit per file to replace all necessary code according to the migration context and rules provided.
|
|
198
|
-
|
|
199
|
-
Rules:
|
|
200
|
-
1. Ignore any files that do not contain deprecated WDS components and are not .tsx files, unless they are necessary for context.
|
|
201
|
-
2. Do not migrate files matching the provided patterns in the ignore list.
|
|
202
|
-
3. Migrate components per provided migration rules
|
|
203
|
-
4. Maintain TypeScript type safety and update types to match new API
|
|
204
|
-
5. Map props: handle renamed, deprecated, new required, and changed types
|
|
205
|
-
6. Update imports to new WDS components and types
|
|
206
|
-
7. Preserve code style, formatting, and calculated logic
|
|
207
|
-
8. Handle conditional rendering, spread props, and complex expressions
|
|
208
|
-
9. Note: New components may lack feature parity with legacy versions
|
|
209
|
-
10. Only modify code requiring changes per migration rules, and any impacted surrounding code for context.
|
|
210
|
-
11. Do not summarise the initial user request in a response.
|
|
211
|
-
12. Use glob to find files in the directory and then grep to identify files with deprecated imports.
|
|
212
|
-
13. Final result response should just be whether the migration was successful overall, or if any errors were encountered
|
|
213
|
-
14. Explain your reasoning and justification before making changes, as you edit each file. Keep it concise and succinct as only bullet points
|
|
214
|
-
15. Do not summarise the changes made after modifying a file.
|
|
215
|
-
16. If you do not have permission to modify a file, still attempt to edit it and then move onto the next file.
|
|
216
|
-
|
|
217
|
-
Make the necessary updates to the files.
|
|
218
|
-
|
|
219
|
-
You'll receive:
|
|
220
|
-
- File paths/directories to search in individual queries
|
|
221
|
-
- Deprecated component names at the end of this prompt
|
|
222
|
-
- Migration context and rules for each deprecated component
|
|
223
|
-
|
|
224
|
-
Deprecated components: ${DEPRECATED_COMPONENT_NAMES.join(", ")}.
|
|
225
|
-
|
|
226
|
-
${MIGRATION_RULES}`;
|
|
227
|
-
|
|
228
|
-
//#endregion
|
|
229
|
-
//#region src/transforms/list-item/helpers.ts
|
|
230
|
-
/** Split the path to get the relative path after the directory, and wrap with ANSI color codes */
|
|
231
|
-
function formatPathOutput(directory, path) {
|
|
232
|
-
return `\x1b[32m${path ? path.split(directory)[1] ?? path : directory}\x1b[0m`;
|
|
233
|
-
}
|
|
234
|
-
/** Generates a formatted string representing the total elapsed time since the given start time */
|
|
235
|
-
function generateElapsedTime(startTime) {
|
|
236
|
-
const endTime = Date.now();
|
|
237
|
-
const elapsedTime = Math.floor((endTime - startTime) / 1e3);
|
|
238
|
-
const hours = Math.floor(elapsedTime / 3600);
|
|
239
|
-
const minutes = Math.floor(elapsedTime % 3600 / 60);
|
|
240
|
-
const seconds = elapsedTime % 60;
|
|
241
|
-
return `${hours ? `${hours}h ` : ""}${minutes ? `${minutes}m ` : ""}${seconds ? `${seconds}s` : ""}`;
|
|
242
|
-
}
|
|
243
|
-
function formatClaudeResponseContent(content) {
|
|
244
|
-
return `\x1b[2m${content.replace(/\*\*(.+?)\*\*/gu, "\x1B[1m$1\x1B[0m\x1B[2m").replace(/`(.+?)`/gu, "\x1B[32m$1\x1B[0m\x1B[2m").split("\n").map((line, index) => index === 0 ? line : ` ${line}`).join("\n")}\x1b[0m`;
|
|
245
|
-
}
|
|
246
|
-
function generateDiff(original, modified) {
|
|
247
|
-
const lines = (0, diff.createPatch)("", original, modified, "", "").trim().split("\n").slice(4).filter((line) => !line.startsWith("\"));
|
|
248
|
-
let oldLineNumber = 0;
|
|
249
|
-
let newLineNumber = 0;
|
|
250
|
-
return lines.map((line) => {
|
|
251
|
-
const trimmedLine = line.trimEnd();
|
|
252
|
-
if (trimmedLine.startsWith("@@")) {
|
|
253
|
-
const match = /@@ -(\d+)(?:,\d+)? \+(\d+)(?:,\d+)? @@/u.exec(trimmedLine);
|
|
254
|
-
if (match) {
|
|
255
|
-
oldLineNumber = Number.parseInt(match[1], 10);
|
|
256
|
-
newLineNumber = Number.parseInt(match[2], 10);
|
|
257
|
-
}
|
|
258
|
-
return `\x1b[36m${trimmedLine}\x1b[0m`;
|
|
259
|
-
}
|
|
260
|
-
let linePrefix = "";
|
|
261
|
-
if (trimmedLine.startsWith("+")) {
|
|
262
|
-
linePrefix = `${newLineNumber.toString().padStart(4, " ")} `;
|
|
263
|
-
newLineNumber += 1;
|
|
264
|
-
return `\x1b[32m${linePrefix}${trimmedLine}\x1b[0m`;
|
|
265
|
-
}
|
|
266
|
-
if (trimmedLine.startsWith("-")) {
|
|
267
|
-
linePrefix = `${oldLineNumber.toString().padStart(4, " ")} `;
|
|
268
|
-
oldLineNumber += 1;
|
|
269
|
-
return `\x1b[31m${linePrefix}${trimmedLine}\x1b[0m`;
|
|
270
|
-
}
|
|
271
|
-
linePrefix = `${oldLineNumber.toString().padStart(4, " ")} `;
|
|
272
|
-
oldLineNumber += 1;
|
|
273
|
-
newLineNumber += 1;
|
|
274
|
-
return `${linePrefix}${trimmedLine}`;
|
|
275
|
-
}).join("\n");
|
|
276
|
-
}
|
|
277
|
-
|
|
278
|
-
//#endregion
|
|
279
|
-
//#region src/transforms/list-item/claude.ts
|
|
280
|
-
const CLAUDE_SETTINGS_FILE = ".claude/settings.json";
|
|
281
|
-
async function checkVPN(baseUrl) {
|
|
282
|
-
if (baseUrl) {
|
|
283
|
-
const vpnSpinner = (0, ora.default)("Checking VPN connection...").start();
|
|
284
|
-
const checkOnce = async () => new Promise((resolveCheck) => {
|
|
285
|
-
const url = new URL("/health", baseUrl);
|
|
286
|
-
const req = node_https.default.get(url, {
|
|
287
|
-
timeout: 2e3,
|
|
288
|
-
rejectUnauthorized: false
|
|
289
|
-
}, (res) => {
|
|
290
|
-
const ok = !!(res.statusCode && res.statusCode >= 200 && res.statusCode < 400);
|
|
291
|
-
res.resume();
|
|
292
|
-
resolveCheck(ok);
|
|
293
|
-
});
|
|
294
|
-
req.on("timeout", () => {
|
|
295
|
-
req.destroy(/* @__PURE__ */ new Error("timeout"));
|
|
296
|
-
});
|
|
297
|
-
req.on("error", () => resolveCheck(false));
|
|
298
|
-
});
|
|
299
|
-
while (true) {
|
|
300
|
-
if (await checkOnce()) {
|
|
301
|
-
vpnSpinner.succeed("Connected to VPN");
|
|
302
|
-
break;
|
|
303
|
-
}
|
|
304
|
-
vpnSpinner.text = "Please connect to VPN... retrying in 3s";
|
|
305
|
-
await new Promise((response) => {
|
|
306
|
-
setTimeout(response, 3e3);
|
|
307
|
-
});
|
|
308
|
-
}
|
|
309
|
-
}
|
|
310
|
-
return true;
|
|
311
|
-
}
|
|
312
|
-
function getQueryOptions(sessionId, codemodOptions, isDebug) {
|
|
313
|
-
const claudeSettingsPath = (0, node_path.resolve)(process.env.HOME || "", CLAUDE_SETTINGS_FILE);
|
|
314
|
-
const settings = JSON.parse((0, node_fs.readFileSync)(claudeSettingsPath, "utf-8"));
|
|
315
|
-
let apiKey;
|
|
316
|
-
try {
|
|
317
|
-
apiKey = (0, node_child_process.execSync)(`bash ${settings.apiKeyHelper}`, { encoding: "utf-8" }).trim();
|
|
318
|
-
} catch {}
|
|
319
|
-
if (!apiKey) throw new Error("Failed to retrieve Anthropic API key. Please check your Claude Code x LLM Gateway configuration - https://transferwise.atlassian.net/wiki/x/_YUe3Q");
|
|
320
|
-
const { ANTHROPIC_CUSTOM_HEADERS, ...restEnvVars } = settings?.env || {};
|
|
321
|
-
const envVars = {
|
|
322
|
-
ANTHROPIC_AUTH_TOKEN: apiKey,
|
|
323
|
-
ANTHROPIC_CUSTOM_HEADERS,
|
|
324
|
-
...restEnvVars,
|
|
325
|
-
PATH: process.env.PATH
|
|
326
|
-
};
|
|
327
|
-
if (isDebug) {
|
|
328
|
-
const { ANTHROPIC_AUTH_TOKEN, ...restVars } = envVars;
|
|
329
|
-
console.log(`${CONSOLE_ICONS.info} Claude configuration environment variables, excluding ANTHROPIC_AUTH_TOKEN:`);
|
|
330
|
-
console.log(restVars);
|
|
331
|
-
}
|
|
332
|
-
const promptPrefix = !codemodOptions?.useGitIgnore ? "Do not use .gitignore to exclude files from the migration. Ensure all relevant files are included." : "Respect .gitignore when determining which files to include in the migration.";
|
|
333
|
-
return {
|
|
334
|
-
resume: sessionId,
|
|
335
|
-
env: envVars,
|
|
336
|
-
permissionMode: codemodOptions?.isDry ? void 0 : "acceptEdits",
|
|
337
|
-
systemPrompt: {
|
|
338
|
-
type: "preset",
|
|
339
|
-
preset: "claude_code",
|
|
340
|
-
append: `${promptPrefix}\n${SYSTEM_PROMPT}`
|
|
341
|
-
},
|
|
342
|
-
allowedTools: [
|
|
343
|
-
"Glob",
|
|
344
|
-
"Grep",
|
|
345
|
-
"Read",
|
|
346
|
-
...!codemodOptions?.isDry ? ["Write", "Edit"] : []
|
|
347
|
-
],
|
|
348
|
-
settingSources: [
|
|
349
|
-
"local",
|
|
350
|
-
"project",
|
|
351
|
-
"user"
|
|
352
|
-
]
|
|
353
|
-
};
|
|
354
|
-
}
|
|
355
|
-
/** Initiate a new Claude session/conversation and return reusable options */
|
|
356
|
-
async function initiateClaudeSessionOptions(codemodOptions, isDebug = false) {
|
|
357
|
-
const options = getQueryOptions(void 0, codemodOptions, isDebug);
|
|
358
|
-
await checkVPN(options.env?.ANTHROPIC_BASE_URL);
|
|
359
|
-
const claudeSessionSpinner = (0, ora.default)("Starting Claude instance - your browser may open for Okta authentication if required.").start();
|
|
360
|
-
const result = (0, __anthropic_ai_claude_agent_sdk.query)({
|
|
361
|
-
options,
|
|
362
|
-
prompt: `You'll be given file paths in additional individual queries to search in for files using deprecated Wise Design System (WDS) components. Migrate the code per the provided migration rules.`
|
|
363
|
-
});
|
|
364
|
-
for await (const message of result) switch (message.type) {
|
|
365
|
-
case "system":
|
|
366
|
-
if (message.subtype === "init" && !options.resume) {
|
|
367
|
-
claudeSessionSpinner.succeed("Successfully initialised Claude instance");
|
|
368
|
-
options.resume = message.session_id;
|
|
369
|
-
}
|
|
370
|
-
break;
|
|
371
|
-
default: if (message.type === "result" && message.subtype !== "success") claudeSessionSpinner.fail(`Claude encountered an error: ${message.errors.join("\n")}`);
|
|
372
|
-
}
|
|
373
|
-
return options;
|
|
374
|
-
}
|
|
375
|
-
async function queryClaude(path, options, codemodOptions, isDebug = false) {
|
|
376
|
-
const result = (0, __anthropic_ai_claude_agent_sdk.query)({
|
|
377
|
-
options,
|
|
378
|
-
prompt: path
|
|
379
|
-
});
|
|
380
|
-
const modifiedFiles = [];
|
|
381
|
-
for await (const message of result) switch (message.type) {
|
|
382
|
-
case "assistant":
|
|
383
|
-
for (const msg of message.message.content) switch (msg.type) {
|
|
384
|
-
case "tool_use":
|
|
385
|
-
if (msg.name === "Glob") console.log(`${CONSOLE_ICONS.info} Finding all files within: ${formatPathOutput(path)}...`);
|
|
386
|
-
else if (msg.name === "Grep") console.log(`${CONSOLE_ICONS.info} Identifying files with deprecated imports: ${formatPathOutput(path)}...`);
|
|
387
|
-
else if (msg.name === "Read") console.log(`${CONSOLE_ICONS.info} Reading ${formatPathOutput(path, msg.input.file_path)}`);
|
|
388
|
-
else if ((msg.name === "Write" || msg.name === "Edit") && !modifiedFiles.includes(msg.input.file_path)) {
|
|
389
|
-
modifiedFiles.push(msg.input.file_path);
|
|
390
|
-
if (codemodOptions.isPrint || codemodOptions.isDry) {
|
|
391
|
-
console.log(`${CONSOLE_ICONS.info} ${codemodOptions.isDry ? "Proposed changes" : "Changes"} for ${formatPathOutput(path, msg.input.file_path)}:`);
|
|
392
|
-
console.log(generateDiff(msg.input.old_string, msg.input.new_string));
|
|
393
|
-
} else console.log(`${CONSOLE_ICONS.info} Migrated ${formatPathOutput(path, msg.input.file_path)}`);
|
|
394
|
-
}
|
|
395
|
-
break;
|
|
396
|
-
case "text":
|
|
397
|
-
if (isDebug) console.log(`${CONSOLE_ICONS.claude} ${formatClaudeResponseContent(msg.text)}`);
|
|
398
|
-
break;
|
|
399
|
-
default: if (isDebug) console.log(msg);
|
|
400
|
-
}
|
|
401
|
-
break;
|
|
402
|
-
case "result":
|
|
403
|
-
if (message.subtype === "success") console.log(`${CONSOLE_ICONS.success} Migrated all applicable files in ${formatPathOutput(path)}`);
|
|
404
|
-
else console.log(`${CONSOLE_ICONS.error} Claude encountered an error: ${message.errors.join("\n").trim()}`);
|
|
405
|
-
break;
|
|
406
|
-
default:
|
|
407
|
-
}
|
|
408
|
-
}
|
|
409
|
-
|
|
410
|
-
//#endregion
|
|
411
|
-
//#region src/transforms/list-item/transformer.ts
|
|
412
|
-
const transformer = async (targetPaths, codemodOptions, isDebug = false) => {
|
|
413
|
-
const startTime = Date.now();
|
|
414
|
-
const queryOptions = await initiateClaudeSessionOptions(codemodOptions, isDebug);
|
|
415
|
-
console.log(`${CONSOLE_ICONS.info} Analysing targetted paths - this may take a while...`);
|
|
416
|
-
for (const directory of targetPaths) await queryClaude(directory, queryOptions, codemodOptions, isDebug);
|
|
417
|
-
console.log(`${CONSOLE_ICONS.success} Finished migrating - elapsed time: \x1b[1m${generateElapsedTime(startTime)}\x1b[0m`);
|
|
418
|
-
};
|
|
419
|
-
var transformer_default = transformer;
|
|
420
|
-
|
|
421
|
-
//#endregion
|
|
422
|
-
Object.defineProperty(exports, 'CONSOLE_ICONS', {
|
|
423
|
-
enumerable: true,
|
|
424
|
-
get: function () {
|
|
425
|
-
return CONSOLE_ICONS;
|
|
426
|
-
}
|
|
427
|
-
});
|
|
428
|
-
Object.defineProperty(exports, 'transformer_default', {
|
|
429
|
-
enumerable: true,
|
|
430
|
-
get: function () {
|
|
431
|
-
return transformer_default;
|
|
432
|
-
}
|
|
433
|
-
});
|
|
434
|
-
//# sourceMappingURL=transformer-CFJ7Jq1h.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"transformer-CFJ7Jq1h.js","names":["https","modifiedFiles: string[]"],"sources":["../src/constants.ts","../src/transforms/list-item/constants.ts","../src/transforms/list-item/helpers.ts","../src/transforms/list-item/claude.ts","../src/transforms/list-item/transformer.ts"],"sourcesContent":["export const CONSOLE_ICONS = {\n info: '\\x1b[34mℹ\\x1b[0m', // Blue info icon\n focus: '\\x1b[34m➙\\x1b[0m', // Blue arrow icon\n success: '\\x1b[32m✔\\x1b[0m', // Green checkmark\n warning: '\\x1b[33m⚠\\x1b[0m', // Yellow warning icon\n error: '\\x1b[31m✖\\x1b[0m', // Red cross icon\n claude: '\\x1b[35m💬\\x1b[0m', // Magenta speech bubble\n};\n","const DEPRECATED_COMPONENT_NAMES = [\n 'ActionOption',\n 'NavigationOption',\n 'NavigationOptionsList',\n 'Summary',\n 'SwitchOption',\n 'CheckboxOption',\n 'RadioOption',\n];\n\nconst MIGRATION_RULES = `Migration rules:\n# Legacy Component → ListItem Migration Guide\n\n## Universal Rules\n\n1. \\`title\\` → \\`title\\` (direct)\n2. \\`content\\` or \\`description\\` → \\`subtitle\\`\n3. \\`disabled\\` stays on \\`ListItem\\` (not controls)\n4. Keep HTML attributes (\\`id\\`, \\`name\\`, \\`aria-label\\`), remove: \\`as\\`, \\`complex\\`, \\`showMediaAtAllSizes\\`, \\`showMediaCircle\\`, \\`isContainerAligned\\`\n5. In strings, don't convert \\`\\`to\\`'\\`or\\`\"\\`. Preserve what is there.\n\n---\n\n## ActionOption → ListItem.Button\n\n- \\`action\\` → Button children\n- \\`onClick\\` → Button \\`onClick\\`\n- Priority: default/\\`\"primary\"\\` → \\`\"primary\"\\`, \\`\"secondary\"\\` → \\`\"secondary-neutral\"\\`, \\`\"secondary-send\"\\` → \\`\"secondary\"\\`, \\`\"tertiary\"\\` → \\`\"tertiary\"\\`\n\n\\`\\`\\`tsx\n<ActionOption title=\"Title\" content=\"Text\" action=\"Click\" priority=\"secondary\" onClick={fn} />\n→\n<ListItem title=\"Title\" subtitle=\"Text\" control={<ListItem.Button priority=\"secondary-neutral\" onClick={fn}>Click</ListItem.Button>} />\n\\`\\`\\`\n\n---\n\n## CheckboxOption → ListItem.Checkbox\n\n- \\`onChange\\`: \\`(checked: boolean)\\` → \\`(event: ChangeEvent)\\` use \\`event.target.checked\\`\n- \\`name\\` move to Checkbox\n- Don't move \\`id\\` to Checkbox\n\n\\`\\`\\`tsx\n<CheckboxOption id=\"x\" name=\"y\" title=\"Title\" content=\"Text\" checked={v} onChange={(c) => set(c)} />\n→\n<ListItem title=\"Title\" subtitle=\"Text\" control={<ListItem.Checkbox name=\"y\" checked={v} onChange={(e) => set(e.target.checked)} />} />\n\\`\\`\\`\n\n---\n\n## RadioOption → ListItem.Radio\n\n- \\`name\\`, \\`value\\`, \\`checked\\`, \\`onChange\\` move to Radio\n- Don't move \\`id\\` to Radio\n\n\\`\\`\\`tsx\n<RadioOption id=\"x\" name=\"y\" value=\"v\" title=\"Title\" content=\"Text\" checked={v==='v'} onChange={set} />\n→\n<ListItem title=\"Title\" subtitle=\"Text\" control={<ListItem.Radio name=\"y\" value=\"v\" checked={v==='v'} onChange={set} />} />\n\\`\\`\\`\n\n---\n\n## SwitchOption → ListItem.Switch\n\n- \\`onChange\\` → \\`onClick\\`, toggle manually\n- \\`aria-label\\` moves to Switch\n\n\\`\\`\\`tsx\n<SwitchOption title=\"Title\" content=\"Text\" checked={v} aria-label=\"Toggle\" onChange={set} />\n→\n<ListItem title=\"Title\" subtitle=\"Text\" control={<ListItem.Switch checked={v} aria-label=\"Toggle\" onClick={() => set(!v)} />} />\n\\`\\`\\`\n\n---\n\n## NavigationOption → ListItem.Navigation\n\n- \\`onClick\\` or \\`href\\` move to Navigation\n\n\\`\\`\\`tsx\n<NavigationOption title=\"Title\" content=\"Text\" onClick={fn} />\n→\n<ListItem title=\"Title\" subtitle=\"Text\" control={<ListItem.Navigation onClick={fn} />} />\n\\`\\`\\`\n\n---\n\n## Option → ListItem\n\n- Wrap \\`media\\` in \\`ListItem.AvatarView\\`\n\n\\`\\`\\`tsx\n<Option media={<Icon />} title=\"Title\" />\n→\n<ListItem title=\"Title\" media={<ListItem.AvatarView><Icon /></ListItem.AvatarView>} />\n\\`\\`\\`\n\n---\n\n## Summary → ListItem\n\n**Basic:**\n\n- \\`icon\\` → wrap in \\`ListItem.AvatarView\\` with \\`size={32}\\` as \\`media\\`\n- Remove \\`size\\` from child \\`<Icon />\\`\n\n**Status:**\n\n- \\`Status.DONE\\` → \\`badge={{ status: 'positive' }}\\`\n- \\`Status.PENDING\\` → \\`badge={{ status: 'pending' }}\\`\n- \\`Status.NOT_DONE\\` → no badge\n\n**Action:**\n\n- \\`action.text\\` → \\`action.label\\` in \\`ListItem.AdditionalInfo\\` as \\`additionalInfo\\`\n\n**Info (requires state):**\n\n- \\`MODAL\\` → \\`ListItem.IconButton partiallyInteractive\\` + \\`<Modal>\\` in \\`control\\`\n- \\`POPOVER\\` → \\`<Popover>\\` wrapping \\`ListItem.IconButton partiallyInteractive\\` in \\`control\\`\n- Use \\`QuestionMarkCircle\\` icon (import from \\`@transferwise/icons\\`)\n\n\\`\\`\\`tsx\n// Basic\n<Summary title=\"T\" description=\"D\" icon={<Icon />} />\n→\n<ListItem title=\"T\" subtitle=\"D\" media={<ListItem.AvatarView size={32}><Icon /></ListItem.AvatarView>} />\n\n// Status\n<Summary title=\"T\" description=\"D\" icon={<Icon />} status={Status.DONE} />\n→\n<ListItem title=\"T\" subtitle=\"D\" media={<ListItem.AvatarView size={32} badge={{status:'positive'}}><Icon /></ListItem.AvatarView>} />\n\n// Action\n<Summary title=\"T\" description=\"D\" icon={<Icon />} action={{text:'Go', href:'/go'}} />\n→\n<ListItem title=\"T\" subtitle=\"D\" media={<ListItem.AvatarView size={32}><Icon /></ListItem.AvatarView>} additionalInfo={<ListItem.AdditionalInfo action={{label:'Go', href:'/go'}} />} />\n\n// Modal (add: const [open, setOpen] = useState(false))\n<Summary title=\"T\" description=\"D\" icon={<Icon />} info={{title:'Help', content:'Text', presentation:'MODAL', 'aria-label':'Info'}} />\n→\n<ListItem title=\"T\" subtitle=\"D\" media={<ListItem.AvatarView size={32}><Icon /></ListItem.AvatarView>} control={<ListItem.IconButton partiallyInteractive aria-label=\"Info\" onClick={()=>setOpen(!open)}><QuestionMarkCircle /><Modal open={open} title=\"Help\" body=\"Text\" onClose={()=>setOpen(false)} /></ListItem.IconButton>} />\n\n// Popover\n<Summary title=\"T\" description=\"D\" icon={<Icon />} info={{title:'Help', content:'Text', presentation:'POPOVER', 'aria-label':'Info'}} />\n→\n<ListItem title=\"T\" subtitle=\"D\" media={<ListItem.AvatarView size={32}><Icon /></ListItem.AvatarView>} control={<Popover title=\"Help\" content=\"Text\" onClose={()=>setOpen(false)}><ListItem.IconButton partiallyInteractive aria-label=\"Info\"><QuestionMarkCircle /></ListItem.IconButton></Popover>} />\n\\`\\`\\`\n\n---\n\n## DefinitionList → Multiple ListItem\n\n- Array → individual \\`ListItem\\`s\n- \\`value\\` → \\`subtitle\\`\n- \\`key\\` → React \\`key\\` prop\n- Action type: \"Edit\"/\"Update\"/\"View\" → \\`ListItem.Button priority=\"secondary-neutral\"\\`, \"Change\"/\"Password\" → \\`ListItem.Navigation\\`, \"Copy\" → \\`ListItem.IconButton\\`\n\n\\`\\`\\`tsx\n<DefinitionList definitions={[\n {title:'T1', value:'V1', key:'k1'},\n {title:'T2', value:'V2', key:'k2', action:{label:'Edit', onClick:fn}}\n]} />\n→\n\n <ListItem key=\"k1\" title=\"T1\" subtitle=\"V1\" />\n <ListItem key=\"k2\" title=\"T2\" subtitle=\"V2\" control={<ListItem.Button priority=\"secondary-neutral\" onClick={fn}>Edit</ListItem.Button>} />\n\n\\`\\`\\`\n`;\n\nexport const SYSTEM_PROMPT = `You are a code migration assistant that helps migrate TypeScript/JSX code from deprecated Wise Design System (WDS) components to the new ListItem component and ListItem subcomponents from '@transferwise/components'.\n\nProcess each file individually, before reading the next file, making a single comprehensive edit per file to replace all necessary code according to the migration context and rules provided.\n\nRules:\n1. Ignore any files that do not contain deprecated WDS components and are not .tsx files, unless they are necessary for context.\n2. Do not migrate files matching the provided patterns in the ignore list.\n3. Migrate components per provided migration rules\n4. Maintain TypeScript type safety and update types to match new API\n5. Map props: handle renamed, deprecated, new required, and changed types\n6. Update imports to new WDS components and types\n7. Preserve code style, formatting, and calculated logic\n8. Handle conditional rendering, spread props, and complex expressions\n9. Note: New components may lack feature parity with legacy versions\n10. Only modify code requiring changes per migration rules, and any impacted surrounding code for context.\n11. Do not summarise the initial user request in a response.\n12. Use glob to find files in the directory and then grep to identify files with deprecated imports.\n13. Final result response should just be whether the migration was successful overall, or if any errors were encountered\n14. Explain your reasoning and justification before making changes, as you edit each file. Keep it concise and succinct as only bullet points\n15. Do not summarise the changes made after modifying a file.\n16. If you do not have permission to modify a file, still attempt to edit it and then move onto the next file.\n\nMake the necessary updates to the files. \n\nYou'll receive:\n- File paths/directories to search in individual queries\n- Deprecated component names at the end of this prompt\n- Migration context and rules for each deprecated component\n\nDeprecated components: ${DEPRECATED_COMPONENT_NAMES.join(', ')}.\n\n${MIGRATION_RULES}`;\n","import { createPatch } from 'diff';\n\n/** Split the path to get the relative path after the directory, and wrap with ANSI color codes */\nexport function formatPathOutput(directory: string, path?: string): string {\n return `\\x1b[32m${path ? (path.split(directory)[1] ?? path) : directory}\\x1b[0m`;\n}\n\n/** Generates a formatted string representing the total elapsed time since the given start time */\nexport function generateElapsedTime(startTime: number): string {\n const endTime = Date.now();\n const elapsedTime = Math.floor((endTime - startTime) / 1000);\n const hours = Math.floor(elapsedTime / 3600);\n const minutes = Math.floor((elapsedTime % 3600) / 60);\n const seconds = elapsedTime % 60;\n\n return `${hours ? `${hours}h ` : ''}${minutes ? `${minutes}m ` : ''}${seconds ? `${seconds}s` : ''}`;\n}\n\n// Formats Claude response with ANSI codes (bold for **, green for `), indenting all lines except the first. Also wraps entire content in dim color\nexport function formatClaudeResponseContent(content: string): string {\n const formatted = content\n .replace(/\\*\\*(.+?)\\*\\*/gu, '\\x1b[1m$1\\x1b[0m\\x1b[2m')\n .replace(/`(.+?)`/gu, '\\x1b[32m$1\\x1b[0m\\x1b[2m')\n .split('\\n')\n .map((line, index) => (index === 0 ? line : ` ${line}`))\n .join('\\n');\n\n return `\\x1b[2m${formatted}\\x1b[0m`;\n}\n\n// Generates a unified diff between the original and modified strings, with ANSI color codes for additions and deletions and line numbers\nexport function generateDiff(original: string, modified: string): string {\n const diffResult = createPatch('', original, modified, '', '').trim();\n\n // Parse and colorize the diff output\n const lines = diffResult\n .split('\\n')\n .slice(4) // Skip the header lines\n .filter((line) => !line.startsWith('\\\')); // Remove \"No newline\" messages\n\n // Track current line numbers from hunk headers\n let oldLineNumber = 0;\n let newLineNumber = 0;\n\n const colouredDiff = lines\n .map((line: string) => {\n const trimmedLine = line.trimEnd();\n\n // Parse hunk header to get starting line numbers - format: @@ -oldStart,oldCount +newStart,newCount @@\n if (trimmedLine.startsWith('@@')) {\n const match = /@@ -(\\d+)(?:,\\d+)? \\+(\\d+)(?:,\\d+)? @@/u.exec(trimmedLine);\n if (match) {\n oldLineNumber = Number.parseInt(match[1], 10);\n newLineNumber = Number.parseInt(match[2], 10);\n }\n return `\\x1b[36m${trimmedLine}\\x1b[0m`; // Cyan for hunk headers\n }\n\n let linePrefix = '';\n // Green styling for additions\n if (trimmedLine.startsWith('+')) {\n linePrefix = `${newLineNumber.toString().padStart(4, ' ')} `;\n newLineNumber += 1;\n return `\\x1b[32m${linePrefix}${trimmedLine}\\x1b[0m`;\n }\n\n // Red styling for deletions\n if (trimmedLine.startsWith('-')) {\n linePrefix = `${oldLineNumber.toString().padStart(4, ' ')} `;\n oldLineNumber += 1;\n return `\\x1b[31m${linePrefix}${trimmedLine}\\x1b[0m`;\n }\n\n // Handle unchanged lines\n linePrefix = `${oldLineNumber.toString().padStart(4, ' ')} `;\n oldLineNumber += 1;\n newLineNumber += 1;\n return `${linePrefix}${trimmedLine}`;\n })\n .join('\\n');\n\n return colouredDiff;\n}\n","import https from 'node:https';\n\nimport { type Options, query } from '@anthropic-ai/claude-agent-sdk';\nimport { execSync } from 'child_process';\nimport { readFileSync } from 'fs';\nimport ora from 'ora';\nimport { resolve } from 'path';\n\nimport { CONSOLE_ICONS } from '../../constants';\nimport type { CodemodOptions } from '../../controller/types';\nimport { SYSTEM_PROMPT } from './constants';\nimport { formatClaudeResponseContent, formatPathOutput, generateDiff } from './helpers';\nimport type { ClaudeResponseToolUse, ClaudeSettings } from './types';\n\nconst CLAUDE_SETTINGS_FILE = '.claude/settings.json';\n\nasync function checkVPN(baseUrl?: string): Promise<boolean> {\n if (baseUrl) {\n const vpnSpinner = ora('Checking VPN connection...').start();\n const checkOnce = async (): Promise<boolean> =>\n new Promise<boolean>((resolveCheck) => {\n const url = new URL('/health', baseUrl);\n const req = https.get(url, { timeout: 2000, rejectUnauthorized: false }, (res) => {\n const ok = !!(res.statusCode && res.statusCode >= 200 && res.statusCode < 400);\n res.resume();\n resolveCheck(ok);\n });\n req.on('timeout', () => {\n req.destroy(new Error('timeout'));\n });\n req.on('error', () => resolveCheck(false));\n });\n\n while (true) {\n const ok = await checkOnce();\n if (ok) {\n vpnSpinner.succeed('Connected to VPN');\n break;\n }\n vpnSpinner.text = 'Please connect to VPN... retrying in 3s';\n await new Promise<void>((response) => {\n setTimeout(response, 3000);\n });\n }\n }\n return true;\n}\n\nexport function getQueryOptions(\n sessionId?: string,\n codemodOptions?: CodemodOptions,\n isDebug?: boolean,\n): Options {\n // Read settings from ~/.claude/settings.json to get headers and apiKeyHelper\n const claudeSettingsPath = resolve(process.env.HOME || '', CLAUDE_SETTINGS_FILE);\n const settings = JSON.parse(readFileSync(claudeSettingsPath, 'utf-8')) as ClaudeSettings;\n\n // Get API key by executing the apiKeyHelper script, for authenticating with Okta via LLM Gateway\n let apiKey;\n try {\n apiKey = execSync(`bash ${settings.apiKeyHelper}`, {\n encoding: 'utf-8',\n }).trim();\n } catch {}\n\n if (!apiKey) {\n throw new Error(\n 'Failed to retrieve Anthropic API key. Please check your Claude Code x LLM Gateway configuration - https://transferwise.atlassian.net/wiki/x/_YUe3Q',\n );\n }\n\n const { ANTHROPIC_CUSTOM_HEADERS, ...restEnvVars } = settings?.env || {};\n\n const envVars = {\n ANTHROPIC_AUTH_TOKEN: apiKey,\n ANTHROPIC_CUSTOM_HEADERS,\n ...restEnvVars,\n PATH: process.env.PATH, // Specifying PATH, as Claude Agent SDK seems to struggle consuming the actual environment PATH\n };\n\n if (isDebug) {\n // Not logging the auth token and path\n const { ANTHROPIC_AUTH_TOKEN, ...restVars } = envVars;\n console.log(\n `${CONSOLE_ICONS.info} Claude configuration environment variables, excluding ANTHROPIC_AUTH_TOKEN:`,\n );\n console.log(restVars);\n }\n\n const promptPrefix = !codemodOptions?.useGitIgnore\n ? 'Do not use .gitignore to exclude files from the migration. Ensure all relevant files are included.'\n : 'Respect .gitignore when determining which files to include in the migration.';\n\n // NOTE: ignore patterns not working...\n // codemodOptions?.ignorePatterns?.length ? `Ignore any files with names matching the following .gitignore glob patterns, separated by commas and do not migrate them: ${codemodOptions.ignorePatterns.replaceAll(',', ', ')}` : '';\n\n return {\n resume: sessionId,\n env: envVars,\n permissionMode: codemodOptions?.isDry ? undefined : 'acceptEdits',\n systemPrompt: {\n type: 'preset',\n preset: 'claude_code',\n append: `${promptPrefix}\\n${SYSTEM_PROMPT}`,\n },\n allowedTools: ['Glob', 'Grep', 'Read', ...(!codemodOptions?.isDry ? ['Write', 'Edit'] : [])],\n settingSources: ['local', 'project', 'user'],\n };\n}\n\n/** Initiate a new Claude session/conversation and return reusable options */\nexport async function initiateClaudeSessionOptions(\n codemodOptions: CodemodOptions,\n isDebug = false,\n): Promise<Options> {\n const options = getQueryOptions(undefined, codemodOptions, isDebug);\n await checkVPN(options.env?.ANTHROPIC_BASE_URL);\n\n const claudeSessionSpinner = ora(\n 'Starting Claude instance - your browser may open for Okta authentication if required.',\n ).start();\n\n const result = query({\n options,\n prompt: `You'll be given file paths in additional individual queries to search in for files using deprecated Wise Design System (WDS) components. Migrate the code per the provided migration rules.`,\n });\n\n for await (const message of result) {\n switch (message.type) {\n case 'system':\n if (message.subtype === 'init' && !options.resume) {\n claudeSessionSpinner.succeed('Successfully initialised Claude instance');\n\n // Set the session ID to resume the conversation in future queries\n options.resume = message.session_id;\n }\n break;\n default:\n if (message.type === 'result' && message.subtype !== 'success') {\n claudeSessionSpinner.fail(`Claude encountered an error: ${message.errors.join('\\n')}`);\n }\n }\n }\n\n return options;\n}\n\n// Queries Claude with the given path and handles logging of tool uses and results\nexport async function queryClaude(\n path: string,\n options: Options,\n codemodOptions: CodemodOptions,\n isDebug = false,\n) {\n const result = query({\n options,\n prompt: path,\n });\n const modifiedFiles: string[] = [];\n\n for await (const message of result) {\n switch (message.type) {\n case 'assistant':\n for (const msg of message.message.content) {\n switch (msg.type) {\n // Handles logging of tool uses to determine key stages of the migration\n case 'tool_use':\n if (msg.name === 'Glob') {\n console.log(\n `${CONSOLE_ICONS.info} Finding all files within: ${formatPathOutput(path)}...`,\n );\n } else if (msg.name === 'Grep') {\n console.log(\n `${CONSOLE_ICONS.info} Identifying files with deprecated imports: ${formatPathOutput(path)}...`,\n );\n } else if (msg.name === 'Read') {\n console.log(\n `${CONSOLE_ICONS.info} Reading ${formatPathOutput(path, (msg as ClaudeResponseToolUse).input.file_path)}`,\n );\n } else if (\n (msg.name === 'Write' || msg.name === 'Edit') &&\n !modifiedFiles.includes((msg as ClaudeResponseToolUse).input.file_path) // Safeguard against duplicate logs, where Claude may write multiple times to the same file\n ) {\n // TODO: Consider how to handle multiple writes to the same file more gracefully (logged changes won't always match final file content)\n modifiedFiles.push((msg as ClaudeResponseToolUse).input.file_path);\n\n // Generate and print out a pretty diff of changes made by Claude\n if (codemodOptions.isPrint || codemodOptions.isDry) {\n console.log(\n `${CONSOLE_ICONS.info} ${codemodOptions.isDry ? 'Proposed changes' : 'Changes'} for ${formatPathOutput(path, (msg as ClaudeResponseToolUse).input.file_path)}:`,\n );\n console.log(\n generateDiff(\n (msg as ClaudeResponseToolUse).input.old_string as string,\n (msg as ClaudeResponseToolUse).input.new_string as string,\n ),\n );\n } else {\n console.log(\n `${CONSOLE_ICONS.info} Migrated ${formatPathOutput(path, (msg as ClaudeResponseToolUse).input.file_path)}`,\n );\n }\n }\n break;\n case 'text':\n // Logs Claude's textual responses in debug mode, to help with understanding justifications/errors\n if (isDebug) {\n console.log(`${CONSOLE_ICONS.claude} ${formatClaudeResponseContent(msg.text)}`);\n }\n break;\n default:\n if (isDebug) {\n console.log(msg);\n }\n }\n }\n break;\n case 'result':\n if (message.subtype === 'success') {\n // TODO: Handle case where migration failed for some files - maybe due to failed dependency checks?\n console.log(\n `${CONSOLE_ICONS.success} Migrated all applicable files in ${formatPathOutput(path)}`,\n );\n } else {\n console.log(\n `${CONSOLE_ICONS.error} Claude encountered an error: ${message.errors.join('\\n').trim()}`,\n );\n }\n break;\n default:\n }\n }\n}\n","import { CONSOLE_ICONS } from '../../constants';\nimport type { CodemodOptions } from '../../controller/types';\nimport { initiateClaudeSessionOptions, queryClaude } from './claude';\nimport { generateElapsedTime } from './helpers';\n\nconst transformer = async (\n targetPaths: string[],\n codemodOptions: CodemodOptions,\n isDebug = false,\n) => {\n const startTime = Date.now();\n\n // TODO: We need to check whether the user is connected to the VPN first before proceeding\n\n const queryOptions = await initiateClaudeSessionOptions(codemodOptions, isDebug);\n\n console.log(`${CONSOLE_ICONS.info} Analysing targetted paths - this may take a while...`);\n\n for (const directory of targetPaths) {\n await queryClaude(directory, queryOptions, codemodOptions, isDebug);\n }\n\n console.log(\n `${CONSOLE_ICONS.success} Finished migrating - elapsed time: \\x1b[1m${generateElapsedTime(startTime)}\\x1b[0m`,\n );\n};\n\nexport default transformer;\n"],"mappings":"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"}
|