diff --git a/static/app/views/admin/adminSettings.tsx b/static/app/views/admin/adminSettings.tsx index 384490e1840be7..19f3d932adc2a6 100644 --- a/static/app/views/admin/adminSettings.tsx +++ b/static/app/views/admin/adminSettings.tsx @@ -1,9 +1,11 @@ import Feature from 'sentry/components/acl/feature'; import Form from 'sentry/components/forms/form'; +import LoadingError from 'sentry/components/loadingError'; +import LoadingIndicator from 'sentry/components/loadingIndicator'; import Panel from 'sentry/components/panels/panel'; import PanelHeader from 'sentry/components/panels/panelHeader'; import {t} from 'sentry/locale'; -import DeprecatedAsyncView from 'sentry/views/deprecatedAsyncView'; +import {useApiQuery} from 'sentry/utils/queryClient'; import {getOption, getOptionField} from './options'; @@ -67,165 +69,168 @@ type FieldDef = { value: string | undefined; }; -type State = DeprecatedAsyncView['state'] & { - data: Record; -}; +export default function AdminSettings() { + const {data, isLoading, isError} = useApiQuery>( + ['/internal/options/'], + { + staleTime: 0, + } + ); -export default class AdminSettings extends DeprecatedAsyncView<{}, State> { - get endpoint() { - return '/internal/options/'; + if (isError) { + return ; } - getEndpoints(): ReturnType { - return [['data', this.endpoint]]; + if (isLoading) { + return ; } - renderBody() { - const {data} = this.state; - - const initialData = {}; - const fields = {}; - for (const key of optionsAvailable) { - // TODO(dcramer): we should not be mutating options - const option = data[key] ?? {field: {}, value: undefined}; + const initialData = {}; + const fields = {}; + for (const key of optionsAvailable) { + // TODO(dcramer): we should not be mutating options + const option = data[key] ?? {field: {}, value: undefined}; - if (option.value === undefined || option.value === '') { - const defn = getOption(key); - initialData[key] = defn.defaultValue ? defn.defaultValue() : ''; - } else { - initialData[key] = option.value; - } - fields[key] = getOptionField(key, option.field); + if (option.value === undefined || option.value === '') { + const defn = getOption(key); + initialData[key] = defn.defaultValue ? defn.defaultValue() : ''; + } else { + initialData[key] = option.value; } + fields[key] = getOptionField(key, option.field); + } + + return ( +
+

{t('Settings')}

- return ( -
-

{t('Settings')}

+
+ + {t('General')} + {fields['system.url-prefix']} + {fields['system.admin-email']} + {fields['system.support-email']} + {fields['system.security-email']} + {fields['system.rate-limit']} + - + + {t('Security & Abuse')} + {fields['auth.allow-registration']} + {fields['auth.ip-rate-limit']} + {fields['auth.user-rate-limit']} + {fields['api.rate-limit.org-create']} + + + + {t('Beacon')} + {fields['beacon.anonymous']} + + + - General - {fields['system.url-prefix']} - {fields['system.admin-email']} - {fields['system.support-email']} - {fields['system.security-email']} - {fields['system.rate-limit']} + {t('Performance Issues - All')} + {fields['performance.issues.all.problem-detection']} - - Security & Abuse - {fields['auth.allow-registration']} - {fields['auth.ip-rate-limit']} - {fields['auth.user-rate-limit']} - {fields['api.rate-limit.org-create']} + {t('Performance Issues - Detectors')} + {fields['performance.issues.n_plus_one_db.problem-creation']} + {fields['performance.issues.n_plus_one_db_ext.problem-creation']} + {fields['performance.issues.n_plus_one_db.count_threshold']} + {fields['performance.issues.n_plus_one_db.duration_threshold']} - - Beacon - {fields['beacon.anonymous']} + {t('Performance Issues - Consecutive DB Detector')} + {fields['performance.issues.consecutive_db.problem-creation']} + {fields['performance.issues.consecutive_db.la-rollout']} + {fields['performance.issues.consecutive_db.ea-rollout']} + {fields['performance.issues.consecutive_db.ga-rollout']} - - - - Performance Issues - All - {fields['performance.issues.all.problem-detection']} - - - Performance Issues - Detectors - {fields['performance.issues.n_plus_one_db.problem-creation']} - {fields['performance.issues.n_plus_one_db_ext.problem-creation']} - {fields['performance.issues.n_plus_one_db.count_threshold']} - {fields['performance.issues.n_plus_one_db.duration_threshold']} - - - Performance Issues - Consecutive DB Detector - {fields['performance.issues.consecutive_db.problem-creation']} - {fields['performance.issues.consecutive_db.la-rollout']} - {fields['performance.issues.consecutive_db.ea-rollout']} - {fields['performance.issues.consecutive_db.ga-rollout']} - - - Performance Issues - N+1 API Calls Detector - {fields['performance.issues.n_plus_one_api_calls.problem-creation']} - {fields['performance.issues.n_plus_one_api_calls.la-rollout']} - {fields['performance.issues.n_plus_one_api_calls.ea-rollout']} - {fields['performance.issues.n_plus_one_api_calls.ga-rollout']} - - - Performance Issues - Compressed Assets Detector - {fields['performance.issues.compressed_assets.problem-creation']} - {fields['performance.issues.compressed_assets.la-rollout']} - {fields['performance.issues.compressed_assets.ea-rollout']} - {fields['performance.issues.compressed_assets.ga-rollout']} - - - Performance Issues - File IO on Main Thread - {fields['performance.issues.file_io_main_thread.problem-creation']} - - - Performance Issues - Slow DB Span Detector - {fields['performance.issues.slow_db_query.problem-creation']} - {fields['performance.issues.slow_db_query.la-rollout']} - {fields['performance.issues.slow_db_query.ea-rollout']} - {fields['performance.issues.slow_db_query.ga-rollout']} - - - - Performance Issues - Large Render Blocking Asset Detector - - {fields['performance.issues.render_blocking_assets.problem-creation']} - {fields['performance.issues.render_blocking_assets.la-rollout']} - {fields['performance.issues.render_blocking_assets.ea-rollout']} - {fields['performance.issues.render_blocking_assets.ga-rollout']} - - - Performance Issues - MN+1 DB Detector - {fields['performance.issues.m_n_plus_one_db.problem-creation']} - {fields['performance.issues.m_n_plus_one_db.la-rollout']} - {fields['performance.issues.m_n_plus_one_db.ea-rollout']} - {fields['performance.issues.m_n_plus_one_db.ga-rollout']} - - - - Performance Issues - Consecutive HTTP Span Detector - - {fields['performance.issues.consecutive_http.max_duration_between_spans']} - {fields['performance.issues.consecutive_http.consecutive_count_threshold']} - {fields['performance.issues.consecutive_http.span_duration_threshold']} - - - Performance Issues - Large HTTP Payload Detector - {fields['performance.issues.large_http_payload.size_threshold']} - - - - Profiling Issues - Block Main Thread Detector Ingest - - {fields['profile.issues.blocked_main_thread-ingest.la-rollout']} - {fields['profile.issues.blocked_main_thread-ingest.ea-rollout']} - {fields['profile.issues.blocked_main_thread-ingest.ga-rollout']} - - - - Profiling Issues - Block Main Thread Detector Post Process Group - - {fields['profile.issues.blocked_main_thread-ppg.la-rollout']} - {fields['profile.issues.blocked_main_thread-ppg.ea-rollout']} - {fields['profile.issues.blocked_main_thread-ppg.ga-rollout']} - - - - - View Hierarchy - - - -
- ); - } + + {t('Performance Issues - N+1 API Calls Detector')} + {fields['performance.issues.n_plus_one_api_calls.problem-creation']} + {fields['performance.issues.n_plus_one_api_calls.la-rollout']} + {fields['performance.issues.n_plus_one_api_calls.ea-rollout']} + {fields['performance.issues.n_plus_one_api_calls.ga-rollout']} + + + + {t('Performance Issues - Compressed Assets Detector')} + + {fields['performance.issues.compressed_assets.problem-creation']} + {fields['performance.issues.compressed_assets.la-rollout']} + {fields['performance.issues.compressed_assets.ea-rollout']} + {fields['performance.issues.compressed_assets.ga-rollout']} + + + {t('Performance Issues - File IO on Main Thread')} + {fields['performance.issues.file_io_main_thread.problem-creation']} + + + {t('Performance Issues - Slow DB Span Detector')} + {fields['performance.issues.slow_db_query.problem-creation']} + {fields['performance.issues.slow_db_query.la-rollout']} + {fields['performance.issues.slow_db_query.ea-rollout']} + {fields['performance.issues.slow_db_query.ga-rollout']} + + + + {t('Performance Issues - Large Render Blocking Asset Detector')} + + {fields['performance.issues.render_blocking_assets.problem-creation']} + {fields['performance.issues.render_blocking_assets.la-rollout']} + {fields['performance.issues.render_blocking_assets.ea-rollout']} + {fields['performance.issues.render_blocking_assets.ga-rollout']} + + + {t('Performance Issues - MN+1 DB Detector')} + {fields['performance.issues.m_n_plus_one_db.problem-creation']} + {fields['performance.issues.m_n_plus_one_db.la-rollout']} + {fields['performance.issues.m_n_plus_one_db.ea-rollout']} + {fields['performance.issues.m_n_plus_one_db.ga-rollout']} + + + + {t('Performance Issues - Consecutive HTTP Span Detector')} + + {fields['performance.issues.consecutive_http.max_duration_between_spans']} + {fields['performance.issues.consecutive_http.consecutive_count_threshold']} + {fields['performance.issues.consecutive_http.span_duration_threshold']} + + + + {t('Performance Issues - Large HTTP Payload Detector')} + + {fields['performance.issues.large_http_payload.size_threshold']} + + + + {t('Profiling Issues - Block Main Thread Detector Ingest')} + + {fields['profile.issues.blocked_main_thread-ingest.la-rollout']} + {fields['profile.issues.blocked_main_thread-ingest.ea-rollout']} + {fields['profile.issues.blocked_main_thread-ingest.ga-rollout']} + + + + {t('Profiling Issues - Block Main Thread Detector Post Process Group')} + + {fields['profile.issues.blocked_main_thread-ppg.la-rollout']} + {fields['profile.issues.blocked_main_thread-ppg.ea-rollout']} + {fields['profile.issues.blocked_main_thread-ppg.ga-rollout']} + + + + + {t('View Hierarchy')} + + + +
+ ); }