[SECURITY_SOLUTION][ENDPOINT] Create Trusted Apps UI Flow #77076

paul-tavares · 2020-09-09T16:10:11Z

Summary

Adds the ability to create a new Trusted App entry to the Trusted Apps List page. Includes some basic validations, but not a comprehensive set (that will be coming in a subsequent PR).

Checklist

Any text added follows EUI's writing guidelines, uses sentence case text and includes i18n support
Unit or functional tests were updated or added to match the most common scenarios
This renders correctly on smaller devices using a responsive layout. (You can test this in your browser

…ted-apps-ui-create # Conflicts: # x-pack/plugins/security_solution/public/management/pages/trusted_apps/view/trusted_apps_page.tsx

…nav bar

parkiino · 2020-09-14T17:55:08Z

x-pack/plugins/security_solution/common/endpoint/types/trusted_apps.ts

  | MacosLinuxConditionEntry
  | (Omit<MacosLinuxConditionEntry, 'field'> & {
-      field: 'signer';
+      field: 'porcess.code_signature';


wait is this actually called porcess?

Yeah, according to the info. I got :)

Sorry - Just got what you were implying 😄
It's a spelling mistake. Will correct it. Thanks for looking @parkiino

kevinlog · 2020-09-14T19:44:35Z

...security_solution/public/management/pages/trusted_apps/state/trusted_apps_list_page_state.ts

 }

+/** Store State when an API request has been sent to create a new trusted app entry */
+export interface TrustedAppCreatePending {


I wonder if there's a way to group these states similar to the List resource. I know it's not entirely the same since we're creating a resource as opposed to loading it.

kevinlog · 2020-09-14T19:48:41Z

...ty_solution/public/management/pages/trusted_apps/view/components/create_trusted_app_form.tsx

+
+const generateNewEntry = (): NewTrustedApp['entries'][0] => {
+  return {
+    field: 'process.hash.*',


these are the field defaults?

Yes, this ultimately drive the default entry for a condition. I know this is not matching what @bfishel has in the Mocks, but for now it is the easier path to take in order to not over-complicate the types of data (I would have to add '' or null' to just about every field here). I plan to discuss that with Bonnie at some point.

kevinlog · 2020-09-14T19:55:19Z

...ty_solution/public/management/pages/trusted_apps/view/components/create_trusted_app_form.tsx

+  isValid: boolean;
+  errors: Partial<{ [k in keyof NewTrustedApp]: string }>;
+}
+const validateFormValues = (values: NewTrustedApp): ValidationResult => {


we've talked about it a couple times in meetings, another validation we could do is field name uniqueness, for instance, you can only have one hash field, etc. Maybe this could solved when we call generateNewEntry() - enforce there that fields must be unique, generate the next "available field" and when none left, disable the "AND" button.

Not required for this PR, was just putting ideas out there for more validations.

FYI @charlie-pichette @efreeti

I opened a separate issue to track UI/UX around validation feedback. This method here is bound to change based on that feedback

kevinlog

LGTM, some smaller comments. Would like @efreeti thoughts as well

…ted-apps-ui-create

parkiino · 2020-09-16T18:34:53Z

x-pack/plugins/security_solution/public/management/pages/trusted_apps/state/type_guards.ts

+  | TrustedAppsListPageState['createView']
+  | Immutable<TrustedAppsListPageState['createView']>;
+
+export const isTrustedAppCreatePendingState = (


is this related to what bohdan was talking about before about having selectors return types?

yes :)

Type guards are a runtime (executable code) function whose purpose is to ensure we are working with the correct type. In TS, it helps tell it that if this function evaluates to true, then the value being evaluated (data) is of a given type (note the : data is TrustedAppCreateSuccess in the return value for this function's signature.

parkiino · 2020-09-16T19:00:56Z

is the spacing expected when you have multiple fields, and are you even allowed to have more than 1 hash?

kibanamachine · 2020-09-16T19:10:39Z

💚 Build Succeeded

continuous-integration/kibana-ci/pull-request
Commit: c5dd93e

Build metrics

@kbn/optimizer bundle module count

id	value	diff	baseline
securitySolution	1991	+8	1983

async chunks size

id	value	diff	baseline
securitySolution	10.1MB	+72.6KB	10.1MB

page load bundle size

id	value	diff	baseline
securitySolution	793.4KB	+171.0B	793.3KB

History

💚 Build #74609 succeeded 1546f90
💚 Build #74577 succeeded 0bd7ac1
💔 Build #74432 failed 7e59185
💔 Build #74301 failed 9d5982d
💔 Build #74270 failed d1bc53e

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

paul-tavares · 2020-09-16T19:18:58Z

@parkiino I was able to reproduce that misalignment in the screen capture, but only when I used the browser's zoom and increase it. Seems to be caused by label (Operator) on that first condition row. I think this is mostly the because you will get from Flex-Box, being that we are not using a "true" table to display this UI.

Thanks for the review

) * Add UI for creating a new Trusted App entry

…) (#77675) * [SECURITY_SOLUTION][ENDPOINT] Create Trusted Apps UI Flow (#77076) * Add UI for creating a new Trusted App entry * update invalid snapshot (cherry picked from commit 333b200) Co-authored-by: Elastic Machine <[email protected]> Co-authored-by: spalger <[email protected]>

paul-tavares added 18 commits September 3, 2020 12:09

Basic form for tursted apps create

51f96f7

Initial component scafolding for a LogicalConditionBuilder component

db38e71

Persist user form element input

83d7a95

small comment

036b315

Condition Entry initial implementation

a0e4cb6

Ability to add/remove entries

383c94f

Show values for Field dropdown

dc838d0

updates to condition items persist at top level

a14a256

adjustment to markup in condition builder

3c425c3

Merge remote-tracking branch 'upstream/master' into task/EMT-691-trus…

c3055fc

…ted-apps-ui-create # Conflicts: # x-pack/plugins/security_solution/public/management/pages/trusted_apps/view/trusted_apps_page.tsx

Make all Flyouts in Administation area show above the SIEM top-level …

e545eec

…nav bar

Add Trusted App button + flyout display

5265092

Moved and renamed Trusted Apps ListPaginationParams

f1ec25d

Added support for show url param in normalizing params

b6ad9a1

Drive flyout via URL param show

a0db8ad

Add header and footer to craete flyout

03d2a36

Rename of components

b04d51e

Added onChange to Trusted App form + initial basic validations

f054c66

paul-tavares added v8.0.0 release_note:skip Skip the PR/issue when compiling release notes v7.1.0 Team:Endpoint Management Feature:Endpoint Elastic Endpoint feature labels Sep 9, 2020

paul-tavares self-assigned this Sep 9, 2020

paul-tavares added 6 commits September 9, 2020 13:37

Fix react warning on missing key

f566037

Flyout UI interactions for clicking the save (create) button

583d933

Plugged save action to store, middleware and API

1525426

Show API error on Form

3802b03

Show toast on successful create a new trusted app entry

121970e

fix: clear createView state on exiting flyout

85b97e7

Refresh list after successful Create

1d3856e

parkiino reviewed Sep 14, 2020

View reviewed changes

Fix TypeScript errors

d1bc53e

kevinlog reviewed Sep 14, 2020

View reviewed changes

kevinlog approved these changes Sep 14, 2020

View reviewed changes

paul-tavares added 11 commits September 14, 2020 16:12

Fix test case to ensure htmlIdGenerator is mocked

ea70142

Trusted Apps List Page test plan for the create flyout

9d5982d

Fix Trusted App server tests

7e59185

Added two missing tests to the Trusted Apps schema

9cec20a

Some tests for Trusted Apps Create Flyout

8a7e235

Additional tests for the create flyout

0daa736

Added test ids + more tests

0bd7ac1

Merge remote-tracking branch 'upstream/master' into task/EMT-691-trus…

2244329

…ted-apps-ui-create

More tests

1546f90

Done with tests

abe027e

Merge remote-tracking branch 'upstream/master' into task/EMT-691-trus…

c5dd93e

…ted-apps-ui-create

parkiino reviewed Sep 16, 2020

View reviewed changes

parkiino approved these changes Sep 16, 2020

View reviewed changes

paul-tavares merged commit c178c8a into elastic:master Sep 16, 2020

paul-tavares deleted the task/EMT-691-trusted-apps-ui-create branch September 16, 2020 20:21

paul-tavares added v7.10.0 and removed v7.1.0 labels Sep 16, 2020

paul-tavares mentioned this pull request Sep 16, 2020

[7.x] [SECURITY_SOLUTION][ENDPOINT] Create Trusted Apps UI Flow (#77076) #77675

Merged

paul-tavares added a commit to paul-tavares/kibana that referenced this pull request Sep 16, 2020

[SECURITY_SOLUTION][ENDPOINT] Create Trusted Apps UI Flow (elastic#77076

b3f7e38

) * Add UI for creating a new Trusted App entry

[SECURITY_SOLUTION][ENDPOINT] Create Trusted Apps UI Flow #77076

[SECURITY_SOLUTION][ENDPOINT] Create Trusted Apps UI Flow #77076

Uh oh!

Conversation

paul-tavares commented Sep 9, 2020 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Summary

Checklist

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

kevinlog left a comment

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

parkiino commented Sep 16, 2020

Uh oh!

kibanamachine commented Sep 16, 2020

💚 Build Succeeded

Build metrics

@kbn/optimizer bundle module count

async chunks size

page load bundle size

History

Uh oh!

paul-tavares commented Sep 16, 2020

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

5 participants

paul-tavares commented Sep 9, 2020 •

edited

Loading