Thom1729 / Sublime-JS-Custom

Customizable JavaScript syntax highlighting for Sublime Text.
MIT License
137 stars 9 forks source link

[Improvement] React.memo does not recognized as ST's Function Symbol #120

Closed ybbond closed 3 years ago

ybbond commented 3 years ago

Summary

Functional component that defined with React.memo not detected as symbol. Thus not searchable by Sublime Text's Goto Symbol nor Goto Symbol in Project...

Examples

Recognized as Symbol

This will be recognized, and searchable by Sublime Text's Goto Symbol

const ProfilePage = (props: Props) => {
  // ...
};

Not Recognized as Symbols

Inline-memoized component with and without FlowTyping, will not be recognizable:

const SettingsPage = React.memo((props: Props) => {
 // ...
});
// with FlowType
const DashboardPage = React.memo<Props>((props: Props) => {
// ...
});

More Info

JSCustom Preference:

  "configurations": {
    "React": {
      "name": "React JSCustom",
      "file_extensions": [ "js", "jsx" ],
      "flow_types": true,
      "jsx": true,
    },
  },
  "defaults": {
    "custom_template_tags": false,
    "eslint_directives": true,
    "flow_types": false,
    "jsx": false,
    "string_object_keys": true,
    "custom_templates": {
      "styled_components": true,
      "tags": {
        "css": "scope:source.js.css",
        "createGlobalStyle": "scope:source.css",
        "gql": "scope:source.graphql"
      }
    }
  }
Thom1729 commented 3 years ago

The variable declaration function detection is purely syntactic — it tries to detect whether the initial value is a function expression or arrow function expression. The syntax highlighter doesn't understand that e.g. React.memo returns a value that's a function. Making this work in the syntax would require adding special cases for every individual function.

For this kind of language-specific semantic stuff, I recommend LSP. It's fully compatible with JS Custom and is much better suited to this kind of thing.

Alternatively, it should be possible to modify the symbol list rules so that any top-level variable declaration would appear in the symbol list. I have not tried this, and it may put too much stuff in the list to be useful, but it's a thought.

Thom1729 commented 3 years ago

Closing this issue because the case in question is not implementable.