From d0c9564e1ab9716afd789f81bbf2a559fb85ade8 Mon Sep 17 00:00:00 2001
From: nikki-kiga <42276368+nikki-kiga@users.noreply.github.com>
Date: Thu, 25 Nov 2021 02:57:21 -0800
Subject: [PATCH] Bug: Add checks to Geomap StyleEditor (#42266)

---
 .../panel/geomap/layers/data/StyleEditor.tsx  | 30 +++++++++----------
 .../app/plugins/panel/geomap/style/utils.ts   |  2 +-
 2 files changed, 16 insertions(+), 16 deletions(-)

diff --git a/public/app/plugins/panel/geomap/layers/data/StyleEditor.tsx b/public/app/plugins/panel/geomap/layers/data/StyleEditor.tsx
index 407b45ffb30..be3e0bc911f 100644
--- a/public/app/plugins/panel/geomap/layers/data/StyleEditor.tsx
+++ b/public/app/plugins/panel/geomap/layers/data/StyleEditor.tsx
@@ -108,7 +108,7 @@ export const StyleEditor: FC<StandardEditorProps<StyleConfig, StyleEditorOptions
             <InlineFieldRow>
               <InlineField label={'Symbol'}>
                 <ResourceDimensionEditor
-                  value={value.symbol ?? defaultStyleConfig.symbol}
+                  value={value?.symbol ?? defaultStyleConfig.symbol}
                   context={context}
                   onChange={onSymbolChange}
                   item={
@@ -127,7 +127,7 @@ export const StyleEditor: FC<StandardEditorProps<StyleConfig, StyleEditorOptions
             </InlineFieldRow>
             <Field label={'Rotation angle'}>
               <ScalarDimensionEditor
-                value={value.rotation ?? defaultStyleConfig.rotation}
+                value={value?.rotation ?? defaultStyleConfig.rotation}
                 context={context}
                 onChange={onRotationChange}
                 item={
@@ -146,7 +146,7 @@ export const StyleEditor: FC<StandardEditorProps<StyleConfig, StyleEditorOptions
           <InlineField label="Color" labelWidth={10}>
             <InlineLabel width={4}>
               <ColorPicker
-                color={value.color?.fixed ?? defaultStyleConfig.color.fixed}
+                color={value?.color?.fixed ?? defaultStyleConfig.color.fixed}
                 onChange={(v) => {
                   onColorChange({ fixed: v });
                 }}
@@ -157,7 +157,7 @@ export const StyleEditor: FC<StandardEditorProps<StyleConfig, StyleEditorOptions
         <InlineFieldRow>
           <InlineField label="Opacity" labelWidth={10} grow>
             <SliderValueEditor
-              value={value.opacity ?? defaultStyleConfig.opacity}
+              value={value?.opacity ?? defaultStyleConfig.opacity}
               context={context}
               onChange={onOpacityChange}
               item={
@@ -180,7 +180,7 @@ export const StyleEditor: FC<StandardEditorProps<StyleConfig, StyleEditorOptions
     <>
       <Field label={'Size'}>
         <ScaleDimensionEditor
-          value={value.size ?? defaultStyleConfig.size}
+          value={value?.size ?? defaultStyleConfig.size}
           context={context}
           onChange={onSizeChange}
           item={
@@ -195,7 +195,7 @@ export const StyleEditor: FC<StandardEditorProps<StyleConfig, StyleEditorOptions
       </Field>
       <Field label={'Symbol'}>
         <ResourceDimensionEditor
-          value={value.symbol ?? defaultStyleConfig.symbol}
+          value={value?.symbol ?? defaultStyleConfig.symbol}
           context={context}
           onChange={onSymbolChange}
           item={
@@ -213,7 +213,7 @@ export const StyleEditor: FC<StandardEditorProps<StyleConfig, StyleEditorOptions
       </Field>
       <Field label={'Color'}>
         <ColorDimensionEditor
-          value={value.color ?? defaultStyleConfig.color}
+          value={value?.color ?? defaultStyleConfig.color}
           context={context}
           onChange={onColorChange}
           item={{} as any}
@@ -221,7 +221,7 @@ export const StyleEditor: FC<StandardEditorProps<StyleConfig, StyleEditorOptions
       </Field>
       <Field label={'Fill opacity'}>
         <SliderValueEditor
-          value={value.opacity ?? defaultStyleConfig.opacity}
+          value={value?.opacity ?? defaultStyleConfig.opacity}
           context={context}
           onChange={onOpacityChange}
           item={
@@ -238,7 +238,7 @@ export const StyleEditor: FC<StandardEditorProps<StyleConfig, StyleEditorOptions
       {settings?.displayRotation && (
         <Field label={'Rotation angle'}>
           <ScalarDimensionEditor
-            value={value.rotation ?? defaultStyleConfig.rotation}
+            value={value?.rotation ?? defaultStyleConfig.rotation}
             context={context}
             onChange={onRotationChange}
             item={
@@ -254,7 +254,7 @@ export const StyleEditor: FC<StandardEditorProps<StyleConfig, StyleEditorOptions
       )}
       <Field label={'Text label'}>
         <TextDimensionEditor
-          value={value.text ?? defaultTextConfig}
+          value={value?.text ?? defaultTextConfig}
           context={context}
           onChange={onTextChange}
           item={{} as any}
@@ -266,7 +266,7 @@ export const StyleEditor: FC<StandardEditorProps<StyleConfig, StyleEditorOptions
           <HorizontalGroup>
             <Field label={'Font size'}>
               <NumberValueEditor
-                value={value.textConfig?.fontSize ?? defaultStyleConfig.textConfig.fontSize}
+                value={value?.textConfig?.fontSize ?? defaultStyleConfig.textConfig.fontSize}
                 context={context}
                 onChange={onTextFontSizeChange}
                 item={{} as any}
@@ -274,7 +274,7 @@ export const StyleEditor: FC<StandardEditorProps<StyleConfig, StyleEditorOptions
             </Field>
             <Field label={'X offset'}>
               <NumberValueEditor
-                value={value.textConfig?.offsetX ?? defaultStyleConfig.textConfig.offsetX}
+                value={value?.textConfig?.offsetX ?? defaultStyleConfig.textConfig.offsetX}
                 context={context}
                 onChange={onTextOffsetXChange}
                 item={{} as any}
@@ -282,7 +282,7 @@ export const StyleEditor: FC<StandardEditorProps<StyleConfig, StyleEditorOptions
             </Field>
             <Field label={'Y offset'}>
               <NumberValueEditor
-                value={value.textConfig?.offsetY ?? defaultStyleConfig.textConfig.offsetY}
+                value={value?.textConfig?.offsetY ?? defaultStyleConfig.textConfig.offsetY}
                 context={context}
                 onChange={onTextOffsetYChange}
                 item={{} as any}
@@ -291,7 +291,7 @@ export const StyleEditor: FC<StandardEditorProps<StyleConfig, StyleEditorOptions
           </HorizontalGroup>
           <Field label={'Align'}>
             <RadioButtonGroup
-              value={value.textConfig?.textAlign ?? defaultStyleConfig.textConfig.textAlign}
+              value={value?.textConfig?.textAlign ?? defaultStyleConfig.textConfig.textAlign}
               onChange={onTextAlignChange}
               options={[
                 { value: TextAlignment.Left, label: TextAlignment.Left },
@@ -302,7 +302,7 @@ export const StyleEditor: FC<StandardEditorProps<StyleConfig, StyleEditorOptions
           </Field>
           <Field label={'Baseline'}>
             <RadioButtonGroup
-              value={value.textConfig?.textBaseline ?? defaultStyleConfig.textConfig.textBaseline}
+              value={value?.textConfig?.textBaseline ?? defaultStyleConfig.textConfig.textBaseline}
               onChange={onTextBaselineChange}
               options={[
                 { value: TextBaseline.Top, label: TextBaseline.Top },
diff --git a/public/app/plugins/panel/geomap/style/utils.ts b/public/app/plugins/panel/geomap/style/utils.ts
index 5ac29cf9897..601b3f5bf38 100644
--- a/public/app/plugins/panel/geomap/style/utils.ts
+++ b/public/app/plugins/panel/geomap/style/utils.ts
@@ -5,7 +5,7 @@ import { defaultStyleConfig, StyleConfig, StyleConfigFields, StyleConfigState }
 
 /** Indicate if the style wants to show text values */
 export function styleUsesText(config: StyleConfig): boolean {
-  const { text } = config;
+  const text = config?.text;
   if (!text) {
     return false;
   }