Order-in-* rules do not work in native class syntax

[lstrzebinczyk]

It would seem that, as in issue, if code is written using modern native classess + decorators, the order-in-* rules do not pick it up. Example would be, from my codebase:

import Component from "@ember/component";
import UploadManager from "web/services/upload-manager";
import { action } from "@ember/object";
import { inject as service } from "@ember/service";

export default class extends Component {
  @service uploadManager!: UploadManager;

  tagName = "";

  sideMenuOpen = false;

  @action openSideMenu() {
    this.set("sideMenuOpen", true);
  }

  @action closeSideMenu() {
    this.set("sideMenuOpen", false);
  }
}

If I were to put @service lower in the file, no error is raised. I am also using typescript, but that doesn't seem to matter for other rules.

What is the situation here, is this a known issue? And first of all, do I understand correctly that the expected situation would be for this rule to be applied to native class based ember entities?

[Alonski]

@lstrzebinczyk This is a known issue in that I chatted about it with a few folks on Discord a month or so ago. I assume a PR fixing this would be welcome :) I for one would love this :)

[laurmurclar]

I'll start putting a PR together for these

[Alonski]

@laurmurclar Id love to see progress on this. I messed around with AST explorer a few months ago but had a tough time understanding how the transforms work. Good luck!

[laurmurclar]

@Alonski sweet. I could give you a hand with that some time if you're interested! Can be hard to get started alone

[laurmurclar]

I don't have time to finish this off right now, but I made a start by updating some util functions that this work will rely on (see https://github.com/ember-cli/eslint-plugin-ember/pull/574). If anyone else has time, feel free to pick it up