mirror of
https://github.com/spacebarchat/client.git
synced 2024-11-26 04:02:46 +01:00
feat: add attachments from clipboard
This commit is contained in:
parent
56c7d2b144
commit
d9241989df
@ -6,9 +6,9 @@ import Channel from "../../stores/objects/Channel";
|
|||||||
import { MessageType, RESTPostAPIChannelMessageJSONBody } from "@spacebarchat/spacebar-api-types/v9";
|
import { MessageType, RESTPostAPIChannelMessageJSONBody } from "@spacebarchat/spacebar-api-types/v9";
|
||||||
import { observer } from "mobx-react-lite";
|
import { observer } from "mobx-react-lite";
|
||||||
import React, { useMemo } from "react";
|
import React, { useMemo } from "react";
|
||||||
import { BaseEditor, Descendant, Node, createEditor } from "slate";
|
import { Descendant, Node, createEditor } from "slate";
|
||||||
import { HistoryEditor, withHistory } from "slate-history";
|
import { withHistory } from "slate-history";
|
||||||
import { Editable, ReactEditor, Slate, withReact } from "slate-react";
|
import { Editable, Slate, withReact } from "slate-react";
|
||||||
import Guild from "../../stores/objects/Guild";
|
import Guild from "../../stores/objects/Guild";
|
||||||
import { Permissions } from "../../utils/Permissions";
|
import { Permissions } from "../../utils/Permissions";
|
||||||
import Snowflake from "../../utils/Snowflake";
|
import Snowflake from "../../utils/Snowflake";
|
||||||
@ -18,17 +18,6 @@ import IconButton from "../IconButton";
|
|||||||
import AttachmentUploadList from "./AttachmentUploadList";
|
import AttachmentUploadList from "./AttachmentUploadList";
|
||||||
import TypingStatus from "./TypingStatus";
|
import TypingStatus from "./TypingStatus";
|
||||||
|
|
||||||
type CustomElement = { type: "paragraph"; children: CustomText[] };
|
|
||||||
type CustomText = { text: string; bold?: true };
|
|
||||||
|
|
||||||
declare module "slate" {
|
|
||||||
interface CustomTypes {
|
|
||||||
Editor: BaseEditor & ReactEditor & HistoryEditor;
|
|
||||||
Element: CustomElement;
|
|
||||||
Text: CustomText;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
const Container = styled.div`
|
const Container = styled.div`
|
||||||
margin-top: -8px;
|
margin-top: -8px;
|
||||||
padding-left: 16px;
|
padding-left: 16px;
|
||||||
@ -106,6 +95,19 @@ function MessageInput(props: Props) {
|
|||||||
const uploadRef = React.useRef<HTMLInputElement>(null);
|
const uploadRef = React.useRef<HTMLInputElement>(null);
|
||||||
const [attachments, setAttachments] = React.useState<File[]>([]);
|
const [attachments, setAttachments] = React.useState<File[]>([]);
|
||||||
|
|
||||||
|
editor.insertData = (data) => {
|
||||||
|
console.log("insert data", data);
|
||||||
|
const text = data.getData("text/plain");
|
||||||
|
const { files } = data;
|
||||||
|
|
||||||
|
if (files && files.length > 0) {
|
||||||
|
const newAttachments = [...attachments, ...files];
|
||||||
|
setAttachments(newAttachments);
|
||||||
|
} else {
|
||||||
|
editor.insertText(text);
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
React.useEffect(() => {
|
React.useEffect(() => {
|
||||||
const permission = Permissions.getPermission(app.account!.id, props.guild, props.channel);
|
const permission = Permissions.getPermission(app.account!.id, props.guild, props.channel);
|
||||||
setCanSendMessages(permission.has("SEND_MESSAGES"));
|
setCanSendMessages(permission.has("SEND_MESSAGES"));
|
||||||
|
38
src/components/messaging/Slate.ts
Normal file
38
src/components/messaging/Slate.ts
Normal file
@ -0,0 +1,38 @@
|
|||||||
|
import { BaseEditor, BaseRange, Descendant } from "slate";
|
||||||
|
import { HistoryEditor } from "slate-history";
|
||||||
|
import { ReactEditor } from "slate-react";
|
||||||
|
|
||||||
|
export type EmptyText = {
|
||||||
|
text: string;
|
||||||
|
};
|
||||||
|
|
||||||
|
export type CustomText = {
|
||||||
|
bold?: boolean;
|
||||||
|
italic?: boolean;
|
||||||
|
code?: boolean;
|
||||||
|
text: string;
|
||||||
|
};
|
||||||
|
|
||||||
|
export type ParagraphElement = {
|
||||||
|
type: "paragraph";
|
||||||
|
align?: string;
|
||||||
|
children: Descendant[];
|
||||||
|
};
|
||||||
|
|
||||||
|
type CustomElement = ParagraphElement;
|
||||||
|
export type CustomEditor = BaseEditor &
|
||||||
|
ReactEditor &
|
||||||
|
HistoryEditor & {
|
||||||
|
nodeToDecorations?: Map<Element, Range[]>;
|
||||||
|
};
|
||||||
|
|
||||||
|
declare module "slate" {
|
||||||
|
interface CustomTypes {
|
||||||
|
Editor: CustomEditor;
|
||||||
|
Element: CustomElement;
|
||||||
|
Text: CustomText | EmptyText;
|
||||||
|
Range: BaseRange & {
|
||||||
|
[key: string]: unknown;
|
||||||
|
};
|
||||||
|
}
|
||||||
|
}
|
Loading…
Reference in New Issue
Block a user