debens / sort-js-object Goto Github PK

hi there! this extension is pretty much exactly what i'm looking for to sort my react-native StyleSheet objects, but i'd love to see the addition of sort on save so that i don't have to select the object that needs sorting and hit the hotkey. i think this is possible for my use-case, because my styles are in their own isolated file (styles.js), which only exports the return of the StyleSheet.create() method. an example of a file i'd like to use this with is below:

import { StyleSheet } from 'react-native';

export default StyleSheet.create({
    foo: {
        textAlign: 'center',
        position: 'absolute',
        left: 0,
        right: 0,
        top: 0,
        bottom: 0,
        flexDirection: 'row',
        alignItems: 'center',
        fontSize: 16,
    },
    bar: {
        textAlign: 'center',
        backgroundColor: '#f00',
    },
});

once saved, the extension would auto-sort/save to have the file look like below:

import { StyleSheet } from 'react-native';

export default StyleSheet.create({
    bar: {
        backgroundColor: '#f00',
        textAlign: 'center',
    },
    foo: {
        alignItems: 'center',
        bottom: 0,
        flexDirection: 'row',
        fontSize: 16,
        left: 0,
        position: 'absolute',
        right: 0,
        textAlign: 'center',
        top: 0,
    },
});

i would love to be able to use this extension on these styles.js files only, and be able to have the extension know i'm on this specific filename+extension and to look for the object within the StyleSheet.create() method and run it's sort when i save the file. i'm not versed in vscode extension creation and your extension has ~ 90% of what i'm looking for, so i'd love to see this get implemented! i'd be willing to test anything at a moment's notice, since this is something myself and my team are clamoring for! thanks so much again!

Thanks for the great extension! Here are a couple of feature requests. Curious about feasibility and would happily contribute to get these in!

I think the trailing commas one is self-explanatory. Would be great if this was configurable.

For the line placement of spread objects, my issue is that

const myObject = {
  key1: {
    ...someOtherObject,
    a: 1
  }
}

turns into

const myObject = {
  key1: { ...someOtherObject,
    a: 1
  }
}

when ideally it would stay the same, with the spread object on its own line.

Description

Every time I try to run, either via hotkey or command, I get the following error:
Failed to parse text: $OBJ

Example

Failed to parse text: { h: 1080, w: 1920, }

Environment

macOS Big Sur 11.6 (20G165)
VSC 1.62.0

First, thanks a ton for creating this extension. Ive been looking for something like it for awhile...

I'm unable to sort the highlighted selection for this object... Even if I place it in it's own file, select the object, and alt + s it returns the Please make sure your selected text is a JS object error. Only if I sort the entire file with ctrl + alt + s does it sort properly. The object is similar to this:

const myObject = {
  foo: (bar) => ({
    ...bar,
    a: true,
  }),
  bazz: (buzz) => ({
    ...buzz,
    b: false,
  })
}

Any insight would be greatly appreciated