chore: Enforce type import consistency (#10968)

* Update types

* fix circular dep

* type imports

* lint type imports and --fix

.oxlintrc.json

@@ -86,6 +86,7 @@
         "@typescript-eslint/no-require-imports": "off",
         "import/no-named-as-default": "off",
         "import/no-named-as-default-member": "off",
+        "typescript/consistent-type-imports": "error",
         "no-unused-vars": [
           "error",
           {

app/actions/definitions/apiKeys.tsx

@@ -1,6 +1,6 @@
 import { PlusIcon, TrashIcon } from "outline-icons";
 import stores from "~/stores";
-import ApiKey from "~/models/ApiKey";
+import type ApiKey from "~/models/ApiKey";
 import ApiKeyNew from "~/scenes/ApiKeyNew";
 import ApiKeyRevokeDialog from "~/scenes/Settings/components/ApiKeyRevokeDialog";
 import { createAction } from "..";

app/actions/definitions/collections.tsx

@@ -20,7 +20,7 @@ import {
   UnsubscribeIcon,
 } from "outline-icons";
 import { toast } from "sonner";
-import Collection from "~/models/Collection";
+import type Collection from "~/models/Collection";
 import { CollectionEdit } from "~/components/Collection/CollectionEdit";
 import { CollectionNew } from "~/components/Collection/CollectionNew";
 import CollectionDeleteDialog from "~/components/CollectionDeleteDialog";

app/actions/definitions/comments.tsx

@@ -1,6 +1,6 @@
 import { DoneIcon, SmileyIcon, TrashIcon } from "outline-icons";
 import { toast } from "sonner";
-import Comment from "~/models/Comment";
+import type Comment from "~/models/Comment";
 import CommentDeleteDialog from "~/components/CommentDeleteDialog";
 import ViewReactionsDialog from "~/components/Reactions/ViewReactionsDialog";
 import { createAction } from "..";

app/actions/definitions/documents.tsx

@@ -35,13 +35,10 @@ import {
 } from "outline-icons";
 import { toast } from "sonner";
 import Icon from "@shared/components/Icon";
-import {
-  ExportContentType,
-  TeamPreference,
-  NavigationNode,
-} from "@shared/types";
+import type { NavigationNode } from "@shared/types";
+import { ExportContentType, TeamPreference } from "@shared/types";
 import { getEventFiles } from "@shared/utils/files";
-import UserMembership from "~/models/UserMembership";
+import type UserMembership from "~/models/UserMembership";
 import DocumentDelete from "~/scenes/DocumentDelete";
 import DocumentMove from "~/scenes/DocumentMove";
 import DocumentPermanentDelete from "~/scenes/DocumentPermanentDelete";
@@ -79,7 +76,7 @@ import {
 } from "~/utils/routeHelpers";
 import capitalize from "lodash/capitalize";
 import CollectionIcon from "~/components/Icons/CollectionIcon";
-import { Action, ActionGroup, ActionSeparator } from "~/types";
+import type { Action, ActionGroup, ActionSeparator } from "~/types";
 import lazyWithRetry from "~/utils/lazyWithRetry";
 
 const Insights = lazyWithRetry(

app/actions/definitions/integrations.tsx

@@ -2,9 +2,9 @@ import { TrashIcon } from "outline-icons";
 import stores from "~/stores";
 import { createAction } from "..";
 import { SettingsSection } from "../sections";
-import Integration from "~/models/Integration";
+import type Integration from "~/models/Integration";
 import { DisconnectAnalyticsDialog } from "~/scenes/Settings/components/DisconnectAnalyticsDialog";
-import { IntegrationType } from "@shared/types";
+import type { IntegrationType } from "@shared/types";
 import { settingsPath } from "@shared/utils/routeHelpers";
 import history from "~/utils/history";
 

app/actions/definitions/navigation.tsx

@@ -17,7 +17,7 @@ import {
 import { UrlHelper } from "@shared/utils/UrlHelper";
 import { isMac } from "@shared/utils/browser";
 import stores from "~/stores";
-import SearchQuery from "~/models/SearchQuery";
+import type SearchQuery from "~/models/SearchQuery";
 import KeyboardShortcuts from "~/scenes/KeyboardShortcuts";
 import {
   createAction,

app/actions/definitions/notifications.tsx

@@ -1,7 +1,7 @@
 import { ArchiveIcon, CheckmarkIcon, MarkAsReadIcon } from "outline-icons";
 import { createAction } from "..";
 import { NotificationSection } from "../sections";
-import Notification from "~/models/Notification";
+import type Notification from "~/models/Notification";
 
 export const markNotificationsAsRead = createAction({
   name: ({ t }) => t("Mark notifications as read"),

app/actions/definitions/shares.tsx

@@ -1,5 +1,5 @@
 import copy from "copy-to-clipboard";
-import Share from "~/models/Share";
+import type Share from "~/models/Share";
 import { createAction, createInternalLinkAction } from "..";
 import { ArrowIcon, CopyIcon, TrashIcon } from "outline-icons";
 import { ShareSection } from "../sections";

app/actions/definitions/teams.tsx

@@ -1,7 +1,7 @@
 import { ArrowIcon, PlusIcon } from "outline-icons";
 import styled from "styled-components";
 import { stringToColor } from "@shared/utils/color";
-import RootStore from "~/stores/RootStore";
+import type RootStore from "~/stores/RootStore";
 import { LoginDialog } from "~/scenes/Login/components/LoginDialog";
 import TeamNew from "~/scenes/TeamNew";
 import TeamLogo from "~/components/TeamLogo";
@@ -10,7 +10,7 @@ import {
   createActionWithChildren,
   createExternalLinkAction,
 } from "~/actions";
-import { ActionContext, ExternalLinkAction } from "~/types";
+import type { ActionContext, ExternalLinkAction } from "~/types";
 import Desktop from "~/utils/Desktop";
 import { TeamSection } from "../sections";
 

app/actions/definitions/users.tsx

@@ -1,8 +1,8 @@
 import { PlusIcon } from "outline-icons";
-import { UserRole } from "@shared/types";
+import type { UserRole } from "@shared/types";
 import { UserRoleHelper } from "@shared/utils/UserRoleHelper";
 import stores from "~/stores";
-import User from "~/models/User";
+import type User from "~/models/User";
 import Invite from "~/scenes/Invite";
 import {
   UserChangeRoleDialog,

app/actions/index.ts

@@ -1,8 +1,8 @@
-import { LocationDescriptor } from "history";
+import type { LocationDescriptor } from "history";
 import { toast } from "sonner";
-import { Optional } from "utility-types";
+import type { Optional } from "utility-types";
 import { v4 as uuidv4 } from "uuid";
-import {
+import type {
   ActionContext,
   Action,
   ActionGroup,
@@ -15,7 +15,7 @@ import {
 } from "~/types";
 import Analytics from "~/utils/Analytics";
 import history from "~/utils/history";
-import { Action as KbarAction } from "kbar";
+import type { Action as KbarAction } from "kbar";
 
 export function resolve<T>(value: any, context: ActionContext): T {
   return typeof value === "function" ? value(context) : value;

app/actions/sections.ts

@@ -1,4 +1,4 @@
-import { ActionContext } from "~/types";
+import type { ActionContext } from "~/types";
 
 export const CollectionSection = ({ t }: ActionContext) => t("Collection");
 

app/components/ActionButton.tsx

@@ -1,10 +1,11 @@
 /* oxlint-disable react/prop-types */
 import * as React from "react";
-import Tooltip, { Props as TooltipProps } from "~/components/Tooltip";
+import type { Props as TooltipProps } from "~/components/Tooltip";
+import Tooltip from "~/components/Tooltip";
 import { performAction, resolve } from "~/actions";
 import useIsMounted from "~/hooks/useIsMounted";
 import useActionContext from "~/hooks/useActionContext";
-import { ActionVariant, ActionWithChildren } from "~/types";
+import type { ActionVariant, ActionWithChildren } from "~/types";
 
 export type Props = React.HTMLAttributes<HTMLButtonElement> & {
   /** Show the button in a disabled state */

app/components/Analytics.tsx

@@ -2,7 +2,8 @@
 /* global ga */
 import escape from "lodash/escape";
 import * as React from "react";
-import { IntegrationService, PublicEnv } from "@shared/types";
+import type { PublicEnv } from "@shared/types";
+import { IntegrationService } from "@shared/types";
 import env from "~/env";
 
 type Props = {

app/components/Avatar/AvatarWithPresence.tsx

@@ -3,7 +3,7 @@ import * as React from "react";
 import { useTranslation } from "react-i18next";
 import styled, { css } from "styled-components";
 import { s } from "@shared/styles";
-import User from "~/models/User";
+import type User from "~/models/User";
 import Tooltip from "~/components/Tooltip";
 import Avatar, { AvatarSize } from "./Avatar";
 

app/components/Avatar/GroupAvatar.tsx

@@ -1,7 +1,7 @@
 import { GroupIcon } from "outline-icons";
 import { useTheme } from "styled-components";
 import Squircle from "@shared/components/Squircle";
-import Group from "~/models/Group";
+import type Group from "~/models/Group";
 import { AvatarSize } from "../Avatar/Avatar";
 
 type Props = {

app/components/Avatar/index.ts

@@ -1,4 +1,5 @@
-import Avatar, { IAvatar, AvatarSize, AvatarVariant } from "./Avatar";
+import type { IAvatar } from "./Avatar";
+import Avatar, { AvatarSize, AvatarVariant } from "./Avatar";
 import AvatarWithPresence from "./AvatarWithPresence";
 import { GroupAvatar } from "./GroupAvatar";
 

app/components/Breadcrumb.tsx

@@ -6,7 +6,7 @@ import { s, ellipsis } from "@shared/styles";
 import Flex from "~/components/Flex";
 import BreadcrumbMenu from "~/menus/BreadcrumbMenu";
 import { undraggableOnDesktop } from "~/styles";
-import { InternalLinkAction, MenuInternalLink } from "~/types";
+import type { InternalLinkAction, MenuInternalLink } from "~/types";
 import { actionToMenuItem } from "~/actions";
 import useActionContext from "~/hooks/useActionContext";
 import { useComputed } from "~/hooks/useComputed";

app/components/Button.tsx

@@ -1,12 +1,11 @@
-import { LocationDescriptor } from "history";
+import type { LocationDescriptor } from "history";
 import { DisclosureIcon } from "outline-icons";
 import { darken, lighten, transparentize } from "polished";
 import * as React from "react";
 import styled from "styled-components";
 import { s } from "@shared/styles";
-import ActionButton, {
-  Props as ActionButtonProps,
-} from "~/components/ActionButton";
+import type { Props as ActionButtonProps } from "~/components/ActionButton";
+import ActionButton from "~/components/ActionButton";
 import { undraggableOnDesktop } from "~/styles";
 
 type RealProps = {

app/components/Collaborators.tsx

@@ -5,7 +5,7 @@ import uniq from "lodash/uniq";
 import { observer } from "mobx-react";
 import { useState, useMemo, useEffect, useCallback } from "react";
 import { useTranslation } from "react-i18next";
-import Document from "~/models/Document";
+import type Document from "~/models/Document";
 import { AvatarSize, AvatarWithPresence } from "~/components/Avatar";
 import DocumentViews from "~/components/DocumentViews";
 import Facepile from "~/components/Facepile";

app/components/Collection/CollectionEdit.tsx

@@ -2,7 +2,8 @@ import { observer } from "mobx-react";
 import { useCallback } from "react";
 import { toast } from "sonner";
 import useStores from "~/hooks/useStores";
-import { CollectionForm, FormData } from "./CollectionForm";
+import type { FormData } from "./CollectionForm";
+import { CollectionForm } from "./CollectionForm";
 
 type Props = {
   collectionId: string;

app/components/Collection/CollectionForm.tsx

@@ -6,11 +6,12 @@ import { Trans, useTranslation } from "react-i18next";
 import styled from "styled-components";
 import Icon from "@shared/components/Icon";
 import { randomElement } from "@shared/random";
-import { CollectionPermission, TeamPreference } from "@shared/types";
+import type { CollectionPermission } from "@shared/types";
+import { TeamPreference } from "@shared/types";
 import { IconLibrary } from "@shared/utils/IconLibrary";
 import { colorPalette } from "@shared/utils/collections";
 import { CollectionValidation } from "@shared/validations";
-import Collection from "~/models/Collection";
+import type Collection from "~/models/Collection";
 import Button from "~/components/Button";
 import Flex from "~/components/Flex";
 import Input from "~/components/Input";

app/components/Collection/CollectionNew.tsx

@@ -4,7 +4,8 @@ import { useCallback } from "react";
 import { toast } from "sonner";
 import useStores from "~/hooks/useStores";
 import history from "~/utils/history";
-import { CollectionForm, FormData } from "./CollectionForm";
+import type { FormData } from "./CollectionForm";
+import { CollectionForm } from "./CollectionForm";
 
 type Props = {
   onSubmit: () => void;

app/components/CollectionBreadcrumb.tsx

@@ -1,7 +1,7 @@
 import { ArchiveIcon } from "outline-icons";
 import * as React from "react";
 import { useTranslation } from "react-i18next";
-import Collection from "~/models/Collection";
+import type Collection from "~/models/Collection";
 import CollectionIcon from "~/components/Icons/CollectionIcon";
 import { archivePath, collectionPath } from "~/utils/routeHelpers";
 import Breadcrumb from "./Breadcrumb";

app/components/CollectionDeleteDialog.tsx

@@ -2,7 +2,7 @@ import { observer } from "mobx-react";
 import { useTranslation, Trans } from "react-i18next";
 import { useHistory } from "react-router-dom";
 import { toast } from "sonner";
-import Collection from "~/models/Collection";
+import type Collection from "~/models/Collection";
 import ConfirmationDialog from "~/components/ConfirmationDialog";
 import Text from "~/components/Text";
 import useCurrentTeam from "~/hooks/useCurrentTeam";

app/components/CommandBar/CommandBarItem.tsx

@@ -1,4 +1,4 @@
-import { ActionImpl } from "kbar";
+import type { ActionImpl } from "kbar";
 import { ArrowIcon, BackIcon } from "outline-icons";
 import * as React from "react";
 import styled, { css, useTheme } from "styled-components";

app/components/CommentDeleteDialog.tsx

@@ -1,7 +1,7 @@
 import { observer } from "mobx-react";
 import { useTranslation, Trans } from "react-i18next";
 import { toast } from "sonner";
-import Comment from "~/models/Comment";
+import type Comment from "~/models/Comment";
 import ConfirmationDialog from "~/components/ConfirmationDialog";
 import Text from "~/components/Text";
 import useStores from "~/hooks/useStores";

app/components/ConfirmMoveDialog.tsx

@@ -1,7 +1,8 @@
 import { observer } from "mobx-react";
 import { Trans, useTranslation } from "react-i18next";
 import { toast } from "sonner";
-import { CollectionPermission, NavigationNode } from "@shared/types";
+import type { NavigationNode } from "@shared/types";
+import { CollectionPermission } from "@shared/types";
 import type Collection from "~/models/Collection";
 import ConfirmationDialog from "~/components/ConfirmationDialog";
 import useStores from "~/hooks/useStores";

app/components/DefaultCollectionInputSelect.tsx

@@ -3,7 +3,8 @@ import React, { useState } from "react";
 import { useTranslation } from "react-i18next";
 import { toast } from "sonner";
 import CollectionIcon from "~/components/Icons/CollectionIcon";
-import { InputSelect, Option } from "~/components/InputSelect";
+import type { Option } from "~/components/InputSelect";
+import { InputSelect } from "~/components/InputSelect";
 import useStores from "~/hooks/useStores";
 
 type DefaultCollectionInputSelectProps = {

app/components/DocumentBreadcrumb.tsx

@@ -5,7 +5,7 @@ import { useTranslation } from "react-i18next";
 import styled from "styled-components";
 import Icon from "@shared/components/Icon";
 import type { NavigationNode } from "@shared/types";
-import Document from "~/models/Document";
+import type Document from "~/models/Document";
 import Breadcrumb from "~/components/Breadcrumb";
 import CollectionIcon from "~/components/Icons/CollectionIcon";
 import { useLocationSidebarContext } from "~/hooks/useLocationSidebarContext";

app/components/DocumentCard.tsx

@@ -13,8 +13,8 @@ import Squircle from "@shared/components/Squircle";
 import { s, hover, ellipsis } from "@shared/styles";
 import { IconType } from "@shared/types";
 import { determineIconType } from "@shared/utils/icon";
-import Document from "~/models/Document";
-import Pin from "~/models/Pin";
+import type Document from "~/models/Document";
+import type Pin from "~/models/Pin";
 import Flex from "~/components/Flex";
 import NudeButton from "~/components/NudeButton";
 import Time from "~/components/Time";

app/components/DocumentContext.tsx

@@ -1,8 +1,9 @@
 import { action, computed, observable } from "mobx";
-import { createContext, useContext, useMemo, PropsWithChildren } from "react";
-import { Heading } from "@shared/utils/ProsemirrorHelper";
-import Document from "~/models/Document";
-import { Editor } from "~/editor";
+import type { PropsWithChildren } from "react";
+import { createContext, useContext, useMemo } from "react";
+import type { Heading } from "@shared/utils/ProsemirrorHelper";
+import type Document from "~/models/Document";
+import type { Editor } from "~/editor";
 
 class DocumentContext {
   /** The current document */

app/components/DocumentCopy.tsx

@@ -3,8 +3,8 @@ import * as React from "react";
 import { Trans, useTranslation } from "react-i18next";
 import { toast } from "sonner";
 import styled from "styled-components";
-import { NavigationNode } from "@shared/types";
-import Document from "~/models/Document";
+import type { NavigationNode } from "@shared/types";
+import type Document from "~/models/Document";
 import { FlexContainer, Footer, StyledText } from "~/scenes/DocumentMove";
 import Button from "~/components/Button";
 import DocumentExplorer from "~/components/DocumentExplorer";

app/components/DocumentExplorer.tsx

@@ -16,7 +16,7 @@ import scrollIntoView from "scroll-into-view-if-needed";
 import styled, { useTheme } from "styled-components";
 import breakpoint from "styled-components-breakpoint";
 import Icon from "@shared/components/Icon";
-import { NavigationNode } from "@shared/types";
+import type { NavigationNode } from "@shared/types";
 import { isModKey } from "@shared/utils/keyboard";
 import { ancestors, descendants, flattenTree } from "@shared/utils/tree";
 import DocumentExplorerNode from "~/components/DocumentExplorerNode";

app/components/DocumentListItem.tsx

@@ -11,7 +11,7 @@ import breakpoint from "styled-components-breakpoint";
 import EventBoundary from "@shared/components/EventBoundary";
 import Icon from "@shared/components/Icon";
 import { s, hover } from "@shared/styles";
-import Document from "~/models/Document";
+import type Document from "~/models/Document";
 import Badge from "~/components/Badge";
 import DocumentMeta from "~/components/DocumentMeta";
 import Flex from "~/components/Flex";

app/components/DocumentMeta.tsx

@@ -1,12 +1,12 @@
-import { LocationDescriptor } from "history";
+import type { LocationDescriptor } from "history";
 import { observer } from "mobx-react";
 import * as React from "react";
 import { useTranslation } from "react-i18next";
 import { Link } from "react-router-dom";
 import styled from "styled-components";
 import { s, ellipsis } from "@shared/styles";
-import Document from "~/models/Document";
-import Revision from "~/models/Revision";
+import type Document from "~/models/Document";
+import type Revision from "~/models/Revision";
 import DocumentBreadcrumb from "~/components/DocumentBreadcrumb";
 import DocumentTasks from "~/components/DocumentTasks";
 import Flex from "~/components/Flex";

app/components/DocumentTasks.tsx

@@ -1,9 +1,9 @@
-import { TFunction } from "i18next";
+import type { TFunction } from "i18next";
 import { observer } from "mobx-react";
 import { DoneIcon } from "outline-icons";
 import { useTranslation } from "react-i18next";
 import styled, { useTheme } from "styled-components";
-import Document from "~/models/Document";
+import type Document from "~/models/Document";
 import CircularProgressBar from "~/components/CircularProgressBar";
 import usePrevious from "~/hooks/usePrevious";
 import { bounceIn } from "~/styles/animations";

app/components/DocumentViews.tsx

@@ -4,8 +4,8 @@ import { observer } from "mobx-react";
 import { useMemo, useCallback } from "react";
 import { useTranslation } from "react-i18next";
 import { dateLocale, dateToRelative } from "@shared/utils/date";
-import Document from "~/models/Document";
-import User from "~/models/User";
+import type Document from "~/models/Document";
+import type User from "~/models/User";
 import { Avatar, AvatarSize } from "~/components/Avatar";
 import ListItem from "~/components/List/Item";
 import PaginatedList from "~/components/PaginatedList";

app/components/DocumentsLoader.tsx

@@ -1,6 +1,6 @@
 import { observer } from "mobx-react";
 import * as React from "react";
-import Collection from "~/models/Collection";
+import type Collection from "~/models/Collection";
 
 type Props = {
   enabled: boolean;

app/components/Editor.tsx

@@ -4,7 +4,7 @@ import { DOMParser as ProsemirrorDOMParser } from "prosemirror-model";
 import { TextSelection } from "prosemirror-state";
 import * as React from "react";
 import { mergeRefs } from "react-merge-refs";
-import { Optional } from "utility-types";
+import type { Optional } from "utility-types";
 import insertFiles from "@shared/editor/commands/insertFiles";
 import EditorContainer from "@shared/editor/components/Styles";
 import { AttachmentPreset } from "@shared/types";

app/components/ErrorBoundary.tsx

@@ -1,7 +1,8 @@
 import { observable } from "mobx";
 import { observer } from "mobx-react";
 import * as React from "react";
-import { withTranslation, Trans, WithTranslation } from "react-i18next";
+import type { WithTranslation } from "react-i18next";
+import { withTranslation, Trans } from "react-i18next";
 import styled from "styled-components";
 import { s } from "@shared/styles";
 import { UrlHelper } from "@shared/utils/UrlHelper";

app/components/EventListItem.tsx

@@ -12,8 +12,8 @@ import {
 import { useTranslation } from "react-i18next";
 import styled, { css } from "styled-components";
 import { s } from "@shared/styles";
-import Document from "~/models/Document";
-import Event from "~/models/Event";
+import type Document from "~/models/Document";
+import type Event from "~/models/Event";
 import Time from "~/components/Time";
 import Logger from "~/utils/Logger";
 import Text from "./Text";

app/components/ExportDialog.tsx

@@ -4,7 +4,7 @@ import { Trans, useTranslation } from "react-i18next";
 import { toast } from "sonner";
 import styled from "styled-components";
 import { FileOperationFormat, NotificationEventType } from "@shared/types";
-import Collection from "~/models/Collection";
+import type Collection from "~/models/Collection";
 import ConfirmationDialog from "~/components/ConfirmationDialog";
 import Flex from "~/components/Flex";
 import Text from "~/components/Text";

app/components/Facepile.tsx

@@ -2,7 +2,7 @@ import { observer } from "mobx-react";
 import * as React from "react";
 import { useTranslation } from "react-i18next";
 import styled from "styled-components";
-import User from "~/models/User";
+import type User from "~/models/User";
 import { Avatar, AvatarSize } from "~/components/Avatar";
 import Flex from "~/components/Flex";
 import { s } from "@shared/styles";

app/components/FilterOptions.tsx

@@ -7,7 +7,8 @@ import type { FetchPageParams } from "~/stores/base/Store";
 import Button, { Inner } from "~/components/Button";
 import Text from "~/components/Text";
 import Input, { NativeInput, Outline } from "./Input";
-import PaginatedList, { PaginatedItem } from "./PaginatedList";
+import type { PaginatedItem } from "./PaginatedList";
+import PaginatedList from "./PaginatedList";
 import { MenuProvider } from "./primitives/Menu/MenuContext";
 import { Menu, MenuContent, MenuTrigger, MenuButton } from "./primitives/Menu";
 import { MenuIconWrapper } from "./primitives/components/Menu";

app/components/HoverPreview/HoverPreviewDocument.tsx

@@ -1,6 +1,6 @@
 import * as React from "react";
 import { richExtensions } from "@shared/editor/nodes";
-import { UnfurlResourceType, UnfurlResponse } from "@shared/types";
+import type { UnfurlResourceType, UnfurlResponse } from "@shared/types";
 import Editor from "~/components/Editor";
 import Flex from "~/components/Flex";
 import ErrorBoundary from "../ErrorBoundary";

app/components/HoverPreview/HoverPreviewGroup.tsx

@@ -1,8 +1,8 @@
 import * as React from "react";
 import { useTranslation } from "react-i18next";
-import { UnfurlResourceType, UnfurlResponse } from "@shared/types";
+import type { UnfurlResourceType, UnfurlResponse } from "@shared/types";
 import { MAX_AVATAR_DISPLAY } from "@shared/constants";
-import User from "~/models/User";
+import type User from "~/models/User";
 import Facepile from "~/components/Facepile";
 import Flex from "~/components/Flex";
 import {

app/components/HoverPreview/HoverPreviewIssue.tsx

@@ -3,11 +3,8 @@ import { Trans } from "react-i18next";
 import styled from "styled-components";
 import { Backticks } from "@shared/components/Backticks";
 import { IssueStatusIcon } from "@shared/components/IssueStatusIcon";
-import {
-  IntegrationService,
-  UnfurlResourceType,
-  UnfurlResponse,
-} from "@shared/types";
+import type { UnfurlResourceType, UnfurlResponse } from "@shared/types";
+import { IntegrationService } from "@shared/types";
 import { Avatar } from "~/components/Avatar";
 import Flex from "~/components/Flex";
 import Text from "../Text";

app/components/HoverPreview/HoverPreviewMention.tsx

@@ -1,5 +1,5 @@
 import * as React from "react";
-import { UnfurlResourceType, UnfurlResponse } from "@shared/types";
+import type { UnfurlResourceType, UnfurlResponse } from "@shared/types";
 import { Avatar, AvatarSize } from "~/components/Avatar";
 import Flex from "~/components/Flex";
 import { Preview, Title, Info, Card, CardContent } from "./Components";

app/components/HoverPreview/HoverPreviewPullRequest.tsx

@@ -3,7 +3,7 @@ import { Trans } from "react-i18next";
 import styled from "styled-components";
 import { Backticks } from "@shared/components/Backticks";
 import { PullRequestIcon } from "@shared/components/PullRequestIcon";
-import { UnfurlResourceType, UnfurlResponse } from "@shared/types";
+import type { UnfurlResourceType, UnfurlResponse } from "@shared/types";
 import { Avatar } from "~/components/Avatar";
 import Flex from "~/components/Flex";
 import Text from "../Text";

app/components/IconPicker/components/EmojiPanel.tsx

@@ -2,17 +2,19 @@ import concat from "lodash/concat";
 import { PlusIcon } from "outline-icons";
 import * as React from "react";
 import { useTranslation } from "react-i18next";
-import { EmojiCategory, EmojiSkinTone, IconType } from "@shared/types";
+import type { EmojiSkinTone } from "@shared/types";
+import { EmojiCategory, IconType } from "@shared/types";
 import { getEmojis, getEmojisWithCategory, search } from "@shared/utils/emoji";
 import Flex from "~/components/Flex";
 import { EmojiCreateDialog } from "~/components/EmojiCreateDialog";
 import { DisplayCategory } from "../utils";
-import GridTemplate, { DataNode, EmojiNode } from "./GridTemplate";
+import type { DataNode, EmojiNode } from "./GridTemplate";
+import GridTemplate from "./GridTemplate";
 import SkinTonePicker from "./SkinTonePicker";
 import { StyledInputSearch, UserInputContainer } from "./Components";
 import { useIconState } from "../useIconState";
 import useStores from "~/hooks/useStores";
-import Emoji from "~/models/Emoji";
+import type Emoji from "~/models/Emoji";
 import { useComputed } from "~/hooks/useComputed";
 import { MenuButton } from "./MenuButton";
 import useCurrentTeam from "~/hooks/useCurrentTeam";

app/components/IconPicker/components/Grid.tsx

@@ -1,5 +1,6 @@
 import React from "react";
-import { FixedSizeList, ListChildComponentProps } from "react-window";
+import type { ListChildComponentProps } from "react-window";
+import { FixedSizeList } from "react-window";
 import styled from "styled-components";
 
 type Props = {

app/components/IconPicker/components/IconPanel.tsx

@@ -7,7 +7,8 @@ import Flex from "~/components/Flex";
 import InputSearch from "~/components/InputSearch";
 import { DisplayCategory } from "../utils";
 import ColorPicker from "./ColorPicker";
-import GridTemplate, { DataNode } from "./GridTemplate";
+import type { DataNode } from "./GridTemplate";
+import GridTemplate from "./GridTemplate";
 import { useIconState } from "../useIconState";
 
 const IconNames = Object.keys(IconLibrary.mapping);

app/components/Icons/CollectionIcon.tsx

@@ -3,7 +3,7 @@ import { CollectionIcon, PrivateCollectionIcon } from "outline-icons";
 import { getLuminance } from "polished";
 import Icon from "@shared/components/Icon";
 import { colorPalette } from "@shared/utils/collections";
-import Collection from "~/models/Collection";
+import type Collection from "~/models/Collection";
 import useStores from "~/hooks/useStores";
 
 type Props = {

app/components/InputColor.tsx

@@ -1,6 +1,7 @@
 import * as React from "react";
 import styled from "styled-components";
-import Input, { Props as InputProps } from "./Input";
+import type { Props as InputProps } from "./Input";
+import Input from "./Input";
 import Relative from "./Sidebar/components/Relative";
 import { SwatchButton } from "./SwatchButton";
 

app/components/InputMemberPermissionSelect.tsx

@@ -2,8 +2,10 @@ import * as React from "react";
 import { useTranslation } from "react-i18next";
 import styled from "styled-components";
 import { s } from "@shared/styles";
-import { InputSelect, Option } from "~/components/InputSelect";
-import { EmptySelectValue, Permission } from "~/types";
+import type { Option } from "~/components/InputSelect";
+import { InputSelect } from "~/components/InputSelect";
+import type { Permission } from "~/types";
+import { EmptySelectValue } from "~/types";
 
 type Props = Pick<
   React.ComponentProps<typeof InputSelect>,

app/components/InputSearch.tsx

@@ -2,7 +2,8 @@ import { SearchIcon } from "outline-icons";
 import * as React from "react";
 import { useTranslation } from "react-i18next";
 import { useTheme } from "styled-components";
-import Input, { Props as InputProps } from "~/components/Input";
+import type { Props as InputProps } from "~/components/Input";
+import Input from "~/components/Input";
 
 type Props = InputProps & {
   placeholder?: string;

app/components/InputSelectPermission.tsx

@@ -3,7 +3,8 @@ import { useTranslation } from "react-i18next";
 import styled from "styled-components";
 import { s } from "@shared/styles";
 import { CollectionPermission } from "@shared/types";
-import { InputSelect, Option } from "~/components/InputSelect";
+import type { Option } from "~/components/InputSelect";
+import { InputSelect } from "~/components/InputSelect";
 import { EmptySelectValue } from "~/types";
 
 type Props = {

app/components/Layout.tsx

@@ -1,7 +1,8 @@
 import { observer } from "mobx-react";
 import * as React from "react";
 import { Helmet } from "react-helmet-async";
-import styled, { DefaultTheme } from "styled-components";
+import type { DefaultTheme } from "styled-components";
+import styled from "styled-components";
 import breakpoint from "styled-components-breakpoint";
 import { s } from "@shared/styles";
 import Flex from "~/components/Flex";

app/components/Lightbox.tsx

@@ -1,12 +1,11 @@
 import { observer } from "mobx-react";
 import * as Dialog from "@radix-ui/react-dialog";
-import styled, { css, Keyframes, keyframes } from "styled-components";
+import type { Keyframes } from "styled-components";
+import styled, { css, keyframes } from "styled-components";
+import type { ComponentProps, HTMLAttributes, ReactNode } from "react";
 import {
-  ComponentProps,
   createContext,
   forwardRef,
-  HTMLAttributes,
-  ReactNode,
   useCallback,
   useContext,
   useEffect,
@@ -42,12 +41,12 @@ import { Separator } from "./Actions";
 import useSwipe from "~/hooks/useSwipe";
 import { toast } from "sonner";
 import { findIndex } from "lodash";
-import { LightboxImage } from "@shared/editor/lib/Lightbox";
+import type { LightboxImage } from "@shared/editor/lib/Lightbox";
+import type { ReactZoomPanPinchRef } from "react-zoom-pan-pinch";
 import {
   TransformWrapper,
   TransformComponent,
   useTransformEffect,
-  ReactZoomPanPinchRef,
 } from "react-zoom-pan-pinch";
 import { transparentize } from "polished";
 import { mergeRefs } from "react-merge-refs";

app/components/List/Item.tsx

@@ -2,7 +2,7 @@ import {
   useFocusEffect,
   useRovingTabIndex,
 } from "@getoutline/react-roving-tabindex";
-import { LocationDescriptor } from "history";
+import type { LocationDescriptor } from "history";
 import * as React from "react";
 import scrollIntoView from "scroll-into-view-if-needed";
 import styled, { useTheme } from "styled-components";

app/components/List/Placeholder.tsx

@@ -2,9 +2,8 @@ import times from "lodash/times";
 import styled from "styled-components";
 import Fade from "~/components/Fade";
 import Flex from "~/components/Flex";
-import PlaceholderText, {
-  Props as PlaceholderTextProps,
-} from "~/components/PlaceholderText";
+import type { Props as PlaceholderTextProps } from "~/components/PlaceholderText";
+import PlaceholderText from "~/components/PlaceholderText";
 
 type Props = {
   count?: number;

app/components/LocaleTime.tsx

@@ -1,5 +1,5 @@
 import * as React from "react";
-import { locales } from "@shared/utils/date";
+import type { locales } from "@shared/utils/date";
 import Tooltip from "~/components/Tooltip";
 import { useLocaleTime } from "~/hooks/useLocaleTime";
 

app/components/Menu/ContextMenu.tsx

@@ -2,7 +2,7 @@ import * as React from "react";
 import { actionToMenuItem } from "~/actions";
 import useActionContext from "~/hooks/useActionContext";
 import useMobile from "~/hooks/useMobile";
-import { ActionVariant, ActionWithChildren } from "~/types";
+import type { ActionVariant, ActionWithChildren } from "~/types";
 import { toMenuItems } from "./transformer";
 import { observer } from "mobx-react";
 import { useComputed } from "~/hooks/useComputed";

app/components/Menu/DropdownMenu.tsx

@@ -1,5 +1,5 @@
 import * as React from "react";
-import * as TooltipPrimitive from "@radix-ui/react-tooltip";
+import type * as TooltipPrimitive from "@radix-ui/react-tooltip";
 import styled from "styled-components";
 import Scrollable from "~/components/Scrollable";
 import {
@@ -13,7 +13,7 @@ import { MenuProvider } from "~/components/primitives/Menu/MenuContext";
 import { actionToMenuItem } from "~/actions";
 import useActionContext from "~/hooks/useActionContext";
 import useMobile from "~/hooks/useMobile";
-import {
+import type {
   ActionVariant,
   ActionWithChildren,
   MenuItem,

app/components/Menu/OverflowMenuButton.tsx

@@ -1,4 +1,4 @@
-import * as DropdownMenuPrimitive from "@radix-ui/react-dropdown-menu";
+import type * as DropdownMenuPrimitive from "@radix-ui/react-dropdown-menu";
 import { MoreIcon } from "outline-icons";
 import * as React from "react";
 import Button from "~/components/Button";

app/components/Menu/transformer.tsx

@@ -10,7 +10,7 @@ import {
   MenuGroup,
 } from "~/components/primitives/Menu";
 import * as Components from "~/components/primitives/components/Menu";
-import { MenuItem } from "~/types";
+import type { MenuItem } from "~/types";
 import { MouseSafeArea } from "~/components/MouseSafeArea";
 import { createRef } from "react";
 

app/components/NavLink.tsx

@@ -1,4 +1,4 @@
-import { LocationDescriptor, LocationDescriptorObject } from "history";
+import type { LocationDescriptor, LocationDescriptorObject } from "history";
 import * as React from "react";
 import { type match, NavLink, Route } from "react-router-dom";
 

app/components/Notifications/NotificationListItem.tsx

@@ -5,7 +5,7 @@ import { useTranslation } from "react-i18next";
 import { Link } from "react-router-dom";
 import styled from "styled-components";
 import { s, hover, truncateMultiline } from "@shared/styles";
-import Notification from "~/models/Notification";
+import type Notification from "~/models/Notification";
 import useStores from "~/hooks/useStores";
 import { Avatar, AvatarSize, AvatarVariant } from "../Avatar";
 import Flex from "../Flex";

app/components/NudeButton.tsx

@@ -1,7 +1,6 @@
 import styled from "styled-components";
-import ActionButton, {
-  Props as ActionButtonProps,
-} from "~/components/ActionButton";
+import type { Props as ActionButtonProps } from "~/components/ActionButton";
+import ActionButton from "~/components/ActionButton";
 import { undraggableOnDesktop } from "~/styles";
 
 type Props = ActionButtonProps & {

app/components/OAuthClient/OAuthClientForm.tsx

@@ -3,7 +3,7 @@ import { useEffect } from "react";
 import { Controller, useForm } from "react-hook-form";
 import { useTranslation } from "react-i18next";
 import { OAuthClientValidation } from "@shared/validations";
-import OAuthClient from "~/models/oauth/OAuthClient";
+import type OAuthClient from "~/models/oauth/OAuthClient";
 import ImageInput from "~/scenes/Settings/components/ImageInput";
 import Button from "~/components/Button";
 import Flex from "~/components/Flex";

app/components/OAuthClient/OAuthClientNew.tsx

@@ -4,7 +4,8 @@ import { useHistory } from "react-router-dom";
 import { toast } from "sonner";
 import useStores from "~/hooks/useStores";
 import { settingsPath } from "~/utils/routeHelpers";
-import { OAuthClientForm, FormData } from "./OAuthClientForm";
+import type { FormData } from "./OAuthClientForm";
+import { OAuthClientForm } from "./OAuthClientForm";
 
 type Props = {
   onSubmit: () => void;

app/components/PaginatedDocumentList.tsx

@@ -1,6 +1,6 @@
 import * as React from "react";
 import { useTranslation } from "react-i18next";
-import Document from "~/models/Document";
+import type Document from "~/models/Document";
 import DocumentListItem from "~/components/DocumentListItem";
 import Error from "~/components/List/Error";
 import PaginatedList from "~/components/PaginatedList";

app/components/PaginatedEventList.tsx

@@ -1,7 +1,7 @@
 import * as React from "react";
 import styled from "styled-components";
-import Document from "~/models/Document";
-import Event from "~/models/Event";
+import type Document from "~/models/Document";
+import type Event from "~/models/Event";
 import Revision from "~/models/Revision";
 import PaginatedList from "~/components/PaginatedList";
 import EventListItem from "./EventListItem";

app/components/PinnedDocuments.tsx

@@ -1,3 +1,4 @@
+import type { DragEndEvent } from "@dnd-kit/core";
 import {
   DndContext,
   closestCenter,
@@ -5,7 +6,6 @@ import {
   PointerSensor,
   useSensor,
   useSensors,
-  DragEndEvent,
 } from "@dnd-kit/core";
 import { restrictToParentElement } from "@dnd-kit/modifiers";
 import {
@@ -20,7 +20,7 @@ import { observer } from "mobx-react";
 import { useState, useRef, useEffect, useCallback } from "react";
 import styled from "styled-components";
 import breakpoint from "styled-components-breakpoint";
-import Pin from "~/models/Pin";
+import type Pin from "~/models/Pin";
 import DocumentCard from "~/components/DocumentCard";
 import useStores from "~/hooks/useStores";
 import { ResizingHeightContainer } from "./ResizingHeightContainer";

app/components/Reactions/Reaction.tsx

@@ -6,7 +6,7 @@ import styled, { css } from "styled-components";
 import { s, hover } from "@shared/styles";
 import type { ReactionSummary } from "@shared/types";
 import { getEmojiId } from "@shared/utils/emoji";
-import User from "~/models/User";
+import type User from "~/models/User";
 import { Emoji } from "~/components/Emoji";
 import Flex from "~/components/Flex";
 import NudeButton from "~/components/NudeButton";

app/components/Reactions/ReactionList.tsx

@@ -1,7 +1,7 @@
 import compact from "lodash/compact";
 import { observer } from "mobx-react";
 import * as React from "react";
-import Comment from "~/models/Comment";
+import type Comment from "~/models/Comment";
 import useHover from "~/hooks/useHover";
 import useStores from "~/hooks/useStores";
 import Logger from "~/utils/Logger";

app/components/Reactions/ViewReactionsDialog.tsx

@@ -6,7 +6,7 @@ import * as Tabs from "@radix-ui/react-tabs";
 import { toast } from "sonner";
 import styled, { css } from "styled-components";
 import { s, hover } from "@shared/styles";
-import Comment from "~/models/Comment";
+import type Comment from "~/models/Comment";
 import { Avatar, AvatarSize } from "~/components/Avatar";
 import { Emoji } from "~/components/Emoji";
 import Flex from "~/components/Flex";

app/components/RegisterKeyDown.ts

@@ -1,4 +1,5 @@
-import useKeyDown, { KeyFilter, Options } from "~/hooks/useKeyDown";
+import type { KeyFilter, Options } from "~/hooks/useKeyDown";
+import useKeyDown from "~/hooks/useKeyDown";
 
 type Props = {
   trigger: KeyFilter;

app/components/ResizingHeightContainer.tsx

@@ -1,4 +1,5 @@
-import { m, TargetAndTransition } from "framer-motion";
+import type { TargetAndTransition } from "framer-motion";
+import { m } from "framer-motion";
 import * as React from "react";
 import { mergeRefs } from "react-merge-refs";
 import useMeasure from "react-use-measure";

app/components/RevisionListItem.tsx

@@ -1,4 +1,4 @@
-import { LocationDescriptor } from "history";
+import type { LocationDescriptor } from "history";
 import { observer } from "mobx-react";
 import { EditIcon, TrashIcon } from "outline-icons";
 import { useCallback, useMemo, useRef } from "react";
@@ -8,8 +8,8 @@ import styled from "styled-components";
 import EventBoundary from "@shared/components/EventBoundary";
 import { hover } from "@shared/styles";
 import { RevisionHelper } from "@shared/utils/RevisionHelper";
-import Document from "~/models/Document";
-import Revision from "~/models/Revision";
+import type Document from "~/models/Document";
+import type Revision from "~/models/Revision";
 import { ActionSeparator } from "~/actions";
 import {
   copyLinkToRevision,

app/components/SearchListItem.tsx

@@ -8,7 +8,7 @@ import { Link } from "react-router-dom";
 import styled, { css } from "styled-components";
 import breakpoint from "styled-components-breakpoint";
 import { s, hover, ellipsis } from "@shared/styles";
-import Document from "~/models/Document";
+import type Document from "~/models/Document";
 import Highlight, { Mark } from "~/components/Highlight";
 import { sharedModelPath } from "~/utils/routeHelpers";
 

app/components/SearchPopover.tsx

@@ -16,7 +16,7 @@ import {
 import { id as bodyContentId } from "~/components/SkipNavContent";
 import useKeyDown from "~/hooks/useKeyDown";
 import useStores from "~/hooks/useStores";
-import { SearchResult } from "~/types";
+import type { SearchResult } from "~/types";
 import SearchListItem from "./SearchListItem";
 
 interface Props extends React.HTMLAttributes<HTMLInputElement> {

app/components/Sharing/Collection/AccessControlList.tsx

@@ -7,8 +7,8 @@ import styled, { useTheme } from "styled-components";
 import Squircle from "@shared/components/Squircle";
 import { s } from "@shared/styles";
 import { CollectionPermission } from "@shared/types";
-import Collection from "~/models/Collection";
-import Share from "~/models/Share";
+import type Collection from "~/models/Collection";
+import type Share from "~/models/Share";
 import { Avatar, GroupAvatar, AvatarSize } from "~/components/Avatar";
 import InputMemberPermissionSelect from "~/components/InputMemberPermissionSelect";
 import { InputSelectPermission } from "~/components/InputSelectPermission";
@@ -18,7 +18,8 @@ import useMaxHeight from "~/hooks/useMaxHeight";
 import usePolicy from "~/hooks/usePolicy";
 import useRequest from "~/hooks/useRequest";
 import useStores from "~/hooks/useStores";
-import { EmptySelectValue, Permission } from "~/types";
+import type { Permission } from "~/types";
+import { EmptySelectValue } from "~/types";
 import { Separator } from "../components";
 import { ListItem } from "../components/ListItem";
 import { Placeholder } from "../components/Placeholder";

app/components/Sharing/Collection/PublicAccess.tsx

@@ -9,8 +9,8 @@ import styled, { useTheme } from "styled-components";
 import Squircle from "@shared/components/Squircle";
 import { s } from "@shared/styles";
 import { UrlHelper } from "@shared/utils/UrlHelper";
-import Collection from "~/models/Collection";
-import Share from "~/models/Share";
+import type Collection from "~/models/Collection";
+import type Share from "~/models/Share";
 import { AvatarSize } from "~/components/Avatar";
 import CopyToClipboard from "~/components/CopyToClipboard";
 import Flex from "~/components/Flex";

app/components/Sharing/Collection/SharePopover.tsx

@@ -6,7 +6,7 @@ import * as React from "react";
 import { useTranslation } from "react-i18next";
 import { toast } from "sonner";
 import { CollectionPermission } from "@shared/types";
-import Collection from "~/models/Collection";
+import type Collection from "~/models/Collection";
 import Group from "~/models/Group";
 import User from "~/models/User";
 import { Avatar, AvatarSize } from "~/components/Avatar";
@@ -19,7 +19,7 @@ import useKeyDown from "~/hooks/useKeyDown";
 import usePolicy from "~/hooks/usePolicy";
 import usePrevious from "~/hooks/usePrevious";
 import useStores from "~/hooks/useStores";
-import { Permission } from "~/types";
+import type { Permission } from "~/types";
 import { collectionPath, urlify } from "~/utils/routeHelpers";
 import { Wrapper, presence } from "../components";
 import { CopyLinkButton } from "../components/CopyLinkButton";

app/components/Sharing/Document/AccessControlList.tsx

@@ -10,7 +10,7 @@ import { CollectionPermission, IconType } from "@shared/types";
 import { determineIconType } from "@shared/utils/icon";
 import type Collection from "~/models/Collection";
 import type Document from "~/models/Document";
-import Share from "~/models/Share";
+import type Share from "~/models/Share";
 import Flex from "~/components/Flex";
 import NudeButton from "~/components/NudeButton";
 import Scrollable from "~/components/Scrollable";

app/components/Sharing/Document/DocumentMemberList.tsx

@@ -7,14 +7,15 @@ import { toast } from "sonner";
 import styled, { useTheme } from "styled-components";
 import { s } from "@shared/styles";
 import { DocumentPermission } from "@shared/types";
-import Document from "~/models/Document";
-import UserMembership from "~/models/UserMembership";
+import type Document from "~/models/Document";
+import type UserMembership from "~/models/UserMembership";
 import { GroupAvatar } from "~/components/Avatar";
 import InputMemberPermissionSelect from "~/components/InputMemberPermissionSelect";
 import useCurrentUser from "~/hooks/useCurrentUser";
 import usePolicy from "~/hooks/usePolicy";
 import useStores from "~/hooks/useStores";
-import { EmptySelectValue, Permission } from "~/types";
+import type { Permission } from "~/types";
+import { EmptySelectValue } from "~/types";
 import { homePath } from "~/utils/routeHelpers";
 import { ListItem } from "../components/ListItem";
 import DocumentMemberListItem from "./DocumentMemberListItem";

app/components/Sharing/Document/DocumentMemberListItem.tsx

@@ -5,12 +5,13 @@ import { Link } from "react-router-dom";
 import styled from "styled-components";
 import { s } from "@shared/styles";
 import { DocumentPermission } from "@shared/types";
-import User from "~/models/User";
-import UserMembership from "~/models/UserMembership";
+import type User from "~/models/User";
+import type UserMembership from "~/models/UserMembership";
 import { Avatar, AvatarSize } from "~/components/Avatar";
 import InputMemberPermissionSelect from "~/components/InputMemberPermissionSelect";
 import Time from "~/components/Time";
-import { EmptySelectValue, Permission } from "~/types";
+import type { Permission } from "~/types";
+import { EmptySelectValue } from "~/types";
 import { ListItem } from "../components/ListItem";
 
 type Props = {

app/components/Sharing/Document/PublicAccess.tsx

@@ -11,8 +11,8 @@ import Flex from "@shared/components/Flex";
 import Squircle from "@shared/components/Squircle";
 import { s } from "@shared/styles";
 import { UrlHelper } from "@shared/utils/UrlHelper";
-import Document from "~/models/Document";
-import Share from "~/models/Share";
+import type Document from "~/models/Document";
+import type Share from "~/models/Share";
 import Input, { NativeInput } from "~/components/Input";
 import Switch from "~/components/Switch";
 import env from "~/env";

app/components/Sharing/Document/SharePopover.tsx

@@ -6,7 +6,7 @@ import * as React from "react";
 import { useTranslation } from "react-i18next";
 import { toast } from "sonner";
 import { DocumentPermission } from "@shared/types";
-import Document from "~/models/Document";
+import type Document from "~/models/Document";
 import Group from "~/models/Group";
 import User from "~/models/User";
 import { Avatar, GroupAvatar, AvatarSize } from "~/components/Avatar";
@@ -19,7 +19,7 @@ import useKeyDown from "~/hooks/useKeyDown";
 import usePolicy from "~/hooks/usePolicy";
 import usePrevious from "~/hooks/usePrevious";
 import useStores from "~/hooks/useStores";
-import { Permission } from "~/types";
+import type { Permission } from "~/types";
 import { documentPath, urlify } from "~/utils/routeHelpers";
 import { Wrapper, presence } from "../components";
 import { CopyLinkButton } from "../components/CopyLinkButton";

app/components/Sharing/components/PermissionAction.tsx

@@ -1,12 +1,12 @@
 import { useTranslation } from "react-i18next";
 import styled from "styled-components";
 import Flex from "@shared/components/Flex";
-import { CollectionPermission, DocumentPermission } from "@shared/types";
+import type { CollectionPermission, DocumentPermission } from "@shared/types";
 import { Inner } from "~/components/Button";
 import ButtonSmall from "~/components/ButtonSmall";
 import Fade from "~/components/Fade";
 import InputMemberPermissionSelect from "~/components/InputMemberPermissionSelect";
-import { Action, Permission } from "~/types";
+import type { Action, Permission } from "~/types";
 
 export function PermissionAction({
   permission,

app/components/Sharing/components/Suggestions.tsx

@@ -7,12 +7,13 @@ import { useTranslation } from "react-i18next";
 import styled from "styled-components";
 import { s, hover } from "@shared/styles";
 import { stringToColor } from "@shared/utils/color";
-import Collection from "~/models/Collection";
-import Document from "~/models/Document";
+import type Collection from "~/models/Collection";
+import type Document from "~/models/Document";
 import Group from "~/models/Group";
-import User from "~/models/User";
+import type User from "~/models/User";
 import ArrowKeyNavigation from "~/components/ArrowKeyNavigation";
-import { Avatar, GroupAvatar, AvatarSize, IAvatar } from "~/components/Avatar";
+import type { IAvatar } from "~/components/Avatar";
+import { Avatar, GroupAvatar, AvatarSize } from "~/components/Avatar";
 import Empty from "~/components/Empty";
 import Placeholder from "~/components/List/Placeholder";
 import Scrollable from "~/components/Scrollable";

app/components/Sidebar/Shared.tsx

@@ -4,7 +4,7 @@ import { useTranslation } from "react-i18next";
 import styled from "styled-components";
 import { hover } from "@shared/styles";
 import { metaDisplay } from "@shared/utils/keyboard";
-import Share from "~/models/Share";
+import type Share from "~/models/Share";
 import Flex from "~/components/Flex";
 import Scrollable from "~/components/Scrollable";
 import SearchPopover from "~/components/SearchPopover";

app/components/Sidebar/components/ArchiveLink.tsx

@@ -4,7 +4,7 @@ import { ArchiveIcon } from "outline-icons";
 import { useState, useEffect, useCallback } from "react";
 import { useTranslation } from "react-i18next";
 import Flex from "@shared/components/Flex";
-import Collection from "~/models/Collection";
+import type Collection from "~/models/Collection";
 import PaginatedList from "~/components/PaginatedList";
 import useRequest from "~/hooks/useRequest";
 import useStores from "~/hooks/useStores";

app/components/Sidebar/components/ArchivedCollectionLink.tsx

@@ -1,5 +1,5 @@
 import { useState, useCallback } from "react";
-import Collection from "~/models/Collection";
+import type Collection from "~/models/Collection";
 import useStores from "~/hooks/useStores";
 import CollectionLink from "./CollectionLink";
 

app/components/Sidebar/components/CollectionLink.tsx

@@ -1,4 +1,4 @@
-import { Location } from "history";
+import type { Location } from "history";
 import { observer } from "mobx-react";
 import { PlusIcon } from "outline-icons";
 import * as React from "react";
@@ -8,9 +8,10 @@ import { useHistory } from "react-router-dom";
 import { UserPreference } from "@shared/types";
 import { ProsemirrorHelper } from "@shared/utils/ProsemirrorHelper";
 import { CollectionValidation, DocumentValidation } from "@shared/validations";
-import Collection from "~/models/Collection";
-import Document from "~/models/Document";
-import EditableTitle, { RefHandle } from "~/components/EditableTitle";
+import type Collection from "~/models/Collection";
+import type Document from "~/models/Document";
+import type { RefHandle } from "~/components/EditableTitle";
+import EditableTitle from "~/components/EditableTitle";
 import Fade from "~/components/Fade";
 import CollectionIcon from "~/components/Icons/CollectionIcon";
 import NudeButton from "~/components/NudeButton";
@@ -23,7 +24,8 @@ import { documentEditPath } from "~/utils/routeHelpers";
 import { useDropToChangeCollection } from "../hooks/useDragAndDrop";
 import DropToImport from "./DropToImport";
 import Relative from "./Relative";
-import { SidebarContextType, useSidebarContext } from "./SidebarContext";
+import type { SidebarContextType } from "./SidebarContext";
+import { useSidebarContext } from "./SidebarContext";
 import SidebarLink from "./SidebarLink";
 import { useCollectionMenuAction } from "~/hooks/useCollectionMenuAction";
 import { ActionContextProvider } from "~/hooks/useActionContext";

app/components/Sidebar/components/CollectionLinkChildren.tsx

@@ -4,8 +4,8 @@ import { useState, useRef, useEffect, useCallback } from "react";
 import { useTranslation } from "react-i18next";
 import { Waypoint } from "react-waypoint";
 import styled from "styled-components";
-import Collection from "~/models/Collection";
-import Document from "~/models/Document";
+import type Collection from "~/models/Collection";
+import type Document from "~/models/Document";
 import DocumentsLoader from "~/components/DocumentsLoader";
 import { ResizingHeightContainer } from "~/components/ResizingHeightContainer";
 import Text from "~/components/Text";

app/components/Sidebar/components/Collections.tsx

@@ -4,13 +4,13 @@ import { useMemo } from "react";
 import { useDrop } from "react-dnd";
 import { useTranslation } from "react-i18next";
 import styled from "styled-components";
-import Collection from "~/models/Collection";
+import type Collection from "~/models/Collection";
 import Flex from "~/components/Flex";
 import Error from "~/components/List/Error";
 import PaginatedList from "~/components/PaginatedList";
 import { createCollection } from "~/actions/definitions/collections";
 import useStores from "~/hooks/useStores";
-import { DragObject } from "../hooks/useDragAndDrop";
+import type { DragObject } from "../hooks/useDragAndDrop";
 import DraggableCollectionLink from "./DraggableCollectionLink";
 import DropCursor from "./DropCursor";
 import Header from "./Header";