Merge branch 'master' into master

pkg/apiserver/user/sso/router.go

@@ -111,6 +111,8 @@ func (s *Service) getConfig(c *gin.Context) {
 		rest.Error(c, err)
 		return
 	}
+	// Hide client secret for security
+	dc.SSO.CoreConfig.ClientSecret = ""
 	c.JSON(http.StatusOK, dc.SSO.CoreConfig)
 }
 

pkg/apiserver/user/sso/service.go

@@ -325,14 +325,20 @@ func (s *Service) buildOAuth2Config(redirectURL string) (*oauth2.Config, error)
 	if !dc.SSO.CoreConfig.Enabled {
 		return nil, ErrBadConfig.New("SSO is not enabled")
 	}
+	scopes := []string{"openid", "profile", "email"}
+	if len(dc.SSO.CoreConfig.Scopes) > 0 {
+		userSupplied := strings.Split(dc.SSO.CoreConfig.Scopes, " ")
+		scopes = append(scopes, userSupplied...)
+	}
 	return &oauth2.Config{
-		ClientID:    dc.SSO.CoreConfig.ClientID,
-		RedirectURL: redirectURL,
+		ClientID:     dc.SSO.CoreConfig.ClientID,
+		ClientSecret: dc.SSO.CoreConfig.ClientSecret,
+		RedirectURL:  redirectURL,
 		Endpoint: oauth2.Endpoint{
 			AuthURL:  dc.SSO.AuthURL,
 			TokenURL: dc.SSO.TokenURL,
 		},
-		Scopes: []string{"openid", "profile", "email"},
+		Scopes: scopes,
 	}, nil
 }
 

pkg/config/dynamic_config.go

@@ -47,7 +47,9 @@ type ProfilingConfig struct {
 type SSOCoreConfig struct {
 	Enabled      bool   `json:"enabled"`
 	ClientID     string `json:"client_id"`
+	ClientSecret string `json:"client_secret"`
 	DiscoveryURL string `json:"discovery_url"`
+	Scopes       string `json:"scopes"`
 	IsReadOnly   bool   `json:"is_read_only"`
 }
 

pkg/config/dynamic_config_manager.go

@@ -164,7 +164,8 @@ func (m *DynamicConfigManager) load() (*DynamicConfig, error) {
 		log.Warn("Dynamic config does not exist in etcd")
 		return nil, nil
 	case 1:
-		log.Info("Load dynamic config from etcd", zap.ByteString("json", resp.Kvs[0].Value))
+		// the log contains the sso client secret, so we should not log it
+		// log.Info("Load dynamic config from etcd", zap.ByteString("json", resp.Kvs[0].Value))
 		var dc DynamicConfig
 		if err = json.Unmarshal(resp.Kvs[0].Value, &dc); err != nil {
 			return nil, err
@@ -185,7 +186,8 @@ func (m *DynamicConfigManager) store(dc *DynamicConfig) error {
 	ctx, cancel := context.WithTimeout(m.lifecycleCtx, Timeout)
 	defer cancel()
 	_, err = m.etcdClient.Put(ctx, DynamicConfigPath, string(bs))
-	log.Info("Save dynamic config to etcd", zap.ByteString("json", bs))
+	// the log contains the sso client secret, so we should not log it
+	// log.Info("Save dynamic config to etcd", zap.ByteString("json", bs))
 
 	return err
 }

ui/packages/tidb-dashboard-client/src/client/api/models/config-ssocore-config.ts

@@ -26,6 +26,12 @@ export interface ConfigSSOCoreConfig {
      * @memberof ConfigSSOCoreConfig
      */
     'client_id'?: string;
+    /**
+     * 
+     * @type {string}
+     * @memberof ConfigSSOCoreConfig
+     */
+    'client_secret'?: string;
     /**
      * 
      * @type {string}
@@ -44,5 +50,11 @@ export interface ConfigSSOCoreConfig {
      * @memberof ConfigSSOCoreConfig
      */
     'is_read_only'?: boolean;
+    /**
+     * 
+     * @type {string}
+     * @memberof ConfigSSOCoreConfig
+     */
+    'scopes'?: string;
 }
 

ui/packages/tidb-dashboard-client/swagger/spec.json

@@ -3828,6 +3828,9 @@
                 "client_id": {
                     "type": "string"
                 },
+                "client_secret": {
+                    "type": "string"
+                },
                 "discovery_url": {
                     "type": "string"
                 },
@@ -3836,6 +3839,9 @@
                 },
                 "is_read_only": {
                     "type": "boolean"
+                },
+                "scopes": {
+                    "type": "string"
                 }
             }
         },

