-
Notifications
You must be signed in to change notification settings - Fork 8.3k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Task/host enhancements #59671
Task/host enhancements #59671
Conversation
Pinging @elastic/endpoint-management (Team:Endpoint Management) |
Pinging @elastic/endpoint-app-team (Feature:Endpoint) |
return { | ||
...state, | ||
detailsError: action.payload, | ||
}; | ||
} else if (action.type === 'userExitedManagementList') { | ||
} else if (action.type === 'userExitedHostList') { |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
is this action dispatched anywhere? what would it mean?
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
that action isn't there anymore lol
@parkiino whats your reasoning for the rename? seems like the 'host lists' is a single component on a single page in the feature of managing hosts (which your team maintains.) |
The renaming is mainly to make the code more concise (writing out host vs. management is a lot faster) and also easier to find things (more intuitive to look for host than management). If someone goes from looking at the application to trying to find it in our code base, a key word they might use is 'host' since it's written all over the page, whereas 'managing/management' is something that is more internal to our team. |
bb072ff
to
28f9dc4
Compare
be1f3ec
to
f3d3dd0
Compare
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Something to consider overall when using Styled components. It is best if we don't try to redefine internal class names from EUI framework. One way to get around this is to define your own class names with specific styles (similar to what we used to do in SMP via sass
) and then use the class names along with the Eui component's className
prop. To do this, you would defined your styles in a component (ex. div
) that would wrap the entire View.
Here is an example:
const HostsViewStyles = styled.div`
.endpoint-hostsList-pageHeader: {
//...
margin-bottom: 0
}
`;
You would now have your Hosts List view be placed inside of the above component
export const HostList ()=> {
return <HostsViewSytles>
{ /* Any component rendered here will have ability to use the above class names */}
<EuiPageHeader className="endpoint-hostsList-pageHeader" >...</EuiPageHeader>
</HostsViewList>
}
Let me know if you have any questions or need help going through this :)
payload: HostListPagination; | ||
} | ||
|
||
// https://github.com/elastic/endpoint-app-team/issues/273 |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Maybe just add some words here as to why the action below is there - something like:
"Why is FakeActionWithNoPayload
here? see: "
@@ -25,7 +25,7 @@ export type MiddlewareFactory<S = GlobalState> = ( | |||
api: MiddlewareAPI<Dispatch<AppAction>, S> | |||
) => (next: Dispatch<AppAction>) => (action: AppAction) => unknown; | |||
|
|||
export interface ManagementListState { | |||
export interface HostListState { | |||
endpoints: EndpointMetadata[]; |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Maybe on next PR, rename endpoints
to host
as the property in the state?
export const FormattedDateAndTime: React.FC<{ date: Date }> = ({ date }) => { | ||
// If date is greater than or equal to 24h (ago), then show it as a date | ||
// else, show it as relative to "now" | ||
return Date.now() - date.getTime() >= 8.64e7 ? ( |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
FYI - one of the outstanding tasks from when I originally implemented this is to change so that relative date will only be displayed if within the last 1h
(instead of last 24h
)
const HostIds = styled(EuiListGroupItem)` | ||
margin-top: 0; | ||
.euiListGroupItem__text { | ||
padding: 0; | ||
} | ||
`; |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
You should not define HostIds
component inside of HostDetails
- you only need to define the styled component once and then re-use it. Move it to be outside (at module level).
padding: 0; | ||
`; | ||
|
||
const HostHeader = styled(EuiPageHeader)` |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Same here and below - move the styled
component definition to be module level.
`; | ||
|
||
const HostHeader = styled(EuiPageHeader)` | ||
background-color: #f5f7fa; |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Do not use hardcoded values for colors/padding etc. unless they are not provided by Eui.
Styled components provide a mechanism for access to the Eui Theme which you should use here. To do that, you define a function that accepts props
for the CSS property value and then use that to return back the definition of that css property.
Example of using a borders and colors from the Eui Theme:
const Container = styled.div`
border-bottom: ${props => props.theme.eui.euiBorderThin};
background-color: ${props => props.theme.eui.euiPageBackgroundColor};
`;
const Wrapper = styled.div`
margin-right: auto;
padding-top: ${props => props.theme.eui.paddingSizes.xl};
padding-left: ${props => props.theme.eui.paddingSizes.m};
padding-right: ${props => props.theme.eui.paddingSizes.m};
`;
6c9bc19
to
17d0a29
Compare
@@ -30,7 +30,7 @@ describe('when on the managing page', () => { | |||
<I18nProvider> | |||
<Router history={history}> | |||
<RouteCapture> | |||
<ManagementList /> | |||
<HostList /> |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
My guess is that the jest tests are failing right now because we need to wrap this in <EuiThemeProvider />
like we do here https://github.com/parkiino/kibana/blob/task/host-enhancements/x-pack/plugins/endpoint/public/applications/endpoint/index.tsx#L60
ca76ece
to
cbd3ec9
Compare
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
LGTM
Nice work 😄 👍
defaultMessage: 'Last Seen', | ||
}), | ||
description: details['@timestamp'], | ||
description: <FormattedDateAndTime date={new Date(details['@timestamp'])} />, |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Just FYI (no change needed): I'm pretty sure FormattedDate components recognize a timestamp as well.
60136b0
to
b6f02da
Compare
for (let index = 0; index < actualCountToReturn; index++) { | ||
const generator = new EndpointDocGenerator('seed'); | ||
endpoints.push(generator.generateEndpointMetadata()); | ||
hosts.push(generator.generateHostMetadata()); |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
this will generate documents from the same host repeatedly with only the timestamp on the document changing. Including the index in the random seed string will create different documents on each loop iteration.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
one optional change to the mock host list generation, a few nit picky comments where 'endpoint' remains
@@ -83,9 +83,9 @@ export interface AlertResultList { | |||
prev: string | null; | |||
} | |||
|
|||
export interface EndpointResultList { | |||
export interface HostResultList { | |||
/* the endpoints restricted by the page size */ |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
endpoints -> hosts
/* the endpoints restricted by the page size */ | ||
endpoints: EndpointMetadata[]; | ||
hosts: HostMetadata[]; | ||
/* the total number of unique endpoints in the index */ |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
endpoints -> hosts
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
oof these comments
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
i will probs try to correct those pupsters in the next pr
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
just kidding. :( build failed so i guess i'll do it now
0643f92
to
377bb03
Compare
await pageObjects.common.navigateToUrlWithBrowserHistory( | ||
'endpoint', | ||
'/hosts', | ||
'selected_host=cbe80003-6964-4e0f-aba1-f94c32b44e95' |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
ideally values like this wouldn't be hardcoded so the tests aren't so coupled to the particular es_archive
'0', | ||
'C2A9093E-E289-4C0A-AA44-8C32A414FA7A', | ||
'active', | ||
'10.48.181.22210.116.62.6210.102.83.30', |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
can we also enhance the way this list of IP addresses is displayed. maybe work for next PR
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
when you say enhance do you mean in terms of how it's displayed here in the test code or did you mean in the actual ui?
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
i just mean there's no separator between the IPs here and i think in the UI also
💚 Build SucceededHistory
To update your PR or re-run it, just comment with: |
* master: [ML] Re-enabling file upload telemetry (elastic#60418) [NP] Use local helper shortenDottedString for discover (elastic#60271) [Console] Fix for `_settings` and x-pack autocomplete (elastic#60246) Task/host enhancements (elastic#59671) [Search service] Asynchronous ES search strategy (elastic#53538) Index Action - Moved index params fields to connector config (elastic#60349) Edits UI text for ML nodes and job button (elastic#60184) Publish getIsNavDrawerLocked$ method on core chrome service. (elastic#60191) Disabled edit alert button on management ui for non registered UI alert types (elastic#60439) Revert "[Console] Fix bool filter autocompletions and refactor (elastic#60361)" [Console] Fix bool filter autocompletions and refactor (elastic#60361) Update ingest management team handle (elastic#60457) [IM] Use EuiCodeBlock to render index mapping (elastic#60420) Add additional safeguards for data source wizard step 2 (elastic#60426) [kbn/pm] don't fail when plugins are outside repo (elastic#60164) upgrade react-use (elastic#60427) Remove link to old settings (elastic#60326) Update app arch CODEOWNERS items. (elastic#60396) [ML] Fixing custom urls to dashboards (elastic#60355) Update the ems-client dependency to 7.7.0 (elastic#59936)
Friendly reminder: Looks like this PR hasn’t been backported yet. |
…alerting/tls-warning * 'alerting/tls-warning' of github.com:gmmorris/kibana: (33 commits) [ML] Disable functional transform tests Fixes to service map single node banner (elastic#60072) [Uptime] replace fetch with kibana http (elastic#59881) Upgrade @types/node to match Node.js runtime (elastic#60368) [License Management] NP migration (elastic#60250) Fix create alert button from not showing in alerts list (elastic#60444) [SIEM][Case] Update connector through flyout (elastic#60307) add data-test-subj where possible on SO management table (elastic#60226) Enforce `required` presence for value/key validation of `recordOf` and `mapOf`. (elastic#60406) [ML] Re-enabling file upload telemetry (elastic#60418) [NP] Use local helper shortenDottedString for discover (elastic#60271) [Console] Fix for `_settings` and x-pack autocomplete (elastic#60246) Task/host enhancements (elastic#59671) [Search service] Asynchronous ES search strategy (elastic#53538) Index Action - Moved index params fields to connector config (elastic#60349) Edits UI text for ML nodes and job button (elastic#60184) Publish getIsNavDrawerLocked$ method on core chrome service. (elastic#60191) Disabled edit alert button on management ui for non registered UI alert types (elastic#60439) Revert "[Console] Fix bool filter autocompletions and refactor (elastic#60361)" [Console] Fix bool filter autocompletions and refactor (elastic#60361) ...
Looks like this PR has a backport PR but it still hasn't been merged. Please merge it ASAP to keep the branches relatively in sync. |
3 similar comments
Looks like this PR has a backport PR but it still hasn't been merged. Please merge it ASAP to keep the branches relatively in sync. |
Looks like this PR has a backport PR but it still hasn't been merged. Please merge it ASAP to keep the branches relatively in sync. |
Looks like this PR has a backport PR but it still hasn't been merged. Please merge it ASAP to keep the branches relatively in sync. |
functional tests and ui updates to endpoint host details Co-authored-by: Elastic Machine <[email protected]>
Summary
List

Details

Checklist
Delete any items that are not applicable to this PR.
For maintainers