update props

elastic · Jan 27, 2022 · f2b0e05 · f2b0e05
1 parent 4727e48
commit f2b0e05
Show file tree

Hide file tree

Showing 4 changed files with 70 additions and 11 deletions.
diff --git a/x-pack/examples/embedded_lens_example/public/app.tsx b/x-pack/examples/embedded_lens_example/public/app.tsx
@@ -32,6 +32,7 @@ import type {
 } from '../../../plugins/lens/public';
 
 import { ViewMode } from '../../../../src/plugins/embeddable/public';
+import { ActionExecutionContext } from '../../../../src/plugins/ui_actions/public';
 
 // Generate a Lens state based on some app-specific input parameters.
 // `TypedLensByValueInput` can be used for type-safety - it uses the same interfaces as Lens-internal code.
@@ -126,6 +127,9 @@ export const App = (props: {
     to: 'now',
   });
 
+  const [enableExtraAction, setEnableExtraAction] = useState(false);
+  const [enableDefaultAction, setEnableDefaultAction] = useState(false);
+
   const LensComponent = props.plugins.lens.EmbeddableComponent;
   const LensSaveModalComponent = props.plugins.lens.SaveModalComponent;
 
@@ -153,7 +157,7 @@ export const App = (props: {
               configuration and navigate to a prefilled editor.
             </p>
 
-            <EuiFlexGroup>
+            <EuiFlexGroup wrap>
               <EuiFlexItem grow={false}>
                 <EuiButton
                   data-test-subj="lns-example-change-color"
@@ -238,10 +242,34 @@ export const App = (props: {
                   Change time range
                 </EuiButton>
               </EuiFlexItem>
+              <EuiFlexItem grow={false}>
+                <EuiButton
+                  aria-label="Enable extra action"
+                  data-test-subj="lns-example-extra-action"
+                  isDisabled={!attributes}
+                  onClick={() => {
+                    setEnableExtraAction((prevState) => !prevState);
+                  }}
+                >
+                  {enableExtraAction ? 'Disable extra action' : 'Enable extra action'}
+                </EuiButton>
+              </EuiFlexItem>
+              <EuiFlexItem grow={false}>
+                <EuiButton
+                  aria-label="Enable default actions"
+                  data-test-subj="lns-example-default-action"
+                  isDisabled={!attributes}
+                  onClick={() => {
+                    setEnableDefaultAction((prevState) => !prevState);
+                  }}
+                >
+                  {enableDefaultAction ? 'Disable default action' : 'Enable default action'}
+                </EuiButton>
+              </EuiFlexItem>
             </EuiFlexGroup>
             <LensComponent
               id=""
-              withActions
+              withDefaultActions={enableDefaultAction}
               style={{ height: 500 }}
               timeRange={time}
               attributes={attributes}
@@ -261,6 +289,27 @@ export const App = (props: {
                 // call back event for on table row click event
               }}
               viewMode={ViewMode.VIEW}
+              extraActions={
+                enableExtraAction
+                  ? [
+                      {
+                        id: 'testAction',
+                        type: 'link',
+                        getIconType: () => 'save',
+                        async isCompatible(
+                          context: ActionExecutionContext<object>
+                        ): Promise<boolean> {
+                          return true;
+                        },
+                        execute: async (context: ActionExecutionContext<object>) => {
+                          alert('I am an extra action');
+                          return;
+                        },
+                        getDisplayName: () => 'Extra action',
+                      },
+                    ]
+                  : undefined
+              }
             />
             {isSaveModalVisible && (
               <LensSaveModalComponent

diff --git a/x-pack/plugins/lens/public/embeddable/embeddable_component.tsx b/x-pack/plugins/lens/public/embeddable/embeddable_component.tsx
@@ -52,7 +52,8 @@ export type TypedLensByValueInput = Omit<LensByValueInput, 'attributes'> & {
 };
 
 export type EmbeddableComponentProps = (TypedLensByValueInput | LensByReferenceInput) & {
-  withActions?: boolean | Action[];
+  withDefaultActions?: boolean;
+  extraActions?: Action[];
 };
 
 interface PluginsStartDependencies {
@@ -67,7 +68,9 @@ export function getEmbeddableComponent(core: CoreStart, plugins: PluginsStartDep
     const factory = embeddableStart.getEmbeddableFactory('lens')!;
     const input = { ...props };
     const [embeddable, loading, error] = useEmbeddableFactory({ factory, input });
-    const hasActions = Boolean(props.withActions);
+    const hasActions =
+      Boolean(props.withDefaultActions) || (props.extraActions && props.extraActions?.length > 0);
+
     const theme = core.theme;
 
     if (loading) {
@@ -83,7 +86,8 @@ export function getEmbeddableComponent(core: CoreStart, plugins: PluginsStartDep
           actionPredicate={() => hasActions}
           input={input}
           theme={theme}
-          extraActions={Array.isArray(props.withActions) ? props.withActions : []}
+          extraActions={props.extraActions}
+          withDefaultActions={props.withDefaultActions}
         />
       );
     }
@@ -99,7 +103,8 @@ interface EmbeddablePanelWrapperProps {
   actionPredicate: (id: string) => boolean;
   input: EmbeddableComponentProps;
   theme: ThemeServiceStart;
-  extraActions: Action[];
+  extraActions?: Action[];
+  withDefaultActions?: boolean;
 }
 
 const EmbeddablePanelWrapper: FC<EmbeddablePanelWrapperProps> = ({
@@ -110,6 +115,7 @@ const EmbeddablePanelWrapper: FC<EmbeddablePanelWrapperProps> = ({
   input,
   theme,
   extraActions,
+  withDefaultActions,
 }) => {
   useEffect(() => {
     embeddable.updateInput(input);
@@ -120,8 +126,11 @@ const EmbeddablePanelWrapper: FC<EmbeddablePanelWrapperProps> = ({
       hideHeader={false}
       embeddable={embeddable as IEmbeddable<EmbeddableInput, EmbeddableOutput>}
       getActions={async (triggerId, context) => {
-        const actions = await uiActions.getTriggerCompatibleActions(triggerId, context);
-        return [...extraActions, ...actions];
+        const actions = withDefaultActions
+          ? await uiActions.getTriggerCompatibleActions(triggerId, context)
+          : [];
+
+        return [...(extraActions ?? []), ...actions];
       }}
       inspector={inspector}
       actionPredicate={actionPredicate}

diff --git a/...observability/public/components/shared/exploratory_view/configurations/lens_attributes.ts b/...observability/public/components/shared/exploratory_view/configurations/lens_attributes.ts
@@ -783,7 +783,7 @@ export class LensAttributes {
     };
   }
 
-  getJSON(refresh?: number): TypedLensByValueInput['attributes'] {
+  getJSON(): TypedLensByValueInput['attributes'] {
     const uniqueIndexPatternsIds = Array.from(
       new Set([...this.layerConfigs.map(({ indexPattern }) => indexPattern.id)])
     );
@@ -792,7 +792,7 @@ export class LensAttributes {
 
     return {
       title: 'Prefilled from exploratory view app',
-      description: String(refresh),
+      description: '',
       visualizationType: 'lnsXY',
       references: [
         ...uniqueIndexPatternsIds.map((patternId) => ({

diff --git a/...plugins/observability/public/components/shared/exploratory_view/embeddable/embeddable.tsx b/...plugins/observability/public/components/shared/exploratory_view/embeddable/embeddable.tsx
@@ -125,7 +125,8 @@ export default function Embeddable({
         timeRange={series?.time}
         attributes={attributesJSON}
         onBrushEnd={({ range }) => {}}
-        withActions={withActions ? actions : false}
+        withDefaultActions={Boolean(withActions)}
+        extraActions={actions}
       />
       {isSaveOpen && attributesJSON && (
         <LensSaveModalComponent