chore(refactor): move and re-organise types folder

This commit is contained in:
Paul Makles 2022-06-10 14:11:38 +01:00
parent ebcbe4bd4b
commit e0ca1681bd
53 changed files with 78 additions and 102 deletions

View file

@ -11,8 +11,6 @@ import { Button, Checkbox } from "@revoltchat/ui";
import { useApplicationState } from "../../mobx/State";
import { SECTION_NSFW } from "../../mobx/stores/Layout";
import { Children } from "../../types/Preact";
const Base = styled.div`
display: flex;
flex-grow: 1;

View file

@ -4,8 +4,6 @@ import { Details } from "@revoltchat/ui";
import { useApplicationState } from "../../mobx/State";
import { Children } from "../../types/Preact";
interface Props {
id: string;
defaultValue: boolean;
@ -34,7 +32,7 @@ export default function CollapsibleSection({
}
{...detailsProps}>
<summary>
<div class="padding">
<div className="padding">
<ChevronDown size={20} />
{summary}
</div>

View file

@ -73,7 +73,7 @@ export default function Emoji({
}
export function generateEmoji(emoji: string) {
return `<img loading="lazy" class="emoji" draggable="false" alt="${emoji}" src="${parseEmoji(
return `<img loading="lazy" className="emoji" draggable="false" alt="${emoji}" src="${parseEmoji(
emoji,
)}" />`;
}

View file

