rzmk/learnhouse
1
0
Fork 0
mirror of https://github.com/rzmk/learnhouse.git synced 2025-12-19 04:19:25 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

feat: init youtube editor extension

Browse source
This commit is contained in:
swve 2022-12-14 00:08:46 +01:00
parent 5eb9101084
commit 8d0efdb93e
5 changed files with 68 additions and 5 deletions
Download patch file Download diff file Expand all files Collapse all files

19
front/components/Editor/Toolbar/ToolbarButtons.tsx
View file

@ -1,12 +1,26 @@
import styled from "styled-components";
import { FontBoldIcon, FontItalicIcon, StrikethroughIcon, ArrowLeftIcon, ArrowRightIcon, OpacityIcon } from "@radix-ui/react-icons";
import { AlertCircle, AlertTriangle, ImagePlus, Info } from "lucide-react";
import { AlertCircle, AlertTriangle, ImagePlus, Info, Youtube } from "lucide-react";
export const ToolbarButtons = ({ editor }: any) => {
if (!editor) {
return null;
}
// YouTube extension
const addYoutubeVideo = () => {
const url = prompt("Enter YouTube URL");
if (url) {
editor.commands.setYoutubeVideo({
src: url,
width: 640,
height: 480,
});
}
};
return (
<ToolButtonsWrapper>
<ToolBtn onClick={() => editor.chain().focus().undo().run()}>
@ -60,6 +74,9 @@ export const ToolbarButtons = ({ editor }: any) => {
>
<ImagePlus size={15} />
</ToolBtn>
<ToolBtn onClick={() => addYoutubeVideo()}>
<Youtube size={15} />
</ToolBtn>
</ToolButtonsWrapper>
);
};