ui/packages/tidb-dashboard-for-clinic-cloud/public/ngm.html

@@ -115,15 +115,20 @@
       const apiToken = localStorage.getItem('clinic.auth.csrf_token')
 
       // example entry link:
-      // http://localhost:8181/clinic/dashboard/cloud/ngm.html?provider=aws&region=us-west-2&orgId=30052&projectId=43584&clusterId=61992&deployType=shared#/slow_query
-      // http://localhost:8181/clinic/dashboard/cloud/ngm.html?provider=aws&region=us-west-2&orgId=30052&projectId=43584&clusterId=61992&deployType=dedicated#/topsql
+      // http://localhost:8181/clinic/dashboard/cloud/ngm.html?provider=aws&region=us-west-2&orgName=xxx&orgId=30052&projectId=43584&clusterId=61992&deployType=shared&userName=xxx#/slow_query
+      // http://localhost:8181/clinic/dashboard/cloud/ngm.html?provider=aws&region=us-west-2&orgName=xxx&orgId=30052&projectId=43584&clusterId=61992&deployType=dedicated&userName=xxx#/topsql
       const searchParams = new URLSearchParams(window.location.search)
       const provider = searchParams.get('provider') || ''
       const region = searchParams.get('region') || ''
       const orgId = searchParams.get('orgId') || ''
       const projectId = searchParams.get('projectId') || ''
       const clusterId = searchParams.get('clusterId') || ''
       const deployType = searchParams.get('deployType') || ''
+
+      const orgName = searchParams.get('orgName') || ''
+      const clusterName = searchParams.get('clusterName') || ''
+      const userName = searchParams.get('userName') || ''
+
       if (
         apiToken === '' ||
         provider === '' ||
@@ -166,7 +171,24 @@
           },
           topSQL: {
             checkNgm: false,
-            showSetting: false
+            showSetting: false,
+            orgName,
+            clusterName,
+            userName,
+
+            timeRangeSelector: {
+              recentSeconds: [
+                5 * 60,
+                15 * 60,
+                30 * 60,
+                60 * 60,
+                6 * 60 * 60,
+                12 * 60 * 60,
+                24 * 60 * 60
+              ],
+              customAbsoluteRangePicker: true
+            },
+            autoRefresh: false
           }
         }
       })

ui/packages/tidb-dashboard-for-clinic-cloud/src/client/index.tsx

