From fd8d494f24c85188a4b9aa9374382eaef7e35c59 Mon Sep 17 00:00:00 2001
From: Pavel Prichodko <14926950+prichodko@users.noreply.github.com>
Date: Thu, 24 Feb 2022 23:30:34 +0100
Subject: [PATCH] Fix react imports grouping sort

---
 .eslintrc                                                    | 2 +-
 examples/channel/index.tsx                                   | 5 +++--
 examples/community/index.tsx                                 | 5 +++--
 package.json                                                 | 1 +
 .../status-react/src/components/Modals/AgreementModal.tsx    | 2 +-
 packages/status-react/src/components/Modals/ConnectModal.tsx | 3 ++-
 packages/status-react/src/components/Modals/StatusModal.tsx  | 2 +-
 7 files changed, 12 insertions(+), 8 deletions(-)

diff --git a/.eslintrc b/.eslintrc
index f557058..b6e99f8 100644
--- a/.eslintrc
+++ b/.eslintrc
@@ -45,7 +45,7 @@
           // Side effect imports.
           ["^\\u0000"],
           // `react` related packages come first.
-          ["react"],
+          ["^react"],
           // Things that start with a letter (or digit or underscore), or `@` followed by a letter.
           ["^@?\\w"],
           // Absolute imports and other imports such as Vue-style `@/foo`.
diff --git a/examples/channel/index.tsx b/examples/channel/index.tsx
index 6c608eb..165c152 100644
--- a/examples/channel/index.tsx
+++ b/examples/channel/index.tsx
@@ -1,6 +1,7 @@
-import React, { render } from 'react-dom'
+import React, { StrictMode } from 'react'
+import { render } from 'react-dom'
+
 import { GroupChat, lightTheme } from '@status-im/react'
-import { StrictMode } from 'react'
 
 const App = () => {
   return (
diff --git a/examples/community/index.tsx b/examples/community/index.tsx
index e85ee27..b1d272d 100644
--- a/examples/community/index.tsx
+++ b/examples/community/index.tsx
@@ -1,6 +1,7 @@
-import React, { render } from 'react-dom'
+import React, { StrictMode } from 'react'
+import { render } from 'react-dom'
+
 import { CommunityChat, lightTheme } from '@status-im/react'
-import { StrictMode } from 'react'
 
 const App = () => {
   return (
diff --git a/package.json b/package.json
index f5ba98c..2500a51 100644
--- a/package.json
+++ b/package.json
@@ -11,6 +11,7 @@
     "build": "wsrun -e -c -s build",
     "lint": "eslint 'packages/**/*.{ts,tsx}'",
     "lint:fix": "eslint 'packages/**/*.{ts,tsx}' --fix",
+    "lint:examples": "eslint 'examples/**/*.{ts,tsx}'",
     "format": "prettier --write .",
     "typecheck": "wsrun -e -c -s typecheck",
     "test": "wsrun -e -c -s test"
diff --git a/packages/status-react/src/components/Modals/AgreementModal.tsx b/packages/status-react/src/components/Modals/AgreementModal.tsx
index a794759..65001b8 100644
--- a/packages/status-react/src/components/Modals/AgreementModal.tsx
+++ b/packages/status-react/src/components/Modals/AgreementModal.tsx
@@ -1,6 +1,6 @@
-import HCaptcha from '@hcaptcha/react-hcaptcha'
 import React, { useState } from 'react'
 
+import HCaptcha from '@hcaptcha/react-hcaptcha'
 import styled, { useTheme } from 'styled-components'
 
 import { useMessengerContext } from '../../contexts/messengerProvider'
diff --git a/packages/status-react/src/components/Modals/ConnectModal.tsx b/packages/status-react/src/components/Modals/ConnectModal.tsx
index ae1ac18..e2fc89b 100644
--- a/packages/status-react/src/components/Modals/ConnectModal.tsx
+++ b/packages/status-react/src/components/Modals/ConnectModal.tsx
@@ -1,6 +1,7 @@
-import QRCode from 'qrcode.react'
 import React from 'react'
 
+import QRCode from 'qrcode.react'
+
 import { CopyInput } from '../Form/CopyInput'
 import { Heading, MiddleSection, QRWrapper, Section, Text } from './ModalStyle'
 
diff --git a/packages/status-react/src/components/Modals/StatusModal.tsx b/packages/status-react/src/components/Modals/StatusModal.tsx
index 5a5d781..27f3a8c 100644
--- a/packages/status-react/src/components/Modals/StatusModal.tsx
+++ b/packages/status-react/src/components/Modals/StatusModal.tsx
@@ -1,6 +1,6 @@
-import QRCode from 'qrcode.react'
 import React, { useState } from 'react'
 
+import QRCode from 'qrcode.react'
 import styled from 'styled-components'
 
 import { buttonStyles } from '../Buttons/buttonStyle'