Skip to content

Commit 55f3810

Browse files
AbhishekA1509AbhishekA1509
committed
feat: add dataSourceId to AppMetrics and related components
1 parent 837160d commit 55f3810

File tree

6 files changed

+40
-24
lines changed

6 files changed

+40
-24
lines changed

‎src/components/app/details/appDetails/AppDetails.tsx

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -817,6 +817,7 @@ export const Details: React.FC<DetailsType> = ({
817817
{environment && !isVirtualEnvRef.current && (
818818
<AppMetrics
819819
appName={appDetails.appName}
820+
dataSourceId={appDetails.dataSourceId}
820821
addExtraSpace={!isExternalToolAvailable}
821822
environment={environment}
822823
podMap={aggregatedNodes.nodes.Pod}

‎src/components/app/details/appDetails/AppMetrics.tsx

Lines changed: 26 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -25,6 +25,7 @@ import {
2525
getCalendarValue,
2626
isK8sVersionValid,
2727
LatencySelect,
28+
AppInfo,
2829
} from './utils'
2930
import {
3031
ChartTypes,
@@ -58,16 +59,17 @@ import { ReactComponent as DropDownIcon } from '../../../../assets/icons/appstat
5859
import { getModuleInfo } from '../../../v2/devtronStackManager/DevtronStackManager.service'
5960
import { ModuleStatus } from '../../../v2/devtronStackManager/DevtronStackManager.type'
6061
import { APP_METRICS_CALENDAR_INPUT_DATE_FORMAT } from './constants'
62+
import { AppDetails } from '@Components/app/types'
6163

6264
export const AppMetrics: React.FC<{
6365
appName: string
6466
environment
6567
podMap: Map<string, any>
6668
k8sVersion
6769
addExtraSpace: boolean
68-
}> = ({ appName, environment, podMap, k8sVersion, addExtraSpace }) => {
70+
} & Pick<AppDetails, 'dataSourceId'>> = ({ appName, podMap, k8sVersion, addExtraSpace, environment, dataSourceId }) => {
6971
const { appTheme } = useTheme()
70-
const { appMetrics, environmentName, infraMetrics } = environment
72+
const { appMetrics, infraMetrics } = environment
7173
const [calendar, setDateRange] = useState<{ startDate: Moment; endDate: Moment }>({
7274
startDate: moment().subtract(5, 'minute'),
7375
endDate: moment(),
@@ -76,10 +78,16 @@ export const AppMetrics: React.FC<{
7678
startDate: 'now-5m',
7779
endDate: 'now',
7880
})
79-
const [datasource, setDatasource] = useState({
81+
const [datasource, setDatasource] = useState<{
82+
isLoading: boolean,
83+
isConfigured: boolean
84+
isHealthy: boolean
85+
dataSourceName: string
86+
}>({
8087
isLoading: true,
8188
isConfigured: false,
8289
isHealthy: false,
90+
dataSourceName: '',
8391
})
8492
const [focusedInput, setFocusedInput] = useState(CalendarFocusInput.StartDate)
8593
const [tab, setTab] = useState<AppMetricsTabType>(AppMetricsTab.Aggregate)
@@ -96,6 +104,8 @@ export const AppMetrics: React.FC<{
96104
throughput: '',
97105
latency: '',
98106
})
107+
108+
const { dataSourceName } = datasource
99109
const addSpace: string = addExtraSpace ? 'mb-16' : ''
100110
const pod = podMap?.values().next().value
101111
const newPodHash = pod?.networkingInfo?.labels?.['rollouts-pod-template-hash']
@@ -138,16 +148,20 @@ export const AppMetrics: React.FC<{
138148
let datasourceConfiguredRes
139149
let datasourceHealthyRes
140150
let hostUrlRes
151+
141152
hostUrlRes = await getHostURLConfiguration()
142153
setHostURLConfig(hostUrlRes.result)
143-
datasourceConfiguredRes = await isDatasourceConfigured(environmentName)
154+
datasourceConfiguredRes = await isDatasourceConfigured(dataSourceId)
155+
144156
if (datasourceConfiguredRes.id) {
145157
datasourceHealthyRes = await isDatasourceHealthy(datasourceConfiguredRes.id)
146158
}
159+
147160
setDatasource({
148161
isLoading: false,
149162
isConfigured: !!datasourceConfiguredRes.id,
150-
isHealthy: datasourceHealthyRes.status.toLowerCase() === 'success',
163+
isHealthy: datasourceHealthyRes?.status.toLowerCase() === 'success',
164+
dataSourceName: datasourceConfiguredRes.name,
151165
})
152166
} catch (error) {
153167
setDatasource({
@@ -179,10 +193,10 @@ export const AppMetrics: React.FC<{
179193
if (!isK8sVersionValid(k8sVersion)) {
180194
k8sVersion = DEFAULTK8SVERSION
181195
}
182-
const appInfo = {
196+
const appInfo: AppInfo = {
183197
appId,
184198
envId,
185-
environmentName,
199+
dataSourceName,
186200
newPodHash,
187201
k8sVersion,
188202
}
@@ -205,10 +219,10 @@ export const AppMetrics: React.FC<{
205219
if (!isK8sVersionValid(k8sVersion)) {
206220
k8sVersion = DEFAULTK8SVERSION
207221
}
208-
const appInfo = {
222+
const appInfo: AppInfo = {
209223
appId,
210224
envId,
211-
environmentName,
225+
dataSourceName,
212226
newPodHash,
213227
k8sVersion,
214228
}
@@ -237,10 +251,10 @@ export const AppMetrics: React.FC<{
237251
})
238252
}
239253

240-
const appInfo = {
254+
const appInfo: AppInfo = {
241255
appId,
242256
envId,
243-
environmentName,
257+
dataSourceName,
244258
newPodHash,
245259
k8sVersion,
246260
}
@@ -348,7 +362,7 @@ export const AppMetrics: React.FC<{
348362
appName={appName}
349363
infraMetrics={environment.infraMetrics}
350364
appMetrics={environment.appMetrics}
351-
environmentName={environmentName}
365+
dataSourceName={dataSourceName}
352366
chartName={chartName}
353367
newPodHash={newPodHash}
354368
calendar={calendar}

‎src/components/app/details/appDetails/GraphsModal.tsx

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -26,6 +26,7 @@ import {
2626
ThroughputSelect,
2727
getCalendarValue,
2828
LatencySelect,
29+
AppInfo,
2930
} from './utils'
3031
import { ReactComponent as GraphIcon } from '../../../../assets/icons/ic-graph.svg'
3132
import { DEFAULTK8SVERSION } from '../../../../config'
@@ -39,14 +40,13 @@ export const ChartNames = {
3940
status: 'Status',
4041
}
4142

42-
export interface GraphModalProps {
43+
export interface GraphModalProps extends Pick<AppInfo, 'dataSourceName'> {
4344
appId: string | number
4445
envId: string | number
4546
appName: string
4647
chartName: ChartTypes
4748
infraMetrics: boolean
4849
appMetrics: boolean
49-
environmentName: string
5050
newPodHash: string
5151
calendar: { startDate: Moment; endDate: Moment }
5252
calendarInputs: { startDate: string; endDate: string }
@@ -135,10 +135,10 @@ export class GraphModal extends Component<GraphModalProps, GraphModalState> {
135135
if (!isK8sVersionValid(k8sVersion)) {
136136
k8sVersion = DEFAULTK8SVERSION
137137
}
138-
const appInfo = {
138+
const appInfo: AppInfo = {
139139
appId: this.props.appId,
140140
envId: this.props.envId,
141-
environmentName: this.props.environmentName,
141+
dataSourceName: this.props.dataSourceName,
142142
newPodHash: this.props.newPodHash,
143143
k8sVersion,
144144
}
@@ -316,10 +316,10 @@ export class GraphModal extends Component<GraphModalProps, GraphModalState> {
316316
if (!isK8sVersionValid(k8sVersion)) {
317317
k8sVersion = DEFAULTK8SVERSION
318318
}
319-
const appInfo = {
319+
const appInfo: AppInfo = {
320320
appId: this.props.appId,
321321
envId: this.props.envId,
322-
environmentName: this.props.environmentName,
322+
dataSourceName: this.props.dataSourceName,
323323
newPodHash: this.props.newPodHash,
324324
k8sVersion,
325325
}

‎src/components/app/details/appDetails/appDetails.service.ts

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -20,9 +20,9 @@ import { fetchWithFullRoute } from '../../../../services/fetchWithFullRoute'
2020
import { ClusterConnectionResponse, DeploymentStatusDetailsResponse, ModuleConfigResponse } from './appDetails.type'
2121
import { AppType } from '../../../v2/appDetails/appDetails.type'
2222

23-
export function isDatasourceConfigured(envName: string) {
23+
export function isDatasourceConfigured(dataSourceId: number) {
2424
const root = window.__ORCHESTRATOR_ROOT__.replace('/orchestrator', '')
25-
const URL = `${root}/grafana/api/datasources/id/Prometheus-${envName}`
25+
const URL = `${root}/grafana/api/datasources/${dataSourceId}`
2626
return fetchWithFullRoute(URL, 'GET')
2727
}
2828

‎src/components/app/details/appDetails/utils.tsx

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -176,7 +176,7 @@ export function isK8sVersion115OrBelow(k8sVersion: string): boolean {
176176
export interface AppInfo {
177177
appId: string | number
178178
envId: string | number
179-
environmentName: string
179+
dataSourceName: string
180180
newPodHash: string
181181
k8sVersion: string
182182
}
@@ -197,7 +197,7 @@ export function getIframeSrc({
197197
grafanaURL,
198198
appInfo.appId,
199199
appInfo.envId,
200-
appInfo.environmentName,
200+
appInfo.dataSourceName,
201201
chartName,
202202
appInfo.newPodHash,
203203
calendarInputs,
@@ -321,7 +321,7 @@ export function addQueryParamToGrafanaURL(
321321
url: string,
322322
appId: string | number,
323323
envId: string | number,
324-
environmentName: string,
324+
dataSourceName: string,
325325
chartName: ChartTypes,
326326
newPodHash: string,
327327
calendarInputs,
@@ -338,7 +338,7 @@ export function addQueryParamToGrafanaURL(
338338
url += `&var-app=${appId}`
339339
url += `&var-env=${envId}`
340340
url += `&var-new_rollout_pod_template_hash=${newPodHash}`
341-
url += `&var-datasource=Prometheus-${environmentName}`
341+
url += `&var-datasource=${dataSourceName}`
342342
if (chartName === 'status') {
343343
if (statusCode === StatusType.Throughput) {
344344
// Throughput Graph

‎src/components/app/types.ts

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -131,6 +131,7 @@ export interface AppDetails extends CDModalProps {
131131
releaseMode: ReleaseMode
132132
trafficSwitched?: boolean
133133
pcoId?: number
134+
dataSourceId?: number
134135
}
135136

136137
export interface LabelTag {

0 commit comments

Comments
 (0)