@@ -77,7 +77,12 @@ function applyErrorHandlerInterceptor(instance: AxiosInstance) {
       if (!routing.isLocationMatch('/') && !routing.isSignInPage()) {
         message.error({ content, key: errCode ?? '401' })
       }
-      window.location.href = window.location.origin
+      // Remember the current url before redirecting to login page,
+      // to support redirect back after login.
+      localStorage.setItem('clinic.login.from', window.location.href)
+      setTimeout(() => {
+        window.location.href = window.location.origin
+      }, 2000)
       err.handled = true
     } else if (handleError === 'default') {
       if (method === 'get') {

ui/packages/tidb-dashboard-lib/src/apps/Monitoring/components/Monitoring.tsx

@@ -20,15 +20,14 @@ import {
   DEFAULT_TIME_RANGE,
   TimeRange,
   Toolbar,
-  ErrorBar
+  ErrorBar,
+  LimitTimeRange
 } from '@lib/components'
+import { useTimeRangeValue } from '@lib/components/TimeRangeSelector/hook'
 import { store } from '@lib/utils/store'
 import { tz } from '@lib/utils'
-import { useTimeRangeValue } from '@lib/components/TimeRangeSelector/hook'
 import { telemetry } from '../utils/telemetry'
 import { MonitoringContext } from '../context'
-// TODO: move to shared folder
-import { LimitTimeRange } from '@lib/apps/Overview/components/LimitTimeRange'
 
 export default function Monitoring() {
   const ctx = useContext(MonitoringContext)

ui/packages/tidb-dashboard-lib/src/apps/Overview/components/Metrics.tsx

@@ -1,26 +1,27 @@
 import { Space, Typography, Button, Tooltip } from 'antd'
 import React, { useCallback, useContext, useRef, useState } from 'react'
 import { useTranslation } from 'react-i18next'
+import { useMemoizedFn } from 'ahooks'
+import { MetricsChart, SyncChartPointer, TimeRangeValue } from 'metrics-chart'
+import { Link } from 'react-router-dom'
+import { Stack } from 'office-ui-fabric-react'
+import { LoadingOutlined, FileTextOutlined } from '@ant-design/icons'
+import { debounce } from 'lodash'
+
 import {
   AutoRefreshButton,
   Card,
   DEFAULT_TIME_RANGE,
   TimeRange,
   Toolbar,
-  ErrorBar
+  ErrorBar,
+  LimitTimeRange
 } from '@lib/components'
-import { Link } from 'react-router-dom'
-import { Stack } from 'office-ui-fabric-react'
 import { useTimeRangeValue } from '@lib/components/TimeRangeSelector/hook'
-import { LoadingOutlined, FileTextOutlined } from '@ant-design/icons'
-import { debounce } from 'lodash'
-import { OverviewContext } from '../context'
 
-import { useMemoizedFn } from 'ahooks'
+import { OverviewContext } from '../context'
 import { telemetry } from '../utils/telemetry'
-import { LimitTimeRange } from '@lib/apps/Overview/components/LimitTimeRange'
 
-import { MetricsChart, SyncChartPointer, TimeRangeValue } from 'metrics-chart'
 export default function Metrics() {
   const ctx = useContext(OverviewContext)
   const promAddrConfigurable = ctx?.cfg.promAddrConfigurable || false

ui/packages/tidb-dashboard-lib/src/apps/SlowQuery/pages/List/index.tsx

@@ -26,7 +26,8 @@ import {
   Toolbar,
   MultiSelect,
   toTimeRangeValue,
-  IColumnKeys
+  IColumnKeys,
+  LimitTimeRange
 } from '@lib/components'
 import { useURLTimeRange } from '@lib/hooks/useURLTimeRange'
 import { CacheContext } from '@lib/utils/useCache'
@@ -41,7 +42,6 @@ import { useDebounceFn, useMemoizedFn } from 'ahooks'
 import { useDeepCompareChange } from '@lib/utils/useChange'
 import { isDistro } from '@lib/utils/distro'
 import { SlowQueryContext } from '../../context'
-import { LimitTimeRange } from '@lib/apps/Overview/components/LimitTimeRange'
 
 const { Option } = Select
 

ui/packages/tidb-dashboard-lib/src/apps/Statement/pages/List/index.tsx

@@ -31,7 +31,8 @@ import {
   TimeRangeSelector,
   DateTime,
   toTimeRangeValue,
-  IColumnKeys
+  IColumnKeys,
+  LimitTimeRange
 } from '@lib/components'
 import { useVersionedLocalStorageState } from '@lib/utils/useVersionedLocalStorageState'
 import { StatementsTable } from '../../components'
@@ -47,7 +48,6 @@ import { StatementModel } from '@lib/client'
 import { isDistro } from '@lib/utils/distro'
 import { StatementContext } from '../../context'
 import { telemetry as stmtTelmetry } from '../../utils/telemetry'
-import { LimitTimeRange } from '@lib/apps/Overview/components/LimitTimeRange'
 
 const STMT_VISIBLE_COLUMN_KEYS = 'statement.visible_column_keys'
 const STMT_SHOW_FULL_SQL = 'statement.show_full_sql'

ui/packages/tidb-dashboard-lib/src/apps/TopSQL/context/index.ts

@@ -38,6 +38,18 @@ export interface ITopSQLDataSource {
 export interface ITopSQLConfig {
   checkNgm: boolean
   showSetting: boolean
+
+  // to limit the time range picker range
+  timeRangeSelector?: {
+    recentSeconds: number[]
+    customAbsoluteRangePicker: boolean
+  }
+  autoRefresh?: boolean
+
+  // for clinic
+  orgName?: string
+  clusterName?: string
+  userName?: string
 }
 
 export interface ITopSQLContext {

ui/packages/tidb-dashboard-lib/src/apps/TopSQL/pages/List/List.tsx

@@ -4,7 +4,8 @@ import React, {
   useContext,
   useEffect,
   useRef,
-  useState
+  useState,
+  useMemo
 } from 'react'
 import { Space, Button, Spin, Alert, Tooltip, Drawer, Result } from 'antd'
 import {
@@ -20,13 +21,13 @@ import formatSql from '@lib/utils/sqlFormatter'
 import { TopsqlInstanceItem, TopsqlSummaryItem } from '@lib/client'
 import {
   Card,
-  TimeRangeSelector,
   toTimeRangeValue as _toTimeRangeValue,
   Toolbar,
   AutoRefreshButton,
   TimeRange,
   fromTimeRangeValue,
-  TimeRangeValue
+  TimeRangeValue,
+  LimitTimeRange
 } from '@lib/components'
 import { useClientRequest } from '@lib/utils/useClientRequest'
 
@@ -126,6 +127,18 @@ export function TopSQLList() {
 
   const chartRef = useRef<any>(null)
 
+  // only for clinic
+  const clusterInfo = useMemo(() => {
+    const infos: string[] = []
+    if (ctx?.cfg.orgName) {
+      infos.push(`Org: ${ctx?.cfg.orgName}`)
+    }
+    if (ctx?.cfg.clusterName) {
+      infos.push(`Cluster: ${ctx?.cfg.clusterName}`)
+    }
+    return infos.join(' | ')
+  }, [ctx?.cfg.orgName, ctx?.cfg.clusterName])
+
   return (
     <>
       <div className={styles.container} ref={containerRef}>
@@ -156,6 +169,12 @@ export function TopSQLList() {
         )}
 
         <Card noMarginBottom>
+          {clusterInfo && (
+            <div style={{ marginBottom: 8, textAlign: 'right' }}>
+              {clusterInfo}
+            </div>
+          )}
+
           <Toolbar>
             <Space>
               <InstanceSelect
@@ -172,18 +191,23 @@ export function TopSQLList() {
                   open && telemetry.openSelectInstance()
                 }
               />
-              <TimeRangeSelector.WithZoomOut
+              <LimitTimeRange
                 value={timeRange}
+                recent_seconds={ctx?.cfg.timeRangeSelector?.recentSeconds}
+                customAbsoluteRangePicker={
+                  ctx?.cfg.timeRangeSelector?.customAbsoluteRangePicker
+                }
                 onChange={(v) => {
                   setTimeRange(v)
                   telemetry.selectTimeRange(v)
                 }}
-                disabled={isLoading}
                 onZoomOutClick={(start, end) =>
                   telemetry.clickZoomOut([start, end])
                 }
+                disabled={isLoading}
               />
               <AutoRefreshButton
+                defaultValue={ctx?.cfg.autoRefresh === false ? 0 : undefined}
                 disabled={isLoading}
                 onRefresh={async () => {
                   await fetchInstancesAndSelectInstance()