@ethlete/query 6.0.0-next.52 → 6.0.0-next.53

package/generators/migrate-to-query-v3/query-client-migration.js

@@ -1,6 +1,8 @@
 import * as ts from 'typescript';
 import { CLIENT_FEATURE, reportClientErrorPipelineAdded } from '../migrate-query-opt-in-features/migration.js';
-import { capitalizeFirstLetter, createSourceFile, ensureConfigSuffix, ensureImportFromEthleteCore, ensureImportFromQuery, getVariableStatementEnd, } from './shared.js';
+import { createModuleGraph } from './module-graph.js';
+import { isNamePosition, isShadowedInNestedScope, renamedReference } from './rename-symbols.js';
+import { capitalizeFirstLetter, createSourceFile, ensureConfigSuffix, ensureImportFromEthleteCore, ensureImportFromQuery, getVariableStatementEnd, printImportDeclaration, } from './shared.js';
 export const migrateQueryClients = (tree, report, scope) => {
     const queryClientFiles = new Map();
     const variableRenames = new Map();
@@ -14,9 +16,9 @@ export const migrateQueryClients = (tree, report, scope) => {
         }
         const renames = new Map();
         const nextContent = migrateQueryClientToConfig({ content, filePath, renamesOut: renames, report });
-        renames.forEach((newName, oldName) => {
-            variableRenames.set(oldName, newName);
-        });
+        if (renames.size > 0) {
+            variableRenames.set(filePath, { originalContent: content, renames });
+        }
         const configNames = extractClientConfigNames(nextContent);
         if (configNames.length > 0) {
             queryClientFiles.set(filePath, configNames);
@@ -69,10 +71,12 @@ export const generateQueryCreators = (tree, queryClientFiles) => {
         generatedFiles.forEach((filePath) => console.log(`   - ${filePath}`));
     }
 };
-export const updateImportsAcrossWorkspace = (tree, renames, scope) => {
+export const updateImportsAcrossWorkspace = (tree, renames, scope, report) => {
     if (renames.size === 0) {
         return;
     }
+    const originalContents = new Map(Array.from(renames.entries()).map(([filePath, { originalContent }]) => [filePath, originalContent]));
+    const graph = createModuleGraph(withOriginalContents(tree, originalContents));
     scope.visit(tree, (filePath) => {
         if (!filePath.endsWith('.ts')) {
             return;
@@ -81,12 +85,42 @@ export const updateImportsAcrossWorkspace = (tree, renames, scope) => {
         if (!content) {
             return;
         }
-        const nextContent = updateImportsInFile(content, renames);
+        const { content: nextContent, renamedByName } = updateImportsInFile(content, filePath, renames, graph);
+        if (renamedByName.size > 0) {
+            report.addManualReview({
+                title: `Check the client rename in ${filePath}`,
+                summary: `The migration could not resolve ${[...renamedByName].map((specifier) => `\`${specifier}\``).join(', ')} to a file, so it renamed the imported client by its name alone.`,
+                action: 'Confirm the renamed import really is the migrated query client, and revert it if it is not.',
+                locations: [{ filePath }],
+                source: 'query-client-migration',
+                dedupeKey: `client-rename-by-name:${filePath}`,
+            });
+        }
         if (nextContent !== content) {
+            originalContents.set(filePath, content);
             tree.write(filePath, nextContent);
         }
     });
 };
+/**
+ * A view of `tree` that still reads the pre-migration content of `originalContents`, so the module
+ * graph resolves a client import by the name it had when the import was written.
+ */
+const withOriginalContents = (tree, originalContents) => new Proxy(tree, {
+    get: (target, property) => {
+        if (property === 'read') {
+            return (filePath, encoding) => {
+                const original = originalContents.get(filePath);
+                if (original === undefined) {
+                    return encoding ? target.read(filePath, encoding) : target.read(filePath);
+                }
+                return encoding ? original : Buffer.from(original);
+            };
+        }
+        const value = Reflect.get(target, property, target);
+        return typeof value === 'function' ? value.bind(target) : value;
+    },
+});
 const hasQueryClientInstantiation = (content) => {
     const sourceFile = createSourceFile(content);
     let hasQueryClientImport = false;
@@ -202,11 +236,31 @@ const removeQueryClientImport = (content, keepLegacyClient) => {
     });
     const nextImports = new Set(requiredImports);
     existingElements.forEach((element) => nextImports.add(element.getText(sourceFile)));
-    const nextImportStatement = `import { ${Array.from(nextImports).sort().join(', ')} } from '@ethlete/query';`;
+    const nextImportStatement = printImportDeclaration(queryImportNode, sourceFile, Array.from(nextImports).sort());
     return (content.slice(0, queryImportNode.getStart(sourceFile)) +
         nextImportStatement +
         content.slice(queryImportNode.getEnd()));
 };
+const isTopLevelVariableName = (node) => {
+    const declaration = node.parent;
+    return (ts.isVariableDeclaration(declaration) &&
+        declaration.name === node &&
+        ts.isVariableStatement(declaration.parent.parent) &&
+        ts.isSourceFile(declaration.parent.parent.parent));
+};
+const renameInDeclaringFile = (node, nextName) => {
+    const parent = node.parent;
+    if (isTopLevelVariableName(node)) {
+        return nextName;
+    }
+    if (ts.isExportSpecifier(parent) && !parent.parent.parent.moduleSpecifier) {
+        return (parent.propertyName ?? parent.name) === node ? nextName : undefined;
+    }
+    if (isNamePosition(node) || isShadowedInNestedScope(node)) {
+        return undefined;
+    }
+    return renamedReference(node, nextName);
+};
 const renameVariables = (content, renames) => {
     if (renames.size === 0) {
         return content;
@@ -214,44 +268,21 @@ const renameVariables = (content, renames) => {
     const sourceFile = createSourceFile(content);
     const replacements = [];
     const visit = (node) => {
-        if (ts.isVariableDeclaration(node) && ts.isIdentifier(node.name)) {
-            const nextName = renames.get(node.name.text);
-            if (nextName) {
-                replacements.push({
-                    start: node.name.getStart(sourceFile),
-                    end: node.name.getEnd(),
-                    replacement: nextName,
-                });
-            }
-        }
-        else if (ts.isIdentifier(node)) {
-            const nextName = renames.get(node.text);
-            if (nextName) {
-                const parent = node.parent;
-                if (!ts.isPropertyAssignment(parent) || parent.name !== node) {
-                    replacements.push({
-                        start: node.getStart(sourceFile),
-                        end: node.getEnd(),
-                        replacement: nextName,
-                    });
-                }
-            }
+        const nextName = ts.isIdentifier(node) ? renames.get(node.text) : undefined;
+        const replacement = nextName && renameInDeclaringFile(node, nextName);
+        if (replacement) {
+            replacements.push({ start: node.getStart(sourceFile), end: node.getEnd(), replacement });
         }
         ts.forEachChild(node, visit);
     };
     visit(sourceFile);
-    const seen = new Set();
-    const uniqueReplacements = replacements.filter((replacement) => {
-        const key = `${replacement.start}:${replacement.end}`;
-        if (seen.has(key)) {
-            return false;
-        }
-        seen.add(key);
-        return true;
-    });
+    return applyReplacements(content, replacements);
+};
+const applyReplacements = (content, replacements) => {
     let result = content;
-    uniqueReplacements.sort((left, right) => right.start - left.start);
-    uniqueReplacements.forEach(({ start, end, replacement }) => {
+    [...replacements]
+        .sort((left, right) => right.start - left.start)
+        .forEach(({ start, end, replacement }) => {
         result = result.slice(0, start) + replacement + result.slice(end);
     });
     return result;
@@ -539,107 +570,90 @@ const generateCreatorsForConfig = (configName) => {
         `export const ${creatorBaseName}Delete = createDeleteQuery(${configVariableName});`,
     ].join('\n');
 };
-const declaresName = (declarations, name) => declarations.some((declaration) => declaration.name && ts.isIdentifier(declaration.name) && declaration.name.text === name);
-const isShadowedByLocalDeclaration = (identifier) => {
-    for (let scope = identifier.parent; scope && !ts.isSourceFile(scope); scope = scope.parent) {
-        if (ts.isFunctionLike(scope) && declaresName(scope.parameters, identifier.text)) {
-            return true;
-        }
-        if (ts.isBlock(scope) &&
-            scope.statements.some((statement) => ts.isVariableStatement(statement) && declaresName(statement.declarationList.declarations, identifier.text))) {
-            return true;
-        }
-    }
-    return false;
-};
-const updateImportsInFile = (content, renames) => {
-    const sourceFile = createSourceFile(content);
+/**
+ * Points imports and re-exports of a renamed client at its new name, and renames the references to
+ * each unaliased import. Only a binding the module graph resolves to the client's declaring file is
+ * touched; a same-named symbol from any other module stays as it is. A workspace specifier the graph
+ * cannot resolve falls back to the rename by name and is returned in `renamedByName` for the report.
+ */
+const updateImportsInFile = (content, filePath, renames, graph) => {
+    const sourceFile = createSourceFile(content, filePath);
     const replacements = [];
-    const visit = (node) => {
-        if (ts.isImportDeclaration(node) &&
-            node.importClause?.namedBindings &&
-            ts.isNamedImports(node.importClause.namedBindings)) {
-            const nextElements = [];
+    const localRenames = new Map();
+    const renamedByName = new Set();
+    const resolveRename = (specifier, importedName) => {
+        const declaringFile = graph.findDeclaringFile(filePath, specifier, importedName);
+        if (declaringFile) {
+            return declaringFile !== filePath ? renames.get(declaringFile)?.renames.get(importedName) : undefined;
+        }
+        if (!graph.isWorkspaceSpecifier(specifier))
+            return undefined;
+        const nextName = [...renames.values()].find((entry) => entry.renames.has(importedName))?.renames.get(importedName);
+        if (nextName)
+            renamedByName.add(specifier);
+        return nextName;
+    };
+    for (const statement of sourceFile.statements) {
+        if (ts.isImportDeclaration(statement) &&
+            ts.isStringLiteral(statement.moduleSpecifier) &&
+            statement.importClause?.namedBindings &&
+            ts.isNamedImports(statement.importClause.namedBindings)) {
+            const specifier = statement.moduleSpecifier.text;
             let hasChanges = false;
-            node.importClause.namedBindings.elements.forEach((element) => {
-                const nextName = renames.get(element.propertyName?.text ?? element.name.text);
+            const nextElements = statement.importClause.namedBindings.elements.map((element) => {
+                const nextName = resolveRename(specifier, (element.propertyName ?? element.name).text);
                 if (!nextName) {
-                    nextElements.push(element.getText(sourceFile));
-                    return;
+                    return element.getText(sourceFile);
                 }
                 hasChanges = true;
-                nextElements.push(element.propertyName ? `${nextName} as ${element.name.text}` : nextName);
+                const typePrefix = element.isTypeOnly ? 'type ' : '';
+                if (element.propertyName) {
+                    return `${typePrefix}${nextName} as ${element.name.text}`;
+                }
+                localRenames.set(element.name.text, nextName);
+                return `${typePrefix}${nextName}`;
             });
             if (hasChanges) {
                 replacements.push({
-                    start: node.getStart(sourceFile),
-                    end: node.getEnd(),
-                    replacement: `import { ${nextElements.join(', ')} } from '${node.moduleSpecifier.text}';`,
+                    start: statement.getStart(sourceFile),
+                    end: statement.getEnd(),
+                    replacement: printImportDeclaration(statement, sourceFile, nextElements),
                 });
             }
         }
-        if (ts.isIdentifier(node)) {
-            const nextName = renames.get(node.text);
-            if (!nextName) {
-                ts.forEachChild(node, visit);
-                return;
-            }
-            const parent = node.parent;
-            if (ts.isImportSpecifier(parent)) {
-                ts.forEachChild(node, visit);
-                return;
-            }
-            if (ts.isVariableDeclaration(parent) && parent.name === node) {
-                ts.forEachChild(node, visit);
-                return;
-            }
-            if (ts.isFunctionDeclaration(parent) && parent.name === node) {
-                ts.forEachChild(node, visit);
-                return;
-            }
-            if (ts.isMethodDeclaration(parent) && parent.name === node) {
-                ts.forEachChild(node, visit);
-                return;
-            }
-            if (ts.isParameter(parent) && parent.name === node) {
-                ts.forEachChild(node, visit);
-                return;
-            }
-            if (ts.isPropertyDeclaration(parent) && parent.name === node) {
-                ts.forEachChild(node, visit);
-                return;
-            }
-            if (ts.isPropertyAccessExpression(parent) && parent.name === node) {
-                ts.forEachChild(node, visit);
-                return;
-            }
-            if ((ts.isPropertyAssignment(parent) && parent.name === node) || isShadowedByLocalDeclaration(node)) {
-                ts.forEachChild(node, visit);
-                return;
-            }
+        if (ts.isExportDeclaration(statement) &&
+            statement.moduleSpecifier &&
+            ts.isStringLiteral(statement.moduleSpecifier) &&
+            statement.exportClause &&
+            ts.isNamedExports(statement.exportClause)) {
+            const specifier = statement.moduleSpecifier.text;
+            statement.exportClause.elements.forEach((element) => {
+                const exportedFrom = element.propertyName ?? element.name;
+                const nextName = ts.isIdentifier(exportedFrom) ? resolveRename(specifier, exportedFrom.text) : undefined;
+                if (nextName) {
+                    replacements.push({
+                        start: exportedFrom.getStart(sourceFile),
+                        end: exportedFrom.getEnd(),
+                        replacement: nextName,
+                    });
+                }
+            });
+        }
+    }
+    const visit = (node) => {
+        const nextName = ts.isIdentifier(node) ? localRenames.get(node.text) : undefined;
+        if (nextName && !isNamePosition(node) && !isShadowedInNestedScope(node)) {
             replacements.push({
                 start: node.getStart(sourceFile),
                 end: node.getEnd(),
-                replacement: nextName,
+                replacement: renamedReference(node, nextName),
             });
         }
         ts.forEachChild(node, visit);
     };
-    visit(sourceFile);
-    let result = content;
-    const seen = new Set();
-    const uniqueReplacements = replacements.filter((replacement) => {
-        const key = `${replacement.start}:${replacement.end}`;
-        if (seen.has(key)) {
-            return false;
-        }
-        seen.add(key);
-        return true;
-    });
-    uniqueReplacements.sort((left, right) => right.start - left.start);
-    uniqueReplacements.forEach(({ start, end, replacement }) => {
-        result = result.slice(0, start) + replacement + result.slice(end);
-    });
-    return result;
+    if (localRenames.size > 0) {
+        visit(sourceFile);
+    }
+    return { content: applyReplacements(content, replacements), renamedByName };
 };
 //# sourceMappingURL=query-client-migration.js.map

package/generators/migrate-to-query-v3/rename-symbols.js

@@ -1,11 +1,11 @@
 import * as ts from 'typescript';
-import { createSourceFile } from './shared.js';
+import { createSourceFile, printImportDeclaration } from './shared.js';
 /**
  * Whether an identifier is a *name* rather than a *reference* - a declaration, a property key, the
  * right-hand side of a member access. Renaming those is what turned `PeopleDetailDataSource.getPerson`
  * and the `postLogin` property of a config type into `legacy…` during the first migration run.
  */
-const isNamePosition = (node) => {
+export const isNamePosition = (node) => {
     const parent = node.parent;
     if (!parent)
         return false;
@@ -65,7 +65,7 @@ const isNamePosition = (node) => {
         return true;
     return false;
 };
-const renamedReference = (node, nextName) => {
+export const renamedReference = (node, nextName) => {
     const parent = node.parent;
     if (ts.isShorthandPropertyAssignment(parent))
         return `${node.text}: ${nextName}`;
@@ -73,6 +73,38 @@ const renamedReference = (node, nextName) => {
         return `${nextName} as ${node.text}`;
     return nextName;
 };
+const bindingDeclares = (name, text) => ts.isIdentifier(name)
+    ? name.text === text
+    : name.elements.some((element) => !ts.isOmittedExpression(element) && bindingDeclares(element.name, text));
+const statementDeclares = (statement, text) => (ts.isVariableStatement(statement) &&
+    statement.declarationList.declarations.some((declaration) => bindingDeclares(declaration.name, text))) ||
+    ((ts.isFunctionDeclaration(statement) || ts.isClassDeclaration(statement) || ts.isEnumDeclaration(statement)) &&
+        statement.name?.text === text);
+export const isShadowedInNestedScope = (identifier) => {
+    const text = identifier.text;
+    for (let scope = identifier.parent; scope && !ts.isSourceFile(scope); scope = scope.parent) {
+        if (ts.isFunctionLike(scope) && scope.parameters.some((parameter) => bindingDeclares(parameter.name, text))) {
+            return true;
+        }
+        if ((ts.isFunctionExpression(scope) || ts.isClassExpression(scope)) && scope.name?.text === text) {
+            return true;
+        }
+        if ((ts.isBlock(scope) || ts.isModuleBlock(scope) || ts.isCaseClause(scope) || ts.isDefaultClause(scope)) &&
+            scope.statements.some((statement) => statementDeclares(statement, text))) {
+            return true;
+        }
+        if ((ts.isForStatement(scope) || ts.isForInStatement(scope) || ts.isForOfStatement(scope)) &&
+            scope.initializer &&
+            ts.isVariableDeclarationList(scope.initializer) &&
+            scope.initializer.declarations.some((declaration) => bindingDeclares(declaration.name, text))) {
+            return true;
+        }
+        if (ts.isCatchClause(scope) && scope.variableDeclaration && bindingDeclares(scope.variableDeclaration.name, text)) {
+            return true;
+        }
+    }
+    return false;
+};
 /** Every name the file declares itself - a local by the same name means the import is shadowed. */
 const collectLocalDeclarations = (sourceFile) => {
     const declared = new Set();
@@ -183,18 +215,13 @@ export const pruneUnusedNamedImports = (content) => {
         const kept = node.importClause.namedBindings.elements.filter((element) => used.has(element.name.text));
         if (kept.length === node.importClause.namedBindings.elements.length)
             continue;
-        const hasDefaultImport = !!node.importClause.name;
-        if (kept.length === 0 && !hasDefaultImport) {
+        const nextImport = printImportDeclaration(node, sourceFile, kept.map((element) => element.getText(sourceFile)));
+        if (!nextImport) {
             const end = content[node.getEnd()] === '\n' ? node.getEnd() + 1 : node.getEnd();
             replacements.push({ start: node.getStart(sourceFile), end, replacement: '' });
             continue;
         }
-        const defaultPart = hasDefaultImport ? `${node.importClause.name.text}, ` : '';
-        replacements.push({
-            start: node.getStart(sourceFile),
-            end: node.getEnd(),
-            replacement: `import ${defaultPart}{ ${kept.map((element) => element.getText(sourceFile)).join(', ')} } from '${node.moduleSpecifier.text}';`,
-        });
+        replacements.push({ start: node.getStart(sourceFile), end: node.getEnd(), replacement: nextImport });
     }
     let result = content;
     replacements.sort((left, right) => right.start - left.start);

package/generators/migrate-to-query-v3/report.js

@@ -25,7 +25,7 @@ export class QueryV3MigrationReport {
             return;
         }
         const nextTask = {
-            id: `QV3-${String(this.tasks.length + 1).padStart(3, '0')}`,
+            id: formatTaskId(this.tasks.length + 1),
             kind: input.kind,
             title: input.title,
             summary: input.summary,
@@ -58,11 +58,37 @@ export class QueryV3MigrationReport {
         });
         console.warn(`\n📄 See ${QUERY_V3_MIGRATION_REPORT_PATH} for the AI-ready follow-up list.`);
     }
-    writeToTree(tree) {
-        tree.write(QUERY_V3_MIGRATION_REPORT_PATH, renderMigrationReportMarkdown(this.tasks));
+    /**
+     * Writes the report. A scoped run (`scopeLabel` set) replaces its own section of an existing report
+     * or appends one, so the tasks of earlier runs over other projects survive.
+     */
+    writeToTree(tree, scopeLabel) {
+        const existing = scopeLabel ? tree.read(QUERY_V3_MIGRATION_REPORT_PATH, 'utf-8') : null;
+        if (!scopeLabel || !existing) {
+            tree.write(QUERY_V3_MIGRATION_REPORT_PATH, renderMigrationReportMarkdown(this.tasks, scopeLabel));
+            return;
+        }
+        tree.write(QUERY_V3_MIGRATION_REPORT_PATH, mergeScopedSection(existing, this.tasks, scopeLabel));
     }
 }
-export const renderMigrationReportMarkdown = (tasks) => {
+const sectionStart = (scopeLabel) => `<!-- migrate-to-query-v3 scope: ${scopeLabel} -->`;
+const SECTION_END = '<!-- /migrate-to-query-v3 scope -->';
+const mergeScopedSection = (existing, tasks, scopeLabel) => {
+    const start = sectionStart(scopeLabel);
+    const startIndex = existing.indexOf(start);
+    const endIndex = startIndex === -1 ? -1 : existing.indexOf(SECTION_END, startIndex);
+    const [before, after] = startIndex === -1 || endIndex === -1
+        ? [existing.trimEnd(), '']
+        : [existing.slice(0, startIndex).trimEnd(), existing.slice(endIndex + SECTION_END.length).trimStart()];
+    const highestId = Math.max(0, ...Array.from(`${before}\n${after}`.matchAll(/QV3-(\d+)/g), (match) => Number(match[1])));
+    const renumbered = tasks.map((task, index) => ({ ...task, id: formatTaskId(highestId + index + 1) }));
+    return [before, renderTasksSection(renumbered, scopeLabel), after]
+        .filter((part) => part.length > 0)
+        .join('\n\n')
+        .concat('\n');
+};
+const formatTaskId = (index) => `QV3-${String(index).padStart(3, '0')}`;
+export const renderMigrationReportMarkdown = (tasks, scopeLabel) => {
     const header = [
         '# Query V3 Migration Follow-Up',
         '',
@@ -83,8 +109,16 @@ export const renderMigrationReportMarkdown = (tasks) => {
         '- `Source`: which migration phase raised the task.',
         '',
     ].join('\n');
+    return `${header}${renderTasksSection(tasks, scopeLabel)}\n`;
+};
+const renderTasksSection = (tasks, scopeLabel) => {
+    const heading = scopeLabel ? `## Tasks (scope: ${scopeLabel})` : '## Tasks';
+    const body = renderTasksBody(tasks);
+    return scopeLabel ? `${sectionStart(scopeLabel)}\n${heading}\n\n${body}\n${SECTION_END}` : `${heading}\n\n${body}`;
+};
+const renderTasksBody = (tasks) => {
     if (tasks.length === 0) {
-        return `${header}## Tasks\n\nNo open follow-up tasks were recorded during this migration run.\n`;
+        return 'No open follow-up tasks were recorded during this migration run.';
     }
     const tasksSection = tasks
         .map((task) => {
@@ -129,8 +163,7 @@ export const renderMigrationReportMarkdown = (tasks) => {
             ];
         }),
         '```',
-        '',
     ].join('\n');
-    return `${header}## Tasks\n\n${tasksSection}${machineSection}`;
+    return `${tasksSection}${machineSection}`;
 };
 //# sourceMappingURL=report.js.map

package/generators/migrate-to-query-v3/shared.js

@@ -13,6 +13,23 @@ export const ensureConfigSuffix = (name) => {
     }
     return `${name}Config`;
 };
+const importSpecifierText = (element) => element.propertyName ? `${element.propertyName.text} as ${element.name.text}` : element.name.text;
+/**
+ * Prints `node` with `namedElements` as its named bindings, keeping the default import, the
+ * `import type` modifier, the quote style and any import attributes. Returns an empty string when
+ * nothing would be left to import.
+ */
+export const printImportDeclaration = (node, sourceFile, namedElements) => {
+    const clause = node.importClause;
+    const defaultName = clause?.name?.text;
+    const bindings = [defaultName, namedElements.length > 0 ? `{ ${namedElements.join(', ')} }` : undefined].filter((part) => !!part);
+    if (bindings.length === 0) {
+        return '';
+    }
+    const typePrefix = clause?.isTypeOnly ? 'type ' : '';
+    const attributes = node.attributes ? ` ${node.attributes.getText(sourceFile)}` : '';
+    return `import ${typePrefix}${bindings.join(', ')} from ${node.moduleSpecifier.getText(sourceFile)}${attributes};`;
+};
 export const ensureNamedImports = ({ content, importsNeeded, moduleSpecifier }) => {
     const sourceFile = createSourceFile(content);
     let importNode;
@@ -32,13 +49,14 @@ export const ensureNamedImports = ({ content, importsNeeded, moduleSpecifier })
         const namedBindings = importNode.importClause.namedBindings;
         namedBindings.elements.forEach((element) => {
             missingImports.delete(element.name.text);
+            missingImports.delete(importSpecifierText(element));
         });
         if (missingImports.size === 0) {
             return content;
         }
         const existingImports = namedBindings.elements.map((element) => element.getText(sourceFile));
         const nextImports = [...existingImports, ...Array.from(missingImports).sort()].sort();
-        const nextImportStatement = `import { ${nextImports.join(', ')} } from '${moduleSpecifier}';`;
+        const nextImportStatement = printImportDeclaration(importNode, sourceFile, nextImports);
         return content.slice(0, importNode.getStart(sourceFile)) + nextImportStatement + content.slice(importNode.getEnd());
     }
     let lastImportEnd = 0;