d36e8ec85f
* remove test_web * integrate reactjs-vite * update lint-staged * simple cors proxy server which handles cookies and redirections * overrider global fetch with proxy call * simple examples for set cookies and fetch request * app bar * add redux * loadPlugins. error: cant load urlencode module * add ts-node for transforming * plugin search & select * plugin slice * accordion components * path item & popular novel * optional for filters * search novel * parse novel * parseChapter * update cookies * default filters * fix: import path * bundler module resolution * new json_plugins * fix: generate multisrc (missing filters) * fix: host scripts * fix: plugin code path * remove typechecking action
43 lines
934 B
TypeScript
43 lines
934 B
TypeScript
import React, { ReactNode, useEffect, useState } from 'react';
|
|
import Alert from '@mui/material/Alert';
|
|
|
|
export default function CopiableItem({
|
|
content,
|
|
children,
|
|
}: {
|
|
content?: string;
|
|
children: ReactNode;
|
|
}) {
|
|
const [alertVisible, setAlertVisble] = useState(false);
|
|
useEffect(() => {
|
|
if (alertVisible) {
|
|
setTimeout(() => setAlertVisble(false), 1000);
|
|
}
|
|
}, [alertVisible]);
|
|
return (
|
|
<div
|
|
onClick={() => {
|
|
if (content) {
|
|
navigator.clipboard.writeText(content).then(() => {
|
|
setAlertVisble(true);
|
|
});
|
|
}
|
|
}}
|
|
>
|
|
{alertVisible ? (
|
|
<Alert
|
|
sx={{
|
|
position: 'absolute',
|
|
transform: 'translate(100%, -100%)',
|
|
zIndex: theme => theme.zIndex.tooltip + 1,
|
|
}}
|
|
severity="success"
|
|
>
|
|
Copied
|
|
</Alert>
|
|
) : null}
|
|
{children}
|
|
</div>
|
|
);
|
|
}
|