diff --git a/packages/insomnia/package-lock.json b/packages/insomnia/package-lock.json index 4e8b093c6c..080f59e336 100644 --- a/packages/insomnia/package-lock.json +++ b/packages/insomnia/package-lock.json @@ -137,7 +137,7 @@ "react-dom": "^18.2.0", "react-hook-form": "^7.12.1", "react-redux": "^7.2.6", - "react-router-dom": "^6.3.0", + "react-router-dom": "^6.4.2", "react-stately": "^3.17.0", "react-tabs": "^3.2.3", "react-use": "^17.2.4", @@ -4810,6 +4810,15 @@ "react": "^16.8.0 || ^17.0.0-rc.1 || ^18.0.0" } }, + "node_modules/@remix-run/router": { + "version": "1.0.2", + "resolved": "https://registry.npmjs.org/@remix-run/router/-/router-1.0.2.tgz", + "integrity": "sha512-GRSOFhJzjGN+d4sKHTMSvNeUPoZiDHWmRnXfzaxrqe7dE/Nzlc8BiMSJdLDESZlndM7jIUrZ/F4yWqVYlI0rwQ==", + "dev": true, + "engines": { + "node": ">=14" + } + }, "node_modules/@repeaterjs/repeater": { "version": "3.0.4", "resolved": "https://registry.npmjs.org/@repeaterjs/repeater/-/repeater-3.0.4.tgz", @@ -12689,15 +12698,6 @@ "node": ">=12.0.0" } }, - "node_modules/history": { - "version": "5.3.0", - "resolved": "https://registry.npmjs.org/history/-/history-5.3.0.tgz", - "integrity": "sha512-ZqaKwjjrAYUYfLG+htGaIIZ4nioX2L70ZUMIFysS3xvBsSG4x/n1V6TXV3N8ZYNuFGlDirFg32T7B6WOUPDYcQ==", - "dev": true, - "dependencies": { - "@babel/runtime": "^7.7.6" - } - }, "node_modules/hkdf": { "version": "0.0.2", "resolved": "https://registry.npmjs.org/hkdf/-/hkdf-0.0.2.tgz", @@ -19094,25 +19094,31 @@ } }, "node_modules/react-router": { - "version": "6.3.0", - "resolved": "https://registry.npmjs.org/react-router/-/react-router-6.3.0.tgz", - "integrity": "sha512-7Wh1DzVQ+tlFjkeo+ujvjSqSJmkt1+8JO+T5xklPlgrh70y7ogx75ODRW0ThWhY7S+6yEDks8TYrtQe/aoboBQ==", + "version": "6.4.2", + "resolved": "https://registry.npmjs.org/react-router/-/react-router-6.4.2.tgz", + "integrity": "sha512-Rb0BAX9KHhVzT1OKhMvCDMw776aTYM0DtkxqUBP8dNBom3mPXlfNs76JNGK8wKJ1IZEY1+WGj+cvZxHVk/GiKw==", "dev": true, "dependencies": { - "history": "^5.2.0" + "@remix-run/router": "1.0.2" + }, + "engines": { + "node": ">=14" }, "peerDependencies": { "react": ">=16.8" } }, "node_modules/react-router-dom": { - "version": "6.3.0", - "resolved": "https://registry.npmjs.org/react-router-dom/-/react-router-dom-6.3.0.tgz", - "integrity": "sha512-uaJj7LKytRxZNQV8+RbzJWnJ8K2nPsOOEuX7aQstlMZKQT0164C+X2w6bnkqU3sjtLvpd5ojrezAyfZ1+0sStw==", + "version": "6.4.2", + "resolved": "https://registry.npmjs.org/react-router-dom/-/react-router-dom-6.4.2.tgz", + "integrity": "sha512-yM1kjoTkpfjgczPrcyWrp+OuQMyB1WleICiiGfstnQYo/S8hPEEnVjr/RdmlH6yKK4Tnj1UGXFSa7uwAtmDoLQ==", "dev": true, "dependencies": { - "history": "^5.2.0", - "react-router": "6.3.0" + "@remix-run/router": "1.0.2", + "react-router": "6.4.2" + }, + "engines": { + "node": ">=14" }, "peerDependencies": { "react": ">=16.8", @@ -26028,6 +26034,12 @@ "@react-types/shared": "^3.14.1" } }, + "@remix-run/router": { + "version": "1.0.2", + "resolved": "https://registry.npmjs.org/@remix-run/router/-/router-1.0.2.tgz", + "integrity": "sha512-GRSOFhJzjGN+d4sKHTMSvNeUPoZiDHWmRnXfzaxrqe7dE/Nzlc8BiMSJdLDESZlndM7jIUrZ/F4yWqVYlI0rwQ==", + "dev": true + }, "@repeaterjs/repeater": { "version": "3.0.4", "resolved": "https://registry.npmjs.org/@repeaterjs/repeater/-/repeater-3.0.4.tgz", @@ -32251,15 +32263,6 @@ "integrity": "sha512-LKzHqnxr4CrD2YsNoIf/o5nJ09j4yi/GcH5BnYz9UnVpZdS4ucMgvP61TDty5xJcFGRjnH4DpujkS9bHT3hq0Q==", "dev": true }, - "history": { - "version": "5.3.0", - "resolved": "https://registry.npmjs.org/history/-/history-5.3.0.tgz", - "integrity": "sha512-ZqaKwjjrAYUYfLG+htGaIIZ4nioX2L70ZUMIFysS3xvBsSG4x/n1V6TXV3N8ZYNuFGlDirFg32T7B6WOUPDYcQ==", - "dev": true, - "requires": { - "@babel/runtime": "^7.7.6" - } - }, "hkdf": { "version": "0.0.2", "resolved": "https://registry.npmjs.org/hkdf/-/hkdf-0.0.2.tgz", @@ -37195,22 +37198,22 @@ "dev": true }, "react-router": { - "version": "6.3.0", - "resolved": "https://registry.npmjs.org/react-router/-/react-router-6.3.0.tgz", - "integrity": "sha512-7Wh1DzVQ+tlFjkeo+ujvjSqSJmkt1+8JO+T5xklPlgrh70y7ogx75ODRW0ThWhY7S+6yEDks8TYrtQe/aoboBQ==", + "version": "6.4.2", + "resolved": "https://registry.npmjs.org/react-router/-/react-router-6.4.2.tgz", + "integrity": "sha512-Rb0BAX9KHhVzT1OKhMvCDMw776aTYM0DtkxqUBP8dNBom3mPXlfNs76JNGK8wKJ1IZEY1+WGj+cvZxHVk/GiKw==", "dev": true, "requires": { - "history": "^5.2.0" + "@remix-run/router": "1.0.2" } }, "react-router-dom": { - "version": "6.3.0", - "resolved": "https://registry.npmjs.org/react-router-dom/-/react-router-dom-6.3.0.tgz", - "integrity": "sha512-uaJj7LKytRxZNQV8+RbzJWnJ8K2nPsOOEuX7aQstlMZKQT0164C+X2w6bnkqU3sjtLvpd5ojrezAyfZ1+0sStw==", + "version": "6.4.2", + "resolved": "https://registry.npmjs.org/react-router-dom/-/react-router-dom-6.4.2.tgz", + "integrity": "sha512-yM1kjoTkpfjgczPrcyWrp+OuQMyB1WleICiiGfstnQYo/S8hPEEnVjr/RdmlH6yKK4Tnj1UGXFSa7uwAtmDoLQ==", "dev": true, "requires": { - "history": "^5.2.0", - "react-router": "6.3.0" + "@remix-run/router": "1.0.2", + "react-router": "6.4.2" } }, "react-stately": { diff --git a/packages/insomnia/package.json b/packages/insomnia/package.json index 81d0c8988d..50cd53e33d 100644 --- a/packages/insomnia/package.json +++ b/packages/insomnia/package.json @@ -193,7 +193,7 @@ "react-dom": "^18.2.0", "react-hook-form": "^7.12.1", "react-redux": "^7.2.6", - "react-router-dom": "^6.3.0", + "react-router-dom": "^6.4.2", "react-stately": "^3.17.0", "react-tabs": "^3.2.3", "react-use": "^17.2.4", diff --git a/packages/insomnia/src/index.html b/packages/insomnia/src/index.html index fa0350e72d..2a38fc188f 100644 --- a/packages/insomnia/src/index.html +++ b/packages/insomnia/src/index.html @@ -22,7 +22,17 @@ width: 100%; " > - Insomnia + + + + + + + + + + + +); diff --git a/packages/insomnia/src/ui/index.tsx b/packages/insomnia/src/ui/index.tsx index 1c9ff92cf0..6a6bf0e7fd 100644 --- a/packages/insomnia/src/ui/index.tsx +++ b/packages/insomnia/src/ui/index.tsx @@ -1,21 +1,26 @@ // eslint-disable-next-line simple-import-sort/imports -import React from 'react'; +import React, { lazy, Suspense } from 'react'; import ReactDOM from 'react-dom/client'; import { Provider } from 'react-redux'; import './rendererListeners'; -import { getProductName, isDevelopment } from '../common/constants'; +import { ACTIVITY_DEBUG, ACTIVITY_HOME, ACTIVITY_SPEC, ACTIVITY_UNIT_TEST, getProductName, isDevelopment } from '../common/constants'; import { database } from '../common/database'; import { initializeLogging } from '../common/log'; import * as models from '../models'; import { initNewOAuthSession } from '../network/o-auth-2/misc'; import { init as initPlugins } from '../plugins'; import { applyColorScheme } from '../plugins/misc'; -import App from './containers/app'; import { init as initStore } from './redux/modules'; import { initializeSentry } from './sentry'; -import { MemoryRouter as Router } from 'react-router-dom'; +import { createMemoryRouter, RouterProvider } from 'react-router-dom'; -import './css/index.less'; // this import must come after `App`. the reason is not yet known. +import Root from './routes/root'; +import './css/index.less'; // this import must come after `Root`. +import { AppLoadingIndicator } from './components/app-loading-indicator'; +const Project = lazy(() => import('./routes/project')); +const UnitTest = lazy(() => import('./routes/unit-test')); +const Debug = lazy(() => import('./routes/debug')); +const Design = lazy(() => import('./routes/design')); initializeSentry(); initializeLogging(); @@ -23,6 +28,51 @@ initializeLogging(); document.body.setAttribute('data-platform', process.platform); document.title = getProductName(); +const router = createMemoryRouter( + // @TODO - Investigate file based routing to generate these routes: + [ + { + path: '/', + element: , + errorElement:
Error
, + children: [ + { + path: ACTIVITY_HOME, + element: ( + }> + + + ), + }, + { + path: ACTIVITY_DEBUG, + element: ( + }> + + + ), + }, + { + path: ACTIVITY_SPEC, + element: ( + }> + + + ), + }, + { + path: ACTIVITY_UNIT_TEST, + element: ( + }> + + + ), + }, + ], + }, + ] +); + async function renderApp() { await database.initClient(); @@ -47,10 +97,8 @@ async function renderApp() { ReactDOM.createRoot(root).render( - - - - , + + ); } diff --git a/packages/insomnia/src/ui/components/wrapper-debug.tsx b/packages/insomnia/src/ui/routes/debug.tsx similarity index 81% rename from packages/insomnia/src/ui/components/wrapper-debug.tsx rename to packages/insomnia/src/ui/routes/debug.tsx index e4168d6f82..e92aa5e470 100644 --- a/packages/insomnia/src/ui/components/wrapper-debug.tsx +++ b/packages/insomnia/src/ui/routes/debug.tsx @@ -8,6 +8,28 @@ import { getByParentId as getGrpcRequestMetaByParentId } from '../../models/grpc import * as requestOperations from '../../models/helpers/request-operations'; import { getByParentId as getRequestMetaByParentId } from '../../models/request-meta'; import { isWebSocketRequest } from '../../models/websocket-request'; +import { EnvironmentsDropdown } from '../components/dropdowns/environments-dropdown'; +import { ErrorBoundary } from '../components/error-boundary'; +import { useDocBodyKeyboardShortcuts } from '../components/keydown-binder'; +import { showModal } from '../components/modals'; +import { AskModal } from '../components/modals/ask-modal'; +import { CookiesModal, showCookiesModal } from '../components/modals/cookies-modal'; +import { GenerateCodeModal } from '../components/modals/generate-code-modal'; +import { PromptModal } from '../components/modals/prompt-modal'; +import { RequestSettingsModal } from '../components/modals/request-settings-modal'; +import { RequestSwitcherModal } from '../components/modals/request-switcher-modal'; +import { WorkspaceEnvironmentsEditModal } from '../components/modals/workspace-environments-edit-modal'; +import { PageLayout } from '../components/page-layout'; +import { GrpcRequestPane } from '../components/panes/grpc-request-pane'; +import { GrpcResponsePane } from '../components/panes/grpc-response-pane'; +import { PlaceholderRequestPane } from '../components/panes/placeholder-request-pane'; +import { RequestPane } from '../components/panes/request-pane'; +import { ResponsePane } from '../components/panes/response-pane'; +import { SidebarChildren } from '../components/sidebar/sidebar-children'; +import { SidebarFilter } from '../components/sidebar/sidebar-filter'; +import { WebSocketRequestPane } from '../components/websockets/websocket-request-pane'; +import { WebSocketResponsePane } from '../components/websockets/websocket-response-pane'; +import { WorkspacePageHeader } from '../components/workspace-page-header'; import { updateRequestMetaByParentId } from '../hooks/create-request'; import { createRequestGroup } from '../hooks/create-request-group'; import { @@ -18,28 +40,6 @@ import { selectSettings, } from '../redux/selectors'; import { selectSidebarFilter } from '../redux/sidebar-selectors'; -import { EnvironmentsDropdown } from './dropdowns/environments-dropdown'; -import { ErrorBoundary } from './error-boundary'; -import { useDocBodyKeyboardShortcuts } from './keydown-binder'; -import { showModal } from './modals'; -import { AskModal } from './modals/ask-modal'; -import { CookiesModal, showCookiesModal } from './modals/cookies-modal'; -import { GenerateCodeModal } from './modals/generate-code-modal'; -import { PromptModal } from './modals/prompt-modal'; -import { RequestSettingsModal } from './modals/request-settings-modal'; -import { RequestSwitcherModal } from './modals/request-switcher-modal'; -import { WorkspaceEnvironmentsEditModal } from './modals/workspace-environments-edit-modal'; -import { PageLayout } from './page-layout'; -import { GrpcRequestPane } from './panes/grpc-request-pane'; -import { GrpcResponsePane } from './panes/grpc-response-pane'; -import { PlaceholderRequestPane } from './panes/placeholder-request-pane'; -import { RequestPane } from './panes/request-pane'; -import { ResponsePane } from './panes/response-pane'; -import { SidebarChildren } from './sidebar/sidebar-children'; -import { SidebarFilter } from './sidebar/sidebar-filter'; -import { WebSocketRequestPane } from './websockets/websocket-request-pane'; -import { WebSocketResponsePane } from './websockets/websocket-response-pane'; -import { WorkspacePageHeader } from './workspace-page-header'; export const WrapperDebug: FC = () => { const activeEnvironment = useSelector(selectActiveEnvironment); diff --git a/packages/insomnia/src/ui/components/wrapper-design.tsx b/packages/insomnia/src/ui/routes/design.tsx similarity index 93% rename from packages/insomnia/src/ui/components/wrapper-design.tsx rename to packages/insomnia/src/ui/routes/design.tsx index f86844c0f1..d39287a6c5 100644 --- a/packages/insomnia/src/ui/components/wrapper-design.tsx +++ b/packages/insomnia/src/ui/routes/design.tsx @@ -9,16 +9,16 @@ import { database } from '../../common/database'; import { debounce } from '../../common/misc'; import { initializeSpectral, isLintError } from '../../common/spectral'; import * as models from '../../models/index'; +import { CodeEditor, UnconnectedCodeEditor } from '../components/codemirror/code-editor'; +import { DesignEmptyState } from '../components/design-empty-state'; +import { ErrorBoundary } from '../components/error-boundary'; +import { Notice, NoticeTable } from '../components/notice-table'; +import { PageLayout } from '../components/page-layout'; +import { SpecEditorSidebar } from '../components/spec-editor/spec-editor-sidebar'; +import { WorkspacePageHeader } from '../components/workspace-page-header'; import { superFaint } from '../css/css-in-js'; import { useActiveApiSpecSyncVCSVersion, useGitVCSVersion } from '../hooks/use-vcs-version'; import { selectActiveApiSpec } from '../redux/selectors'; -import { CodeEditor, UnconnectedCodeEditor } from './codemirror/code-editor'; -import { DesignEmptyState } from './design-empty-state'; -import { ErrorBoundary } from './error-boundary'; -import { Notice, NoticeTable } from './notice-table'; -import { PageLayout } from './page-layout'; -import { SpecEditorSidebar } from './spec-editor/spec-editor-sidebar'; -import { WorkspacePageHeader } from './workspace-page-header'; const EmptySpaceHelper = styled.div({ ...superFaint, diff --git a/packages/insomnia/src/ui/components/wrapper-home.tsx b/packages/insomnia/src/ui/routes/project.tsx similarity index 91% rename from packages/insomnia/src/ui/components/wrapper-home.tsx rename to packages/insomnia/src/ui/routes/project.tsx index 7df4da1ceb..19b48855b0 100644 --- a/packages/insomnia/src/ui/components/wrapper-home.tsx +++ b/packages/insomnia/src/ui/routes/project.tsx @@ -17,27 +17,27 @@ import { isDesign, Workspace, WorkspaceScopeKeys } from '../../models/workspace' import { WorkspaceMeta } from '../../models/workspace-meta'; import { MemClient } from '../../sync/git/mem-client'; import { initializeLocalBackendProjectAndMarkForSync } from '../../sync/vcs/initialize-backend-project'; -import { VCS } from '../../sync/vcs/vcs'; +import { AppHeader } from '../components/app-header'; +import { Dropdown } from '../components/base/dropdown/dropdown'; +import { DropdownButton } from '../components/base/dropdown/dropdown-button'; +import { DropdownDivider } from '../components/base/dropdown/dropdown-divider'; +import { DropdownItem } from '../components/base/dropdown/dropdown-item'; +import { DashboardSortDropdown } from '../components/dropdowns/dashboard-sort-dropdown'; +import { ProjectDropdown } from '../components/dropdowns/project-dropdown'; +import { RemoteWorkspacesDropdown } from '../components/dropdowns/remote-workspaces-dropdown'; +import { showPrompt } from '../components/modals'; +import { PageLayout } from '../components/page-layout'; +import { WrapperHomeEmptyStatePane } from '../components/panes/wrapper-home-empty-state-pane'; +import { SvgIcon } from '../components/svg-icon'; +import { Button } from '../components/themed-button'; +import { WorkspaceCard, WorkspaceCardProps } from '../components/workspace-card'; +import { useVCS } from '../hooks/use-vcs'; import { cloneGitRepository } from '../redux/modules/git'; import { selectIsLoading, setDashboardSortOrder } from '../redux/modules/global'; import { ForceToWorkspace } from '../redux/modules/helpers'; import { importClipBoard, importFile, importUri } from '../redux/modules/import'; import { activateWorkspace, createWorkspace } from '../redux/modules/workspace'; import { selectActiveProject, selectApiSpecs, selectDashboardSortOrder, selectIsLoggedIn, selectWorkspaceMetas, selectWorkspacesForActiveProject } from '../redux/selectors'; -import { AppHeader } from './app-header'; -import { Dropdown } from './base/dropdown/dropdown'; -import { DropdownButton } from './base/dropdown/dropdown-button'; -import { DropdownDivider } from './base/dropdown/dropdown-divider'; -import { DropdownItem } from './base/dropdown/dropdown-item'; -import { DashboardSortDropdown } from './dropdowns/dashboard-sort-dropdown'; -import { ProjectDropdown } from './dropdowns/project-dropdown'; -import { RemoteWorkspacesDropdown } from './dropdowns/remote-workspaces-dropdown'; -import { showPrompt } from './modals'; -import { PageLayout } from './page-layout'; -import { WrapperHomeEmptyStatePane } from './panes/wrapper-home-empty-state-pane'; -import { SvgIcon } from './svg-icon'; -import { Button } from './themed-button'; -import { WorkspaceCard, WorkspaceCardProps } from './workspace-card'; const CreateButton = styled(Button).attrs({ variant: 'contained', @@ -54,10 +54,6 @@ const CardContainer = styled.div({ paddingTop: 'var(--padding-md)', }); -interface Props { - vcs: VCS | null; -} - function orderDashboardCards(orderBy: DashboardSortOrder) { return (cardA: Pick, cardB: Pick) => { switch (orderBy) { @@ -150,7 +146,7 @@ const mapWorkspaceToWorkspaceCard = ({ }; }; -const WrapperHome: FC = (({ vcs }) => { +const WrapperHome: FC = (() => { const sortOrder = useSelector(selectDashboardSortOrder); const activeProject = useSelector(selectActiveProject); const isLoggedIn = useSelector(selectIsLoggedIn); @@ -158,7 +154,7 @@ const WrapperHome: FC = (({ vcs }) => { const apiSpecs = useSelector(selectApiSpecs); const workspaceMetas = useSelector(selectWorkspaceMetas); const workspacesForActiveProject = useSelector(selectWorkspacesForActiveProject); - + const vcs = useVCS({}); const dispatch = useDispatch(); const [filter, setFilter] = useState(''); diff --git a/packages/insomnia/src/ui/containers/app.tsx b/packages/insomnia/src/ui/routes/root.tsx similarity index 83% rename from packages/insomnia/src/ui/containers/app.tsx rename to packages/insomnia/src/ui/routes/root.tsx index 2f8cf61219..7406ab921f 100644 --- a/packages/insomnia/src/ui/containers/app.tsx +++ b/packages/insomnia/src/ui/routes/root.tsx @@ -1,12 +1,9 @@ -import React, { FC, Fragment, lazy, Suspense, useEffect, useState } from 'react'; +import React, { Fragment, useEffect, useState } from 'react'; import { useSelector } from 'react-redux'; -import { Route, Routes, useNavigate } from 'react-router-dom'; +import { Outlet, useNavigate } from 'react-router-dom'; import { - ACTIVITY_DEBUG, ACTIVITY_HOME, - ACTIVITY_SPEC, - ACTIVITY_UNIT_TEST, } from '../../common/constants'; import { database as db } from '../../common/database'; import * as models from '../../models'; @@ -51,6 +48,7 @@ import { WorkspaceEnvironmentsEditModal } from '../components/modals/workspace-e import { WorkspaceSettingsModal } from '../components/modals/workspace-settings-modal'; import { WrapperModal } from '../components/modals/wrapper-modal'; import { Toast } from '../components/toast'; +import { AppHooks } from '../containers/app-hooks'; import withDragDropContext from '../context/app/drag-drop-context'; import { GrpcDispatchModalWrapper, GrpcProvider } from '../context/grpc'; import { NunjucksEnabledProvider } from '../context/nunjucks/nunjucks-enabled-context'; @@ -69,50 +67,6 @@ import { selectIsFinishedBooting, selectIsLoggedIn, } from '../redux/selectors'; -import { AppHooks } from './app-hooks'; - -const lazyWithPreload = >( - importFn: () => Promise<{ default: T }> -) => { - const LazyComponent = lazy(importFn); - const preload = () => importFn(); - - return [LazyComponent, preload] as const; -}; - -const [WrapperHome, preloadWrapperHome] = lazyWithPreload( - () => import('../components/wrapper-home') -); -const [WrapperDebug, preloadWrapperDebug] = lazyWithPreload( - () => import('../components/wrapper-debug') -); -const [WrapperDesign, preloadWrapperDesign] = lazyWithPreload( - () => import('../components/wrapper-design') -); -const [WrapperUnitTest, preloadWrapperUnitTest] = lazyWithPreload( - () => import('../components/wrapper-unit-test') -); - -preloadWrapperHome(); -preloadWrapperDebug(); -preloadWrapperDesign(); -preloadWrapperUnitTest(); - -const LoadingIndicator = () => (
- Insomnia -
); const ActivityRouter = () => { const selectedActivity = useSelector(selectActiveActivity); @@ -296,42 +250,7 @@ const App = () => { - - }> - - - } - /> - }> - - - } - /> - }> - - - } - /> - }> - - - } - /> - + diff --git a/packages/insomnia/src/ui/components/wrapper-unit-test.tsx b/packages/insomnia/src/ui/routes/unit-test.tsx similarity index 93% rename from packages/insomnia/src/ui/components/wrapper-unit-test.tsx rename to packages/insomnia/src/ui/routes/unit-test.tsx index 916b7d5912..3c9cfe03b9 100644 --- a/packages/insomnia/src/ui/components/wrapper-unit-test.tsx +++ b/packages/insomnia/src/ui/routes/unit-test.tsx @@ -13,24 +13,24 @@ import { isRequestGroup } from '../../models/request-group'; import type { UnitTest } from '../../models/unit-test'; import type { UnitTestSuite } from '../../models/unit-test-suite'; import { getSendRequestCallback } from '../../network/unit-test-feature'; +import { Dropdown } from '../components/base/dropdown/dropdown'; +import { DropdownButton } from '../components/base/dropdown/dropdown-button'; +import { DropdownItem } from '../components/base/dropdown/dropdown-item'; +import { Editable } from '../components/base/editable'; +import { CodeEditor } from '../components/codemirror/code-editor'; +import { ErrorBoundary } from '../components/error-boundary'; +import { ListGroup, UnitTestItem, UnitTestResultItem } from '../components/list-group'; +import { showAlert, showModal, showPrompt } from '../components/modals'; +import { SelectModal } from '../components/modals/select-modal'; +import { PageLayout } from '../components/page-layout'; +import { EmptyStatePane } from '../components/panes/empty-state-pane'; +import type { Child } from '../components/sidebar/sidebar-children'; +import { SvgIcon } from '../components/svg-icon'; +import { Button } from '../components/themed-button'; +import { UnitTestEditable } from '../components/unit-test-editable'; +import { WorkspacePageHeader } from '../components/workspace-page-header'; import { selectActiveEnvironment, selectActiveUnitTestResult, selectActiveUnitTests, selectActiveUnitTestSuite, selectActiveUnitTestSuites, selectActiveWorkspace } from '../redux/selectors'; import { selectSidebarChildren } from '../redux/sidebar-selectors'; -import { Dropdown } from './base/dropdown/dropdown'; -import { DropdownButton } from './base/dropdown/dropdown-button'; -import { DropdownItem } from './base/dropdown/dropdown-item'; -import { Editable } from './base/editable'; -import { CodeEditor } from './codemirror/code-editor'; -import { ErrorBoundary } from './error-boundary'; -import { ListGroup, UnitTestItem, UnitTestResultItem } from './list-group'; -import { showAlert, showModal, showPrompt } from './modals'; -import { SelectModal } from './modals/select-modal'; -import { PageLayout } from './page-layout'; -import { EmptyStatePane } from './panes/empty-state-pane'; -import type { Child } from './sidebar/sidebar-children'; -import { SvgIcon } from './svg-icon'; -import { Button } from './themed-button'; -import { UnitTestEditable } from './unit-test-editable'; -import { WorkspacePageHeader } from './workspace-page-header'; const HeaderButton = styled(Button)({ '&&': {