[Proposal] Order imports using the eslint import plugin (#2632)

* Add import plugin (eslintrc.json, package.json, yarn.lock)

* Changes from running yarn lint --fix

* Change files

* Change import order config "warn" to "error"

* Run yarn lint --fix again + some manual fixes

* Change files

* Run prettier

* Re-order - move standard libraries (react/react native) to the top

* Run yarn lint --fix after previous change

* Change files

* Bad merge

.eslintrc.json

@@ -6,7 +6,7 @@
     "browser": true
   },
   "parser": "@typescript-eslint/parser",
-  "plugins": ["@typescript-eslint"],
+  "plugins": ["@typescript-eslint", "import"],
   "rules": {
     "indent": "off",
     "no-unused-vars": "off",
@@ -29,7 +29,26 @@
     "@typescript-eslint/no-object-literal-type-assertion": "off",
     "@typescript-eslint/array-type": "off",
     "@typescript-eslint/no-var-requires": "off",
-    "@typescript-eslint/no-unused-vars": "off"
+    "@typescript-eslint/no-unused-vars": "off",
+    "import/order": [
+      "error",
+      {
+        "newlines-between": "always",
+        "groups": ["builtin", "external", "internal", ["parent", "sibling", "index"]],
+        "pathGroups": [
+          {
+            "pattern": "react+(|-native)",
+            "group": "external",
+            "position": "before"
+          }
+        ],
+        "pathGroupsExcludedImportTypes": ["react"],
+        "alphabetize": {
+          "order": "asc",
+          "caseInsensitive": true
+        }
+      }
+    ]
   },
   "overrides": [
     {

apps/E2E/src/ActivityIndicator/pages/ActivityIndicatorPageObject.ts

@@ -1,5 +1,5 @@
-import { HOMEPAGE_ACTIVITY_INDICATOR_BUTTON, ACTIVITY_INDICATOR_TESTPAGE, ACTIVITY_INDICATOR_TEST_COMPONENT } from '../consts';
 import { BasePage } from '../../common/BasePage';
+import { HOMEPAGE_ACTIVITY_INDICATOR_BUTTON, ACTIVITY_INDICATOR_TESTPAGE, ACTIVITY_INDICATOR_TEST_COMPONENT } from '../consts';
 
 class ActivityIndicatorPageObject extends BasePage {
   /*****************************************/

apps/E2E/src/Avatar/pages/AvatarPageObject.ts

@@ -1,5 +1,5 @@
-import { AVATAR_TESTPAGE, HOMEPAGE_AVATAR_BUTTON, AVATAR_TEST_COMPONENT, AVATAR_SECONDARY_TEST_COMPONENT } from '../consts';
 import { BasePage } from '../../common/BasePage';
+import { AVATAR_TESTPAGE, HOMEPAGE_AVATAR_BUTTON, AVATAR_TEST_COMPONENT, AVATAR_SECONDARY_TEST_COMPONENT } from '../consts';
 class AvatarPageObject extends BasePage {
   /*****************************************/
   /**************** Getters ****************/

apps/E2E/src/Avatar/specs/Avatar.spec.win.ts

@@ -1,6 +1,6 @@
-import AvatarPageObject from '../pages/AvatarPageObject';
 import { Attribute, LINK_A11Y_ROLE, IMAGE_A11Y_ROLE } from '../../common/consts';
 import { AVATAR_ACCESSIBILITY_LABEL, AVATAR_ACCESSIBILITY_LABEL_BY_NAME, AVATAR_ACCESSIBILITY_HINT } from '../consts';
+import AvatarPageObject from '../pages/AvatarPageObject';
 
 // Before testing begins, allow up to 60 seconds for app to open
 describe('Avatar Testing Initialization', () => {

apps/E2E/src/ButtonLegacy/pages/ButtonLegacyPageObject.ts

@@ -1,3 +1,4 @@
+import { BasePage, By } from '../../common/BasePage';
 import {
   BUTTON_TESTPAGE,
   BUTTON_TEST_COMPONENT_DEPRECATED,
@@ -5,7 +6,6 @@ import {
   HOMEPAGE_BUTTON_BUTTON,
   BUTTON_ON_PRESS_DEPRECATED,
 } from '../consts';
-import { BasePage, By } from '../../common/BasePage';
 class ButtonLegacyPageObject extends BasePage {
   /******************************************************************/
   /**************** UI Element Interaction Methods ******************/

apps/E2E/src/ButtonLegacy/specs/ButtonLegacy.spec.win.ts

@@ -1,6 +1,6 @@
-import ButtonLegacyPageObject from '../pages/ButtonLegacyPageObject';
 import { BUTTON_A11Y_ROLE, Keys, Attribute } from '../../common/consts';
 import { BUTTON_ACCESSIBILITY_LABEL_DEPRECATED, BUTTON_TEST_COMPONENT_LABEL_DEPRECATED } from '../consts';
+import ButtonLegacyPageObject from '../pages/ButtonLegacyPageObject';
 
 // Before testing begins, allow up to 60 seconds for app to open
 describe('Button Legacy Testing Initialization', () => {

apps/E2E/src/ButtonV1/specs/ButtonV1.spec.android.ts

@@ -1,6 +1,6 @@
+import { BUTTON_TEST_COMPONENT } from '../../ButtonLegacy/consts';
 import { AndroidAttribute, ANDROID_BUTTON } from '../../common/consts';
 import ButtonV1PageObject from '../pages/ButtonV1PageObject';
-import { BUTTON_TEST_COMPONENT } from '../../ButtonLegacy/consts';
 
 // Before testing begins, allow up to 60 seconds for app to open
 describe('Button Testing Initialization', () => {

apps/E2E/src/ButtonV1/specs/ButtonV1.spec.win.ts

@@ -1,6 +1,6 @@
-import ButtonV1PageObject from '../pages/ButtonV1PageObject';
-import { BUTTON_A11Y_ROLE, Keys, Attribute } from '../../common/consts';
 import { BUTTON_ACCESSIBILITY_LABEL, BUTTON_TEST_COMPONENT_LABEL } from '../../ButtonLegacy/consts';
+import { BUTTON_A11Y_ROLE, Keys, Attribute } from '../../common/consts';
+import ButtonV1PageObject from '../pages/ButtonV1PageObject';
 
 // Before testing begins, allow up to 60 seconds for app to open
 describe('ButtonV1 Testing Initialization', () => {

apps/E2E/src/Callout/pages/CalloutPageObject.win.ts

@@ -1,5 +1,5 @@
-import { CALLOUT_TESTPAGE, CALLOUT_TEST_COMPONENT, HOMEPAGE_CALLOUT_BUTTON, BUTTON_TO_OPEN_CALLOUT } from '../consts';
 import { BasePage, By } from '../../common/BasePage';
+import { CALLOUT_TESTPAGE, CALLOUT_TEST_COMPONENT, HOMEPAGE_CALLOUT_BUTTON, BUTTON_TO_OPEN_CALLOUT } from '../consts';
 
 class CalloutPageObject extends BasePage {
   /******************************************************************/

apps/E2E/src/Callout/specs/Callout.spec.win.ts

@@ -1,6 +1,6 @@
-import CalloutPageObject from '../pages/CalloutPageObject.win';
-import { CALLOUT_ACCESSIBILITY_LABEL } from '../consts';
 import { Attribute, CALLOUT_A11Y_ROLE } from '../../common/consts';
+import { CALLOUT_ACCESSIBILITY_LABEL } from '../consts';
+import CalloutPageObject from '../pages/CalloutPageObject.win';
 
 // Before testing begins, allow up to 60 seconds for app to open
 describe('Callout Testing Initialization', () => {

apps/E2E/src/CheckboxLegacy/specs/CheckboxLegacy.spec.win.ts

@@ -1,6 +1,6 @@
-import CheckboxLegacyPageObject from '../pages/CheckboxLegacyPageObject';
-import { CHECKBOX_TEST_COMPONENT_LABEL, CHECKBOX_ACCESSIBILITY_LABEL } from '../consts';
 import { CHECKBOX_A11Y_ROLE, Keys, Attribute } from '../../common/consts';
+import { CHECKBOX_TEST_COMPONENT_LABEL, CHECKBOX_ACCESSIBILITY_LABEL } from '../consts';
+import CheckboxLegacyPageObject from '../pages/CheckboxLegacyPageObject';
 
 describe('Checkbox Legacy Testing Initialization', () => {
   it('Wait for app load', async () => {

apps/E2E/src/CheckboxV1/pages/CheckboxV1PageObject.ts

@@ -1,3 +1,4 @@
+import { BasePage, By } from '../../common/BasePage';
 import {
   HOMEPAGE_CHECKBOXV1_BUTTON,
   CHECKBOXV1_TESTPAGE,
@@ -5,7 +6,6 @@ import {
   CHECKBOXV1_NO_A11Y_LABEL_COMPONENT,
   CHECKBOXV1_ON_PRESS,
 } from '../consts';
-import { BasePage, By } from '../../common/BasePage';
 
 class CheckboxV1PageObject extends BasePage {
   /******************************************************************/

apps/E2E/src/CheckboxV1/specs/CheckboxV1.spec.android.ts

@@ -1,6 +1,6 @@
-import CheckboxV1PageObject from '../pages/CheckboxV1PageObject';
 import { AndroidAttribute, ANDROID_CHECKBOX } from '../../common/consts';
 import { CHECKBOXV1_TEST_COMPONENT } from '../consts';
+import CheckboxV1PageObject from '../pages/CheckboxV1PageObject';
 
 describe('CheckboxV1 Testing Initialization', () => {
   it('Wait for app load', async () => {

apps/E2E/src/CheckboxV1/specs/CheckboxV1.spec.win.ts

@@ -1,6 +1,6 @@
-import CheckboxV1PageObject from '../pages/CheckboxV1PageObject';
-import { CHECKBOXV1_TEST_COMPONENT_LABEL, CHECKBOXV1_ACCESSIBILITY_LABEL } from '../consts';
 import { CHECKBOX_A11Y_ROLE, Keys, Attribute } from '../../common/consts';
+import { CHECKBOXV1_TEST_COMPONENT_LABEL, CHECKBOXV1_ACCESSIBILITY_LABEL } from '../consts';
+import CheckboxV1PageObject from '../pages/CheckboxV1PageObject';
 
 describe('CheckboxV1 Testing Initialization', () => {
   it('Wait for app load', async () => {

apps/E2E/src/ColorTokens/pages/ColorTokensPageObject.win.ts

@@ -1,5 +1,5 @@
-import { HOMEPAGE_COLORTOKEN_BUTTON, COLORTOKEN_TESTPAGE } from '../consts';
 import { BasePage } from '../../common/BasePage';
+import { HOMEPAGE_COLORTOKEN_BUTTON, COLORTOKEN_TESTPAGE } from '../consts';
 
 class ColorTokenPageObject extends BasePage {
   /*****************************************/

apps/E2E/src/ContextualMenu/pages/ContextualMenuPageObject.win.ts

@@ -1,11 +1,11 @@
+import { BasePage, By } from '../../common/BasePage';
+import { Keys } from '../../common/consts';
 import {
   CONTEXTUALMENU_TESTPAGE,
   CONTEXTUALMENU_TEST_COMPONENT,
   HOMEPAGE_CONTEXTUALMENU_BUTTON,
   CONTEXTUALMENUITEM_TEST_COMPONENT,
 } from '../consts';
-import { BasePage, By } from '../../common/BasePage';
-import { Keys } from '../../common/consts';
 
 class ContextualMenuPageObject extends BasePage {
   /******************************************************************/

apps/E2E/src/ContextualMenu/specs/ContextualMenu.spec.win.ts

@@ -1,5 +1,5 @@
-import ContextualMenuPageObject from '../pages/ContextualMenuPageObject.win';
 import { PAGE_TIMEOUT, Keys } from '../../common/consts';
+import ContextualMenuPageObject from '../pages/ContextualMenuPageObject.win';
 
 // Before testing begins, allow up to 60 seconds for app to open
 describe('ContextualMenu Testing Initialization', () => {

apps/E2E/src/CornerRadiusTokens/pages/CornerRadiusTokensPageObject.ts

@@ -1,5 +1,5 @@
-import { HOMEPAGE_CORNERRADIUS_TESTPAGE, HOMEPAGE_CORNERRADIUS_BUTTON } from '../consts';
 import { BasePage } from '../../common/BasePage';
+import { HOMEPAGE_CORNERRADIUS_TESTPAGE, HOMEPAGE_CORNERRADIUS_BUTTON } from '../consts';
 
 class CornerRadiusTokensPageObject extends BasePage {
   /*****************************************/

apps/E2E/src/FocusTrapZone/pages/FocusTrapZonePageObject.win.ts

@@ -1,5 +1,5 @@
-import { FOCUSTRAPZONE_TESTPAGE, FOCUSTRAPZONE_TEST_COMPONENT, HOMEPAGE_FOCUSTRAPZONE_BUTTON } from '../consts';
 import { BasePage } from '../../common/BasePage';
+import { FOCUSTRAPZONE_TESTPAGE, FOCUSTRAPZONE_TEST_COMPONENT, HOMEPAGE_FOCUSTRAPZONE_BUTTON } from '../consts';
 
 class FocusTrapZonePageObject extends BasePage {
   /*****************************************/

apps/E2E/src/FocusZone/consts.ts

@@ -1,4 +1,5 @@
 import type { FocusZoneDirection } from '@fluentui-react-native/focus-zone';
+
 import type { GridButton } from './pages/FocusZonePageObject';
 
 export const HOMEPAGE_FOCUSZONE_BUTTON = 'Homepage_FocusZone_Button';

apps/E2E/src/FocusZone/pages/FocusZonePageObject.ts

@@ -1,4 +1,5 @@
 import type { FocusZoneDirection } from '@fluentui-react-native/focus-zone';
+
 import { BasePage, By } from '../../common/BasePage';
 import {
   FOCUSZONE_CIRCLE_NAV_SWITCH,

apps/E2E/src/IconLegacy/pages/IconLegacyPageObject.ts

@@ -1,5 +1,5 @@
-import { ICON_TESTPAGE, ICON_TEST_COMPONENT, HOMEPAGE_ICON_BUTTON, ICON_NO_A11Y_LABEL_COMPONENT } from '../consts';
 import { BasePage } from '../../common/BasePage';
+import { ICON_TESTPAGE, ICON_TEST_COMPONENT, HOMEPAGE_ICON_BUTTON, ICON_NO_A11Y_LABEL_COMPONENT } from '../consts';
 
 class IconLegacyPageObject extends BasePage {
   /*****************************************/

apps/E2E/src/IconV1/pages/IconV1PageObject.ts

@@ -1,5 +1,5 @@
-import { ICON_TESTPAGE, ICON_TEST_COMPONENT, HOMEPAGE_ICON_BUTTON, ICON_FONT_TEST_COMPONENT } from '../../IconLegacy/consts';
 import { BasePage } from '../../common/BasePage';
+import { ICON_TESTPAGE, ICON_TEST_COMPONENT, HOMEPAGE_ICON_BUTTON, ICON_FONT_TEST_COMPONENT } from '../../IconLegacy/consts';
 
 class IconV1PageObject extends BasePage {
   /*****************************************/

apps/E2E/src/IconV1/specs/IconV1.spec.win.ts

@@ -1,6 +1,6 @@
-import IconV1PageObject from '../pages/IconV1PageObject';
 import { Attribute, IMAGE_A11Y_ROLE } from '../../common/consts';
 import { ICON_ACCESSIBILITY_LABEL } from '../../IconLegacy/consts';
+import IconV1PageObject from '../pages/IconV1PageObject';
 
 // Before testing begins, allow up to 60 seconds for app to open
 describe('IconV1 Testing Initialization', () => {

apps/E2E/src/LinkLegacy/pages/LinkLegacyPageObject.ts

@@ -1,5 +1,5 @@
-import { LINK_TESTPAGE, LINK_TEST_COMPONENT, HOMEPAGE_LINK_BUTTON, LINK_NO_A11Y_LABEL_COMPONENT } from '../consts';
 import { BasePage } from '../../common/BasePage';
+import { LINK_TESTPAGE, LINK_TEST_COMPONENT, HOMEPAGE_LINK_BUTTON, LINK_NO_A11Y_LABEL_COMPONENT } from '../consts';
 
 class LinkLegacyPageObject extends BasePage {
   /*****************************************/

apps/E2E/src/LinkLegacy/specs/LinkLegacy.spec.win.ts

@@ -1,6 +1,6 @@
-import LinkLegacyPageObject from '../pages/LinkLegacyPageObject';
-import { LINK_ACCESSIBILITY_LABEL } from '../consts';
 import { LINK_A11Y_ROLE, Attribute } from '../../common/consts';
+import { LINK_ACCESSIBILITY_LABEL } from '../consts';
+import LinkLegacyPageObject from '../pages/LinkLegacyPageObject';
 
 // Before testing begins, allow up to 60 seconds for app to open
 describe('Link Testing Initialization', () => {

apps/E2E/src/LinkV1/pages/LinkV1PageObject.ts

@@ -1,5 +1,5 @@
-import { LINKV1_TESTPAGE, LINKV1_TEST_COMPONENT, HOMEPAGE_LINKV1_BUTTON, LINKV1_NO_A11Y_LABEL_COMPONENT } from '../consts';
 import { BasePage, By } from '../../common/BasePage';
+import { LINKV1_TESTPAGE, LINKV1_TEST_COMPONENT, HOMEPAGE_LINKV1_BUTTON, LINKV1_NO_A11Y_LABEL_COMPONENT } from '../consts';
 
 class LinkV1PageObject extends BasePage {
   /******************************************************************/

apps/E2E/src/LinkV1/specs/LinkV1.spec.win.ts

@@ -1,6 +1,6 @@
-import LinkV1PageObject from '../pages/LinkV1PageObject';
-import { LINKV1_ACCESSIBILITY_LABEL } from '../consts';
 import { LINK_A11Y_ROLE, Attribute, Keys } from '../../common/consts';
+import { LINKV1_ACCESSIBILITY_LABEL } from '../consts';
+import LinkV1PageObject from '../pages/LinkV1PageObject';
 
 // Before testing begins, allow up to 60 seconds for app to open
 describe('LinkV1 Testing Initialization', () => {

apps/E2E/src/MenuButtonLegacy/specs/MenuButtonLegacy.spec.win.ts

@@ -1,6 +1,6 @@
-import MenuButtonLegacyPageObject from '../pages/MenuButtonLegacyPageObject.win';
 import { MENUBUTTON_A11Y_ROLE, Keys, Attribute } from '../../common/consts';
 import { MENU_BUTTON_ACCESSIBILITY_LABEL, MENU_BUTTON_TEST_COMPONENT_LABEL } from '../consts';
+import MenuButtonLegacyPageObject from '../pages/MenuButtonLegacyPageObject.win';
 
 // Before testing begins, allow up to 60 seconds for app to open
 describe('MenuButton Legacy Testing Initialization', () => {

apps/E2E/src/MenuButtonV1/pages/MenuButtonV1PageObject.win.ts

@@ -1,10 +1,10 @@
+import { BasePage, By } from '../../common/BasePage';
 import {
   MENUBUTTONV1_TESTPAGE,
   MENUBUTTONV1_TEST_COMPONENT,
   HOMEPAGE_MENUBUTTONV1_BUTTON,
   MENUBUTTONV1_NO_A11Y_LABEL_COMPONENT,
 } from '../consts';
-import { BasePage, By } from '../../common/BasePage';
 
 class MenuButtonV1PageObject extends BasePage {
   /*****************************************/

apps/E2E/src/MenuButtonV1/specs/MenuButtonV1.spec.win.ts

@@ -1,6 +1,6 @@
-import MenuButtonV1PageObject from '../pages/MenuButtonV1PageObject.win';
 import { MENUBUTTON_A11Y_ROLE, Attribute } from '../../common/consts';
 import { MENUBUTTONV1_ACCESSIBILITY_LABEL, MENUBUTTONV1_TEST_COMPONENT_LABEL } from '../consts';
+import MenuButtonV1PageObject from '../pages/MenuButtonV1PageObject.win';
 
 // Before testing begins, allow up to 60 seconds for app to open
 describe('MenuButtonV1 Testing Initialization', () => {

apps/E2E/src/Persona/pages/PersonaPageObject.ts

@@ -1,5 +1,5 @@
-import { PERSONA_TESTPAGE, PERSONA_TEST_COMPONENT, HOMEPAGE_PERSONA_BUTTON } from '../consts';
 import { BasePage } from '../../common/BasePage';
+import { PERSONA_TESTPAGE, PERSONA_TEST_COMPONENT, HOMEPAGE_PERSONA_BUTTON } from '../consts';
 
 class PersonaPageObject extends BasePage {
   /*****************************************/

apps/E2E/src/PersonaCoin/pages/PersonaCoinPageObject.ts

@@ -1,5 +1,5 @@
-import { PERSONACOIN_TESTPAGE, PERSONACOIN_TEST_COMPONENT, HOMEPAGE_PERSONACOIN_BUTTON } from '../consts';
 import { BasePage } from '../../common/BasePage';
+import { PERSONACOIN_TESTPAGE, PERSONACOIN_TEST_COMPONENT, HOMEPAGE_PERSONACOIN_BUTTON } from '../consts';
 
 class PersonaCoinPageObject extends BasePage {
   /*****************************************/

apps/E2E/src/Pressable/pages/PressablePageObject.ts

@@ -1,5 +1,5 @@
-import { PRESSABLE_TESTPAGE, PRESSABLE_TEST_COMPONENT, HOMEPAGE_PRESSABLE_BUTTON } from '../consts';
 import { BasePage } from '../../common/BasePage';
+import { PRESSABLE_TESTPAGE, PRESSABLE_TEST_COMPONENT, HOMEPAGE_PRESSABLE_BUTTON } from '../consts';
 
 class PressablePageObject extends BasePage {
   /*****************************************/

apps/E2E/src/Separator/pages/SeparatorPageObject.ts

@@ -1,5 +1,5 @@
-import { SEPARATOR_TESTPAGE, SEPARATOR_TEST_COMPONENT, HOMEPAGE_SEPARATOR_BUTTON } from '../consts';
 import { BasePage } from '../../common/BasePage';
+import { SEPARATOR_TESTPAGE, SEPARATOR_TEST_COMPONENT, HOMEPAGE_SEPARATOR_BUTTON } from '../consts';
 
 class SeparatorPageObject extends BasePage {
   /*****************************************/

apps/E2E/src/Shadow/pages/ShadowPageObject.ts

@@ -1,5 +1,5 @@
-import { SHADOW_TESTPAGE, HOMEPAGE_SHADOW_BUTTON } from '../consts';
 import { BasePage } from '../../common/BasePage';
+import { SHADOW_TESTPAGE, HOMEPAGE_SHADOW_BUTTON } from '../consts';
 
 class ShadowTestPage extends BasePage {
   /*****************************************/

apps/E2E/src/Shimmer/pages/ShimmerPageObject.ts

@@ -1,5 +1,5 @@
-import { HOMEPAGE_SHIMMER_BUTTON, SHIMMER_TESTPAGE, SHIMMER_TEST_COMPONENT } from '../consts';
 import { BasePage } from '../../common/BasePage';
+import { HOMEPAGE_SHIMMER_BUTTON, SHIMMER_TESTPAGE, SHIMMER_TEST_COMPONENT } from '../consts';
 
 class ShimmerPageObject extends BasePage {
   /*****************************************/

apps/E2E/src/Spacing/pages/SpacingTokensPageObject.ts

@@ -1,5 +1,5 @@
-import { SPACING_TESTPAGE, HOMEPAGE_SPACING_BUTTON } from '../consts';
 import { BasePage } from '../../common/BasePage';
+import { SPACING_TESTPAGE, HOMEPAGE_SPACING_BUTTON } from '../consts';
 
 class SpacingTokensPageObject extends BasePage {
   /*****************************************/

apps/E2E/src/Spinner/pages/SpinnerPageObject.ts

@@ -1,5 +1,5 @@
-import { HOMEPAGE_SPINNER_BUTTON, SPINNER_TESTPAGE, SPINNER_TEST_COMPONENT } from '../consts';
 import { BasePage } from '../../common/BasePage';
+import { HOMEPAGE_SPINNER_BUTTON, SPINNER_TESTPAGE, SPINNER_TEST_COMPONENT } from '../consts';
 
 class SpinnerPageObject extends BasePage {
   /*****************************************/

apps/E2E/src/StrokeWidthTokens/pages/StrokeWidthTokensPageObject.ts

@@ -1,5 +1,5 @@
-import { STROKEWIDTH_TESTPAGE, HOMEPAGE_STROKEWIDTH_BUTTON } from '../consts';
 import { BasePage } from '../../common/BasePage';
+import { STROKEWIDTH_TESTPAGE, HOMEPAGE_STROKEWIDTH_BUTTON } from '../consts';
 
 class StrokeWidthTokensPageObject extends BasePage {
   /*****************************************/

apps/E2E/src/Svg/pages/SvgPageObject.ts

@@ -1,5 +1,5 @@
-import { SVG_TESTPAGE, SVG_TEST_COMPONENT, HOMEPAGE_SVG_BUTTON } from '../consts';
 import { BasePage } from '../../common/BasePage';
+import { SVG_TESTPAGE, SVG_TEST_COMPONENT, HOMEPAGE_SVG_BUTTON } from '../consts';
 
 class SvgPageObject extends BasePage {
   /*****************************************/

apps/E2E/src/Switch/specs/Switch.spec.win.ts

@@ -1,6 +1,6 @@
-import SwitchPageObject from '../pages/SwitchPageObject';
 import { BUTTON_A11Y_ROLE, Keys, Attribute } from '../../common/consts';
 import { SWITCH_TEST_COMPONENT_LABEL, SWITCH_ACCESSIBILITY_LABEL } from '../consts';
+import SwitchPageObject from '../pages/SwitchPageObject';
 
 // Before testing begins, allow up to 60 seconds for app to open
 describe('Switch Testing Initialization', () => {

apps/E2E/src/TabsLegacy/pages/TabsLegacyPageObject.ts

@@ -1,3 +1,4 @@
+import { BasePage, By } from '../../common/BasePage';
 import {
   TABS_TESTPAGE,
   TABS_TEST_COMPONENT,
@@ -9,7 +10,6 @@ import {
   SECOND_TABS_ITEM_CONTENT,
   THIRD_TABS_ITEM_CONTENT,
 } from '../consts';
-import { BasePage, By } from '../../common/BasePage';
 
 /* This enum gives the spec file an EASY way to interact with SPECIFIC UI elements on the page.
  * The spec file should import this enum and use it when wanting to interact with different elements on the page.

apps/E2E/src/TabsLegacy/specs/TabsLegacy.spec.win.ts

@@ -1,5 +1,5 @@
-import TabsLegacyPageObject from '../pages/TabsLegacyPageObject';
 import { TAB_A11Y_ROLE, TABITEM_A11Y_ROLE, Keys, Attribute } from '../../common/consts';
+import TabsLegacyPageObject from '../pages/TabsLegacyPageObject';
 
 // Before testing begins, allow up to 60 seconds for app to open
 describe('Tabs Legacy Testing Initialization', () => {

apps/E2E/src/TabsV1/pages/TabsV1PageObject.ts

@@ -1,3 +1,4 @@
+import { BasePage, By } from '../../common/BasePage';
 import {
   TABSV1_TESTPAGE,
   TABSV1_TEST_COMPONENT,
@@ -9,7 +10,6 @@ import {
   TABSITEMV1_CONTENT_2,
   TABSITEMV1_CONTENT_3,
 } from '../consts';
-import { BasePage, By } from '../../common/BasePage';
 
 export type TabItem = 'First' | 'Second' | 'Third';
 

apps/E2E/src/TabsV1/specs/TabsV1.spec.win.ts

@@ -1,5 +1,5 @@
-import TabsV1PageObject from '../pages/TabsV1PageObject';
 import { Attribute, Keys, TAB_A11Y_ROLE, TABITEM_A11Y_ROLE } from '../../common/consts';
+import TabsV1PageObject from '../pages/TabsV1PageObject';
 
 // Before testing begins, allow up to 60 seconds for app to open
 describe('TabsV1 Testing Initialization', () => {

apps/E2E/src/TextLegacy/pages/TextLegacyPageObject.ts

@@ -1,5 +1,5 @@
-import { TEXT_TESTPAGE, HOMEPAGE_TEXT_BUTTON, DEPRECATED_TEXT_FIRST_COMPONENT, DEPRECATED_TEXT_SECOND_COMPONENT } from '../consts';
 import { BasePage, By } from '../../common/BasePage';
+import { TEXT_TESTPAGE, HOMEPAGE_TEXT_BUTTON, DEPRECATED_TEXT_FIRST_COMPONENT, DEPRECATED_TEXT_SECOND_COMPONENT } from '../consts';
 class TextLegacyPageObject extends BasePage {
   /*****************************************/
   /**************** Getters ****************/

apps/E2E/src/TextV1/pages/TextV1PageObject.win.ts

@@ -1,5 +1,5 @@
-import { TEXTV1_NO_A11Y_LABEL_COMPONENT, TEXTV1_TESTPAGE, TEXTV1_TEST_COMPONENT, HOMEPAGE_TEXTV1_BUTTON } from '../consts';
 import { BasePage } from '../../common/BasePage';
+import { TEXTV1_NO_A11Y_LABEL_COMPONENT, TEXTV1_TESTPAGE, TEXTV1_TEST_COMPONENT, HOMEPAGE_TEXTV1_BUTTON } from '../consts';
 
 class TextV1PageObject extends BasePage {
   /*****************************************/

apps/E2E/src/Theme/pages/ThemePageObject.win.ts

@@ -1,5 +1,5 @@
-import { THEME_TESTPAGE, THEME_TEST_COMPONENT, HOMEPAGE_THEME_BUTTON } from '../consts';
 import { BasePage } from '../../common/BasePage';
+import { THEME_TESTPAGE, THEME_TEST_COMPONENT, HOMEPAGE_THEME_BUTTON } from '../consts';
 
 class ThemePageObject extends BasePage {
   /*****************************************/

apps/E2E/src/common/NativeTesting/specs/NativeTesting.spec.win.ts

@@ -1,5 +1,5 @@
-import NativeTestingPageObject from '../pages/NativeTestingPageObject.win';
 import { PAGE_TIMEOUT } from '../../../common/consts';
+import NativeTestingPageObject from '../pages/NativeTestingPageObject.win';
 
 describe('Native Safety Check Testing Initialization', () => {
   it('Wait for app load', async () => {

apps/fluent-tester/src/FluentTester.tsx

@@ -1,16 +1,18 @@
-import type { Theme } from '@fluentui-react-native/framework';
-import { Separator, TextV1 as Text } from '@fluentui/react-native';
-import { ButtonV1 as Button } from '@fluentui-react-native/button';
-import { themedStyleSheet } from '@fluentui-react-native/themed-stylesheet';
 import * as React from 'react';
 import { ScrollView, View, Text as RNText, Platform, SafeAreaView, BackHandler, I18nManager } from 'react-native';
-import { BASE_TESTPAGE, TESTPAGE_BUTTONS_SCROLLVIEWER, TESTPAGE_CONTENT_SCROLLVIEWER } from '../../E2E/src/common/consts';
+
-import { fluentTesterStyles, mobileStyles } from './TestComponents/Common/styles';
+import { Separator, TextV1 as Text } from '@fluentui/react-native';
+import { ButtonV1 as Button } from '@fluentui-react-native/button';
+import type { Theme } from '@fluentui-react-native/framework';
 import { useTheme } from '@fluentui-react-native/theme-types';
-import { ThemePickers } from './theme/ThemePickers';
+import { themedStyleSheet } from '@fluentui-react-native/themed-stylesheet';
-import { tests } from './testPages';
+
-import { ROOT_VIEW } from '../../E2E/src/common/consts';
+import { fluentTesterStyles, mobileStyles } from './TestComponents/Common/styles';
 import { testProps } from './TestComponents/Common/TestProps';
+import { tests } from './testPages';
+import { ThemePickers } from './theme/ThemePickers';
+import { BASE_TESTPAGE, TESTPAGE_BUTTONS_SCROLLVIEWER, TESTPAGE_CONTENT_SCROLLVIEWER } from '../../E2E/src/common/consts';
+import { ROOT_VIEW } from '../../E2E/src/common/consts';
 
 // uncomment the below lines to enable message spy
 /**

apps/fluent-tester/src/FluentTesterApp.tsx

@@ -1,12 +1,14 @@
 'use strict';
 
-import { ThemeProvider } from '@fluentui-react-native/theme';
 import * as React from 'react';
 import { Platform } from 'react-native';
+
+import { useHorizontalSizeClass } from '@fluentui-react-native/experimental-appearance-additions';
+import { ThemeProvider } from '@fluentui-react-native/theme';
+
 import type { FluentTesterProps } from './FluentTester';
 import { FluentTester } from './FluentTester';
 import { testerTheme } from './theme/index';
-import { useHorizontalSizeClass } from '@fluentui-react-native/experimental-appearance-additions';
 
 export const FluentTesterApp: React.FunctionComponent<FluentTesterProps> = (props) => {
   const sizeClass = useHorizontalSizeClass();

apps/fluent-tester/src/TestComponents/ActivityIndicator/ActivityIndicatorTest.tsx

@@ -1,12 +1,14 @@
 import * as React from 'react';
-import { ActivityIndicator } from '@fluentui-react-native/experimental-activity-indicator';
+import { View, Switch } from 'react-native';
+
 import { Text } from '@fluentui/react-native';
+import { ActivityIndicator } from '@fluentui-react-native/experimental-activity-indicator';
 import { Stack } from '@fluentui-react-native/stack';
+
+import { ACTIVITY_INDICATOR_TESTPAGE } from '../../../../E2E/src/ActivityIndicator/consts';
 import { stackStyle, commonTestStyles as commonStyles } from '../Common/styles';
 import type { TestSection, PlatformStatus } from '../Test';
 import { Test } from '../Test';
-import { ACTIVITY_INDICATOR_TESTPAGE } from '../../../../E2E/src/ActivityIndicator/consts';
-import { View, Switch } from 'react-native';
 
 const BasicActivityIndicator: React.FunctionComponent = () => {
   const [animating, setAnimating] = React.useState(true);

apps/fluent-tester/src/TestComponents/Avatar/AvatarTest.tsx

@@ -1,11 +1,12 @@
 import * as React from 'react';
-import { AVATAR_TESTPAGE } from '../../../../E2E/src/Avatar/consts';
+import { Platform } from 'react-native';
-import type { TestSection, PlatformStatus } from '../Test';
+
-import { Test } from '../Test';
 import { StandardUsage } from './BasicAvatar';
 import { CustomizeUsage } from './CustomizedAvatar';
 import { E2EAvatarTest } from './E2EAvatarTest';
-import { Platform } from 'react-native';
+import { AVATAR_TESTPAGE } from '../../../../E2E/src/Avatar/consts';
+import type { TestSection, PlatformStatus } from '../Test';
+import { Test } from '../Test';
 
 const avatarSections: TestSection[] = [
   {

apps/fluent-tester/src/TestComponents/Avatar/BasicAvatar.android.tsx

@@ -1,11 +1,13 @@
 import type { FunctionComponent } from 'react';
 import React from 'react';
-import { Avatar } from '@fluentui-react-native/avatar';
 import { View } from 'react-native';
+
+import { Avatar } from '@fluentui-react-native/avatar';
+import type { InteractionEvent } from '@fluentui-react-native/interactive-hooks';
+import { Switch } from '@fluentui-react-native/switch';
+
 import { steveBallmerPhotoUrl } from './../PersonaCoin/styles';
 import { mobileStyles } from '../Common/styles';
-import { Switch } from '@fluentui-react-native/switch';
-import type { InteractionEvent } from '@fluentui-react-native/interactive-hooks';
 
 export const StandardUsage: FunctionComponent = () => {
   const [activityRing, setActivityRing] = React.useState(true);

apps/fluent-tester/src/TestComponents/Avatar/BasicAvatar.tsx

@@ -1,15 +1,17 @@
-import type { FunctionComponent } from 'react';
 import React, { useState, useCallback } from 'react';
+import type { FunctionComponent } from 'react';
+import { View, Text, Platform } from 'react-native';
+
+import { ToggleButton } from '@fluentui/react-native';
 import type { AvatarSize, AvatarColor, AvatarActive } from '@fluentui-react-native/avatar';
 import { AvatarSizes, AvatarColors, Avatar } from '@fluentui-react-native/avatar';
 import type { PresenceBadgeStatus } from '@fluentui-react-native/badge';
 import { PresenceBadgeStatuses } from '@fluentui-react-native/badge';
-import { View, Text, Platform } from 'react-native';
+
 import { satyaPhotoUrl, undefinedText } from './../PersonaCoin/styles';
-import { commonTestStyles as commonStyles } from '../Common/styles';
 import { svgProps } from '../Common/iconExamples';
 import { StyledPicker } from '../Common/StyledPicker';
-import { ToggleButton } from '@fluentui/react-native';
+import { commonTestStyles as commonStyles } from '../Common/styles';
 
 type WithUndefined<T> = T | typeof undefinedText;
 

apps/fluent-tester/src/TestComponents/Avatar/CustomizedAvatar.tsx

@@ -1,12 +1,14 @@
 import React, { useState, useMemo } from 'react';
+import { View, Text, TextInput, Platform, StyleSheet } from 'react-native';
+
+import { ToggleButton } from '@fluentui/react-native';
 import type { AvatarSize } from '@fluentui-react-native/avatar';
 import { Avatar } from '@fluentui-react-native/avatar';
-import { View, Text, TextInput, Platform, StyleSheet } from 'react-native';
-import { steveBallmerPhotoUrl } from './../PersonaCoin/styles';
-import { commonTestStyles as commonStyles } from '../Common/styles';
 import type { FontWeight } from '@fluentui-react-native/theme-types';
+
+import { steveBallmerPhotoUrl } from './../PersonaCoin/styles';
 import { svgProps } from '../Common/iconExamples';
-import { ToggleButton } from '@fluentui/react-native';
+import { commonTestStyles as commonStyles } from '../Common/styles';
 
 const styles = StyleSheet.create({
   avatarTestCaseContainer: { marginLeft: 20 },

apps/fluent-tester/src/TestComponents/Avatar/E2EAvatarTest.tsx

@@ -1,7 +1,8 @@
-import { Avatar } from '@fluentui-react-native/avatar';
 import * as React from 'react';
 import { View } from 'react-native';
-import { testProps } from '../Common/TestProps';
+
+import { Avatar } from '@fluentui-react-native/avatar';
+
 import {
   AVATAR_ACCESSIBILITY_LABEL,
   AVATAR_ACCESSIBILITY_HINT,
@@ -9,6 +10,7 @@ import {
   AVATAR_TEST_COMPONENT,
   AVATAR_SECONDARY_TEST_COMPONENT,
 } from '../../../../E2E/src/Avatar/consts';
+import { testProps } from '../Common/TestProps';
 
 export const E2EAvatarTest: React.FunctionComponent = () => {
   return (

apps/fluent-tester/src/TestComponents/Avatar/NativeAvatarTest.tsx

@@ -1,14 +1,16 @@
 import * as React from 'react';
+import { Switch, View } from 'react-native';
+
+import { Text } from '@fluentui/react-native';
 import type { Size } from '@fluentui-react-native/experimental-avatar/';
 import { NativeAvatar } from '@fluentui-react-native/experimental-avatar/';
-import { Text } from '@fluentui/react-native';
 import { Stack } from '@fluentui-react-native/stack';
+
+import { testImageSource, rainbowGradientSource } from './testImageSources';
 import { NATIVE_AVATAR_TESTPAGE } from '../../../../E2E/src/Avatar/consts';
+import { commonTestStyles as commonStyles } from '../Common/styles';
 import type { TestSection, PlatformStatus } from '../Test';
 import { Test } from '../Test';
-import { testImageSource, rainbowGradientSource } from './testImageSources';
-import { commonTestStyles as commonStyles } from '../Common/styles';
-import { Switch, View } from 'react-native';
 
 export const BasicAvatar: React.FunctionComponent = () => {
   const [showImage, setShowImage] = React.useState(true);

apps/fluent-tester/src/TestComponents/Badge/BadgeTest.tsx

@@ -1,11 +1,12 @@
 import * as React from 'react';
+
+import { BasicBadge } from './BasicBadgeTest';
+import { CounterBadgeTest } from './CounterBadgeTest';
+import { E2EBadgeTest } from './E2EBadgeTest';
+import { PresenceBadgeTest } from './PresenceBadgeTest';
 import { BADGE_TESTPAGE } from '../../../../E2E/src/Badge/consts';
 import type { TestSection, PlatformStatus } from '../Test';
 import { Test } from '../Test';
-import { BasicBadge } from './BasicBadgeTest';
-import { CounterBadgeTest } from './CounterBadgeTest';
-import { PresenceBadgeTest } from './PresenceBadgeTest';
-import { E2EBadgeTest } from './E2EBadgeTest';
 
 const badgeSections: TestSection[] = [
   {

apps/fluent-tester/src/TestComponents/Badge/BasicBadgeTest.tsx

@@ -1,6 +1,8 @@
 /* eslint-disable @typescript-eslint/no-var-requires */
 import React, { useState, useCallback, useMemo } from 'react';
 import { View, Platform, Text, Image } from 'react-native';
+
+import { ToggleButton } from '@fluentui/react-native';
 import type {
   BadgeAppearance,
   BadgeColor,
@@ -11,11 +13,11 @@ import type {
   BadgeTokens,
 } from '@fluentui-react-native/badge';
 import { Badge, BadgeAppearances, BadgeColors, BadgeShapes, BadgeSizes } from '@fluentui-react-native/badge';
-import { StyledPicker } from '../Common/StyledPicker';
-import { satyaPhotoUrl } from './../PersonaCoin/styles';
-import { ToggleButton } from '@fluentui/react-native';
 import { useFluentTheme } from '@fluentui-react-native/framework';
+
+import { satyaPhotoUrl } from './../PersonaCoin/styles';
 import { svgProps, iconProps } from '../Common/iconExamples';
+import { StyledPicker } from '../Common/StyledPicker';
 
 const badgeColors: BadgeColor[] = [...BadgeColors];
 const badgeShapes: BadgeShape[] = [...BadgeShapes];

apps/fluent-tester/src/TestComponents/Badge/CounterBadgeTest.tsx

@@ -1,7 +1,9 @@
 /* eslint-disable @typescript-eslint/no-var-requires */
 import React from 'react';
 import { View, Platform, Text } from 'react-native';
+
 import { CounterBadge } from '@fluentui-react-native/badge';
+
 import { iconProps } from '../Common/iconExamples';
 
 export const CounterBadgeTest: React.FunctionComponent = () => {

apps/fluent-tester/src/TestComponents/Badge/E2EBadgeTest.tsx

@@ -1,8 +1,10 @@
-import { Badge, PresenceBadge } from '@fluentui-react-native/badge';
 import * as React from 'react';
 import { View } from 'react-native';
-import { testProps } from '../Common/TestProps';
+
+import { Badge, PresenceBadge } from '@fluentui-react-native/badge';
+
 import { BADGE_TEST_COMPONENT, BADGE_SECONDARY_TEST_COMPONENT } from '../../../../E2E/src/Badge/consts';
+import { testProps } from '../Common/TestProps';
 
 export const E2EBadgeTest: React.FunctionComponent = () => {
   return (

apps/fluent-tester/src/TestComponents/Badge/PresenceBadgeTest.tsx

@@ -1,10 +1,12 @@
 /* eslint-disable @typescript-eslint/no-var-requires */
 import React, { useState, useCallback } from 'react';
 import { View, Platform, Text } from 'react-native';
+
+import { ToggleButton } from '@fluentui/react-native';
 import type { BadgeSize } from '@fluentui-react-native/badge';
 import { PresenceBadge, BadgeSizes } from '@fluentui-react-native/badge';
+
 import { StyledPicker } from '../Common/StyledPicker';
-import { ToggleButton } from '@fluentui/react-native';
 
 const badgeSizes: BadgeSize[] = [...BadgeSizes];
 export const PresenceBadgeTest: React.FunctionComponent = () => {

apps/fluent-tester/src/TestComponents/Button/ButtonHOCTestSection.tsx

@@ -1,11 +1,13 @@
-import { ButtonV1 as Button } from '@fluentui/react-native';
-import { TextV1 as Text } from '@fluentui-react-native/text';
 import * as React from 'react';
 import { Platform, View } from 'react-native';
-import { commonTestStyles, stackStyle } from '../Common/styles';
+
+import { ButtonV1 as Button } from '@fluentui/react-native';
 import type { InteractionEvent } from '@fluentui-react-native/interactive-hooks';
 import { isGestureResponderEvent } from '@fluentui-react-native/interactive-hooks';
+import { TextV1 as Text } from '@fluentui-react-native/text';
+
 import { svgProps } from '../Common/iconExamples';
+import { commonTestStyles, stackStyle } from '../Common/styles';
 
 const CustomText = Text.customize({ fontSize: 'header', color: 'hotpink' });
 const CustomButton = Button.customize({ backgroundColor: 'pink' });

apps/fluent-tester/src/TestComponents/Button/ButtonIconTestSection.android.tsx

@@ -1,8 +1,10 @@
-import { ButtonV1 as Button } from '@fluentui/react-native';
 import * as React from 'react';
 import { View } from 'react-native';
-import { commonTestStyles, testContentRootViewStyle } from '../Common/styles';
+
+import { ButtonV1 as Button } from '@fluentui/react-native';
+
 import { svgProps } from '../Common/iconExamples';
+import { commonTestStyles, testContentRootViewStyle } from '../Common/styles';
 
 export const ButtonIconTest: React.FunctionComponent = () => {
   const fontBuiltInProps = {

apps/fluent-tester/src/TestComponents/Button/ButtonIconTestSection.tsx

@@ -1,10 +1,12 @@
-import { ButtonV1 as Button } from '@fluentui/react-native';
 import * as React from 'react';
 import { Platform, View, StyleSheet } from 'react-native';
-import { commonTestStyles, testContentRootViewStyle } from '../Common/styles';
+
-import { testImage, svgProps, iconProps } from '../Common/iconExamples';
+import { ButtonV1 as Button } from '@fluentui/react-native';
 import { SvgXml } from 'react-native-svg';
 
+import { testImage, svgProps, iconProps } from '../Common/iconExamples';
+import { commonTestStyles, testContentRootViewStyle } from '../Common/styles';
+
 const styles = StyleSheet.create({
   chevron: { paddingStart: 4 },
 });

apps/fluent-tester/src/TestComponents/Button/ButtonShapeTestSection.tsx

@@ -1,6 +1,8 @@
-import { ButtonV1 as Button, CompoundButton } from '@fluentui/react-native';
 import * as React from 'react';
 import { View } from 'react-native';
+
+import { ButtonV1 as Button, CompoundButton } from '@fluentui/react-native';
+
 import { commonTestStyles, testContentRootViewStyle } from '../Common/styles';
 
 export const ButtonShapeTest: React.FunctionComponent = () => {

apps/fluent-tester/src/TestComponents/Button/ButtonSizeTestSection.tsx

@@ -1,8 +1,10 @@
-import { ButtonV1 as Button, CompoundButton, FAB } from '@fluentui/react-native';
 import * as React from 'react';
 import { Platform, View } from 'react-native';
-import { commonTestStyles, testContentRootViewStyle } from '../Common/styles';
+
+import { ButtonV1 as Button, CompoundButton, FAB } from '@fluentui/react-native';
+
 import { iconProps } from '../Common/iconExamples';
+import { commonTestStyles, testContentRootViewStyle } from '../Common/styles';
 
 const isMobile = Platform.OS === 'android' || Platform.OS === 'ios';
 

apps/fluent-tester/src/TestComponents/Button/ButtonTest.tsx

@@ -1,18 +1,19 @@
 import * as React from 'react';
+import { Platform } from 'react-native';
+
+import { ButtonShapeTest } from './ButtonShapeTestSection';
+import { ButtonSizeTest } from './ButtonSizeTestSection';
+import { ButtonVariantTest } from './ButtonVariantTestSection';
 import { ButtonFocusTest_deprecated } from './deprecated/ButtonFocusTest';
 import { ButtonIconTest_deprecated } from './deprecated/ButtonIconTest';
-import { BUTTON_TESTPAGE } from '../../../../E2E/src/ButtonLegacy/consts';
 import { E2EButtonTest_deprecated } from './deprecated/E2EButtonTest';
+import { E2EButtonTest } from './E2EButtonTest';
+import { ToggleButtonTest } from './ToggleButtonTestSection';
+import { BUTTON_TESTPAGE } from '../../../../E2E/src/ButtonLegacy/consts';
+import { ButtonHOCTest } from '../Button/ButtonHOCTestSection';
+import { ButtonIconTest } from '../Button/ButtonIconTestSection';
 import type { TestSection, PlatformStatus } from '../Test';
 import { Test } from '../Test';
-import { ButtonVariantTest } from './ButtonVariantTestSection';
-import { ToggleButtonTest } from './ToggleButtonTestSection';
-import { ButtonIconTest } from '../Button/ButtonIconTestSection';
-import { ButtonSizeTest } from './ButtonSizeTestSection';
-import { ButtonShapeTest } from './ButtonShapeTestSection';
-import { E2EButtonTest } from './E2EButtonTest';
-import { ButtonHOCTest } from '../Button/ButtonHOCTestSection';
-import { Platform } from 'react-native';
 
 const buttonSections: TestSection[] = [
   {

apps/fluent-tester/src/TestComponents/Button/ButtonVariantTestSection.mobile.tsx

@@ -1,8 +1,10 @@
-import { Button, FAB } from '@fluentui-react-native/experimental-button';
 import * as React from 'react';
 import { View } from 'react-native';
-import { commonTestStyles, testContentRootViewStyle } from '../Common/styles';
+
+import { Button, FAB } from '@fluentui-react-native/experimental-button';
+
 import { iconProps } from '../Common/iconExamples';
+import { commonTestStyles, testContentRootViewStyle } from '../Common/styles';
 
 export const ButtonVariantTest: React.FunctionComponent = () => {
   const [showFABText, setShowFABText] = React.useState(true);

apps/fluent-tester/src/TestComponents/Button/ButtonVariantTestSection.tsx

@@ -1,6 +1,8 @@
-import { Button, CompoundButton, FAB } from '@fluentui-react-native/experimental-button';
 import * as React from 'react';
 import { View } from 'react-native';
+
+import { Button, CompoundButton, FAB } from '@fluentui-react-native/experimental-button';
+
 import { iconProps } from '../Common/iconExamples';
 import { commonTestStyles, testContentRootViewStyle } from '../Common/styles';
 

apps/fluent-tester/src/TestComponents/Button/E2EButtonTest.tsx

@@ -1,10 +1,12 @@
 /* eslint-disable @typescript-eslint/no-var-requires */
+import * as React from 'react';
+import { View } from 'react-native';
+
 import { Text } from '@fluentui/react-native';
 import { ButtonV1 as Button } from '@fluentui/react-native';
 import { Stack } from '@fluentui-react-native/stack';
-import * as React from 'react';
+import type { IViewWin32Props } from '@office-iss/react-native-win32';
-import { View } from 'react-native';
+
-import { stackStyle } from '../Common/styles';
 import {
   BUTTON_TEST_COMPONENT,
   BUTTON_ON_PRESS,
@@ -17,7 +19,7 @@ import {
   BUTTON_FOCUSABLE_TEST_COMPONENT,
   BUTTON_FOCUSABLE_TEST_COMPONENT_LABEL,
 } from '../../../../E2E/src/ButtonLegacy/consts';
-import type { IViewWin32Props } from '@office-iss/react-native-win32';
+import { stackStyle } from '../Common/styles';
 import { testProps } from '../Common/TestProps';
 
 export const E2EButtonTest: React.FunctionComponent = () => {

apps/fluent-tester/src/TestComponents/Button/ToggleButtonTestSection.tsx

@@ -1,7 +1,9 @@
-import { ToggleButton } from '@fluentui/react-native';
-import { Checkbox } from '@fluentui/react-native';
 import * as React from 'react';
 import { StyleSheet, View } from 'react-native';
+
+import { ToggleButton } from '@fluentui/react-native';
+import { Checkbox } from '@fluentui/react-native';
+
 import { commonTestStyles, testContentRootViewStyle } from '../Common/styles';
 
 const styles = StyleSheet.create({

apps/fluent-tester/src/TestComponents/Button/deprecated/ButtonFocusTest.tsx

@@ -1,7 +1,9 @@
+import * as React from 'react';
+
 import { Button } from '@fluentui/react-native';
 import type { IFocusable } from '@fluentui-react-native/interactive-hooks';
 import { Stack } from '@fluentui-react-native/stack';
-import * as React from 'react';
+
 import { stackStyle } from '../../Common/styles';
 
 export const ButtonFocusTest_deprecated: React.FunctionComponent = () => {

apps/fluent-tester/src/TestComponents/Button/deprecated/ButtonIconTest.tsx

@@ -1,10 +1,12 @@
 /* eslint-disable @typescript-eslint/no-var-requires */
-import { Button, Text } from '@fluentui/react-native';
-import { Stack } from '@fluentui-react-native/stack';
 import * as React from 'react';
 import { Platform, View } from 'react-native';
-import { stackStyle } from '../../Common/styles';
+
+import { Button, Text } from '@fluentui/react-native';
+import { Stack } from '@fluentui-react-native/stack';
+
 import { testImage, svgProps } from '../../Common/iconExamples';
+import { stackStyle } from '../../Common/styles';
 
 const CustomizedIconButton = Button.customize({
   tokens: { iconColor: 'red' },

apps/fluent-tester/src/TestComponents/Button/deprecated/E2EButtonTest.tsx

@@ -1,9 +1,10 @@
 /* eslint-disable @typescript-eslint/no-var-requires */
-import { Button, Text } from '@fluentui/react-native';
-import { Stack } from '@fluentui-react-native/stack';
 import * as React from 'react';
 import { View } from 'react-native';
-import { stackStyle } from '../../Common/styles';
+
+import { Button, Text } from '@fluentui/react-native';
+import { Stack } from '@fluentui-react-native/stack';
+
 import {
   BUTTON_TEST_COMPONENT_DEPRECATED,
   BUTTON_ON_PRESS_DEPRECATED,
@@ -11,6 +12,7 @@ import {
   BUTTON_ACCESSIBILITY_LABEL_DEPRECATED,
   BUTTON_TEST_COMPONENT_LABEL_DEPRECATED,
 } from '../../../../../E2E/src/ButtonLegacy/consts';
+import { stackStyle } from '../../Common/styles';
 import { testProps } from '../../Common/TestProps';
 
 export const E2EButtonTest_deprecated: React.FunctionComponent = () => {

apps/fluent-tester/src/TestComponents/Callout/CalloutE2ETest.tsx

@@ -1,9 +1,11 @@
 import * as React from 'react';
 import type { ScreenRect } from 'react-native';
 import { View } from 'react-native';
+
 import type { DismissBehaviors } from '@fluentui/react-native';
 import { ButtonV1 as Button, Callout, Text } from '@fluentui/react-native';
 import { Switch } from '@fluentui-react-native/switch';
+
 import { BUTTON_TO_OPEN_CALLOUT, CALLOUT_ACCESSIBILITY_LABEL, CALLOUT_TEST_COMPONENT } from '../../../../E2E/src/Callout/consts';
 import { testProps } from '../Common/TestProps';
 

apps/fluent-tester/src/TestComponents/Callout/CalloutTest.tsx

@@ -1,14 +1,16 @@
 import * as React from 'react';
 import type { ScreenRect } from 'react-native';
 import { Text, View, Switch, ScrollView } from 'react-native';
-import type { IFocusable, RestoreFocusEvent, DismissBehaviors } from '@fluentui/react-native';
+
 import { Button, Callout, Separator, Pressable, StealthButton } from '@fluentui/react-native';
+import type { IFocusable, RestoreFocusEvent, DismissBehaviors } from '@fluentui/react-native';
+
+import { E2ECalloutTest } from './CalloutE2ETest';
 import { CALLOUT_TESTPAGE } from '../../../../E2E/src/Callout/consts';
+import { MenuPicker } from '../Common/MenuPicker';
+import { fluentTesterStyles } from '../Common/styles';
 import type { TestSection, PlatformStatus } from '../Test';
 import { Test } from '../Test';
-import { E2ECalloutTest } from './CalloutE2ETest';
-import { fluentTesterStyles } from '../Common/styles';
-import { MenuPicker } from '../Common/MenuPicker';
 
 const StandardCallout: React.FunctionComponent = () => {
   const [showStandardCallout, setShowStandardCallout] = React.useState(false);

apps/fluent-tester/src/TestComponents/CheckboxLegacy/CheckboxLegacyE2ETest.tsx

@@ -1,7 +1,9 @@
-import { Checkbox, Text } from '@fluentui/react-native';
 import * as React from 'react';
 import { View } from 'react-native';
-import { stackStyle } from '../Common/styles';
+
+import { Checkbox, Text } from '@fluentui/react-native';
+import { Stack } from '@fluentui-react-native/stack';
+
 import {
   CHECKBOX_TEST_COMPONENT,
   CHECKBOX_ON_PRESS,
@@ -9,7 +11,7 @@ import {
   CHECKBOX_TEST_COMPONENT_LABEL,
   CHECKBOX_ACCESSIBILITY_LABEL,
 } from '../../../../E2E/src/CheckboxLegacy/consts';
-import { Stack } from '@fluentui-react-native/stack';
+import { stackStyle } from '../Common/styles';
 import { testProps } from '../Common/TestProps';
 
 export const CheckboxLegacyE2ETest: React.FunctionComponent = () => {

apps/fluent-tester/src/TestComponents/CheckboxLegacy/CheckboxLegacyTest.tsx

@@ -1,14 +1,16 @@
+import * as React from 'react';
+import { View, TextInput } from 'react-native';
+
 import { Checkbox } from '@fluentui/react-native';
 import type { Theme } from '@fluentui-react-native/theme-types';
 import { useTheme } from '@fluentui-react-native/theme-types';
-import * as React from 'react';
+import { themedStyleSheet } from '@fluentui-react-native/themed-stylesheet';
-import { View, TextInput } from 'react-native';
+
-import { commonTestStyles as commonStyles } from '../Common/styles';
-import { CHECKBOX_TESTPAGE } from '../../../../E2E/src/CheckboxLegacy/consts';
 import { CheckboxLegacyE2ETest } from './CheckboxLegacyE2ETest';
+import { CHECKBOX_TESTPAGE } from '../../../../E2E/src/CheckboxLegacy/consts';
+import { commonTestStyles as commonStyles } from '../Common/styles';
 import type { TestSection, PlatformStatus } from '../Test';
 import { Test } from '../Test';
-import { themedStyleSheet } from '@fluentui-react-native/themed-stylesheet';
 
 function onChangeUncontrolled(isChecked: boolean) {
   console.log(isChecked);

apps/fluent-tester/src/TestComponents/CheckboxV1/CheckboxV1Test.tsx

@@ -1,16 +1,18 @@
 import * as React from 'react';
-import { CHECKBOXV1_TESTPAGE } from '../../../../E2E/src/CheckboxV1/consts';
+import { View, TextInput, Platform } from 'react-native';
-import type { TestSection, PlatformStatus } from '../Test';
+
-import { Test } from '../Test';
+import { ButtonV1 as Button } from '@fluentui-react-native/button';
 import { Checkbox } from '@fluentui-react-native/experimental-checkbox';
+import type { InteractionEvent } from '@fluentui-react-native/interactive-hooks';
 import type { Theme } from '@fluentui-react-native/theme-types';
 import { useTheme } from '@fluentui-react-native/theme-types';
-import { View, TextInput, Platform } from 'react-native';
-import { commonTestStyles as commonStyles, mobileStyles } from '../Common/styles';
-import { E2ECheckboxV1Test } from './E2ECheckboxV1Test';
-import type { InteractionEvent } from '@fluentui-react-native/interactive-hooks';
 import { themedStyleSheet } from '@fluentui-react-native/themed-stylesheet';
-import { ButtonV1 as Button } from '@fluentui-react-native/button';
+
+import { E2ECheckboxV1Test } from './E2ECheckboxV1Test';
+import { CHECKBOXV1_TESTPAGE } from '../../../../E2E/src/CheckboxV1/consts';
+import { commonTestStyles as commonStyles, mobileStyles } from '../Common/styles';
+import type { TestSection, PlatformStatus } from '../Test';
+import { Test } from '../Test';
 
 function onChangeUncontrolled(_e: InteractionEvent, isChecked: boolean) {
   console.log(isChecked);

apps/fluent-tester/src/TestComponents/CheckboxV1/E2ECheckboxV1Test.tsx

@@ -1,7 +1,10 @@
-import { Checkbox } from '@fluentui-react-native/experimental-checkbox';
 import * as React from 'react';
 import { View } from 'react-native';
-import { stackStyle } from '../Common/styles';
+
+import { Text } from '@fluentui/react-native';
+import { Checkbox } from '@fluentui-react-native/experimental-checkbox';
+import { Stack } from '@fluentui-react-native/stack';
+
 import {
   CHECKBOXV1_TEST_COMPONENT,
   CHECKBOXV1_ACCESSIBILITY_LABEL,
@@ -9,8 +12,7 @@ import {
   CHECKBOXV1_TEST_COMPONENT_LABEL,
   CHECKBOXV1_ON_PRESS,
 } from '../../../../E2E/src/CheckboxV1/consts';
-import { Stack } from '@fluentui-react-native/stack';
+import { stackStyle } from '../Common/styles';
-import { Text } from '@fluentui/react-native';
 import { testProps } from '../Common/TestProps';
 
 export const E2ECheckboxV1Test: React.FunctionComponent = () => {

apps/fluent-tester/src/TestComponents/ColorTokens/ColorTokenTest.tsx

@@ -1,22 +1,24 @@
 import * as React from 'react';
 import type { ViewStyle, ColorValue } from 'react-native';
 import { View, StyleSheet, Platform } from 'react-native';
+
+import { Text, ToggleButton } from '@fluentui/react-native';
+import { createAliasTokens } from '@fluentui-react-native/default-theme';
+import type { SvgIconProps } from '@fluentui-react-native/icon';
+import { globalTokens } from '@fluentui-react-native/theme-tokens';
 import type { Theme } from '@fluentui-react-native/theme-types';
 import { useTheme } from '@fluentui-react-native/theme-types';
 import { themedStyleSheet } from '@fluentui-react-native/themed-stylesheet';
 import { getCurrentAppearance } from '@fluentui-react-native/theming-utils';
 import { createOfficeAliasTokens } from '@fluentui-react-native/win32-theme';
-import { createAliasTokens } from '@fluentui-react-native/default-theme';
-import { commonTestStyles } from '../Common/styles';
-import { Text, ToggleButton } from '@fluentui/react-native';
-import type { TestSection, PlatformStatus } from '../Test';
-import { Test } from '../Test';
-import { COLORTOKENS_TEST_COMPONENT, COLORTOKEN_TESTPAGE } from '../../../../E2E/src/ColorTokens/consts';
-import { testProps } from '../Common/TestProps';
-import { globalTokens } from '@fluentui-react-native/theme-tokens';
 import type { SvgProps } from 'react-native-svg';
 import Svg, { G, Path } from 'react-native-svg';
-import type { SvgIconProps } from '@fluentui-react-native/icon';
+
+import { COLORTOKENS_TEST_COMPONENT, COLORTOKEN_TESTPAGE } from '../../../../E2E/src/ColorTokens/consts';
+import { commonTestStyles } from '../Common/styles';
+import { testProps } from '../Common/TestProps';
+import type { TestSection, PlatformStatus } from '../Test';
+import { Test } from '../Test';
 
 const getThemedStyles = themedStyleSheet((theme: Theme) => {
   return {

apps/fluent-tester/src/TestComponents/Common/AlignmentPicker.tsx

@@ -1,8 +1,10 @@
 import * as React from 'react';
-import { undefinedText } from '../PersonaCoin/styles';
-import type { IconAlignment } from '@fluentui/react-native';
 import type { StyleProp, ViewStyle } from 'react-native';
+
+import type { IconAlignment } from '@fluentui/react-native';
+
 import { MenuPicker } from './MenuPicker';
+import { undefinedText } from '../PersonaCoin/styles';
 
 const alignmentValues: Array<typeof undefinedText | IconAlignment> = [undefinedText, 'start', 'center', 'end'];
 

apps/fluent-tester/src/TestComponents/Common/MenuPicker.desktop.tsx

@@ -1,11 +1,14 @@
 import * as React from 'react';
 import { View, StyleSheet } from 'react-native';
-import { Menu, MenuItem, MenuTrigger, MenuPopover, MenuList } from '@fluentui-react-native/menu';
+
-import type { MenuPickerProps, CollectionItem } from './MenuPicker.types';
-export { MenuPickerProps, CollectionItem };
 import { ButtonV1 as Button, Text } from '@fluentui/react-native';
+import { Menu, MenuItem, MenuTrigger, MenuPopover, MenuList } from '@fluentui-react-native/menu';
 import { SvgXml } from 'react-native-svg';
 
+import type { MenuPickerProps, CollectionItem } from './MenuPicker.types';
+
+export { MenuPickerProps, CollectionItem };
+
 const chevronXml = `
 <svg width="12" height="16" viewBox="0 0 11 6" color="#000">
   <path fill='currentColor' d='M0.646447 0.646447C0.841709 0.451184 1.15829 0.451184 1.35355 0.646447L5.5 4.79289L9.64645 0.646447C9.84171 0.451185 10.1583 0.451185 10.3536 0.646447C10.5488 0.841709 10.5488 1.15829 10.3536 1.35355L5.85355 5.85355C5.65829 6.04882 5.34171 6.04882 5.14645 5.85355L0.646447 1.35355C0.451184 1.15829 0.451184 0.841709 0.646447 0.646447Z' />

apps/fluent-tester/src/TestComponents/Common/MenuPicker.tsx

@@ -1,7 +1,9 @@
 import * as React from 'react';
+
 import { Picker } from '@react-native-picker/picker';
-import { testProps } from './TestProps';
+
 import type { CollectionItem, MenuPickerProps } from './MenuPicker.types';
+import { testProps } from './TestProps';
 export { CollectionItem, MenuPickerProps };
 
 /*

apps/fluent-tester/src/TestComponents/Common/MenuPicker.windows.tsx

@@ -1,6 +1,7 @@
 export * from './MenuPicker.desktop';
 import * as React from 'react';
 import { Button, Text, View, StyleSheet } from 'react-native';
+
 import type { MenuPickerProps, CollectionItem } from './MenuPicker.types';
 export { MenuPickerProps, CollectionItem };
 

apps/fluent-tester/src/TestComponents/Common/Slider.tsx

@@ -1,6 +1,7 @@
 import * as React from 'react';
 import type { ViewProps, StyleProp, ViewStyle } from 'react-native';
 import { StyleSheet, UIManager, Text, findNodeHandle, View } from 'react-native';
+
 import { Separator, Pressable } from '@fluentui/react-native';
 import type { IPressableState } from '@fluentui-react-native/interactive-hooks';
 

apps/fluent-tester/src/TestComponents/Common/StyledPicker.tsx

@@ -1,7 +1,9 @@
 import * as React from 'react';
-import { MenuPicker } from './MenuPicker';
 import type { ColorValue } from 'react-native';
+
 import { useTheme } from '@fluentui-react-native/theme-types';
+
+import { MenuPicker } from './MenuPicker';
 import { commonTestStyles as commonStyles } from './styles';
 
 export const StyledPicker = (props) => {

apps/fluent-tester/src/TestComponents/Common/iconExamples.tsx

@@ -1,5 +1,7 @@
 import { Platform } from 'react-native';
+
 import type { SvgIconProps, FontIconProps, IconProps } from '@fluentui-react-native/icon';
+
 import TestSvg from '../../../assets/test.svg';
 
 export const svgProps: SvgIconProps = {

apps/fluent-tester/src/TestComponents/Common/styles.ts

@@ -1,4 +1,5 @@
 import { StyleSheet } from 'react-native';
+
 import type { IStackProps } from '@fluentui-react-native/stack';
 
 export const commonTestStyles = StyleSheet.create({

apps/fluent-tester/src/TestComponents/ContextualMenu/ContextualMenuTest.tsx

@@ -1,6 +1,7 @@
 /* eslint-disable @typescript-eslint/no-var-requires */
 import * as React from 'react';
 import { Text, View, Switch } from 'react-native';
+
 import {
   Text as FURNText,
   ButtonV1 as Button,
@@ -11,11 +12,12 @@ import {
   Separator,
   Checkbox,
 } from '@fluentui/react-native';
+
+import { E2EContextualMenuTest } from './E2EContextualMenuTest';
 import { CONTEXTUALMENU_TESTPAGE } from '../../../../E2E/src/ContextualMenu/consts';
+import { svgProps, fontProps, testImage } from '../Common/iconExamples';
 import type { TestSection, PlatformStatus } from '../Test';
 import { Test } from '../Test';
-import { svgProps, fontProps, testImage } from '../Common/iconExamples';
-import { E2EContextualMenuTest } from './E2EContextualMenuTest';
 
 const ContextualMenuMainTest: React.FunctionComponent = () => {
   const stdBtnRef = React.useRef(null);

apps/fluent-tester/src/TestComponents/ContextualMenu/E2EContextualMenuTest.tsx

@@ -1,7 +1,9 @@
 /* eslint-disable @typescript-eslint/no-var-requires */
 import * as React from 'react';
 import { Text, View, Switch } from 'react-native';
+
 import { ButtonV1 as Button, ContextualMenu, ContextualMenuItem, Separator } from '@fluentui/react-native';
+
 import { CONTEXTUALMENUITEM_TEST_COMPONENT, CONTEXTUALMENU_TEST_COMPONENT } from '../../../../E2E/src/ContextualMenu/consts';
 import { testProps } from '../Common/TestProps';
 

apps/fluent-tester/src/TestComponents/CornerRadius/CornerRadiusTest.tsx

@@ -1,15 +1,17 @@
 import * as React from 'react';
-import { HOMEPAGE_CORNERRADIUS_TESTPAGE } from '../../../../E2E/src/CornerRadiusTokens/consts';
-import type { TestSection, PlatformStatus } from '../Test';
-import { Test } from '../Test';
 import { View } from 'react-native';
-import { Stack } from '@fluentui-react-native/stack';
+
-import { stackStyle } from '../Common/styles';
-import { globalTokens } from '@fluentui-react-native/theme-tokens';
 import { Text } from '@fluentui/react-native';
 import { useFluentTheme } from '@fluentui-react-native/framework';
+import { Stack } from '@fluentui-react-native/stack';
+import { globalTokens } from '@fluentui-react-native/theme-tokens';
 import { getCurrentAppearance } from '@fluentui-react-native/theming-utils';
 
+import { HOMEPAGE_CORNERRADIUS_TESTPAGE } from '../../../../E2E/src/CornerRadiusTokens/consts';
+import { stackStyle } from '../Common/styles';
+import type { TestSection, PlatformStatus } from '../Test';
+import { Test } from '../Test';
+
 interface CornerRadiusTestComponentProps {
   name: string;
   cornerRadius: number;

apps/fluent-tester/src/TestComponents/Divider/DividerTest.tsx

@@ -1,14 +1,16 @@
 import * as React from 'react';
 import { Platform, StyleSheet, View } from 'react-native';
+
 import { Divider } from '@fluentui-react-native/divider';
 import { Stack } from '@fluentui-react-native/stack';
 import { TextV1 as Text } from '@fluentui-react-native/text';
+
+import { CustomisedMobileDividers, MobileDividers } from './MobileDividerTest';
 import { DIVIDER_TESTPAGE } from '../../../../E2E/src/Divider/consts';
+import TestSvg from '../../../assets/test.svg';
+import { commonTestStyles } from '../Common/styles';
 import { Test } from '../Test';
 import type { TestSection, PlatformStatus } from '../Test';
-import { commonTestStyles } from '../Common/styles';
-import TestSvg from '../../../assets/test.svg';
-import { CustomisedMobileDividers, MobileDividers } from './MobileDividerTest';
 
 const isMobile = Platform.OS === 'android' || Platform.OS === 'ios';
 const PaddedDivider = Divider.customize({ paddingVertical: 4, thickness: 2 });

apps/fluent-tester/src/TestComponents/Divider/MobileDividerTest.tsx

@@ -1,11 +1,12 @@
 import * as React from 'react';
+import { StyleSheet, View } from 'react-native';
+
 import { Divider } from '@fluentui-react-native/divider';
 import { Stack } from '@fluentui-react-native/stack';
 import { TextV1 as Text } from '@fluentui-react-native/text';
+import { globalTokens } from '@fluentui-react-native/theme-tokens';
 
 import { commonTestStyles } from '../Common/styles';
-import { StyleSheet, View } from 'react-native';
-import { globalTokens } from '@fluentui-react-native/theme-tokens';
 
 const CustomizedText = Text.customize({
   textAlign: 'right',

apps/fluent-tester/src/TestComponents/Drawer/DrawerTest.tsx

@@ -1,15 +1,17 @@
 import * as React from 'react';
-import { stackStyle } from '../Common/styles';
 import { View, Text } from 'react-native';
+
 import { Link } from '@fluentui/react-native';
 import { Button } from '@fluentui-react-native/experimental-button';
 import { Drawer } from '@fluentui-react-native/experimental-drawer';
-import { Stack } from '@fluentui-react-native/stack';
 import { Icon } from '@fluentui-react-native/icon';
+import { Stack } from '@fluentui-react-native/stack';
+
 import { DRAWER_TESTPAGE } from './consts';
-import type { TestSection, PlatformStatus } from '../Test';
-import { Test } from '../Test';
 import { svgProps } from '../Common/iconExamples';
+import { stackStyle } from '../Common/styles';
+import { Test } from '../Test';
+import type { TestSection, PlatformStatus } from '../Test';
 
 const BasicDrawer: React.FunctionComponent = () => {
   const stdBtnRef = React.useRef(null);

apps/fluent-tester/src/TestComponents/Dropdown/DropdownTest.tsx

@@ -1,8 +1,10 @@
 import * as React from 'react';
+
 import { Option, Dropdown } from '@fluentui-react-native/dropdown';
 import { Stack } from '@fluentui-react-native/stack';
-import { stackStyle } from '../Common/styles';
+
 import { DROPDOWN_TESTPAGE } from './consts';
+import { stackStyle } from '../Common/styles';
 import type { TestSection, PlatformStatus } from '../Test';
 import { Test } from '../Test';
 

apps/fluent-tester/src/TestComponents/Expander/ExpanderTest.tsx

@@ -1,12 +1,14 @@
 import * as React from 'react';
-import { Expander } from '@fluentui-react-native/experimental-expander';
+import { View, Switch } from 'react-native';
+
 import { Text } from '@fluentui/react-native';
+import { Expander } from '@fluentui-react-native/experimental-expander';
 import { Stack } from '@fluentui-react-native/stack';
+
+import { EXPANDER_TESTPAGE } from './consts';
 import { stackStyle, commonTestStyles as commonStyles } from '../Common/styles';
 import type { TestSection, PlatformStatus } from '../Test';
 import { Test } from '../Test';
-import { EXPANDER_TESTPAGE } from './consts';
-import { View, Switch } from 'react-native';
 
 const CustomizedExpander = Expander.customize({
   headerBackground: '#9c9c9c',