ref: Remove optional chaining

This is required for #13786

Author: lynnagara

babel.config.js

@@ -7,7 +7,6 @@ module.exports = {
     'react-hot-loader/babel',
     '@babel/plugin-syntax-dynamic-import',
     '@babel/plugin-proposal-object-rest-spread',
-    '@babel/plugin-proposal-optional-chaining',
     '@babel/plugin-transform-runtime',
     // NOTE: The order of the decorator and class-property plugins is important
     // here. Decorators must be processed first before class properties, see:

package.json

@@ -11,7 +11,6 @@
     "@babel/plugin-proposal-class-properties": "^7.0.0",
     "@babel/plugin-proposal-decorators": "^7.0.0",
     "@babel/plugin-proposal-object-rest-spread": "^7.0.0",
-    "@babel/plugin-proposal-optional-chaining": "^7.0.0",
     "@babel/plugin-syntax-dynamic-import": "^7.0.0",
     "@babel/plugin-transform-runtime": "^7.0.0",
     "@babel/polyfill": "^7.0.0",

src/sentry/static/sentry/app/api.jsx

@@ -1,4 +1,4 @@
-import {isUndefined, isNil} from 'lodash';
+import {isUndefined, isNil, get} from 'lodash';
 import $ from 'jquery';
 import * as Sentry from '@sentry/browser';
 
@@ -72,15 +72,15 @@ export class Client {
    * If so, redirect user to new project slug
    */
   hasProjectBeenRenamed(response) {
-    const code = response?.responseJSON?.detail?.code;
+    const code = get(response, 'responseJSON.detail.code');
 
     // XXX(billy): This actually will never happen because we can't intercept the 302
     // jQuery ajax will follow the redirect by default...
     if (code !== PROJECT_MOVED) {
       return false;
     }
 
-    const slug = response?.responseJSON?.detail?.extra?.slug;
+    const slug = get(response, 'responseJSON.detail.extra.slug');
 
     redirectToProject(slug);
     return true;
@@ -120,7 +120,7 @@ export class Client {
   }
 
   handleRequestError({id, path, requestOptions}, response, ...responseArgs) {
-    const code = response?.responseJSON?.detail?.code;
+    const code = get(response, 'responseJSON.detail.code');
     const isSudoRequired = code === SUDO_REQUIRED || code === SUPERUSER_REQUIRED;
 
     if (isSudoRequired) {

src/sentry/static/sentry/app/components/charts/components/tooltip.jsx

@@ -1,5 +1,6 @@
 import 'echarts/lib/component/tooltip';
 
+import {get} from 'lodash';
 import {getFormattedDate} from 'app/utils/dates';
 import {truncationFormatter} from '../utils';
 
@@ -54,7 +55,9 @@ function getFormatter({filter, isGroupedByDate, truncate, formatAxisLabel, utc})
     const seriesParams = isAxisItem ? seriesParamsOrParam : [seriesParamsOrParam];
 
     // If axis, timestamp comes from axis, otherwise for a single item it is defined in its data
-    const timestamp = isAxisItem ? seriesParams[0].axisValue : seriesParams[0]?.data[0];
+    const timestamp = isAxisItem
+      ? seriesParams[0].axisValue
+      : get(seriesParams, '[0].data[0]');
 
     const label =
       seriesParams.length && axisFormatterOrDefault(timestamp, isGroupedByDate, utc);

src/sentry/static/sentry/app/components/commitRow.jsx

@@ -37,7 +37,7 @@ export default class CommitRow extends React.Component {
           <Message>{this.renderMessage(message)}</Message>
           <Meta>
             {tct('[author] committed [timeago]', {
-              author: <strong>{author?.name || t('Unknown author')}</strong>,
+              author: <strong>{(author && author.name) || t('Unknown author')}</strong>,
               timeago: <TimeSince date={dateCreated} />,
             })}
           </Meta>

src/sentry/static/sentry/app/components/forms/formField.jsx

@@ -89,7 +89,7 @@ export default class FormField extends React.PureComponent {
     if (defined(props.error)) {
       return props.error;
     }
-    return form?.errors[props.name] || null;
+    return (form && form.errors[props.name]) || null;
   }
 
   getId() {

src/sentry/static/sentry/app/components/platformPicker.jsx

@@ -35,7 +35,7 @@ class PlatformPicker extends React.Component {
 
   state = {
     category: PLATFORM_CATEGORIES[0].id,
-    filter: this.props.noAutoFilter ? '' : this.props.platform?.split('-')[0],
+    filter: this.props.noAutoFilter ? '' : (this.props.platform || '').split('-')[0],
   };
 
   get platformList() {

src/sentry/static/sentry/app/utils/handleXhrErrorResponse.jsx

@@ -22,11 +22,11 @@ export default function handleXhrErrorResponse(message) {
     }
 
     // Ignore sudo-required errors
-    if (responseJSON?.detail?.code === 'sudo-required') {
+    if (responseJSON.detail && responseJSON.detail.code === 'sudo-required') {
       return;
     }
 
-    if (typeof responseJSON?.detail?.message === 'string') {
+    if (responseJSON.detail && typeof responseJSON.detail.message === 'string') {
       Sentry.withScope(scope => {
         scope.setExtra('status', resp.status);
         scope.setExtra('detail', responseJSON.detail);

src/sentry/static/sentry/app/views/app.jsx

@@ -7,7 +7,7 @@ import Cookies from 'js-cookie';
 import PropTypes from 'prop-types';
 import React from 'react';
 import keydown from 'react-keydown';
-import {isEqual} from 'lodash';
+import {get, isEqual} from 'lodash';
 
 import {openCommandPalette} from 'app/actionCreators/modal';
 import {t} from 'app/locale';
@@ -117,8 +117,8 @@ class App extends React.Component {
         return;
       }
 
-      const code = jqXHR?.responseJSON?.detail?.code;
-      const extra = jqXHR?.responseJSON?.detail?.extra;
+      const code = get(jqXHR, 'responseJSON.detail.code');
+      const extra = get(jqXHR, 'responseJSON.detail.extra');
 
       // 401s can also mean sudo is required or it's a request that is allowed to fail
       // Ignore if these are the cases

src/sentry/static/sentry/app/views/onboarding/platform.jsx

@@ -114,7 +114,7 @@ class OnboardingPlatform extends React.Component {
   render() {
     const {active, project, platform, scrollTargetId} = this.props;
 
-    const selectedPlatform = platform || project?.platform;
+    const selectedPlatform = platform || (project && project.platform);
 
     const continueDisabled =
       !selectedPlatform || this.state.progressing || (this.hasFirstProject && !active);