jscodeshift TypeScript codemod - Remove Generic type but keep wrapped type

Question

I'm currently trying to write a codemod that will remove all the $ReadOnly<T> generic from a TypeScript codebase, keeping only T (T being an object/union)

So far, this is what I came up with

module.exports = (fileInfo, api) => {
const j = api.jscodeshift
const source = j(fileInfo.source)

source
.find(j.TSTypeAliasDeclaration)
.find(j.TSTypeReference)
.filter(x => {
    return x.value.typeName.name === '$ReadOnly' && x.value.typeParameters.params[0].type === 'TSTypeLiteral'
})
.replaceWith(nodePath => {
    const members = []
    nodePath.value.typeParameters.params[0].members.forEach(x => {
        members.push(j.tsPropertySignature(x.key, x.typeAnnotation))
    })

    return j.tsTypeLiteral(members)
})

return source
    .toSource()
}

The idea is to modify something like this:

export type MyType = $ReadOnly<{
  someProps: string,
}>

To that:

export type MyType = {
  someProps: string,
}

Unfortunately, this is what I end up with, with a duplicate type keyword:

export type type MyType = {
  someProps: string,
}

Any idea what could've gone wrong here?

Answer 1

It can be written in a declarative way with putout code transformer (you can try it in putout.cloudcmd.io):

// type-updater.js
const {replaceWith} = require('putout').operator;

module.exports.report = () => '$ReadOnly generic should be removed';

module.exports.match = () => ({
    'export type __a = __b': ({__b}, path) => {
        return __b.name === '$ReadOnly';
    }
});
    
module.exports.replace = () => ({
    'export type __a = __b': (vars, path) => {
        const typeAnnotationPath = path.get('declaration.typeAnnotation');
        const paramPath = typeAnnotationPath.get('typeParameters.params.0');
        
        replaceWith(typeAnnotationPath, paramPath);
        
        return path;
    },
});

This is replacer type of putout plugin.

It will change input:

// fixture/update-type.js
export type MyType = $ReadOnly<{
  someProps: string,
}>
    
export type MyType2 = $WriteOnly<{
  someProps: string,
}>
    
export type MyType1 = {
  someProps: string,
}

Into output:

// fixture/update-type-fix.js
export type MyType = {
  someProps: string,
};
    
export type MyType2 = $WriteOnly<{
  someProps: string,
}>
    
export type MyType1 = {
  someProps: string,
}

Putout has a simple test runner so you can test your codemod with predefined fixtures using:

// type-updater.spec.js
const test = require('@putout/test')(__dirname, {
     'update-type': require('./type-updater'),
});

test('update-type: report', (t) => {
    t.report('update-type', '$ReadOnly generic should be removed');
});

test('update-type: transform', (t) => {
    t.transform('update-type');
    t.end();
});

To run this codemod save it into ~/.putout and run on your codebase with:

putout .

Or save in a directory your-project/codemods and run:

putout --rulesdir codemods .