@ -3,8 +3,6 @@ import styled from "styled-components/macro";
import { Text } from "preact-i18n";
import { Children } from "../../types/Preact";
type Props = Omit<TippyProps, "children"> & {
children: Children;
content: Children;

View file

@ -31,7 +31,7 @@ export default function UpdateIndicator({ style }: Props) {
if (style === "titlebar") {
return (
<div class="actions">
<div className="actions">
<Tooltip
content="A new update is available!"
placement="bottom">

View file

@ -16,7 +16,6 @@ import { I18nError } from "../../../context/Locale";
import { useIntermediate } from "../../../context/intermediate/Intermediate";
import { useClient } from "../../../context/revoltjs/RevoltClient";
import { Children } from "../../../types/Preact";
import Markdown from "../../markdown/Markdown";
import UserIcon from "../user/UserIcon";
import { Username } from "../user/UserShort";

View file

@ -2,8 +2,6 @@ import styled from "styled-components/macro";
import { Ref } from "preact";
import { Children } from "../../../../types/Preact";
const Grid = styled.div<{ width: number; height: number }>`
--width: ${(props) => props.width}px;
--height: ${(props) => props.height}px;

View file

@ -149,12 +149,12 @@ function FileEntry({
<EmptyEntry className="icon">
<File size={36} />
</EmptyEntry>
<div class="overlay">
<div className="overlay">
<XCircle size={36} />
</div>
</PreviewBox>
<span class="fn">{file.name}</span>
<span class="size">{determineFileSize(file.size)}</span>
<span className="fn">{file.name}</span>
<span className="size">{determineFileSize(file.size)}</span>
</Entry>
);
@ -169,13 +169,18 @@ function FileEntry({
return (
<Entry className={index >= CAN_UPLOAD_AT_ONCE ? "fade" : ""}>
<PreviewBox onClick={remove}>
<img class="icon" src={url} alt={file.name} loading="eager" />
<div class="overlay">
<img
className="icon"
src={url}
alt={file.name}
loading="eager"
/>
<div className="overlay">
<XCircle size={36} />
</div>
</PreviewBox>
<span class="fn">{file.name}</span>
<span class="size">{determineFileSize(file.size)}</span>
<span className="fn">{file.name}</span>
<span className="size">{determineFileSize(file.size)}</span>
</Entry>
);
}

View file

@ -152,11 +152,11 @@ export default observer(({ channel, replies, setReplies }: Props) => {
return (
<Base key={reply.id}>
<ReplyBase preview>
<div class="replyto">
<div className="replyto">
<Text id="app.main.channel.reply.replying" />
</div>
<div class="content">
<div class="username">
<div className="content">
<div className="username">
<UserShort
size={16}
showServerIdentity
@ -164,7 +164,7 @@ export default observer(({ channel, replies, setReplies }: Props) => {
masquerade={message.masquerade!}
/>
</div>
<div class="message">
<div className="message">
{message.attachments && (
<>
<File size={16} />
@ -196,7 +196,7 @@ export default observer(({ channel, replies, setReplies }: Props) => {
</div>
</div>
</ReplyBase>
<span class="actions">
<span className="actions">
{message.author_id !== client.user!._id && (
<IconButton
onClick={() => {
@ -225,7 +225,7 @@ export default observer(({ channel, replies, setReplies }: Props) => {
content={
<Text id="app.main.channel.reply.toggle" />
}>
<span class="toggle">
<span className="toggle">
<At size={15} />
<Text
id={

View file

@ -20,7 +20,7 @@ export default function EmbedMediaActions({ embed }: Props) {
</span>
<a
href={embed.url}
class={styles.openIcon}
className={styles.openIcon}
target="_blank"
rel="noreferrer">
<IconButton>

View file

@ -1,7 +1,6 @@
import { User } from "revolt.js";
import styled from "styled-components/macro";
import { Children } from "../../../types/Preact";
import Tooltip from "../Tooltip";
import { Username } from "./UserShort";
import UserStatus from "./UserStatus";

View file

@ -114,7 +114,7 @@ export default observer(
y="0"
width="32"
height="32"
class="icon"
className="icon"
mask={mask ?? (status ? "url(#user)" : undefined)}>
{<img src={url} draggable={false} loading="lazy" />}
</foreignObject>

View file

@ -17,9 +17,8 @@ import { dayjs } from "../../context/Locale";
import { useIntermediate } from "../../context/intermediate/Intermediate";
import { AppContext } from "../../context/revoltjs/RevoltClient";
import { generateEmoji } from "../common/Emoji";
import { emojiDictionary } from "../../assets/emojis";
import { generateEmoji } from "../common/Emoji";
import { MarkdownProps } from "./Markdown";
import Prism from "./prism";
@ -49,10 +48,10 @@ export const md: MarkdownIt = MarkdownIt({
const v = Prism.languages[lang];
if (v) {
const out = Prism.highlight(str, v, lang);
return `<pre class="code"><div class="lang"><div onclick="copycode(this)">${lang}</div></div><code class="language-${lang}">${out}</code></pre>`;
return `<pre className="code"><div className="lang"><div onclick="copycode(this)">${lang}</div></div><code className="language-${lang}">${out}</code></pre>`;
}
return `<pre class="code"><code>${md.utils.escapeHtml(
return `<pre className="code"><code>${md.utils.escapeHtml(
str,
)}</code></pre>`;
},

View file

@ -98,7 +98,7 @@ const TitlebarBase = styled.div<Props>`
export function Titlebar(props: Props) {
return (
<TitlebarBase {...props}>
<div class="title">
<div className="title">
<svg
xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 193.733 37.438">
@ -114,7 +114,7 @@ export function Titlebar(props: Props) {
<Wrench size="12.5" />
)}
</div>
{/*<div class="actions quick">
{/*<div className="actions quick">
<Tooltip
content="Mute"
placement="bottom">
@ -130,9 +130,9 @@ export function Titlebar(props: Props) {
</div>
</Tooltip>
</div>*/}
<div class="drag" />
<div className="drag" />
<UpdateIndicator style="titlebar" />
<div class="actions">
<div className="actions">
<div onClick={window.native.min}>
<svg
aria-hidden="false"
@ -164,7 +164,7 @@ export function Titlebar(props: Props) {
/>
</svg>
</div>
<div onClick={window.native.close} class="error">
<div onClick={window.native.close} className="error">
<svg
aria-hidden="false"
width="12"

View file

@ -15,7 +15,6 @@ import { stopPropagation } from "../../../lib/stopPropagation";
import { useIntermediate } from "../../../context/intermediate/Intermediate";
import { Children } from "../../../types/Preact";
import ChannelIcon from "../../common/ChannelIcon";
import Tooltip from "../../common/Tooltip";
import UserIcon from "../../common/user/UserIcon";

View file

@ -112,7 +112,7 @@ export function SearchSidebar({ close }: Props) {
onKeyDown={(e) => e.key === "Enter" && search()}
onChange={(e) => setQuery(e.currentTarget.value)}
/>
<div class="sort">
<div className="sort">
{["Latest", "Oldest", "Relevance"].map((key) => (
<Button
key={key}
@ -127,7 +127,7 @@ export function SearchSidebar({ close }: Props) {
</div>
{state.type === "loading" && <Preloader type="ring" />}
{state.type === "results" && (
<div class="list">
<div className="list">
{state.results.map((message) => {
let href = "";
if (channel?.channel_type === "TextChannel") {
@ -138,7 +138,7 @@ export function SearchSidebar({ close }: Props) {
return (
<Link to={href} key={message._id}>
<div class="message">
<div className="message">
<Message
message={message}
head

View file

@ -2,12 +2,13 @@ import styled from "styled-components/macro";
import { Text } from "preact-i18n";
import { EmojiPack } from "../../common/Emoji";
import mutantSVG from "./mutant_emoji.svg";
import notoSVG from "./noto_emoji.svg";
import openmojiSVG from "./openmoji_emoji.svg";
import twemojiSVG from "./twemoji_emoji.svg";
import { EmojiPack } from "../../common/Emoji";
const Container = styled.div`
gap: 12px;
display: flex;
@ -87,10 +88,10 @@ export function EmojiSelector({ value, setValue }: Props) {
<Text id="app.settings.pages.appearance.emoji_pack" />
</h3>
<Container>
<div class="row">
<div className="row">
<div>
<div
class="button"
className="button"
onClick={() => setValue("mutant")}
data-active={!value || value === "mutant"}>
<img
@ -112,7 +113,7 @@ export function EmojiSelector({ value, setValue }: Props) {
</div>
<div>
<div
class="button"
className="button"
onClick={() => setValue("twemoji")}
data-active={value === "twemoji"}>
<img
@ -125,10 +126,10 @@ export function EmojiSelector({ value, setValue }: Props) {
<h4>Twemoji</h4>
</div>
</div>
<div class="row">
<div className="row">
<div>
<div
class="button"
className="button"
onClick={() => setValue("openmoji")}
data-active={value === "openmoji"}>
<img
@ -142,7 +143,7 @@ export function EmojiSelector({ value, setValue }: Props) {
</div>
<div>
<div
class="button"
className="button"
onClick={() => setValue("noto")}
data-active={value === "noto"}>
<img

View file

@ -117,10 +117,10 @@ export default observer(() => {
] as const
).map((key) => (
<div
class="entry"
className="entry"
key={key}
style={{ backgroundColor: theme.getVariable(key) }}>
<div class="input">
<div className="input">
<input
type="color"
value={theme.getVariable(key)}
@ -141,9 +141,9 @@ export default observer(() => {
}}>
{key}
</span>
<div class="override">
<div className="override">
<div
class="picker"
className="picker"
onClick={(e) =>
e.currentTarget.parentElement?.parentElement
?.querySelector("input")
@ -153,7 +153,7 @@ export default observer(() => {
</div>
<InputBox
type="text"
class="text"
className="text"
value={theme.getVariable(key)}
onChange={(el) =>
setVariable({

View file

@ -55,7 +55,7 @@ export default function ThemeTools() {
</Button>
</Tooltip>
<div
class="code"
className="code"
onClick={() => writeClipboard(JSON.stringify(theme))}>
<Tooltip content={<Text id="app.special.copy" />}>
{" "}

View file

@ -117,12 +117,12 @@ export function PermissionSelect({
return (
<PermissionEntry disabled={disabled}>
<span class="title">
<span className="title">
<span>
<Text id={`permissions.${id}.t`}>{id}</Text>
{disabled && <Lock className="lock" size={14} />}
</span>
<span class="description">
<span className="description">
<Text id={`permissions.${id}.d`} />
</span>
</span>

View file

@ -14,8 +14,6 @@ import { isTouchscreenDevice } from "../../lib/isTouchscreenDevice";
import { useApplicationState } from "../../mobx/State";
import { SIDEBAR_CHANNELS } from "../../mobx/stores/Layout";
import { Children } from "../../types/Preact";
interface Props {
topBorder?: boolean;
bottomBorder?: boolean;

View file

@ -13,7 +13,6 @@ import {
import { hydrateState } from "../mobx/State";
import { Children } from "../types/Preact";
import Locale from "./Locale";
import Theme from "./Theme";
import Intermediate from "./intermediate/Intermediate";

View file

@ -12,7 +12,6 @@ import { determineLink } from "../../lib/links";
import { useApplicationState } from "../../mobx/State";
import { Children } from "../../types/Preact";
import Modals from "./Modals";
export type Screen =

View file

@ -6,7 +6,6 @@ import { useContext, useState } from "preact/hooks";
import { Category, InputBox, Modal } from "@revoltchat/ui";
import { Children } from "../../../types/Preact";
import { I18nError } from "../../Locale";
import { AppContext } from "../../revoltjs/RevoltClient";
import { takeError } from "../../revoltjs/util";

View file

@ -14,7 +14,6 @@ import { TextReact } from "../../../lib/i18n";
import Message from "../../../components/common/messaging/Message";
import UserIcon from "../../../components/common/user/UserIcon";
import { Children } from "../../../types/Preact";
import { I18nError } from "../../Locale";
import { AppContext } from "../../revoltjs/RevoltClient";
import { takeError } from "../../revoltjs/util";

View file

@ -2,7 +2,6 @@ import { Redirect } from "react-router-dom";
import { useApplicationState } from "../../mobx/State";
import { Children } from "../../types/Preact";
import { useClient } from "./RevoltClient";
interface Props {

View file

@ -6,7 +6,6 @@ import { useContext } from "preact/hooks";
import { Preloader } from "@revoltchat/ui";
import { Children } from "../../types/Preact";
import { ClientStatus, StatusContext } from "./RevoltClient";
interface Props {

View file

@ -9,7 +9,6 @@ import { Preloader } from "@revoltchat/ui";
import { useApplicationState } from "../../mobx/State";
import { Children } from "../../types/Preact";
import { useIntermediate } from "../intermediate/Intermediate";
import { registerEvents } from "./events";
import { takeError } from "./util";

View file

@ -2,8 +2,6 @@ import { Channel } from "revolt.js";
import { Text } from "preact-i18n";
import { Children } from "../../types/Preact";
// eslint-disable-next-line @typescript-eslint/no-explicit-any
export function takeError(error: any): string {
if (error.response) {

View file

@ -30,7 +30,6 @@ import CMNotifications from "./contextmenu/CMNotifications";
import Tooltip from "../components/common/Tooltip";
import UserStatus from "../components/common/user/UserStatus";
import { Children } from "../types/Preact";
import { internalEmit } from "./eventEmitter";
import { getRenderer } from "./renderer/Singleton";

View file

@ -6,7 +6,6 @@ import styled from "styled-components/macro";
import { useEffect, useErrorBoundary, useState } from "preact/hooks";
import { GIT_REVISION } from "../revision";
import { Children } from "../types/Preact";
const CrashContainer = styled.div`
height: 100%;

View file

@ -6,8 +6,6 @@ import { useApplicationState } from "../mobx/State";
import { AppContext } from "../context/revoltjs/RevoltClient";
import { Children } from "../types/Preact";
export default observer(({ children }: { children: Children }) => {
const config = useApplicationState().config;
const client = useMemo(() => config.createClient(), [config.get()]);

View file

@ -20,8 +20,6 @@ import { LineDivider } from "@revoltchat/ui";
import { useApplicationState } from "../../mobx/State";
import { NotificationState } from "../../mobx/stores/NotificationOptions";
import { Children } from "../../types/Preact";
interface Action {
key: string;
type: "channel" | "server";

View file

@ -3,8 +3,6 @@ import { useContext } from "preact/hooks";
import { Dictionary } from "../context/Locale";
import { Children } from "../types/Preact";
interface Fields {
[key: string]: Children;
}

View file

@ -119,7 +119,7 @@ export default function App() {
{statusBar && (
<StatusBar>
<div className="title">Partial outage: CDN</div>
<div class="actions">
<div className="actions">
<Link to="/invite/Testers">
<a>
<div className="button">Updates</div>

View file

@ -24,7 +24,6 @@ import { useClient } from "../../../context/revoltjs/RevoltClient";
import Message from "../../../components/common/messaging/Message";
import { SystemMessage } from "../../../components/common/messaging/SystemMessage";
import { Children } from "../../../types/Preact";
import ConversationStart from "./ConversationStart";
import MessageEditor from "./MessageEditor";

View file

@ -18,7 +18,6 @@ import { useIntermediate } from "../../context/intermediate/Intermediate";
import UserIcon from "../../components/common/user/UserIcon";
import UserStatus from "../../components/common/user/UserStatus";
import { Children } from "../../types/Preact";
interface Props {
user: User;

View file

@ -19,7 +19,6 @@ import CollapsibleSection from "../../components/common/CollapsibleSection";
import Tooltip from "../../components/common/Tooltip";
import UserIcon from "../../components/common/user/UserIcon";
import { PageHeader } from "../../components/ui/Header";
import { Children } from "../../types/Preact";
import { Friend } from "./Friend";
export default observer(() => {
@ -201,7 +200,7 @@ export default observer(() => {
sticky
large
summary={
<div class="title">
<div className="title">
<Text id={i18n} /> {list.length}
</div>
}>

View file

@ -77,9 +77,9 @@ export default observer(() => {
<div className={styles.home}>
<Overlay>
{seasonalTheme && (
<div class="snowfall">
<div className="snowfall">
{snowflakes.map((emoji, index) => (
<div key={index} class="snowflake">
<div key={index} className="snowflake">
{emoji}
</div>
))}

View file

@ -14,7 +14,6 @@ import { isTouchscreenDevice } from "../../lib/isTouchscreenDevice";
import { useApplicationState } from "../../mobx/State";
import ButtonItem from "../../components/navigation/items/ButtonItem";
import { Children } from "../../types/Preact";
interface Props {
pages: {

View file

@ -93,7 +93,7 @@ export function Audio() {
return (
<>
<div class={styles.audio}>
<div className={styles.audio}>
{!permission && (
<Tip palette="error">
<Text id="app.settings.pages.audio.tip_grant_permission" />
@ -115,7 +115,7 @@ export function Audio() {
<h3>
<Text id="app.settings.pages.audio.input_device" />
</h3>
<div class={styles.audioBox}>
<div className={styles.audioBox}>
<ComboBox
value={
window.localStorage.getItem(

View file

@ -171,7 +171,7 @@ export function Sessions() {
type="text"
className={styles.name}
value={session.name}
autocomplete="off"
autoComplete="off"
style={{ pointerEvents: "none" }}
/>
<span className={styles.time}>

View file

@ -38,8 +38,7 @@ const Inner = observer(({ ban, users, server, removeSelf }: InnerProps) => {
onClick={() => {
setDelete(true);
server.unbanUser(ban._id.user).then(removeSelf);
}}
disabled={deleting}>
}}>
<XCircle size={24} />
</IconButton>
</div>
@ -100,7 +99,7 @@ export const Bans = observer(({ server }: Props) => {
<span>
<Text id="app.settings.server_pages.bans.user" />
</span>
<span class={styles.reason}>
<span className={styles.reason}>
<Text id="app.settings.server_pages.bans.reason" />
</span>
<span>

View file

@ -292,7 +292,7 @@ export const Categories = observer(({ server }: Props) => {
/>
))}
<KanbanList last>
<div class="inner">
<div className="inner">
<KanbanListHeader
onClick={() =>
setCategories([
@ -369,7 +369,7 @@ function ListElement({
{(provided) => (
<div {...provided.draggableProps} ref={provided.innerRef}>
<KanbanList last={false} key={category.id}>
<div class="inner">
<div className="inner">
<Row>
<KanbanListHeader {...provided.dragHandleProps}>
{editing ? (
@ -422,7 +422,7 @@ function ListElement({
provided.innerRef
}>
<KanbanEntry>
<div class="inner">
<div className="inner">
<ChannelIcon
target={
channel

View file

@ -38,8 +38,7 @@ const Inner = observer(({ invite, server, removeSelf }: InnerProps) => {
onClick={() => {
setDelete(true);
server.client.deleteInvite(invite._id).then(removeSelf);
}}
disabled={deleting}>
}}>
<XCircle size={24} />
</IconButton>
</div>

View file

@ -61,7 +61,7 @@ const Inner = observer(({ member }: InnerProps) => {
title={
<span
style={{
color: role.colour,
color: role.colour!,
}}>
{role.name}
</span>

View file

@ -138,7 +138,7 @@ export const Overview = observer(({ server }: Props) => {
gap: "8px",
alignItems: "center",
}}>
<span style={{ flexShrink: "0", flex: `25%` }}>{i18n}</span>
<span style={{ flexShrink: 0, flex: `25%` }}>{i18n}</span>
<ComboBox
value={
systemMessages?.[

2
src/preact.d.ts vendored
View file

@ -1,2 +0,0 @@
/* eslint-disable */
import JSX = preact.JSX;

View file

@ -1,4 +0,0 @@
import { VNode } from "preact";
export type Child = VNode | string | number | boolean | undefined | null;
export type Children = Child | Child[] | Children[];

View file

13
src/types/preact.d.ts vendored Normal file
View file

@ -0,0 +1,13 @@
/* eslint-disable */
import JSX = preact.JSX;
declare type Child =
| JSX.Element
| preact.VNode
| string
| number
| boolean
| undefined
| null;
declare type Children = Child | Child[] | Children[];