coder · BrunoQuaresma · Apr 19, 2022 · Apr 19, 2022 · Apr 19, 2022 · Apr 19, 2022
diff --git a/examples/docker-local/main.tf b/examples/docker-local/main.tf
@@ -37,7 +37,7 @@ resource "docker_volume" "coder_volume" {
 }
 
 resource "docker_container" "workspace" {
-  count = data.coder_workspace.me.start_count
+  count   = data.coder_workspace.me.start_count
   image   = var.docker_image
   name    = "coder-${data.coder_workspace.me.owner}-${data.coder_workspace.me.name}-root"
   dns     = ["1.1.1.1"]

diff --git a/site/src/AppRouter.tsx b/site/src/AppRouter.tsx
@@ -1,7 +1,7 @@
 import React from "react"
 import { Route, Routes } from "react-router-dom"
-import { RequireAuth } from "./components"
 import { AuthAndFrame } from "./components/AuthAndFrame/AuthAndFrame"
+import { RequireAuth } from "./components/Page/RequireAuth"
 import { PreferencesLayout } from "./components/Preferences/Layout"
 import { IndexPage } from "./pages"
 import { NotFoundPage } from "./pages/404"

diff --git a/site/src/components/AuthAndFrame/AuthAndFrame.tsx b/site/src/components/AuthAndFrame/AuthAndFrame.tsx
@@ -1,5 +1,5 @@
 import React from "react"
-import { Navbar } from "../Navbar"
+import { Navbar } from "../Navbar/Navbar"
 import { Footer } from "../Page/Footer"
 import { RequireAuth } from "../Page/RequireAuth"
 

diff --git a/site/src/components/Button/index.ts b/site/src/components/Button/index.ts
diff --git a/...rc/components/CodeBlock/index.stories.tsx → ...omponents/CodeBlock/CodeBlock.stories.tsx b/...rc/components/CodeBlock/index.stories.tsx → ...omponents/CodeBlock/CodeBlock.stories.tsx
@@ -1,6 +1,6 @@
 import { Story } from "@storybook/react"
 import React from "react"
-import { CodeBlock, CodeBlockProps } from "./index"
+import { CodeBlock, CodeBlockProps } from "./CodeBlock"
 
 const sampleLines = `Successfully assigned coder/image-jcws7 to cluster-1
 Container image "gcr.io/coder-dogfood/master/coder-dev-ubuntu@sha256" already present on machine

diff --git a/site/src/components/CodeBlock/index.test.tsx → ...c/components/CodeBlock/CodeBlock.test.tsx b/site/src/components/CodeBlock/index.test.tsx → ...c/components/CodeBlock/CodeBlock.test.tsx
@@ -1,7 +1,7 @@
 import { screen } from "@testing-library/react"
 import React from "react"
 import { render } from "../../testHelpers"
-import { CodeBlock } from "./index"
+import { CodeBlock } from "./CodeBlock"
 
 describe("CodeBlock", () => {
   it("renders lines)", async () => {

diff --git a/site/src/components/CodeBlock/index.tsx → site/src/components/CodeBlock/CodeBlock.tsx b/site/src/components/CodeBlock/index.tsx → site/src/components/CodeBlock/CodeBlock.tsx
diff --git a/site/src/components/CodeExample/CodeExample.tsx b/site/src/components/CodeExample/CodeExample.tsx
@@ -1,7 +1,7 @@
 import { makeStyles } from "@material-ui/core/styles"
 import React from "react"
 import { MONOSPACE_FONT_FAMILY } from "../../theme/constants"
-import { CopyButton } from "../Button"
+import { CopyButton } from "../Button/CopyButton"
 
 export interface CodeExampleProps {
   code: string

diff --git a/site/src/components/CodeExample/index.ts b/site/src/components/CodeExample/index.ts
diff --git a/.../src/components/EmptyState/index.test.tsx → ...components/EmptyState/EmptyState.test.tsx b/.../src/components/EmptyState/index.test.tsx → ...components/EmptyState/EmptyState.test.tsx
@@ -1,7 +1,7 @@
 import { screen } from "@testing-library/react"
 import React from "react"
 import { render } from "../../testHelpers"
-import { EmptyState } from "./index"
+import { EmptyState } from "./EmptyState"
 
 describe("EmptyState", () => {
   it("renders (smoke test)", async () => {

diff --git a/site/src/components/EmptyState/index.tsx → .../src/components/EmptyState/EmptyState.tsx b/site/src/components/EmptyState/index.tsx → .../src/components/EmptyState/EmptyState.tsx
diff --git a/site/src/components/ErrorSummary/ErrorSummary.stories.tsx b/site/src/components/ErrorSummary/ErrorSummary.stories.tsx
@@ -1,6 +1,6 @@
 import { ComponentMeta, Story } from "@storybook/react"
 import React from "react"
-import { ErrorSummary, ErrorSummaryProps } from "."
+import { ErrorSummary, ErrorSummaryProps } from "./ErrorSummary"
 
 export default {
   title: "components/ErrorSummary",

diff --git a/...rc/components/ErrorSummary/index.test.tsx → ...onents/ErrorSummary/ErrorSummary.test.tsx b/...rc/components/ErrorSummary/index.test.tsx → ...onents/ErrorSummary/ErrorSummary.test.tsx
@@ -1,6 +1,6 @@
 import { render, screen } from "@testing-library/react"
 import React from "react"
-import { ErrorSummary } from "./index"
+import { ErrorSummary } from "./ErrorSummary"
 
 describe("ErrorSummary", () => {
   it("renders", async () => {

diff --git a/site/src/components/ErrorSummary/index.tsx → .../components/ErrorSummary/ErrorSummary.tsx b/site/src/components/ErrorSummary/index.tsx → .../components/ErrorSummary/ErrorSummary.tsx
diff --git a/site/src/components/Form/index.test.tsx → site/src/components/Form/utils.test.tsx b/site/src/components/Form/index.test.tsx → site/src/components/Form/utils.test.tsx
@@ -1,5 +1,5 @@
 import { FormikContextType } from "formik/dist/types"
-import { getFormHelpers, onChangeTrimmed } from "./index"
+import { getFormHelpers, onChangeTrimmed } from "./utils"
 
 interface TestType {
   untouchedGoodField: string

diff --git a/site/src/components/Form/index.ts → site/src/components/Form/utils.ts b/site/src/components/Form/index.ts → site/src/components/Form/utils.ts
@@ -1,12 +1,6 @@
 import { FormikContextType, getIn } from "formik"
 import { ChangeEvent, ChangeEventHandler, FocusEventHandler } from "react"
 
-export * from "./FormCloseButton"
-export * from "./FormDropdownField"
-export * from "./FormSection"
-export * from "./FormTextField"
-export * from "./FormTitle"
-
 interface FormHelpers {
   name: string
   onBlur: FocusEventHandler

diff --git a/site/src/components/Header/index.test.tsx → site/src/components/Header/Header.test.tsx b/site/src/components/Header/index.test.tsx → site/src/components/Header/Header.test.tsx
@@ -1,7 +1,7 @@
 import { screen } from "@testing-library/react"
 import React from "react"
 import { render } from "../../testHelpers"
-import { Header } from "./index"
+import { Header } from "./Header"
 
 describe("Header", () => {
   it("renders title and subtitle", async () => {

diff --git a/site/src/components/Header/index.tsx → site/src/components/Header/Header.tsx b/site/src/components/Header/index.tsx → site/src/components/Header/Header.tsx
diff --git a/site/src/components/Navbar/index.tsx → site/src/components/Navbar/Navbar.tsx b/site/src/components/Navbar/index.tsx → site/src/components/Navbar/Navbar.tsx
@@ -1,7 +1,7 @@
 import { useActor } from "@xstate/react"
 import React, { useContext } from "react"
 import { XServiceContext } from "../../xServices/StateContext"
-import { NavbarView } from "./NavbarView"
+import { NavbarView } from "./NavbarView/NavbarView"
 
 export const Navbar: React.FC = () => {
   const xServices = useContext(XServiceContext)

diff --git a/site/src/components/Navbar/NavbarView/NavbarView.stories.tsx b/site/src/components/Navbar/NavbarView/NavbarView.stories.tsx
@@ -1,6 +1,6 @@
 import { Story } from "@storybook/react"
 import React from "react"
-import { NavbarView, NavbarViewProps } from "."
+import { NavbarView, NavbarViewProps } from "./NavbarView"
 
 export default {
   title: "components/NavbarView",

diff --git a/site/src/components/Navbar/NavbarView/NavbarView.test.tsx b/site/src/components/Navbar/NavbarView/NavbarView.test.tsx
@@ -1,8 +1,8 @@
 import { screen } from "@testing-library/react"
 import React from "react"
-import { NavbarView } from "."
 import { render } from "../../../testHelpers"
 import { MockUser } from "../../../testHelpers/entities"
+import { NavbarView } from "./NavbarView"
 
 describe("NavbarView", () => {
   const noop = () => {

diff --git a/...rc/components/Navbar/NavbarView/index.tsx → ...mponents/Navbar/NavbarView/NavbarView.tsx b/...rc/components/Navbar/NavbarView/index.tsx → ...mponents/Navbar/NavbarView/NavbarView.tsx
@@ -7,7 +7,7 @@ import { UserResponse } from "../../../api/types"
 import { navHeight } from "../../../theme/constants"
 import { AdminDropdown } from "../../AdminDropdown/AdminDropdown"
 import { Logo } from "../../Icons/Logo"
-import { UserDropdown } from "../UserDropdown"
+import { UserDropdown } from "../UserDropdown/UsersDropdown"
 
 export interface NavbarViewProps {
   user?: UserResponse

diff --git a/site/src/components/Navbar/UserDropdown/UserDropdown.stories.tsx b/site/src/components/Navbar/UserDropdown/UserDropdown.stories.tsx
@@ -1,7 +1,7 @@
 import Box from "@material-ui/core/Box"
 import { Story } from "@storybook/react"
 import React from "react"
-import { UserDropdown, UserDropdownProps } from "."
+import { UserDropdown, UserDropdownProps } from "./UsersDropdown"
 
 export default {
   title: "components/UserDropdown",

diff --git a/site/src/components/Navbar/UserDropdown/UserDropdown.test.tsx b/site/src/components/Navbar/UserDropdown/UserDropdown.test.tsx
@@ -1,8 +1,8 @@
 import { screen } from "@testing-library/react"
 import React from "react"
-import { Language, UserDropdown, UserDropdownProps } from "."
 import { render } from "../../../testHelpers"
 import { MockUser } from "../../../testHelpers/entities"
+import { Language, UserDropdown, UserDropdownProps } from "./UsersDropdown"
 
 const renderAndClick = async (props: Partial<UserDropdownProps> = {}) => {
   render(<UserDropdown user={props.user ?? MockUser} onSignOut={props.onSignOut ?? jest.fn()} />)

diff --git a/.../components/Navbar/UserDropdown/index.tsx → ...nts/Navbar/UserDropdown/UsersDropdown.tsx b/.../components/Navbar/UserDropdown/index.tsx → ...nts/Navbar/UserDropdown/UsersDropdown.tsx
@@ -12,7 +12,7 @@ import { BorderedMenu } from "../../BorderedMenu/BorderedMenu"
 import { CloseDropdown, OpenDropdown } from "../../DropdownArrows/DropdownArrows"
 import { DocsIcon } from "../../Icons/DocsIcon"
 import { LogoutIcon } from "../../Icons/LogoutIcon"
-import { UserAvatar } from "../../User"
+import { UserAvatar } from "../../User/UserAvatar"
 import { UserProfileCard } from "../../User/UserProfileCard"
 
 export const Language = {

diff --git a/site/src/components/Page/index.tsx b/site/src/components/Page/index.tsx
diff --git a/site/src/components/Preferences/AccountForm.tsx b/site/src/components/Preferences/AccountForm.tsx
@@ -3,9 +3,9 @@ import TextField from "@material-ui/core/TextField"
 import { FormikContextType, FormikErrors, useFormik } from "formik"
 import React from "react"
 import * as Yup from "yup"
-import { getFormHelpers, onChangeTrimmed } from "../Form"
+import { getFormHelpers, onChangeTrimmed } from "../Form/utils"
 import { Stack } from "../Stack/Stack"
-import { LoadingButton } from "./../Button"
+import { LoadingButton } from "./../Button/LoadingButton"
 
 interface AccountFormValues {
   name: string

diff --git a/site/src/components/Preferences/Layout.tsx b/site/src/components/Preferences/Layout.tsx
@@ -2,7 +2,7 @@ import Box from "@material-ui/core/Box"
 import React from "react"
 import { Outlet } from "react-router-dom"
 import { AuthAndFrame } from "../AuthAndFrame/AuthAndFrame"
-import { TabPanel } from "../TabPanel"
+import { TabPanel } from "../TabPanel/TabPanel"
 
 export const Language = {
   accountLabel: "Account",

diff --git a/site/src/components/Section/index.tsx → site/src/components/Section/Section.tsx b/site/src/components/Section/index.tsx → site/src/components/Section/Section.tsx
diff --git a/site/src/components/Section/SectionView.stories.tsx b/site/src/components/Section/SectionView.stories.tsx
@@ -2,7 +2,7 @@ import Button from "@material-ui/core/Button"
 import TextField from "@material-ui/core/TextField"
 import { Story } from "@storybook/react"
 import React from "react"
-import { Section, SectionProps } from "./"
+import { Section, SectionProps } from "./Section"
 
 export default {
   title: "components/Section",

diff --git a/site/src/components/SignIn/CliAuthToken.tsx b/site/src/components/SignIn/CliAuthToken.tsx
@@ -2,7 +2,7 @@ import Paper from "@material-ui/core/Paper"
 import { makeStyles } from "@material-ui/core/styles"
 import Typography from "@material-ui/core/Typography"
 import React from "react"
-import { CodeExample } from "../CodeExample"
+import { CodeExample } from "../CodeExample/CodeExample"
 
 export interface CliAuthTokenProps {
   sessionToken: string

diff --git a/site/src/components/SignIn/SignInForm.tsx b/site/src/components/SignIn/SignInForm.tsx
@@ -4,8 +4,8 @@ import TextField from "@material-ui/core/TextField"
 import { FormikContextType, useFormik } from "formik"
 import React from "react"
 import * as Yup from "yup"
-import { getFormHelpers, onChangeTrimmed } from "../Form"
-import { LoadingButton } from "./../Button"
+import { getFormHelpers, onChangeTrimmed } from "../Form/utils"
+import { LoadingButton } from "./../Button/LoadingButton"
 import { Welcome } from "./Welcome"
 
 /**

diff --git a/site/src/components/SignIn/index.tsx b/site/src/components/SignIn/index.tsx
diff --git a/site/src/components/Snackbar/GlobalSnackbar.tsx b/site/src/components/Snackbar/GlobalSnackbar.tsx
@@ -1,5 +1,10 @@
 import { makeStyles } from "@material-ui/core/styles"
 import React, { useCallback, useState } from "react"
+import { useCustomEvent } from "../../hooks/events"
+import { CustomEventListener } from "../../util/events"
+import { ErrorIcon } from "../Icons/ErrorIcon"
+import { Typography } from "../Typography/Typography"
+import { EnterpriseSnackbar } from "./EnterpriseSnackbar"
 import {
   AdditionalMessage,
   isNotificationList,
@@ -8,12 +13,7 @@ import {
   MsgType,
   NotificationMsg,
   SnackbarEventType,
-} from "."
-import { useCustomEvent } from "../../hooks/events"
-import { CustomEventListener } from "../../util/events"
-import { ErrorIcon } from "../Icons/ErrorIcon"
-import { Typography } from "../Typography/Typography"
-import { EnterpriseSnackbar } from "./EnterpriseSnackbar"
+} from "./utils"
 
 export const GlobalSnackbar: React.FC = () => {
   const styles = useStyles()

diff --git a/site/src/components/Snackbar/index.test.ts → site/src/components/Snackbar/utils.test.ts b/site/src/components/Snackbar/index.test.ts → site/src/components/Snackbar/utils.test.ts
@@ -1,4 +1,4 @@
-import { displaySuccess, isNotificationTextPrefixed, MsgType, NotificationMsg } from "./index"
+import { displaySuccess, isNotificationTextPrefixed, MsgType, NotificationMsg } from "./utils"
 
 describe("Snackbar", () => {
   describe("isNotificationTextPrefixed", () => {

diff --git a/site/src/components/Snackbar/index.ts → site/src/components/Snackbar/utils.ts b/site/src/components/Snackbar/index.ts → site/src/components/Snackbar/utils.ts
@@ -1,11 +1,5 @@
 import { dispatchCustomEvent } from "../../util/events"
 
-///////////////////////////////////////////////////////////////////////////////
-// Notification Component
-///////////////////////////////////////////////////////////////////////////////
-
-export { GlobalSnackbar } from "./GlobalSnackbar"
-
 ///////////////////////////////////////////////////////////////////////////////
 // Notification Types
 ///////////////////////////////////////////////////////////////////////////////

diff --git a/site/src/components/TabPanel/TabPanel.stories.tsx b/site/src/components/TabPanel/TabPanel.stories.tsx
@@ -1,6 +1,6 @@
 import { Story } from "@storybook/react"
 import React from "react"
-import { TabPanel, TabPanelProps } from "."
+import { TabPanel, TabPanelProps } from "./TabPanel"
 
 export default {
   title: "components/TabPanel",

diff --git a/site/src/components/TabPanel/index.tsx → site/src/components/TabPanel/TabPanel.tsx b/site/src/components/TabPanel/index.tsx → site/src/components/TabPanel/TabPanel.tsx
diff --git a/site/src/components/Table/Cells/UserCell.tsx b/site/src/components/Table/Cells/UserCell.tsx
@@ -3,7 +3,7 @@ import Link from "@material-ui/core/Link"
 import { makeStyles } from "@material-ui/core/styles"
 import Typography from "@material-ui/core/Typography"
 import React from "react"
-import { UserAvatar, UserAvatarProps } from "../../User"
+import { UserAvatar, UserAvatarProps } from "../../User/UserAvatar"
 
 export interface UserCellProps {
   Avatar: UserAvatarProps

diff --git a/site/src/components/Table/index.tsx b/site/src/components/Table/index.tsx
diff --git a/site/src/components/User/index.ts b/site/src/components/User/index.ts
diff --git a/site/src/components/UsersTable/UsersTable.tsx b/site/src/components/UsersTable/UsersTable.tsx
@@ -1,7 +1,7 @@
 import React from "react"
 import { UserResponse } from "../../api/types"
-import { Column, Table } from "../../components/Table"
-import { EmptyState } from "../EmptyState"
+import { Column, Table } from "../../components/Table/Table"
+import { EmptyState } from "../EmptyState/EmptyState"
 import { UserCell } from "../Table/Cells/UserCell"
 
 const Language = {

diff --git a/site/src/components/Workspace/index.ts b/site/src/components/Workspace/index.ts
diff --git a/site/src/components/index.tsx b/site/src/components/index.tsx
diff --git a/site/src/forms/CreateTemplateForm.tsx b/site/src/forms/CreateTemplateForm.tsx
@@ -4,15 +4,12 @@ import { FormikContextType, useFormik } from "formik"
 import React from "react"
 import * as Yup from "yup"
 import { CreateTemplateRequest, Organization, Provisioner, Template } from "../api/types"
-import { LoadingButton } from "../components/Button"
-import {
-  DropdownItem,
-  FormCloseButton,
-  FormDropdownField,
-  FormSection,
-  FormTextField,
-  FormTitle,
-} from "../components/Form"
+import { LoadingButton } from "../components/Button/LoadingButton"
+import { FormCloseButton } from "../components/Form/FormCloseButton"
+import { DropdownItem, FormDropdownField } from "../components/Form/FormDropdownField"
+import { FormSection } from "../components/Form/FormSection"
+import { FormTextField } from "../components/Form/FormTextField"
+import { FormTitle } from "../components/Form/FormTitle"
 
 export interface CreateTemplateFormProps {
   provisioners: Provisioner[]

diff --git a/site/src/forms/CreateWorkspaceForm.tsx b/site/src/forms/CreateWorkspaceForm.tsx
@@ -4,8 +4,11 @@ import { FormikContextType, useFormik } from "formik"
 import React from "react"
 import * as Yup from "yup"
 import { CreateWorkspaceRequest, Template, Workspace } from "../api/types"
-import { LoadingButton } from "../components/Button"
-import { FormCloseButton, FormSection, FormTextField, FormTitle } from "../components/Form"
+import { LoadingButton } from "../components/Button/LoadingButton"
+import { FormCloseButton } from "../components/Form/FormCloseButton"
+import { FormSection } from "../components/Form/FormSection"
+import { FormTextField } from "../components/Form/FormTextField"
+import { FormTitle } from "../components/Form/FormTitle"
 
 export interface CreateWorkspaceForm {
   template: Template

diff --git a/site/src/pages/UsersPage/UsersPage.tsx b/site/src/pages/UsersPage/UsersPage.tsx
@@ -1,6 +1,6 @@
 import { useActor } from "@xstate/react"
 import React, { useContext } from "react"
-import { ErrorSummary } from "../../components/ErrorSummary"
+import { ErrorSummary } from "../../components/ErrorSummary/ErrorSummary"
 import { XServiceContext } from "../../xServices/StateContext"
 import { UsersPageView } from "./UsersPageView"
 

diff --git a/site/src/pages/UsersPage/UsersPageView.tsx b/site/src/pages/UsersPage/UsersPageView.tsx
@@ -1,7 +1,7 @@
 import { makeStyles } from "@material-ui/core/styles"
 import React from "react"
 import { Pager, UserResponse } from "../../api/types"
-import { Header } from "../../components/Header"
+import { Header } from "../../components/Header/Header"
 import { UsersTable } from "../../components/UsersTable/UsersTable"
 
 export const Language = {

diff --git a/site/src/pages/cli-auth.tsx b/site/src/pages/cli-auth.tsx
@@ -3,7 +3,7 @@ import { useActor } from "@xstate/react"
 import React, { useContext, useEffect, useState } from "react"
 import { getApiKey } from "../api"
 import { FullScreenLoader } from "../components/Loader/FullScreenLoader"
-import { CliAuthToken } from "../components/SignIn"
+import { CliAuthToken } from "../components/SignIn/CliAuthToken"
 import { XServiceContext } from "../xServices/StateContext"
 
 export const CliAuthenticationPage: React.FC = () => {

diff --git a/site/src/pages/login.tsx b/site/src/pages/login.tsx
@@ -5,7 +5,7 @@ import { Navigate, useLocation } from "react-router-dom"
 import { Footer } from "../components/Page/Footer"
 import { retrieveRedirect } from "../util/redirect"
 import { XServiceContext } from "../xServices/StateContext"
-import { SignInForm } from "./../components/SignIn"
+import { SignInForm } from "./../components/SignIn/SignInForm"
 
 export const useStyles = makeStyles((theme) => ({
   root: {

diff --git a/site/src/pages/preferences/account.tsx b/site/src/pages/preferences/account.tsx
@@ -2,7 +2,7 @@ import { useActor } from "@xstate/react"
 import React, { useContext } from "react"
 import { isApiError, mapApiErrorToFieldErrors } from "../../api/errors"
 import { AccountForm } from "../../components/Preferences/AccountForm"
-import { Section } from "../../components/Section"
+import { Section } from "../../components/Section/Section"
 import { XServiceContext } from "../../xServices/StateContext"
 
 export const Language = {

diff --git a/site/src/pages/preferences/linkedAccounts.tsx b/site/src/pages/preferences/linkedAccounts.tsx
@@ -1,5 +1,5 @@
 import React from "react"
-import { Section } from "../../components/Section"
+import { Section } from "../../components/Section/Section"
 
 const Language = {
   title: "Linked Accounts",