GitHub-Proxy/signoz
1
0
Fork 0
mirror of https://git.mirrors.martin98.com/https://github.com/SigNoz/signoz synced 2025-08-12 06:19:03 +08:00
Code Issues Packages Projects Releases Wiki Activity

choose config based on routes

Browse Source
This commit is contained in:
dhrubesh 2021-05-13 20:07:48 +05:30
parent 173bd01e70
commit a416767950
2 changed files with 14 additions and 21 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

33
frontend/src/modules/Nav/TopNav/DateTimeSelector.tsx
View File

@ -5,12 +5,12 @@ import { withRouter } from "react-router";
import { RouteComponentProps, useLocation } from "react-router-dom"; import { RouteComponentProps, useLocation } from "react-router-dom";
import { connect } from "react-redux"; import { connect } from "react-redux";
import ROUTES from "Src/constants/routes"; import ROUTES from "Src/constants/routes";
import { findIndex } from "lodash";
import CustomDateTimeModal from "./CustomDateTimeModal"; import CustomDateTimeModal from "./CustomDateTimeModal";
import { GlobalTime, updateTimeInterval } from "../../../store/actions"; import { GlobalTime, updateTimeInterval } from "../../../store/actions";
import { StoreState } from "../../../store/reducers"; import { StoreState } from "../../../store/reducers";
import FormItem from "antd/lib/form/FormItem"; import FormItem from "antd/lib/form/FormItem";
import { DefaultOptions, ServiceMapOptions } from "./config";
import { DateTimeRangeType } from "../../../store/actions"; import { DateTimeRangeType } from "../../../store/actions";
import { METRICS_PAGE_QUERY_PARAM } from "Src/constants/query"; import { METRICS_PAGE_QUERY_PARAM } from "Src/constants/query";
import { LOCAL_STORAGE } from "Src/constants/localStorage"; import { LOCAL_STORAGE } from "Src/constants/localStorage";
@ -32,16 +32,19 @@ interface DateTimeSelectorProps extends RouteComponentProps<any> {
This components is mounted all the time. Use event listener to track changes. This components is mounted all the time. Use event listener to track changes.
*/ */
const _DateTimeSelector = (props: DateTimeSelectorProps) => { const _DateTimeSelector = (props: DateTimeSelectorProps) => {
const defaultTime = "30min"; const location = useLocation();
const options =
location.pathname === ROUTES.SERVICE_MAP ? ServiceMapOptions : DefaultOptions;
const defaultTime = options[0].value;
const [customDTPickerVisible, setCustomDTPickerVisible] = useState(false); const [customDTPickerVisible, setCustomDTPickerVisible] = useState(false);
const [timeInterval, setTimeInterval] = useState(defaultTime); const [timeInterval, setTimeInterval] = useState(defaultTime);
const [startTime, setStartTime] = useState<moment.Moment | null>(null); const [startTime, setStartTime] = useState<moment.Moment | null>(null);
const [endTime, setEndTime] = useState<moment.Moment | null>(null); const [endTime, setEndTime] = useState<moment.Moment | null>(null);
const [refreshButtonHidden, setRefreshButtonHidden] = useState(false); const [refreshButtonHidden, setRefreshButtonHidden] = useState(false);
const [refreshText, setRefreshText] = useState(""); const [refreshText, setRefreshText] = useState("");
const [refreshButtonClick, setRefreshButtoClick] = useState(0); const [refreshButtonClick, setRefreshButtonClick] = useState(0);
const [form_dtselector] = Form.useForm(); const [form_dtselector] = Form.useForm();
const location = useLocation();
const updateTimeOnQueryParamChange = () => { const updateTimeOnQueryParamChange = () => {
const timeDurationInLocalStorage = localStorage.getItem( const timeDurationInLocalStorage = localStorage.getItem(
@ -78,13 +81,11 @@ const _DateTimeSelector = (props: DateTimeSelectorProps) => {
// On URL Change // On URL Change
useEffect(() => { useEffect(() => {
updateTimeOnQueryParamChange(); updateTimeOnQueryParamChange();
if (findIndex(options, (option) => option.value === timeInterval) === -1) {
setTimeInterval(options[0].value);
}
}, [location]); }, [location]);
//On mount
useEffect(() => {
updateTimeOnQueryParamChange();
}, []);
const setMetricsTimeInterval = (value: string) => { const setMetricsTimeInterval = (value: string) => {
props.updateTimeInterval(value); props.updateTimeInterval(value);
setTimeInterval(value); setTimeInterval(value);
@ -173,7 +174,7 @@ const _DateTimeSelector = (props: DateTimeSelectorProps) => {
}; };
const handleRefresh = () => { const handleRefresh = () => {
setRefreshButtoClick(refreshButtonClick + 1); setRefreshButtonClick(refreshButtonClick + 1);
setMetricsTimeInterval(timeInterval); setMetricsTimeInterval(timeInterval);
}; };
@ -187,15 +188,6 @@ const _DateTimeSelector = (props: DateTimeSelectorProps) => {
}; };
}, [props.location, refreshButtonClick]); }, [props.location, refreshButtonClick]);
const options = [
{ value: "custom", label: "Custom" },
{ value: "15min", label: "Last 15 min" },
{ value: "30min", label: "Last 30 min" },
{ value: "1hr", label: "Last 1 hour" },
{ value: "6hr", label: "Last 6 hour" },
{ value: "1day", label: "Last 1 day" },
{ value: "1week", label: "Last 1 week" },
];
if (props.location.pathname.startsWith(ROUTES.USAGE_EXPLORER)) { if (props.location.pathname.startsWith(ROUTES.USAGE_EXPLORER)) {
return null; return null;
} else { } else {
@ -205,6 +197,7 @@ const _DateTimeSelector = (props: DateTimeSelectorProps) => {
"YYYY/MM/DD HH:mm", "YYYY/MM/DD HH:mm",
)}` )}`
: timeInterval; : timeInterval;
return ( return (
<DateTimeWrapper> <DateTimeWrapper>
<Space style={{ float: "right", display: "block" }}> <Space style={{ float: "right", display: "block" }}>

2
frontend/src/modules/Servicemap/ServiceMap.tsx
View File

@ -62,7 +62,7 @@ const ServiceMap = (props: ServiceMapProps) => {
useEffect(() => { useEffect(() => {
getServiceMapItems(globalTime); getServiceMapItems(globalTime);
getDetailedServiceMapItems(globalTime); getDetailedServiceMapItems(globalTime);
}, []); }, [globalTime]);
useEffect(() => { useEffect(() => {
fgRef.current && fgRef.current.d3Force("charge").strength(-400); fgRef.current && fgRef.current.d3Force("charge").strength(-400);