diff --git a/src/components/common/messaging/attachments/TextFile.tsx b/src/components/common/messaging/attachments/TextFile.tsx index b967c11a..b119bcae 100644 --- a/src/components/common/messaging/attachments/TextFile.tsx +++ b/src/components/common/messaging/attachments/TextFile.tsx @@ -5,15 +5,14 @@ import styles from "./Attachment.module.scss"; import { Text } from "preact-i18n"; import { useContext, useEffect, useState } from "preact/hooks"; +import { Button, Preloader } from "@revoltchat/ui"; + import RequiresOnline from "../../../../context/revoltjs/RequiresOnline"; import { AppContext, StatusContext, } from "../../../../context/revoltjs/RevoltClient"; -import Preloader from "../../../ui/Preloader"; -import { Button } from "@revoltchat/ui"; - interface Props { attachment: API.File; } diff --git a/src/components/common/messaging/embed/EmbedInvite.tsx b/src/components/common/messaging/embed/EmbedInvite.tsx index c8566f56..45d6c538 100644 --- a/src/components/common/messaging/embed/EmbedInvite.tsx +++ b/src/components/common/messaging/embed/EmbedInvite.tsx @@ -7,7 +7,7 @@ import styled, { css } from "styled-components/macro"; import { useContext, useEffect, useState } from "preact/hooks"; -import { Button } from "@revoltchat/ui"; +import { Button, Preloader } from "@revoltchat/ui"; import { isTouchscreenDevice } from "../../../../lib/isTouchscreenDevice"; @@ -20,7 +20,6 @@ import { takeError } from "../../../../context/revoltjs/util"; import ServerIcon from "../../../../components/common/ServerIcon"; import Overline from "../../../ui/Overline"; -import Preloader from "../../../ui/Preloader"; const EmbedInviteBase = styled.div` width: 400px; diff --git a/src/components/navigation/right/Search.tsx b/src/components/navigation/right/Search.tsx index 94576ff9..2f021471 100644 --- a/src/components/navigation/right/Search.tsx +++ b/src/components/navigation/right/Search.tsx @@ -5,13 +5,12 @@ import styled from "styled-components/macro"; import { Text } from "preact-i18n"; import { useEffect, useState } from "preact/hooks"; -import { Button, InputBox } from "@revoltchat/ui"; +import { Button, InputBox, Preloader } from "@revoltchat/ui"; import { useClient } from "../../../context/revoltjs/RevoltClient"; import Message from "../../common/messaging/Message"; import Overline from "../../ui/Overline"; -import Preloader from "../../ui/Preloader"; import { GenericSidebarBase, GenericSidebarList } from "../SidebarBase"; type SearchState = diff --git a/src/components/ui/LineDivider.tsx b/src/components/ui/LineDivider.tsx deleted file mode 100644 index b158c8ce..00000000 --- a/src/components/ui/LineDivider.tsx +++ /dev/null @@ -1,9 +0,0 @@ -import styled from "styled-components/macro"; - -export default styled.div` - height: 0; - opacity: 0.6; - flex-shrink: 0; - margin: 8px 15px; - border-top: 1px solid var(--tertiary-foreground); -`; diff --git a/src/components/ui/Preloader.tsx b/src/components/ui/Preloader.tsx deleted file mode 100644 index 8eed522c..00000000 --- a/src/components/ui/Preloader.tsx +++ /dev/null @@ -1,104 +0,0 @@ -import styled, { keyframes } from "styled-components/macro"; - -const skSpinner = keyframes` - 0%, 80%, 100% { - -webkit-transform: scale(0); - transform: scale(0); - } - 40% { - -webkit-transform: scale(1.0); - transform: scale(1.0); - } -`; - -const prRing = keyframes` - 0% { - transform: rotate(0deg); - } - 100% { - transform: rotate(360deg); - } -`; - -const PreloaderBase = styled.div` - width: 100%; - height: 100%; - - display: flex; - align-items: center; - justify-content: center; - - .spinner { - width: 58px; - display: flex; - text-align: center; - margin: 100px auto 0; - justify-content: space-between; - } - - .spinner > div { - width: 14px; - height: 14px; - background-color: var(--tertiary-foreground); - - border-radius: 100%; - display: inline-block; - animation: ${skSpinner} 1.4s infinite ease-in-out both; - } - - .spinner div:nth-child(1) { - animation-delay: -0.32s; - } - - .spinner div:nth-child(2) { - animation-delay: -0.16s; - } - - .ring { - display: inline-block; - position: relative; - width: 48px; - height: 52px; - } - - .ring div { - width: 32px; - margin: 8px; - height: 32px; - display: block; - position: absolute; - box-sizing: border-box; - border: 2px solid #fff; - border-radius: var(--border-radius-half); - animation: ${prRing} 1.2s cubic-bezier(0.5, 0, 0.5, 1) infinite; - border-color: #fff transparent transparent transparent; - } - - .ring div:nth-child(1) { - animation-delay: -0.45s; - } - - .ring div:nth-child(2) { - animation-delay: -0.3s; - } - - .ring div:nth-child(3) { - animation-delay: -0.15s; - } -`; - -interface Props { - type: "spinner" | "ring"; -} - -export default function Preloader({ type }: Props) { - return ( - -
-
-
-
-
- - ); -} diff --git a/src/components/ui/SaveStatus.tsx b/src/components/ui/SaveStatus.tsx deleted file mode 100644 index 6e813cd6..00000000 --- a/src/components/ui/SaveStatus.tsx +++ /dev/null @@ -1,32 +0,0 @@ -import { Check, CloudUpload } from "@styled-icons/boxicons-regular"; -import { Pencil } from "@styled-icons/boxicons-solid"; -import styled from "styled-components/macro"; - -const StatusBase = styled.div` - gap: 4px; - padding: 4px; - display: flex; - align-items: center; - text-transform: capitalize; -`; - -export type EditStatus = "saved" | "editing" | "saving"; -interface Props { - status: EditStatus; -} - -export default function SaveStatus({ status }: Props) { - return ( - - {status === "saved" ? ( - - ) : status === "editing" ? ( - - ) : ( - - )} - {/* FIXME: add i18n */} - {status} - - ); -} diff --git a/src/context/index.tsx b/src/context/index.tsx index 0d48a5bb..277f0126 100644 --- a/src/context/index.tsx +++ b/src/context/index.tsx @@ -4,11 +4,15 @@ import { ContextMenuTrigger } from "preact-context-menu"; import { Text } from "preact-i18n"; import { useEffect, useState } from "preact/hooks"; -import { LinkProvider, TextProvider, TrigProvider } from "@revoltchat/ui"; +import { + LinkProvider, + Preloader, + TextProvider, + TrigProvider, +} from "@revoltchat/ui"; import { hydrateState } from "../mobx/State"; -import Preloader from "../components/ui/Preloader"; import { Children } from "../types/Preact"; import Locale from "./Locale"; import Theme from "./Theme"; diff --git a/src/context/intermediate/modals/Onboarding.tsx b/src/context/intermediate/modals/Onboarding.tsx index 9e6c492c..af21e930 100644 --- a/src/context/intermediate/modals/Onboarding.tsx +++ b/src/context/intermediate/modals/Onboarding.tsx @@ -4,9 +4,8 @@ import styles from "./Onboarding.module.scss"; import { Text } from "preact-i18n"; import { useState } from "preact/hooks"; -import { Button } from "@revoltchat/ui"; +import { Button, Preloader } from "@revoltchat/ui"; -import Preloader from "../../../components/ui/Preloader"; import wideSVG from "/assets/wide.svg"; import FormField from "../../../pages/login/FormField"; diff --git a/src/context/intermediate/popovers/UserProfile.tsx b/src/context/intermediate/popovers/UserProfile.tsx index a1d9088e..e14692f4 100644 --- a/src/context/intermediate/popovers/UserProfile.tsx +++ b/src/context/intermediate/popovers/UserProfile.tsx @@ -15,7 +15,7 @@ import styles from "./UserProfile.module.scss"; import { Localizer, Text } from "preact-i18n"; import { useContext, useEffect, useLayoutEffect, useState } from "preact/hooks"; -import { Button, IconButton } from "@revoltchat/ui"; +import { Button, IconButton, Preloader } from "@revoltchat/ui"; import { noop } from "../../../lib/js"; @@ -29,7 +29,6 @@ import UserStatus from "../../../components/common/user/UserStatus"; import Markdown from "../../../components/markdown/Markdown"; import Modal from "../../../components/ui/Modal"; import Overline from "../../../components/ui/Overline"; -import Preloader from "../../../components/ui/Preloader"; import { ClientStatus, StatusContext, diff --git a/src/context/revoltjs/FileUploads.tsx b/src/context/revoltjs/FileUploads.tsx index c08ec266..db246144 100644 --- a/src/context/revoltjs/FileUploads.tsx +++ b/src/context/revoltjs/FileUploads.tsx @@ -7,11 +7,10 @@ import classNames from "classnames"; import { Text } from "preact-i18n"; import { useContext, useEffect, useState } from "preact/hooks"; -import { IconButton } from "@revoltchat/ui"; +import { IconButton, Preloader } from "@revoltchat/ui"; import { determineFileSize } from "../../lib/fileSize"; -import Preloader from "../../components/ui/Preloader"; import { useIntermediate } from "../intermediate/Intermediate"; import { AppContext } from "./RevoltClient"; import { takeError } from "./util"; diff --git a/src/context/revoltjs/RequiresOnline.tsx b/src/context/revoltjs/RequiresOnline.tsx index f3595a5d..4400bcc6 100644 --- a/src/context/revoltjs/RequiresOnline.tsx +++ b/src/context/revoltjs/RequiresOnline.tsx @@ -4,7 +4,7 @@ import styled from "styled-components/macro"; import { Text } from "preact-i18n"; import { useContext } from "preact/hooks"; -import Preloader from "../../components/ui/Preloader"; +import { Preloader } from "@revoltchat/ui"; import { Children } from "../../types/Preact"; import { ClientStatus, StatusContext } from "./RevoltClient"; diff --git a/src/context/revoltjs/RevoltClient.tsx b/src/context/revoltjs/RevoltClient.tsx index b4fefcce..44681b80 100644 --- a/src/context/revoltjs/RevoltClient.tsx +++ b/src/context/revoltjs/RevoltClient.tsx @@ -3,12 +3,12 @@ import { observer } from "mobx-react-lite"; import { Client } from "revolt.js"; import { createContext } from "preact"; -import { useContext, useEffect, useMemo, useState } from "preact/hooks"; +import { useContext, useEffect, useState } from "preact/hooks"; + +import { Preloader } from "@revoltchat/ui"; import { useApplicationState } from "../../mobx/State"; -import Preloader from "../../components/ui/Preloader"; - import { Children } from "../../types/Preact"; import { useIntermediate } from "../intermediate/Intermediate"; import { registerEvents } from "./events"; diff --git a/src/lib/ContextMenus.tsx b/src/lib/ContextMenus.tsx index 32b37d4d..9eeebd06 100644 --- a/src/lib/ContextMenus.tsx +++ b/src/lib/ContextMenus.tsx @@ -13,7 +13,7 @@ import { import { Text } from "preact-i18n"; import { useContext } from "preact/hooks"; -import { IconButton } from "@revoltchat/ui"; +import { IconButton, LineDivider } from "@revoltchat/ui"; import { useApplicationState } from "../mobx/State"; import { QueuedMessage } from "../mobx/stores/MessageQueue"; @@ -30,7 +30,6 @@ import CMNotifications from "./contextmenu/CMNotifications"; import Tooltip from "../components/common/Tooltip"; import UserStatus from "../components/common/user/UserStatus"; -import LineDivider from "../components/ui/LineDivider"; import { Children } from "../types/Preact"; import { internalEmit } from "./eventEmitter"; import { getRenderer } from "./renderer/Singleton"; diff --git a/src/lib/contextmenu/CMNotifications.tsx b/src/lib/contextmenu/CMNotifications.tsx index 0c235ede..ec65b54d 100644 --- a/src/lib/contextmenu/CMNotifications.tsx +++ b/src/lib/contextmenu/CMNotifications.tsx @@ -15,11 +15,11 @@ import { Server } from "revolt.js"; import { ContextMenuWithData, MenuItem } from "preact-context-menu"; import { Text } from "preact-i18n"; +import { LineDivider } from "@revoltchat/ui"; + import { useApplicationState } from "../../mobx/State"; import { NotificationState } from "../../mobx/stores/NotificationOptions"; -import LineDivider from "../../components/ui/LineDivider"; - import { Children } from "../../types/Preact"; interface Action { diff --git a/src/pages/app.tsx b/src/pages/app.tsx index ca3e1d1d..0fa90d89 100644 --- a/src/pages/app.tsx +++ b/src/pages/app.tsx @@ -2,7 +2,7 @@ import { Route, Switch } from "react-router-dom"; import { lazy, Suspense } from "preact/compat"; -import { Masks } from "@revoltchat/ui"; +import { Masks, Preloader } from "@revoltchat/ui"; import ErrorBoundary from "../lib/ErrorBoundary"; import FakeClient from "../lib/FakeClient"; @@ -10,7 +10,6 @@ import FakeClient from "../lib/FakeClient"; import Context from "../context"; import { CheckAuth } from "../context/revoltjs/CheckAuth"; -import Preloader from "../components/ui/Preloader"; import Invite from "./invite/Invite"; const Login = lazy(() => import("./login/Login")); diff --git a/src/pages/channels/messaging/MessageArea.tsx b/src/pages/channels/messaging/MessageArea.tsx index e954eac3..4a1e031e 100644 --- a/src/pages/channels/messaging/MessageArea.tsx +++ b/src/pages/channels/messaging/MessageArea.tsx @@ -16,6 +16,8 @@ import { useState, } from "preact/hooks"; +import { Preloader } from "@revoltchat/ui"; + import { defer } from "../../../lib/defer"; import { internalEmit, internalSubscribe } from "../../../lib/eventEmitter"; import { getRenderer } from "../../../lib/renderer/Singleton"; @@ -28,8 +30,6 @@ import { StatusContext, } from "../../../context/revoltjs/RevoltClient"; -import Preloader from "../../../components/ui/Preloader"; - import ConversationStart from "./ConversationStart"; import MessageRenderer from "./MessageRenderer"; diff --git a/src/pages/channels/messaging/MessageRenderer.tsx b/src/pages/channels/messaging/MessageRenderer.tsx index 1813190a..6195e29b 100644 --- a/src/pages/channels/messaging/MessageRenderer.tsx +++ b/src/pages/channels/messaging/MessageRenderer.tsx @@ -1,5 +1,6 @@ /* eslint-disable react-hooks/rules-of-hooks */ import { X } from "@styled-icons/boxicons-regular"; +import dayjs from "dayjs"; import isEqual from "lodash.isequal"; import { observer } from "mobx-react-lite"; import { API } from "revolt.js"; @@ -11,7 +12,7 @@ import { decodeTime } from "ulid"; import { Text } from "preact-i18n"; import { useEffect, useState } from "preact/hooks"; -import { MessageDivider } from "@revoltchat/ui"; +import { MessageDivider, Preloader } from "@revoltchat/ui"; import { internalSubscribe, internalEmit } from "../../../lib/eventEmitter"; import { ChannelRenderer } from "../../../lib/renderer/Singleton"; @@ -23,11 +24,9 @@ import { useClient } from "../../../context/revoltjs/RevoltClient"; import Message from "../../../components/common/messaging/Message"; import { SystemMessage } from "../../../components/common/messaging/SystemMessage"; -import Preloader from "../../../components/ui/Preloader"; import { Children } from "../../../types/Preact"; import ConversationStart from "./ConversationStart"; import MessageEditor from "./MessageEditor"; -import dayjs from "dayjs"; interface Props { last_id?: string; @@ -126,7 +125,12 @@ export default observer(({ last_id, renderer, highlight }: Props) => { } if (unread || date) { - render.push(); + render.push( + , + ); head = true; } diff --git a/src/pages/discover/Discover.tsx b/src/pages/discover/Discover.tsx index d596ea72..7894dc32 100644 --- a/src/pages/discover/Discover.tsx +++ b/src/pages/discover/Discover.tsx @@ -5,6 +5,8 @@ import styled, { css } from "styled-components/macro"; import { useEffect, useMemo, useRef, useState } from "preact/hooks"; +import { Preloader } from "@revoltchat/ui"; + import { isTouchscreenDevice } from "../../lib/isTouchscreenDevice"; import { useApplicationState } from "../../mobx/State"; @@ -13,7 +15,6 @@ import { Overrides } from "../../context/Theme"; import { useIntermediate } from "../../context/intermediate/Intermediate"; import Header from "../../components/ui/Header"; -import Preloader from "../../components/ui/Preloader"; const Container = styled.div` flex-grow: 1; diff --git a/src/pages/invite/Invite.tsx b/src/pages/invite/Invite.tsx index 363e1a39..2e28da93 100644 --- a/src/pages/invite/Invite.tsx +++ b/src/pages/invite/Invite.tsx @@ -7,9 +7,8 @@ import styles from "./Invite.module.scss"; import { Text } from "preact-i18n"; import { useContext, useEffect, useState } from "preact/hooks"; -import { Button } from "@revoltchat/ui"; +import { Button, Preloader } from "@revoltchat/ui"; -import { defer } from "../../lib/defer"; import { TextReact } from "../../lib/i18n"; import { useApplicationState } from "../../mobx/State"; @@ -25,7 +24,6 @@ import { takeError } from "../../context/revoltjs/util"; import ServerIcon from "../../components/common/ServerIcon"; import UserIcon from "../../components/common/user/UserIcon"; import Overline from "../../components/ui/Overline"; -import Preloader from "../../components/ui/Preloader"; export default function Invite() { const history = useHistory(); diff --git a/src/pages/invite/InviteBot.tsx b/src/pages/invite/InviteBot.tsx index 6e573e5d..72b09fcf 100644 --- a/src/pages/invite/InviteBot.tsx +++ b/src/pages/invite/InviteBot.tsx @@ -4,14 +4,13 @@ import styled from "styled-components/macro"; import { useEffect, useState } from "preact/hooks"; -import { Button, ComboBox } from "@revoltchat/ui"; +import { Button, ComboBox, Preloader } from "@revoltchat/ui"; import { useClient } from "../../context/revoltjs/RevoltClient"; import UserIcon from "../../components/common/user/UserIcon"; import Markdown from "../../components/markdown/Markdown"; import Overline from "../../components/ui/Overline"; -import Preloader from "../../components/ui/Preloader"; import Tip from "../../components/ui/Tip"; const BotInfo = styled.div` diff --git a/src/pages/login/forms/CaptchaBlock.tsx b/src/pages/login/forms/CaptchaBlock.tsx index 91124b38..9dc8888c 100644 --- a/src/pages/login/forms/CaptchaBlock.tsx +++ b/src/pages/login/forms/CaptchaBlock.tsx @@ -5,9 +5,9 @@ import styles from "../Login.module.scss"; import { Text } from "preact-i18n"; import { useEffect } from "preact/hooks"; -import { useApplicationState } from "../../../mobx/State"; +import { Preloader } from "@revoltchat/ui"; -import Preloader from "../../../components/ui/Preloader"; +import { useApplicationState } from "../../../mobx/State"; export interface CaptchaProps { onSuccess: (token?: string) => void; diff --git a/src/pages/login/forms/Form.tsx b/src/pages/login/forms/Form.tsx index 3f7e32e8..8bc2b224 100644 --- a/src/pages/login/forms/Form.tsx +++ b/src/pages/login/forms/Form.tsx @@ -6,17 +6,16 @@ import styles from "../Login.module.scss"; import { Text } from "preact-i18n"; import { useState } from "preact/hooks"; -import { Button } from "@revoltchat/ui"; +import { Button, Preloader } from "@revoltchat/ui"; +import { Tip } from "@revoltchat/ui"; import { useApplicationState } from "../../../mobx/State"; import { takeError } from "../../../context/revoltjs/util"; -import Overline from "../../../components/ui/Overline"; -import Preloader from "../../../components/ui/Preloader"; import WaveSVG from "../../settings/assets/wave.svg"; -import { Tip } from "@revoltchat/ui"; +import Overline from "../../../components/ui/Overline"; import FormField from "../FormField"; import { CaptchaBlock, CaptchaProps } from "./CaptchaBlock"; import { MailProvider } from "./MailProvider"; diff --git a/src/pages/login/forms/FormVerify.tsx b/src/pages/login/forms/FormVerify.tsx index f7ecd1b9..b2145f8a 100644 --- a/src/pages/login/forms/FormVerify.tsx +++ b/src/pages/login/forms/FormVerify.tsx @@ -2,14 +2,13 @@ import { useHistory, useParams } from "react-router-dom"; import { useContext, useEffect, useState } from "preact/hooks"; +import { Preloader } from "@revoltchat/ui"; + import { useApplicationState } from "../../../mobx/State"; -import { AppContext } from "../../../context/revoltjs/RevoltClient"; import { takeError } from "../../../context/revoltjs/util"; import Overline from "../../../components/ui/Overline"; -import Preloader from "../../../components/ui/Preloader"; - import { Form } from "./Form"; export function FormResend() { diff --git a/src/pages/settings/GenericSettings.tsx b/src/pages/settings/GenericSettings.tsx index c8b90d53..8e3721a9 100644 --- a/src/pages/settings/GenericSettings.tsx +++ b/src/pages/settings/GenericSettings.tsx @@ -13,7 +13,7 @@ import { useState, } from "preact/hooks"; -import { IconButton } from "@revoltchat/ui"; +import { IconButton, LineDivider } from "@revoltchat/ui"; import { isTouchscreenDevice } from "../../lib/isTouchscreenDevice"; @@ -22,7 +22,6 @@ import { useApplicationState } from "../../mobx/State"; import ButtonItem from "../../components/navigation/items/ButtonItem"; import Category from "../../components/ui/Category"; import Header from "../../components/ui/Header"; -import LineDivider from "../../components/ui/LineDivider"; import { Children } from "../../types/Preact"; interface Props { diff --git a/src/pages/settings/ServerSettings.tsx b/src/pages/settings/ServerSettings.tsx index 61a34448..f495329e 100644 --- a/src/pages/settings/ServerSettings.tsx +++ b/src/pages/settings/ServerSettings.tsx @@ -13,13 +13,12 @@ import { Route, Switch, useHistory, useParams } from "react-router-dom"; import styles from "./Settings.module.scss"; import { Text } from "preact-i18n"; +import { LineDivider } from "@revoltchat/ui"; + import { useIntermediate } from "../../context/intermediate/Intermediate"; import RequiresOnline from "../../context/revoltjs/RequiresOnline"; import { useClient } from "../../context/revoltjs/RevoltClient"; -import Category from "../../components/ui/Category"; -import LineDivider from "../../components/ui/LineDivider"; - import ButtonItem from "../../components/navigation/items/ButtonItem"; import { GenericSettings } from "./GenericSettings"; import { Bans } from "./server/Bans"; diff --git a/src/pages/settings/Settings.tsx b/src/pages/settings/Settings.tsx index a3a0619d..28743654 100644 --- a/src/pages/settings/Settings.tsx +++ b/src/pages/settings/Settings.tsx @@ -29,6 +29,8 @@ import { openContextMenu } from "preact-context-menu"; import { Text } from "preact-i18n"; import { useContext } from "preact/hooks"; +import { LineDivider } from "@revoltchat/ui"; + import { useApplicationState } from "../../mobx/State"; import { useIntermediate } from "../../context/intermediate/Intermediate"; @@ -38,8 +40,6 @@ import { AppContext, LogOutContext } from "../../context/revoltjs/RevoltClient"; import UserIcon from "../../components/common/user/UserIcon"; import { Username } from "../../components/common/user/UserShort"; import UserStatus from "../../components/common/user/UserStatus"; -import LineDivider from "../../components/ui/LineDivider"; - import ButtonItem from "../../components/navigation/items/ButtonItem"; import { GIT_BRANCH, GIT_REVISION, REPO_URL } from "../../revision"; import { APP_VERSION } from "../../version"; diff --git a/src/pages/settings/panes/Sessions.tsx b/src/pages/settings/panes/Sessions.tsx index 24bb1bb2..8905f38f 100644 --- a/src/pages/settings/panes/Sessions.tsx +++ b/src/pages/settings/panes/Sessions.tsx @@ -18,13 +18,12 @@ import styles from "./Panes.module.scss"; import { Text } from "preact-i18n"; import { useContext, useEffect, useState } from "preact/hooks"; -import { Button } from "@revoltchat/ui"; +import { Button, Preloader } from "@revoltchat/ui"; import { dayjs } from "../../../context/Locale"; import { useIntermediate } from "../../../context/intermediate/Intermediate"; import { AppContext } from "../../../context/revoltjs/RevoltClient"; -import Preloader from "../../../components/ui/Preloader"; import Tip from "../../../components/ui/Tip"; import CategoryButton from "../../../components/ui/fluent/CategoryButton"; diff --git a/src/pages/settings/server/Bans.tsx b/src/pages/settings/server/Bans.tsx index 2613a194..ed458946 100644 --- a/src/pages/settings/server/Bans.tsx +++ b/src/pages/settings/server/Bans.tsx @@ -8,10 +8,9 @@ import styles from "./Panes.module.scss"; import { Text } from "preact-i18n"; import { useEffect, useMemo, useState } from "preact/hooks"; -import { IconButton, InputBox } from "@revoltchat/ui"; +import { IconButton, InputBox, Preloader } from "@revoltchat/ui"; import UserIcon from "../../../components/common/user/UserIcon"; -import Preloader from "../../../components/ui/Preloader"; interface InnerProps { ban: API.ServerBan; diff --git a/src/pages/settings/server/Categories.tsx b/src/pages/settings/server/Categories.tsx index 5dd9e74c..9d73dd26 100644 --- a/src/pages/settings/server/Categories.tsx +++ b/src/pages/settings/server/Categories.tsx @@ -8,6 +8,8 @@ import { ulid } from "ulid"; import { Text } from "preact-i18n"; import { useCallback, useEffect, useMemo, useState } from "preact/hooks"; +import { SaveStatus } from "@revoltchat/ui"; + import { useAutosave } from "../../../lib/debounce"; import { Draggable, Droppable } from "../../../lib/dnd"; import { noop } from "../../../lib/js"; @@ -15,7 +17,6 @@ import { noop } from "../../../lib/js"; import { useIntermediate } from "../../../context/intermediate/Intermediate"; import ChannelIcon from "../../../components/common/ChannelIcon"; -import SaveStatus, { EditStatus } from "../../../components/ui/SaveStatus"; const KanbanEntry = styled.div` padding: 2px 4px; @@ -132,7 +133,9 @@ interface Props { } export const Categories = observer(({ server }: Props) => { - const [status, setStatus] = useState("saved"); + const [status, setStatus] = useState<"saved" | "editing" | "saving">( + "saved", + ); const [categories, setCategories] = useState( server.categories ?? [], ); diff --git a/src/pages/settings/server/Invites.tsx b/src/pages/settings/server/Invites.tsx index 204c3a94..cbd6abbb 100644 --- a/src/pages/settings/server/Invites.tsx +++ b/src/pages/settings/server/Invites.tsx @@ -7,13 +7,12 @@ import styles from "./Panes.module.scss"; import { Text } from "preact-i18n"; import { useEffect, useState } from "preact/hooks"; -import { IconButton } from "@revoltchat/ui"; +import { IconButton, Preloader } from "@revoltchat/ui"; import { getChannelName } from "../../../context/revoltjs/util"; import UserIcon from "../../../components/common/user/UserIcon"; import { Username } from "../../../components/common/user/UserShort"; -import Preloader from "../../../components/ui/Preloader"; interface InnerProps { invite: API.Invite;