feat(to-destructuring): new command (#12)

Co-authored-by: Anthony Fu <[email protected]>

src/commands/index.ts

@@ -3,6 +3,7 @@ import { toArrow } from './to-arrow'
 import { keepSorted } from './keep-sorted'
 import { toForEach } from './to-for-each'
 import { toForOf } from './to-for-of'
+import { toDestructuring } from './to-destructuring'
 import { toDynamicImport } from './to-dynamic-import'
 import { toStringLiteral } from './to-string-literal'
 import { toTemplateLiteral } from './to-template-literal'
@@ -20,6 +21,7 @@ export {
   noShorthand,
   noType,
   toArrow,
+  toDestructuring,
   toDynamicImport,
   toForEach,
   toForOf,
@@ -37,6 +39,7 @@ export const builtinCommands = [
   noShorthand,
   noType,
   toArrow,
+  toDestructuring,
   toDynamicImport,
   toForEach,
   toForOf,

src/commands/to-destructuring.md

@@ -0,0 +1,45 @@
+# `to-destructuring`
+
+Convert an assignment expression to destructuring assignment.
+
+## Triggers
+
+- `/// to-destructuring`
+- `/// to-dest`
+- `/// 2destructuring`
+- `/// 2dest`
+
+## Examples
+
+```js
+/// to-destructuring
+const foo = bar.foo
+
+/// to-dest
+const baz = bar?.foo
+
+/// 2destructuring
+const foo = bar[0]
+
+/// 2dest
+const foo = bar?.[1]
+
+let foo
+/// to-destructuring
+foo = bar().foo
+```
+
+Will be converted to:
+
+```js
+const { foo } = bar
+
+const { foo: baz } = bar ?? {}
+
+const [foo] = bar
+
+const [,foo] = bar ?? []
+
+let foo
+;({ foo } = bar())
+```

src/commands/to-destructuring.test.ts

@@ -0,0 +1,102 @@
+import { toDestructuring as command } from './to-destructuring'
+import { $, run } from './_test-utils'
+
+run(
+  command,
+  {
+    code: $`
+    /// to-destructuring
+    const foo = bar.foo`,
+    output: $`
+    const { foo } = bar`,
+    errors: ['command-fix'],
+  },
+  {
+    code: $`
+    /// to-destructuring
+    const baz = bar.foo`,
+    output: $`
+    const { foo: baz } = bar`,
+    errors: ['command-fix'],
+  },
+  {
+    code: $`
+    /// to-destructuring
+    const foo = bar?.foo`,
+    output: $`
+    const { foo } = bar ?? {}`,
+    errors: ['command-fix'],
+  },
+  {
+    code: $`
+    /// to-destructuring
+    const foo = bar[1]`,
+    output: $`
+    const [,foo] = bar`,
+    errors: ['command-fix'],
+  },
+  {
+    code: $`
+    /// to-destructuring
+    const foo = bar?.[0]`,
+    output: $`
+    const [foo] = bar ?? []`,
+    errors: ['command-fix'],
+  },
+  {
+    code: $`
+    /// to-destructuring
+    const foo = bar().foo`,
+    output: $`
+    const { foo } = bar()`,
+    errors: ['command-fix'],
+  },
+  {
+    code: $`
+    /// to-destructuring
+    const foo = bar()?.foo`,
+    output: $`
+    const { foo } = bar() ?? {}`,
+    errors: ['command-fix'],
+  },
+  {
+    code: $`
+    /// to-destructuring
+    foo = bar.foo`,
+    output: $`
+    ;({ foo } = bar)`,
+    errors: ['command-fix'],
+  },
+  {
+    code: $`
+    /// to-destructuring
+    baz = bar.foo`,
+    output: $`
+    ;({ foo: baz } = bar)`,
+    errors: ['command-fix'],
+  },
+  {
+    code: $`
+    /// to-destructuring
+    foo = bar[0]`,
+    output: $`
+    ;([foo] = bar)`,
+    errors: ['command-fix'],
+  },
+  {
+    code: $`
+    /// to-destructuring
+    foo = bar().foo`,
+    output: $`
+    ;({ foo } = bar())`,
+    errors: ['command-fix'],
+  },
+  {
+    code: $`
+    /// to-destructuring
+    baz = bar().foo`,
+    output: $`
+    ;({ foo: baz } = bar())`,
+    errors: ['command-fix'],
+  },
+)

src/commands/to-destructuring.ts

@@ -0,0 +1,43 @@
+import type { Command } from '../types'
+
+export const toDestructuring: Command = {
+  name: 'to-destructuring',
+  match: /^[\/:@]\s*(?:to-|2)?(?:destructuring|dest)?$/i,
+  action(ctx) {
+    const node = ctx.findNodeBelow(
+      'VariableDeclaration',
+      'AssignmentExpression',
+    )
+    if (!node)
+      return ctx.reportError('Unable to find object/array to convert')
+
+    const isDeclaration = node.type === 'VariableDeclaration'
+
+    const rightExpression = isDeclaration ? node.declarations[0].init : node.right
+    const member = rightExpression?.type === 'ChainExpression' ? rightExpression.expression : rightExpression
+
+    if (member?.type !== 'MemberExpression')
+      return ctx.reportError('Unable to convert to destructuring')
+
+    const id = isDeclaration ? ctx.getTextOf(node.declarations[0].id) : ctx.getTextOf(node.left)
+    const property = ctx.getTextOf(member.property)
+
+    // TODO maybe there is no good way to know if this is an array or object
+    const isArray = !Number.isNaN(Number(property))
+
+    const left = isArray ? `${','.repeat(Number(property))}${id}` : `${id === property ? id : `${property}: ${id}`}`
+
+    let right = `${ctx.getTextOf(member.object)}`
+    if (member.optional)
+      right += ` ?? ${isArray ? '[]' : '{}'}`
+
+    let str = isArray ? `[${left}] = ${right}` : `{ ${left} } = ${right}`
+    str = isDeclaration ? `${node.kind} ${str}` : `;(${str})`
+
+    ctx.report({
+      node,
+      message: 'Convert to destructuring',
+      fix: fixer => fixer.replaceTextRange(node.range, str),
+    })
+  },
+}