diff --git a/public/images/bilibili.png b/public/images/bilibili.png new file mode 100644 index 00000000..ffe7d018 Binary files /dev/null and b/public/images/bilibili.png differ diff --git a/shared/embeds/Bilibili.js b/shared/embeds/Bilibili.js new file mode 100644 index 00000000..7027311d --- /dev/null +++ b/shared/embeds/Bilibili.js @@ -0,0 +1,29 @@ +// @flow +import * as React from "react"; +import Frame from "./components/Frame"; + +const URL_REGEX = /(?:https?:\/\/)?(www\.bilibili\.com)\/video\/([\w\d]+)?(\?\S+)?/i; + +type Props = {| + attrs: {| + href: string, + matches: string[], + |}, +|}; + +export default class Vimeo extends React.Component { + static ENABLED = [URL_REGEX]; + + render() { + const { matches } = this.props.attrs; + const videoId = matches[2]; + + return ( + + ); + } +} diff --git a/shared/embeds/Bilibili.test.js b/shared/embeds/Bilibili.test.js new file mode 100644 index 00000000..44e4749e --- /dev/null +++ b/shared/embeds/Bilibili.test.js @@ -0,0 +1,23 @@ +/* eslint-disable flowtype/require-valid-file-annotation */ +import Bilibili from "./Bilibili"; + +describe("Bilibili", () => { + const match = Bilibili.ENABLED[0]; + test("to be enabled on video link", () => { + expect( + "https://www.bilibili.com/video/BV1CV411s7jd?spm_id_from=333.999.0.0".match( + match + ) + ).toBeTruthy(); + }); + + test("to not be enabled elsewhere", () => { + expect("https://youtu.be".match(match)).toBe(null); + expect("https://bilibili.com".match(match)).toBe(null); + expect("https://www.bilibili.com".match(match)).toBe(null); + expect("https://www.bilibili.com/logout".match(match)).toBe(null); + expect("https://www.bilibili.com/feed/subscriptions".match(match)).toBe( + null + ); + }); +}); diff --git a/shared/embeds/index.js b/shared/embeds/index.js index 3f53c865..e0c08d60 100644 --- a/shared/embeds/index.js +++ b/shared/embeds/index.js @@ -3,6 +3,7 @@ import * as React from "react"; import styled from "styled-components"; import Abstract from "./Abstract"; import Airtable from "./Airtable"; +import Bilibili from "./Bilibili"; import Cawemo from "./Cawemo"; import ClickUp from "./ClickUp"; import Codepen from "./Codepen"; @@ -66,6 +67,13 @@ export default [ component: Airtable, matcher: matcher(Airtable), }, + { + title: "Bilibili", + keywords: "video", + icon: () => , + component: Bilibili, + matcher: matcher(Bilibili), + }, { title: "Cawemo", keywords: "bpmn process",