OSD-Frontend/src/Core.js

43 lines
1.1 KiB
JavaScript

import React from "react";
import { useSelector, useDispatch } from "react-redux";
import { Box, Button, Clock } from "grommet";
import { setPlugin, selectCore } from "./coreSlice";
import * as plugins from "./plugins";
function Core() {
const coreState = useSelector(selectCore);
const dispatch = useDispatch();
const plugin = plugins.default[coreState.plugin];
const props = {
data: coreState.data,
close: () => dispatch(setPlugin(false))
};
const dummyButtons = ["Maps", "Home Devices", "Phone"];
return <>
{plugin ? plugin(props) : (
<Box
align="center"
background="light-1"
width="100vw"
justify="center"
direction="column"
alignContent="center"
height="100vh"
>
<Clock size="xxlarge" />
<Clock size="xxlarge" type="digital" />
<Box direction="row" margin="1.5em" wrap={true}>
<Button onClick={() => dispatch(setPlugin("mpd"))} primary
label="Music Player" />
{dummyButtons.map(i =>
<Button primary label={i} key={i} margin="0 0 0 1em" />
)}
</Box>
</Box>)
}
</>;
}
export default Core;