Thanks to visit codestin.com
Credit goes to github.com

Skip to content

Commit dd55d45

Browse files
authored
chore: remove react imports (#1867)
reolves #1856
1 parent 26a2a16 commit dd55d45

File tree

177 files changed

+192
-293
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

177 files changed

+192
-293
lines changed

site/.eslintrc.yaml

+3
Original file line numberDiff line numberDiff line change
@@ -114,6 +114,9 @@ rules:
114114
react/jsx-curly-brace-presence:
115115
- error
116116
- children: ignore
117+
# https://reactjs.org/blog/2020/09/22/introducing-the-new-jsx-transform.html#eslint
118+
react/jsx-uses-react: "off"
119+
react/react-in-jsx-scope: "off"
117120
settings:
118121
react:
119122
version: detect

site/src/AppRouter.tsx

+7-7
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import React from "react"
1+
import { FC, lazy, Suspense } from "react"
22
import { Route, Routes } from "react-router-dom"
33
import { AuthAndFrame } from "./components/AuthAndFrame/AuthAndFrame"
44
import { RequireAuth } from "./components/RequireAuth/RequireAuth"
@@ -19,12 +19,12 @@ import { WorkspaceBuildPage } from "./pages/WorkspaceBuildPage/WorkspaceBuildPag
1919
import { WorkspacePage } from "./pages/WorkspacePage/WorkspacePage"
2020
import { WorkspaceSchedulePage } from "./pages/WorkspaceSchedulePage/WorkspaceSchedulePage"
2121

22-
const TerminalPage = React.lazy(() => import("./pages/TerminalPage/TerminalPage"))
23-
const WorkspacesPage = React.lazy(() => import("./pages/WorkspacesPage/WorkspacesPage"))
24-
const CreateWorkspacePage = React.lazy(() => import("./pages/CreateWorkspacePage/CreateWorkspacePage"))
22+
const TerminalPage = lazy(() => import("./pages/TerminalPage/TerminalPage"))
23+
const WorkspacesPage = lazy(() => import("./pages/WorkspacesPage/WorkspacesPage"))
24+
const CreateWorkspacePage = lazy(() => import("./pages/CreateWorkspacePage/CreateWorkspacePage"))
2525

26-
export const AppRouter: React.FC = () => (
27-
<React.Suspense fallback={<></>}>
26+
export const AppRouter: FC = () => (
27+
<Suspense fallback={<></>}>
2828
<Routes>
2929
<Route path="/">
3030
<Route
@@ -159,5 +159,5 @@ export const AppRouter: React.FC = () => (
159159
<Route path="*" element={<NotFoundPage />} />
160160
</Route>
161161
</Routes>
162-
</React.Suspense>
162+
</Suspense>
163163
)

site/src/Main.tsx

-1
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,4 @@
11
import { inspect } from "@xstate/inspect"
2-
import React from "react"
32
import ReactDOM from "react-dom"
43
import { Interpreter } from "xstate"
54
import { App } from "./app"

site/src/__mocks__/react-markdown.tsx

+2-2
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
1-
import React from "react"
1+
import { FC } from "react"
22

3-
const ReactMarkdown: React.FC = ({ children }) => {
3+
const ReactMarkdown: FC = ({ children }) => {
44
return <div data-testid="markdown">{children}</div>
55
}
66

site/src/app.tsx

+2-2
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
import CssBaseline from "@material-ui/core/CssBaseline"
22
import ThemeProvider from "@material-ui/styles/ThemeProvider"
3-
import React from "react"
3+
import { FC } from "react"
44
import { BrowserRouter as Router } from "react-router-dom"
55
import { SWRConfig } from "swr"
66
import { AppRouter } from "./AppRouter"
@@ -10,7 +10,7 @@ import { dark } from "./theme"
1010
import "./theme/globalFonts"
1111
import { XServiceProvider } from "./xServices/StateContext"
1212

13-
export const App: React.FC = () => {
13+
export const App: FC = () => {
1414
return (
1515
<Router>
1616
<SWRConfig

site/src/components/AuthAndFrame/AuthAndFrame.tsx

+2-2
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import React from "react"
1+
import { FC } from "react"
22
import { Footer } from "../Footer/Footer"
33
import { Navbar } from "../Navbar/Navbar"
44
import { RequireAuth } from "../RequireAuth/RequireAuth"
@@ -10,7 +10,7 @@ interface AuthAndFrameProps {
1010
/**
1111
* Wraps page in RequireAuth and renders it between Navbar and Footer
1212
*/
13-
export const AuthAndFrame: React.FC<AuthAndFrameProps> = ({ children }) => (
13+
export const AuthAndFrame: FC<AuthAndFrameProps> = ({ children }) => (
1414
<RequireAuth>
1515
<>
1616
<Navbar />

site/src/components/AvatarData/AvatarData.stories.tsx

-1
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,4 @@
11
import { Story } from "@storybook/react"
2-
import React from "react"
32
import { AvatarData, AvatarDataProps } from "./AvatarData"
43

54
export default {

site/src/components/AvatarData/AvatarData.tsx

+2-2
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
import Avatar from "@material-ui/core/Avatar"
22
import Link from "@material-ui/core/Link"
33
import { makeStyles } from "@material-ui/core/styles"
4-
import React from "react"
4+
import { FC } from "react"
55
import { Link as RouterLink } from "react-router-dom"
66
import { combineClasses } from "../../util/combineClasses"
77
import { firstLetter } from "../../util/firstLetter"
@@ -12,7 +12,7 @@ export interface AvatarDataProps {
1212
link?: string
1313
}
1414

15-
export const AvatarData: React.FC<AvatarDataProps> = ({ title, subtitle, link }) => {
15+
export const AvatarData: FC<AvatarDataProps> = ({ title, subtitle, link }) => {
1616
const styles = useStyles()
1717

1818
return (

site/src/components/BorderedMenu/BorderedMenu.stories.tsx

-1
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,4 @@
11
import { Story } from "@storybook/react"
2-
import React from "react"
32
import { BorderedMenuRow } from "../BorderedMenuRow/BorderedMenuRow"
43
import { BuildingIcon } from "../Icons/BuildingIcon"
54
import { UsersOutlinedIcon } from "../Icons/UsersOutlinedIcon"

site/src/components/BorderedMenu/BorderedMenu.tsx

+2-2
Original file line numberDiff line numberDiff line change
@@ -1,14 +1,14 @@
11
import Popover, { PopoverProps } from "@material-ui/core/Popover"
22
import { fade, makeStyles } from "@material-ui/core/styles"
3-
import React from "react"
3+
import { FC } from "react"
44

55
type BorderedMenuVariant = "admin-dropdown" | "user-dropdown"
66

77
export type BorderedMenuProps = Omit<PopoverProps, "variant"> & {
88
variant?: BorderedMenuVariant
99
}
1010

11-
export const BorderedMenu: React.FC<BorderedMenuProps> = ({ children, variant, ...rest }) => {
11+
export const BorderedMenu: FC<BorderedMenuProps> = ({ children, variant, ...rest }) => {
1212
const styles = useStyles()
1313

1414
return (

site/src/components/BorderedMenuRow/BorderedMenuRow.tsx

+2-2
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@ import ListItem from "@material-ui/core/ListItem"
22
import { makeStyles } from "@material-ui/core/styles"
33
import SvgIcon from "@material-ui/core/SvgIcon"
44
import CheckIcon from "@material-ui/icons/Check"
5-
import React from "react"
5+
import { FC } from "react"
66
import { NavLink } from "react-router-dom"
77
import { ellipsizeText } from "../../util/ellipsizeText"
88
import { Typography } from "../Typography/Typography"
@@ -26,7 +26,7 @@ interface BorderedMenuRowProps {
2626
onClick?: () => void
2727
}
2828

29-
export const BorderedMenuRow: React.FC<BorderedMenuRowProps> = ({
29+
export const BorderedMenuRow: FC<BorderedMenuRowProps> = ({
3030
active,
3131
description,
3232
Icon,

site/src/components/BuildsTable/BuildsTable.stories.tsx

-1
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,4 @@
11
import { ComponentMeta, Story } from "@storybook/react"
2-
import React from "react"
32
import { MockBuilds } from "../../testHelpers/entities"
43
import { BuildsTable, BuildsTableProps } from "./BuildsTable"
54

site/src/components/BuildsTable/BuildsTable.tsx

+2-2
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,7 @@ import TableCell from "@material-ui/core/TableCell"
66
import TableHead from "@material-ui/core/TableHead"
77
import TableRow from "@material-ui/core/TableRow"
88
import useTheme from "@material-ui/styles/useTheme"
9-
import React from "react"
9+
import { FC } from "react"
1010
import { useNavigate } from "react-router-dom"
1111
import * as TypesGen from "../../api/typesGenerated"
1212
import { displayWorkspaceBuildDuration, getDisplayStatus } from "../../util/workspace"
@@ -27,7 +27,7 @@ export interface BuildsTableProps {
2727
className?: string
2828
}
2929

30-
export const BuildsTable: React.FC<BuildsTableProps> = ({ builds, className }) => {
30+
export const BuildsTable: FC<BuildsTableProps> = ({ builds, className }) => {
3131
const isLoading = !builds
3232
const theme: Theme = useTheme()
3333
const navigate = useNavigate()

site/src/components/CliAuthToken/CliAuthToken.stories.tsx

-1
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,4 @@
11
import { Story } from "@storybook/react"
2-
import React from "react"
32
import { CliAuthToken, CliAuthTokenProps } from "./CliAuthToken"
43

54
export default {

site/src/components/CliAuthToken/CliAuthToken.test.tsx

-1
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,4 @@
11
import { screen } from "@testing-library/react"
2-
import React from "react"
32
import { render } from "../../testHelpers/renderHelpers"
43
import { CliAuthToken } from "./CliAuthToken"
54

site/src/components/CliAuthToken/CliAuthToken.tsx

+2-2
Original file line numberDiff line numberDiff line change
@@ -1,14 +1,14 @@
11
import Paper from "@material-ui/core/Paper"
22
import { makeStyles } from "@material-ui/core/styles"
33
import Typography from "@material-ui/core/Typography"
4-
import React from "react"
4+
import { FC } from "react"
55
import { CodeExample } from "../CodeExample/CodeExample"
66

77
export interface CliAuthTokenProps {
88
sessionToken: string
99
}
1010

11-
export const CliAuthToken: React.FC<CliAuthTokenProps> = ({ sessionToken }) => {
11+
export const CliAuthToken: FC<CliAuthTokenProps> = ({ sessionToken }) => {
1212
const styles = useStyles()
1313
return (
1414
<Paper className={styles.container}>

site/src/components/CodeBlock/CodeBlock.stories.tsx

-1
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,4 @@
11
import { Story } from "@storybook/react"
2-
import React from "react"
32
import { CodeBlock, CodeBlockProps } from "./CodeBlock"
43

54
const sampleLines = `Successfully assigned coder/image-jcws7 to cluster-1

site/src/components/CodeBlock/CodeBlock.test.tsx

-1
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,4 @@
11
import { screen } from "@testing-library/react"
2-
import React from "react"
32
import { render } from "../../testHelpers/renderHelpers"
43
import { CodeBlock } from "./CodeBlock"
54

site/src/components/CodeBlock/CodeBlock.tsx

+4-4
Original file line numberDiff line numberDiff line change
@@ -1,15 +1,15 @@
11
import { makeStyles } from "@material-ui/core/styles"
2-
import React from "react"
2+
import { FC, Fragment, ReactElement } from "react"
33
import { MONOSPACE_FONT_FAMILY } from "../../theme/constants"
44
import { combineClasses } from "../../util/combineClasses"
55

66
export interface CodeBlockProps {
77
lines: string[]
8-
ctas?: React.ReactElement[]
8+
ctas?: ReactElement[]
99
className?: string
1010
}
1111

12-
export const CodeBlock: React.FC<CodeBlockProps> = ({ lines, ctas, className = "" }) => {
12+
export const CodeBlock: FC<CodeBlockProps> = ({ lines, ctas, className = "" }) => {
1313
const styles = useStyles()
1414

1515
return (
@@ -24,7 +24,7 @@ export const CodeBlock: React.FC<CodeBlockProps> = ({ lines, ctas, className = "
2424
{ctas && ctas.length && (
2525
<div className={styles.ctaBar}>
2626
{ctas.map((cta, i) => {
27-
return <React.Fragment key={i}>{cta}</React.Fragment>
27+
return <Fragment key={i}>{cta}</Fragment>
2828
})}
2929
</div>
3030
)}

site/src/components/CodeExample/CodeExample.stories.tsx

-1
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,4 @@
11
import { Story } from "@storybook/react"
2-
import React from "react"
32
import { CodeExample, CodeExampleProps } from "./CodeExample"
43

54
const sampleCode = `echo "Hello, world"`

site/src/components/CodeExample/CodeExample.test.tsx

-1
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,4 @@
11
import { screen } from "@testing-library/react"
2-
import React from "react"
32
import { render } from "../../testHelpers/renderHelpers"
43
import { CodeExample } from "./CodeExample"
54

site/src/components/CodeExample/CodeExample.tsx

+2-2
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
import { makeStyles } from "@material-ui/core/styles"
2-
import React from "react"
2+
import { FC } from "react"
33
import { MONOSPACE_FONT_FAMILY } from "../../theme/constants"
44
import { CopyButton } from "../CopyButton/CopyButton"
55

@@ -10,7 +10,7 @@ export interface CodeExampleProps {
1010
/**
1111
* Component to show single-line code examples, with a copy button
1212
*/
13-
export const CodeExample: React.FC<CodeExampleProps> = ({ code }) => {
13+
export const CodeExample: FC<CodeExampleProps> = ({ code }) => {
1414
const styles = useStyles()
1515

1616
return (

site/src/components/ConfirmDialog/ConfirmDialog.stories.tsx

-1
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,4 @@
11
import { ComponentMeta, Story } from "@storybook/react"
2-
import React from "react"
32
import { ConfirmDialog, ConfirmDialogProps } from "./ConfirmDialog"
43

54
export default {

site/src/components/ConfirmDialog/ConfirmDialog.test.tsx

+2-2
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,11 @@
11
import { fireEvent, render } from "@testing-library/react"
2-
import React from "react"
2+
import { FC } from "react"
33
import { act } from "react-dom/test-utils"
44
import { WrapperComponent } from "../../testHelpers/renderHelpers"
55
import { ConfirmDialog, ConfirmDialogProps } from "./ConfirmDialog"
66

77
namespace Helpers {
8-
export const Component: React.FC<ConfirmDialogProps> = (props: ConfirmDialogProps) => {
8+
export const Component: FC<ConfirmDialogProps> = (props: ConfirmDialogProps) => {
99
return (
1010
<WrapperComponent>
1111
<ConfirmDialog {...props} />

site/src/components/CreateUserForm/CreateUserForm.stories.tsx

-1
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,5 @@
11
import { action } from "@storybook/addon-actions"
22
import { Story } from "@storybook/react"
3-
import React from "react"
43
import { CreateUserForm, CreateUserFormProps } from "./CreateUserForm"
54

65
export default {

site/src/components/CreateUserForm/CreateUserForm.tsx

+2-2
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
import FormHelperText from "@material-ui/core/FormHelperText"
22
import TextField from "@material-ui/core/TextField"
33
import { FormikContextType, FormikErrors, useFormik } from "formik"
4-
import React from "react"
4+
import { FC } from "react"
55
import * as Yup from "yup"
66
import * as TypesGen from "../../api/typesGenerated"
77
import { getFormHelpers, nameValidator, onChangeTrimmed } from "../../util/formUtils"
@@ -34,7 +34,7 @@ const validationSchema = Yup.object({
3434
username: nameValidator(Language.usernameLabel),
3535
})
3636

37-
export const CreateUserForm: React.FC<CreateUserFormProps> = ({
37+
export const CreateUserForm: FC<CreateUserFormProps> = ({
3838
onSubmit,
3939
onCancel,
4040
formErrors,

site/src/components/DropdownArrows/DropdownArrows.tsx

+3-3
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
import { fade, makeStyles, Theme } from "@material-ui/core/styles"
22
import KeyboardArrowDown from "@material-ui/icons/KeyboardArrowDown"
33
import KeyboardArrowUp from "@material-ui/icons/KeyboardArrowUp"
4-
import React from "react"
4+
import { FC } from "react"
55

66
const useStyles = makeStyles((theme: Theme) => ({
77
arrowIcon: {
@@ -15,12 +15,12 @@ const useStyles = makeStyles((theme: Theme) => ({
1515
},
1616
}))
1717

18-
export const OpenDropdown: React.FC = () => {
18+
export const OpenDropdown: FC = () => {
1919
const styles = useStyles()
2020
return <KeyboardArrowDown className={styles.arrowIcon} />
2121
}
2222

23-
export const CloseDropdown: React.FC = () => {
23+
export const CloseDropdown: FC = () => {
2424
const styles = useStyles()
2525
return <KeyboardArrowUp className={`${styles.arrowIcon} ${styles.arrowIconUp}`} />
2626
}

site/src/components/EmptyState/EmptyState.test.tsx

-1
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,4 @@
11
import { screen } from "@testing-library/react"
2-
import React from "react"
32
import { render } from "../../testHelpers/renderHelpers"
43
import { EmptyState } from "./EmptyState"
54

site/src/components/EmptyState/EmptyState.tsx

+3-3
Original file line numberDiff line numberDiff line change
@@ -1,14 +1,14 @@
11
import Box from "@material-ui/core/Box"
22
import { makeStyles } from "@material-ui/core/styles"
33
import Typography from "@material-ui/core/Typography"
4-
import React from "react"
4+
import { FC, ReactNode } from "react"
55

66
export interface EmptyStateProps {
77
/** Text Message to display, placed inside Typography component */
88
message: string
99
/** Longer optional description to display below the message */
1010
description?: string
11-
cta?: React.ReactNode
11+
cta?: ReactNode
1212
}
1313

1414
/**
@@ -19,7 +19,7 @@ export interface EmptyStateProps {
1919
* EmptyState's props extend the [Material UI Box component](https://material-ui.com/components/box/)
2020
* that you can directly pass props through to to customize the shape and layout of it.
2121
*/
22-
export const EmptyState: React.FC<EmptyStateProps> = (props) => {
22+
export const EmptyState: FC<EmptyStateProps> = (props) => {
2323
const { message, description, cta, ...boxProps } = props
2424
const styles = useStyles()
2525

site/src/components/EnterpriseSnackbar/EnterpriseSnackbar.stories.tsx

-1
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,4 @@
11
import { Story } from "@storybook/react"
2-
import React from "react"
32
import { EnterpriseSnackbar, EnterpriseSnackbarProps } from "./EnterpriseSnackbar"
43

54
export default {

site/src/components/EnterpriseSnackbar/EnterpriseSnackbar.tsx

+2-2
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@ import IconButton from "@material-ui/core/IconButton"
22
import Snackbar, { SnackbarProps as MuiSnackbarProps } from "@material-ui/core/Snackbar"
33
import { makeStyles } from "@material-ui/core/styles"
44
import CloseIcon from "@material-ui/icons/Close"
5-
import React from "react"
5+
import { FC } from "react"
66
import { combineClasses } from "../../util/combineClasses"
77

88
type EnterpriseSnackbarVariant = "error" | "info"
@@ -25,7 +25,7 @@ export interface EnterpriseSnackbarProps extends MuiSnackbarProps {
2525
*
2626
* See original component's Material UI documentation here: https://material-ui.com/components/snackbars/
2727
*/
28-
export const EnterpriseSnackbar: React.FC<EnterpriseSnackbarProps> = ({
28+
export const EnterpriseSnackbar: FC<EnterpriseSnackbarProps> = ({
2929
onClose,
3030
variant = "info",
3131
ContentProps = {},

0 commit comments

Comments
 (0)