diff --git a/Client/src/App.jsx b/Client/src/App.jsx
index 5db3ea623..8fb4bf932 100644
--- a/Client/src/App.jsx
+++ b/Client/src/App.jsx
@@ -59,7 +59,7 @@ function App() {
element={}
/>
}
/>
{
const MS_PER_MINUTE = 60000;
const { user, authToken } = useSelector((state) => state.auth);
+ const { monitors } = useSelector((state) => state.uptimeMonitors);
const dispatch = useDispatch();
const navigate = useNavigate();
const theme = useTheme();
@@ -30,6 +32,7 @@ const CreateMonitor = () => {
"notify-email-default": "notification-email",
};
+ const { monitorId } = useParams();
const [monitor, setMonitor] = useState({
url: "",
name: "",
@@ -40,6 +43,36 @@ const CreateMonitor = () => {
const [https, setHttps] = useState(true);
const [errors, setErrors] = useState({});
+ useEffect(() => {
+ const fetchMonitor = async () => {
+ if (monitorId) {
+ const action = await dispatch(
+ getUptimeMonitorById({ authToken, monitorId })
+ );
+
+ if (action.payload.success) {
+ const data = action.payload.data;
+ const { name, ...rest } = data; //data.name is read-only
+ if (rest.type === "http") {
+ const url = new URL(rest.url);
+ rest.url = url.host;
+ }
+ rest.name = `${name} (Clone)`;
+ rest.interval /= MS_PER_MINUTE;
+ setMonitor({
+ ...rest,
+ });
+ } else {
+ navigate("/not-found", { replace: true });
+ createToast({
+ body: "There was an error cloning the monitor.",
+ });
+ }
+ }
+ };
+ fetchMonitor();
+ }, [monitorId, authToken, monitors]);
+
const handleChange = (event, name) => {
const { value, id } = event.target;
if (!name) name = idMap[id];
diff --git a/Client/src/Pages/Monitors/Home/actionsMenu.jsx b/Client/src/Pages/Monitors/Home/actionsMenu.jsx
index efb29402d..7f2eb0d97 100644
--- a/Client/src/Pages/Monitors/Home/actionsMenu.jsx
+++ b/Client/src/Pages/Monitors/Home/actionsMenu.jsx
@@ -137,6 +137,14 @@ const ActionsMenu = ({ monitor, isAdmin, updateCallback }) => {
Configure
)}
+
{isAdmin && (