web client v0.2 (add restaurant OK, settings OK)

src/components/Output/Contact.js

@@ -0,0 +1,58 @@
+import React from "react";
+import Paper from "@material-ui/core/Paper";
+import List from "@material-ui/core/List";
+import ListItem from "@material-ui/core/ListItem";
+import ListItemText from "@material-ui/core/ListItemText";
+import Divider from "@material-ui/core/Divider";
+import { makeStyles } from "@material-ui/core/styles";
+import LogoMain from "./logoMain";
+
+const useStyles = makeStyles((theme) => ({
+  root: {
+    textAlign: "center",
+  },
+  secondary: {
+    "& .MuiListItemText-secondary": {
+      color: "#7b7b7b",
+      fontSize: "13px",
+    },
+    textAlign: "center",
+  },
+}));
+
+export default function Contact() {
+  const style = useStyles();
+  return (
+    <Paper style={{ backgroundColor: "#262626", color: "#bbbbbb" }}>
+      <List className={style.root}>
+        <ListItem>
+          <LogoMain />
+        </ListItem>
+        <Divider />
+        <ListItem>
+          <ListItemText
+            className={style.secondary}
+            primary="Telefon"
+            secondary="(+48) 533 270 853"
+          />
+        </ListItem>
+        <Divider />
+        <ListItem>
+          <ListItemText
+            className={style.secondary}
+            primary="Biuro"
+            secondary="menui@menui.pl"
+          />
+        </ListItem>
+        <Divider />
+        <ListItem>
+          <ListItemText
+            className={style.secondary}
+            primary="Wsparcie techniczne"
+            secondary="support@menui.pl"
+          />
+        </ListItem>
+      </List>
+    </Paper>
+  );
+}

src/components/Output/InfoDialog.js

@@ -1,17 +1,12 @@
 import React from "react";
-import CloseIcon from "@material-ui/icons/Close";
 import { makeStyles } from "@material-ui/core/styles";
 import DialogTitle from "@material-ui/core/DialogTitle";
 import DialogContent from "@material-ui/core/DialogContent";
 import Dialog from "@material-ui/core/Dialog";
 import Divider from "@material-ui/core/Divider";
-import ButtonSecondary from "../Input/ButtonSecondary";
-import IconButton from "@material-ui/core/IconButton";
 import CircularProgress from "@material-ui/core/CircularProgress";
-import { useHistory } from "react-router-dom";
 
 export default function InfoDialog(props) {
-  const history = useHistory();
   const loading = props.loading;
   const loginStyles = makeStyles((theme) => ({
     root: {
@@ -32,25 +27,12 @@ export default function InfoDialog(props) {
   const styles = loginStyles();
 
   return (
-    <Dialog
-      className={styles.root}
-      onClose={() => history.push("/")}
-      open={true}
-      aria-labelledby="title"
-    >
+    <Dialog className={styles.root} open={true} aria-labelledby="title">
       <DialogTitle id="title">{props.title}</DialogTitle>
-      <IconButton
-        className={styles.closeButton}
-        onClick={() => history.push("/")}
-        aria-label="close"
-      >
-        <CloseIcon />
-      </IconButton>
       <Divider />
       <DialogContent>
         <p>{props.text}</p>
         {loading && <CircularProgress />}
-        <ButtonSecondary onClick={history.push("/")} text="Ok" />
       </DialogContent>
     </Dialog>
   );

src/components/Output/ListItemRestaurant.js

@@ -0,0 +1,62 @@
+import React from "react";
+import ListItemIcon from "@material-ui/core/ListItemIcon";
+import ListItemText from "@material-ui/core/ListItemText";
+import ListItem from "@material-ui/core/ListItem";
+import FastfoodIcon from "@material-ui/icons/Fastfood";
+import Badge from "@material-ui/core/Badge";
+import { makeStyles } from "@material-ui/core/styles";
+
+const useStyles = makeStyles((theme) => ({
+  root: {
+    "& .MuiBadge-colorPrimary": {
+      backgroundColor: "#13ff00",
+    },
+    "& .MuiBadge-colorError": {
+      backgroundColor: "#ff0000",
+    },
+  },
+  secondary: {
+    "& .MuiListItemText-secondary": {
+      color: "#7b7b7b",
+      fontSize: "13px",
+    },
+  },
+}));
+
+export default function ListItemRestaurant(props) {
+  const styles = useStyles();
+  const badgeData = {
+    color: "",
+    secondaryText: "",
+  };
+  const badgeInit = () => {
+    if (!props.subscriptionActive || props.subscriptionActive === false) {
+      badgeData.color = "error";
+      badgeData.secondaryText = "Aktywuj sybskrypcję";
+    } else {
+      badgeData.color = "primary";
+      badgeData.secondaryText = "Subskrypcja aktywna";
+    }
+  };
+  badgeInit();
+
+  return (
+    <ListItem button>
+      <ListItemIcon>
+        <Badge
+          className={styles.root}
+          anchorOrigin={{ vertical: "top", horizontal: "left" }}
+          variant="dot"
+          color={badgeData.color}
+        >
+          <FastfoodIcon />
+        </Badge>
+      </ListItemIcon>
+      <ListItemText
+        className={styles.secondary}
+        primary={props.name}
+        secondary={badgeData.secondaryText}
+      />
+    </ListItem>
+  );
+}

src/components/Output/Social.js

@@ -3,17 +3,27 @@ import FacebookIcon from "@material-ui/icons/Facebook";
 import TwitterIcon from "@material-ui/icons/Twitter";
 import InstagramIcon from "@material-ui/icons/Instagram";
 import IconButton from "@material-ui/core/IconButton";
+import { openInNewTab } from "../../Services.js";
 
 export default function Social(props) {
   return (
     <div className="social-container">
-      <IconButton color="secondary">
+      <IconButton
+        onClick={() => openInNewTab("https://www.facebook.com")}
+        color="secondary"
+      >
         <FacebookIcon />
       </IconButton>
-      <IconButton color="secondary">
+      <IconButton
+        onClick={() => openInNewTab("https://twitter.com/menuifood")}
+        color="secondary"
+      >
         <TwitterIcon />
       </IconButton>
-      <IconButton color="secondary">
+      <IconButton
+        onClick={() => openInNewTab("https://www.instagram.com")}
+        color="secondary"
+      >
         <InstagramIcon />
       </IconButton>
     </div>