Merge pull request #682 from bluewave-labs/feat/logger

Feat/logger, resolves #681
This commit is contained in:
Alexander Holliday
2024-08-19 19:02:37 -07:00
committed by GitHub
17 changed files with 73 additions and 34 deletions

View File

@@ -19,6 +19,7 @@ import ProgressUpload from "../../ProgressBars";
import { formatBytes } from "../../../Utils/fileUtils";
import { clearUptimeMonitorState } from "../../../Features/UptimeMonitors/uptimeMonitorsSlice";
import { createToast } from "../../../Utils/toastUtils";
import { logger } from "../../../Utils/Logger";
/**
* ProfilePanel component displays a form for editing user profile information
@@ -256,7 +257,7 @@ const ProfilePanel = () => {
placeholder="Enter your email"
autoComplete="email"
// TODO - add onChange
onChange={() => console.log("Disabled.")}
onChange={() => logger.warn("disabled")}
// error={errors[idToName["edit-email"]]}
disabled={true}
/>

View File

@@ -1,5 +1,7 @@
import React, { useEffect } from "react";
import { useNavigate } from "react-router-dom";
import { logger } from "../Utils/Logger";
import { networkService } from "../main";
const withAdminCheck = (WrappedComponent) => {
@@ -15,7 +17,7 @@ const withAdminCheck = (WrappedComponent) => {
}
})
.catch((error) => {
console.log(error);
logger.error(error);
});
}, [navigate]);
return <WrappedComponent {...props} isAdmin={true} />;

View File

@@ -14,7 +14,7 @@ import Logo from "../../assets/icons/bwu-icon.svg?react";
import Mail from "../../assets/icons/mail.svg?react";
import ArrowBackRoundedIcon from "@mui/icons-material/ArrowBackRounded";
import PropTypes from "prop-types";
import { logger } from "../../Utils/Logger";
import "./index.css";
/**
@@ -284,7 +284,7 @@ const Login = () => {
}
})
.catch((error) => {
console.log(error);
logger.error(error);
});
}, [authToken, navigate]);

View File

@@ -17,6 +17,7 @@ import Button from "../../../Components/Button";
import Field from "../../../Components/Inputs/Field";
import { networkService } from "../../../main";
import "../index.css";
import { logger } from "../../../Utils/Logger";
/**
* Displays the initial landing page.
@@ -399,10 +400,9 @@ const Register = ({ isAdmin }) => {
try {
const res = await networkService.verifyInvitationToken(token);
const { role, email } = res.data.data;
console.log(role);
setForm({ ...form, email, role });
} catch (error) {
console.log(error);
logger.error(error);
}
}
};

View File

@@ -20,6 +20,7 @@ import { useState, useEffect } from "react";
import { useSelector } from "react-redux";
import { networkService } from "../../../main";
import { StatusLabel } from "../../../Components/Label";
import { logger } from "../../../Utils/Logger";
const IncidentTable = ({ monitors, selectedMonitor, filter }) => {
const { authToken, user } = useSelector((state) => state.auth);
@@ -70,7 +71,7 @@ const IncidentTable = ({ monitors, selectedMonitor, filter }) => {
setChecks(res.data.data.checks);
setChecksCount(res.data.data.checksCount);
} catch (error) {
console.log(error);
logger.error(error);
}
};
fetchPage();
@@ -85,7 +86,6 @@ const IncidentTable = ({ monitors, selectedMonitor, filter }) => {
]);
const handlePageChange = (_, newPage) => {
console.log(newPage);
setPaginationController({
...paginationController,
page: newPage - 1, // 0-indexed

View File

@@ -19,6 +19,7 @@ import {
import Checkbox from "../../../Components/Inputs/Checkbox";
import Breadcrumbs from "../../../Components/Breadcrumbs";
import "./index.css";
import { logger } from "../../../Utils/Logger";
/**
* Parses a URL string and returns a URL object.
@@ -108,7 +109,7 @@ const Configure = () => {
useEffect(() => {
const data = monitors.find((monitor) => monitor._id === monitorId);
if (!data) {
console.error("Error fetching monitor of id: " + monitorId);
logger.error("Error fetching monitor of id: " + monitorId);
navigate("/not-found");
}
setMonitor({
@@ -337,7 +338,7 @@ const Configure = () => {
label="Notify via SMS (coming soon)"
isChecked={false}
value=""
onChange={() => console.log("disabled")}
onChange={() => logger.warn("disabled")}
isDisabled={true}
/>
<Checkbox
@@ -356,7 +357,7 @@ const Configure = () => {
label="Also notify via email to multiple addresses (coming soon)"
isChecked={false}
value=""
onChange={() => console.log("disabled")}
onChange={() => logger.warn("disabled")}
isDisabled={true}
/>
{monitor?.notifications?.some(
@@ -368,7 +369,7 @@ const Configure = () => {
type="text"
placeholder="name@gmail.com"
value=""
onChange={() => console.log("disabled")}
onChange={() => logger.warn("disabled")}
/>
<Typography mt={theme.gap.small}>
You can separate multiple emails with a comma

View File

@@ -13,6 +13,7 @@ import Select from "../../../Components/Inputs/Select";
import Checkbox from "../../../Components/Inputs/Checkbox";
import { createToast } from "../../../Utils/toastUtils";
import Breadcrumbs from "../../../Components/Breadcrumbs";
import { logger } from "../../../Utils/Logger";
const CreateMonitor = () => {
const MS_PER_MINUTE = 60000;
@@ -267,7 +268,7 @@ const CreateMonitor = () => {
label="Notify via SMS (coming soon)"
isChecked={false}
value=""
onChange={() => console.log("disabled")}
onChange={() => logger.warn("disabled")}
isDisabled={true}
/>
<Checkbox
@@ -284,7 +285,7 @@ const CreateMonitor = () => {
label="Also notify via email to multiple addresses (coming soon)"
isChecked={false}
value=""
onChange={() => console.log("disabled")}
onChange={() => logger.warn("disabled")}
isDisabled={true}
/>
{monitor.notifications.some(
@@ -296,7 +297,7 @@ const CreateMonitor = () => {
type="text"
placeholder="name@gmail.com"
value=""
onChange={() => console.log("disabled")}
onChange={() => logger.warn("disabled")}
/>
<Typography mt={theme.gap.small}>
You can separate multiple emails with a comma

View File

@@ -17,6 +17,7 @@ import { networkService } from "../../../../main";
import { StatusLabel } from "../../../../Components/Label";
import ArrowBackRoundedIcon from "@mui/icons-material/ArrowBackRounded";
import ArrowForwardRoundedIcon from "@mui/icons-material/ArrowForwardRounded";
import { logger } from "../../../../Utils/Logger";
const PaginationTable = ({ monitorId, dateRange }) => {
const { authToken } = useSelector((state) => state.auth);
@@ -50,7 +51,7 @@ const PaginationTable = ({ monitorId, dateRange }) => {
setChecks(res.data.data.checks);
setChecksCount(res.data.data.checksCount);
} catch (error) {
console.log(error);
logger.error(error);
}
};
fetchPage();

View File

@@ -18,6 +18,7 @@ import {
import "./index.css";
import MonitorDetails60MinChart from "../../../Components/Charts/MonitorDetails60MinChart";
import Breadcrumbs from "../../../Components/Breadcrumbs";
import { logger } from "../../../Utils/Logger";
const StatBox = ({ title, value }) => {
return (
@@ -132,8 +133,7 @@ const DetailsPage = () => {
);
setMonitor(res.data.data);
} catch (error) {
console.log(error);
console.error("Error fetching monitor of id: " + monitorId);
logger.error(error);
navigate("/not-found");
}
}, [authToken, monitorId, navigate, dateRange]);

View File

@@ -28,6 +28,7 @@ import {
import Settings from "../../assets/icons/settings-bold.svg?react";
import PropTypes from "prop-types";
import { logger } from "../../Utils/Logger";
const ActionsMenu = ({ monitor }) => {
const [anchorEl, setAnchorEl] = useState(null);
@@ -36,7 +37,6 @@ const ActionsMenu = ({ monitor }) => {
const dispatch = useDispatch();
const theme = useTheme();
const authState = useSelector((state) => state.auth);
const handleRemove = async (event) => {
event.preventDefault();
event.stopPropagation();

View File

@@ -33,7 +33,6 @@ const DefaultValue = {
*/
const NotFound = ({ title = DefaultValue.title, desc = DefaultValue.desc }) => {
const navigate = useNavigate();
console.log("NOT FOUND");
return (
<Stack className="not-found-page" justifyContent="center">
<Stack gap="20px" alignItems="center">

View File

@@ -18,6 +18,7 @@ import PauseCircleOutlineIcon from "@mui/icons-material/PauseCircleOutline";
import GreenCheck from "../../../assets/icons/checkbox-green.svg?react";
import RedCheck from "../../../assets/icons/checkbox-red.svg?react";
import Breadcrumbs from "../../../Components/Breadcrumbs";
import { logger } from "../../../Utils/Logger";
import "./index.css";
@@ -92,7 +93,7 @@ const PageSpeedConfigure = () => {
useEffect(() => {
const data = monitors.find((monitor) => monitor._id === monitorId);
if (!data) {
console.error("Error fetching pagespeed monitor of id: " + monitorId);
logger.error("Error fetching pagespeed monitor of id: " + monitorId);
navigate("/not-found");
}
setMonitor({
@@ -278,7 +279,7 @@ const PageSpeedConfigure = () => {
id="notify-emails-list"
placeholder="notifications@gmail.com"
value=""
onChange={() => console.log("disabled")}
onChange={() => logger.warn("disabled")}
error=""
/>
<Typography mt={theme.gap.small}>

View File

@@ -12,6 +12,7 @@ import { createToast } from "../../../Utils/toastUtils";
import { createPageSpeed } from "../../../Features/PageSpeedMonitor/pageSpeedMonitorSlice";
import Breadcrumbs from "../../../Components/Breadcrumbs";
import "./index.css";
import { logger } from "../../../Utils/Logger";
const CreatePageSpeed = () => {
const theme = useTheme();
@@ -175,7 +176,7 @@ const CreatePageSpeed = () => {
id="notify-emails-list"
placeholder="notifications@gmail.com"
value=""
onChange={() => console.log("disabled")}
onChange={() => logger.warn("disabled")}
error=""
/>
<Typography mt={theme.gap.small}>

View File

@@ -21,6 +21,7 @@ import PageSpeedLineChart from "../../../Components/Charts/PagespeedLineChart";
import Breadcrumbs from "../../../Components/Breadcrumbs";
import "./index.css";
import PropTypes from "prop-types";
import { logger } from "../../../Utils/Logger";
const StatBox = ({ icon, title, value }) => {
const theme = useTheme();
@@ -210,7 +211,7 @@ const PageSpeedDetails = () => {
setMonitor(res?.data?.data ?? {});
setAudits(res?.data?.data?.checks?.[0]?.audits ?? []);
} catch (error) {
console.log(error);
logger.error(logger);
navigate("/not-found");
}
};

View File

@@ -4,7 +4,7 @@ import Button from "../../Components/Button";
import Field from "../../Components/Inputs/Field";
import Link from "../../Components/Link";
import Select from "../../Components/Inputs/Select";
import { logger } from "../../Utils/Logger";
import "./index.css";
const Settings = () => {
@@ -40,14 +40,14 @@ const Settings = () => {
id="display-timezone"
label="Display timezone"
value="est"
onChange={() => console.log("disabled")}
onChange={() => logger.warn("disabled")}
items={[{ _id: "est", name: "America / Toronto" }]}
/>
<Select
id="server-timezone"
label="Server timezone"
value="est"
onChange={() => console.log("disabled")}
onChange={() => logger.warn("disabled")}
items={[{ _id: "est", name: "America / Toronto" }]}
/>
</Stack>
@@ -74,7 +74,7 @@ const Settings = () => {
optionalLabel="0 for infinite"
placeholder="90"
value=""
onChange={() => console.log("Disabled")}
onChange={() => logger.warn("Disabled")}
/>
<Box>
<Typography>Clear all stats. This is irreversible.</Typography>

View File

@@ -0,0 +1,30 @@
const LOG_LEVEL = import.meta.env.VITE_APP_LOG_LEVEL;
class Logger {
constructor(logLevel) {
const NO_OP = () => {};
if (logLevel === "none") {
this.error = NO_OP;
this.warn = NO_OP;
this.log = NO_OP;
return;
}
this.error = console.error.bind(console);
if (logLevel === "error") {
this.warn = NO_OP;
this.log = NO_OP;
return;
}
this.warn = console.warn.bind(console);
if (logLevel === "warn") {
this.log = NO_OP;
return;
}
this.log = console.log.bind(console);
}
}
export const logger = new Logger(LOG_LEVEL);

View File

@@ -22,7 +22,7 @@ BlueWave Uptime is an open source server monitoring application used to track th
- [x] Ping monitoring
- [x] Incidents at a glance
- [x] Page speed monitoring
- [x] E-mail notifications
- [x] E-mail notifications
- [ ] Scheduled maintenance (in the works)
**Roadmap (short term):**
@@ -62,8 +62,7 @@ Made with [contrib.rocks](https://contrib.rocks).
[![Star History Chart](https://api.star-history.com/svg?repos=bluewave-labs/bluewave-uptime&type=Date)](https://star-history.com/#bluewave-labs/bluewave-uptime&Date)
Also check other developer and contributor-friendly projects of BlueWave:
Also check other developer and contributor-friendly projects of BlueWave:
- [BlueWave HRM](https://github.com/bluewave-labs/bluewave-hrm)
- [BlueWave Onboarding](https://github.com/bluewave-labs/bluewave-onboarding)
@@ -191,6 +190,7 @@ SYSTEM_EMAIL_PASSWORD=<system_email_password>
```
VITE_APP_API_BASE_URL="http://localhost:5000/api/v1"
VITE_APP_API_LOG_LEVEL="debug"
```
4. In the `Docker` directory run `docker compose up` to run the `docker-compose.yaml` file and start all four images.
@@ -211,9 +211,10 @@ That's it, the application is ready to use on port 80.
##### Environmental Variables <a id="env-vars-client"></a>
| ENV Variable Name | Required/Optional | Type | Description | Accepted Values |
| --------------------- | ----------------- | -------- | ------------------ | --------------- |
| VITE_APP_API_BASE_URL | Required | `string` | Base URL of server | {host}/api/v1 |
| ENV Variable Name | Required/Optional | Type | Description | Accepted Values |
| --------------------- | ----------------- | -------- | ------------------ | ---------------------------------- |
| VITE_APP_API_BASE_URL | Required | `string` | Base URL of server | {host}/api/v1 |
| VITE_APP_LOG_LEVEL | Optional | `string` | Log level | `"none"`\|`"error"` \| `"warn"` \| |
<br/>