sort imports (#1729)

Author: mdjastrzebski

eslint.config.mjs

@@ -1,5 +1,6 @@
 import tseslint from 'typescript-eslint';
 import callstackConfig from '@callstack/eslint-config/react-native.flat.js';
+import simpleImportSort from 'eslint-plugin-simple-import-sort';
 
 export default [
   {
@@ -14,9 +15,24 @@ export default [
   },
   ...callstackConfig,
   ...tseslint.configs.strict,
+  {
+    plugins: {
+      'simple-import-sort': simpleImportSort,
+    },
+    rules: {
+      'simple-import-sort/imports': [
+        'error',
+        {
+          groups: [['^\\u0000', '^react', '^@?\\w', '^', '^\\.']],
+        },
+      ],
+    },
+  },
   {
     rules: {
       'no-console': 'error',
+      'import/order': 'off',
+      '@typescript-eslint/consistent-type-imports': 'error',
     },
   },
   {

package.json

@@ -82,6 +82,7 @@
     "babel-plugin-module-resolver": "^5.0.2",
     "del-cli": "^6.0.0",
     "eslint": "^9.17.0",
+    "eslint-plugin-simple-import-sort": "^12.1.1",
     "flow-bin": "~0.170.0",
     "jest": "^29.7.0",
     "prettier": "^2.8.8",

src/__tests__/config.test.ts

@@ -1,4 +1,4 @@
-import { getConfig, configure, resetToDefaults } from '../config';
+import { configure, getConfig, resetToDefaults } from '../config';
 
 beforeEach(() => {
   resetToDefaults();

src/__tests__/fire-event-textInput.test.tsx

@@ -1,6 +1,7 @@
 import React from 'react';
-import { Text, TextInput, TextInputProps } from 'react-native';
-import { render, fireEvent, screen } from '..';
+import type { TextInputProps } from 'react-native';
+import { Text, TextInput } from 'react-native';
+import { fireEvent, render, screen } from '..';
 
 function WrappedTextInput(props: TextInputProps) {
   return <TextInput {...props} />;

src/__tests__/host-component-names.test.tsx

@@ -1,5 +1,6 @@
 import * as React from 'react';
 import { Image, Modal, ScrollView, Switch, Text, TextInput } from 'react-native';
+import { render, screen } from '..';
 import {
   isHostImage,
   isHostModal,
@@ -8,7 +9,6 @@ import {
   isHostText,
   isHostTextInput,
 } from '../helpers/host-component-names';
-import { render, screen } from '..';
 
 test('detects host Text component', () => {
   render(<Text>Hello</Text>);

src/__tests__/host-text-nesting.test.tsx

@@ -1,6 +1,6 @@
 import * as React from 'react';
-import { Text, Pressable, View } from 'react-native';
-import { render, within, screen } from '../pure';
+import { Pressable, Text, View } from 'react-native';
+import { render, screen, within } from '../pure';
 
 /**
  * Our queries interact differently with composite and host elements, and some specific cases require us

src/__tests__/react-native-animated.test.tsx

@@ -1,5 +1,6 @@
 import * as React from 'react';
-import { Animated, ViewStyle } from 'react-native';
+import type { ViewStyle } from 'react-native';
+import { Animated } from 'react-native';
 import { act, render, screen } from '..';
 
 type AnimatedViewProps = {

src/__tests__/render-hook.test.tsx

@@ -1,4 +1,5 @@
-import React, { ReactNode } from 'react';
+import type { ReactNode } from 'react';
+import React from 'react';
 import TestRenderer from 'react-test-renderer';
 import { renderHook } from '../pure';
 

src/__tests__/render-string-validation.test.tsx

@@ -1,6 +1,6 @@
 import * as React from 'react';
-import { View, Text, Pressable } from 'react-native';
-import { render, fireEvent, screen } from '..';
+import { Pressable, Text, View } from 'react-native';
+import { fireEvent, render, screen } from '..';
 
 // eslint-disable-next-line no-console
 const originalConsoleError = console.error;

src/__tests__/render.test.tsx

@@ -1,6 +1,7 @@
 import * as React from 'react';
 import { Pressable, Text, TextInput, View } from 'react-native';
-import { fireEvent, render, RenderAPI, screen } from '..';
+import type { RenderAPI } from '..';
+import { fireEvent, render, screen } from '..';
 
 const PLACEHOLDER_FRESHNESS = 'Add custom freshness';
 const PLACEHOLDER_CHEF = 'Who inspected freshness?';