[Cases] Attach lens visualizations from dashboards

[angorayc]

Summary

Original issue: #154842

Collaboration with @cnasikas

In dashboard, when clicking on ... of each chart, we should be able to:

• - Add to New case
• - Add to existing case
• - Create case from existing case modal
• - Create case from existing case modal when no existing cases

Screen.Recording.2023-05-25.at.11.51.28.mov

Checklist

Delete any items that are not applicable to this PR.

• Unit or functional tests were updated or added to match the most common scenarios

[js-jankisalvi]

I found a small issue with select modal, it is visible even after selecting a case:

This issue is not reproducible anymore. Select modal is working as expected.

[jonathan-buttner]

The code changes look good. Thanks for addressing my concerns and questions. I noticed one oddity:

For all instances of cases when you click the Create case button within the table it does not work. I tested this one main and it works as expected.

[cnasikas]

I could not find a way to reduce the bundle size. The imports from @kbn/embeddable-plugin/public and @kbn/ui-actions-plugin/public increased it. I tried to import only what we need by setting the path of the import to the folder we need but I got this error

Module not found: Error: import [@kbn/embeddable-plugin/public/lib/embeddables/error_embeddable references a non-public export of the [embeddable] bundle and must point to one of the public directories: [public,common].

This PR #157492 will reduce the limit substantially.

[jbudz]

Works for me. Thanks for looking into it.

[angorayc]

The code changes look good. Thanks for addressing my concerns and questions. I noticed one oddity:

For all instances of cases when you click the Create case button within the table it does not work. I tested this one main and it works as expected.

Thanks for catching this bug @jonathan-buttner , it should be fixed now:

Screen.Recording.2023-06-01.at.15.40.00.mov

Screen.Recording.2023-06-01.at.15.40.39.mov

[jonathan-buttner]

Great work!

[jonathan-buttner]

Just curious why this fixed the issue?

[angorayc]

If it's about create case button the flyout wouldn’t appear, it's fixed here:
e1e671c#diff-4b6429a0bd15d6fd67fb5734dd24068c314f12abc8a1ecbe49f2006adbef73f5R291

[cnasikas]

Do you mean about the owner moved inside isCompatible. If yes, it is because when createAddToExistingCaseLensAction is being called the currentAppId is not set yet. But isCompatible and execute are being called after the render of the app where the currentAppId is set. We need to get the owner after currentAppId is set.

[kibana-ci]

💚 Build Succeeded

• Buildkite Build
• Commit: 0a66940

Metrics [docs]

Module Count

Fewer modules leads to a faster build time

id	before	after	diff
cases	642	649	+7

Async chunks

Total size of all lazy-loaded chunks that will be downloaded as the user navigates the app

id	before	after	diff
cases	386.8KB	386.7KB	-120.0B

Page load bundle

Size of the bundles that are downloaded on every page load. Target size is below 100kb

id	before	after	diff
cases	170.1KB	175.6KB	+5.5KB

Unknown metric groups

ESLint disabled line counts

id	before	after	diff
enterpriseSearch	19	21	+2
securitySolution	414	418	+4
total			+6

Total ESLint disabled count

id	before	after	diff
enterpriseSearch	20	22	+2
securitySolution	498	502	+4
total			+6

History

• 💚 Build #131776 succeeded b870216
• 💔 Build #131674 failed 4e6dd86
• 💚 Build #131635 succeeded e9fbd42
• 💔 Build #130926 failed 876cc23
• 💔 Build #130775 failed bfa8c6d
• 💚 Build #130165 succeeded 8f66588

To update your PR or re-run it, just comment with:
@elasticmachine merge upstream

cc @angorayc

[angorayc]

There is a known issue that the visualizations added to the dashboard might not able to see the case actions due to dashboard's call by reference logic. Visualizations rendered in this way doesn't contain the Lens attributes we need in the case attachments, so the case actions won't render.

kibana/x-pack/plugins/cases/public/components/visualizations/actions/add_to_new_case.tsx

Line 33 in b8eed60

const { attributes, timeRange } = embeddable.getInput();

Bug scenario:

no_cases_actions.mov

Expected:

Observation:

Even we saved the dashboard, we can't find the 3rd visualization name test in the dashboard's saved object:

To fix this, we need to add a method in lens embeddable:

private fullAttributes: LensSavedObjectAttributes | undefined;
  public getFullAttributes() {
    return this.fullAttributes;
  }

// in initializeSavedVis
const { metaInfo, attributes } = unwrapResult;

this.fullAttributes = attributes;