52 lines
982 B
TypeScript
52 lines
982 B
TypeScript
|
import electron from "electron";
|
||
|
import React, { useState } from "react";
|
||
|
import styled from "styled-components";
|
||
|
import ReactDom from "react-dom";
|
||
|
|
||
|
type Proptypes = {
|
||
|
}
|
||
|
|
||
|
const Content = styled.div`
|
||
|
position: fixed;
|
||
|
top: 50%;
|
||
|
left: 50%;
|
||
|
transform: translate(-50%, -50%);
|
||
|
background-color: #FFF;
|
||
|
padding: 50px;
|
||
|
z-index: 1000;
|
||
|
`;
|
||
|
|
||
|
const Overlay = styled.div`
|
||
|
position: fixed;
|
||
|
top:0;
|
||
|
bottom: 0;
|
||
|
right: 0;
|
||
|
left: 0;
|
||
|
background-color: rgba(0,0,0,0.7);
|
||
|
z-index: 999;
|
||
|
`;
|
||
|
|
||
|
const Settings: React.FC<Proptypes> = () => {
|
||
|
const [open, setOpen] = useState(false);
|
||
|
const ipcHandler = () => {
|
||
|
setOpen(true);
|
||
|
};
|
||
|
electron.ipcRenderer.on("show-settings", ipcHandler);
|
||
|
|
||
|
if (!open) {
|
||
|
return null;
|
||
|
}
|
||
|
|
||
|
return ReactDom.createPortal(
|
||
|
<>
|
||
|
<Overlay />
|
||
|
<Content>
|
||
|
<button type="button" onClick={() => { setOpen(false); }}>close</button>
|
||
|
</Content>
|
||
|
</>,
|
||
|
document.getElementById("portal")!,
|
||
|
);
|
||
|
};
|
||
|
|
||
|
export default Settings;
|