-
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
[Observability] Landing page for Observability #67467
[Observability] Landing page for Observability #67467
Conversation
0d96d67
to
f60716d
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.
Just some minor nits
Pinging @elastic/uptime (Team:uptime) |
Pinging @elastic/apm-ui (Team:apm) |
@elasticmachine merge upstream |
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 just curious about one question re: EuiCard in the App sections.
</EuiText> | ||
</EuiFlexItem> | ||
|
||
{/* Apps sections */} |
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 there a reason the EuiCard doesn't work for the App sections? Otherwise this all looks good.
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.
We might need to add an option in EUI to render EuiCard without the panel (border & shadow) display. But I'd certainly switch to using the EuiCard, and I can work on getting this display style into EUI
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 thought about that too, but since we talked in one of the comments above that we shouldn't overwrite the Eui styles I thought I shouldn't do it.
But I also agree that replacing it by EuiCard is way better.
Since both of you are fine with that, I go with the EuiCard here too.
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.
@cauemarcondes thanks for considering that! In most cases, we want to do a flow like this (@sqren please correct me if I'm off here for APM):
- Use an existing EUI component as-is or with its documented props/options
- Use an existing EUI component, and ping the EUI team about a special need we have (we may need to hack around it for a release or so but with the idea we will use the EUI recommended way eventually)
- In rare cases, use our own styles to override EUI styles because what we want can't be accommodated by EUI
I think we ran into a case of (2) here, and the EUI team is the BEST at helping us out with those situations. Thanks for being flexible!
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.
Thanks for the clarification @jasonrhodes .
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.
@cchaos I just noticed there's a property called display
available on EuiCard
which has the options plain
or panel
when choosing plain
it removes the border and shadow.
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.
Gah, hahaha, You're right. We just never added an example in our docs specifically for that. Glad you found it!
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.
Map lgtm!
- code review
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.
Canvas changes LGTM
also, Observability overview page looks really nice!
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!
@elasticmachine merge upstream |
💛 Build succeeded, but was flaky
Test FailuresKibana Pipeline / kibana-xpack-agent / Chrome X-Pack UI Functional Tests.x-pack/test/functional/apps/canvas/custom_elements·ts.Canvas app custom elements adds the custom element to the workpad when promptedStandard Out
Stack Trace
History
To update your PR or re-run it, just comment with: |
* creating overview page and menu * styling the home page * adjusting breadcrumb * renaming isnt working * renaming isnt working * renaming isnt working * fixing import * fixing scroll when resize window * fixing eslint errors * prepending links * adding target option * refactoring * adding dark mode support * fixing prettier format * fixing i18n * reverting some unnecessary changes * addressing PR comments * fixing functional tests * ordering observability menu * fixing tests * addressing PR comments * fixing test * fixing scroll * addressing pr comments * addressing pr comments Co-authored-by: Elastic Machine <[email protected]>
* master: (57 commits) Add app arch team as owner of datemath package (elastic#66880) [Observability] Landing page for Observability (elastic#67467) [SIEM] Fix timeline buildGlobalQuery (elastic#68320) Optimize saved objects getScopedClient and HTTP API (elastic#68221) [Maps] Fix mb-style interpolate style rule (elastic#68413) update script to always download node (elastic#68421) [SECURITY SOLEIL] Fix selection of event type when no siem index signal created (elastic#68291) [DOCS] Adds note about configuring File Data Visualizer (elastic#68407) [DOCS] Adds link from remote clusters to index patterns (elastic#68406) [QA] slack notify on failure (elastic#68126) upgrade eslint-plugin-react-hooks from 2.3.0 to 4.0.4 (elastic#68295) moving to jira to a gold license (elastic#67178) [DOCS] Revises doc on adding data (elastic#68038) [APM] Add ThemeProvider to support dark mode (elastic#68242) Make welcome screen disabling first action in loginIfPrompted (elastic#68238) [QA] Code coverage: unskip tests, collect tests results, exclude bundles from report (elastic#64477) [ML] Functional tests - disable flaky regression and classification creation test [Alerting] change eventLog ILM requests to absolute URLs (elastic#68331) Report page load asset size (elastic#66224) [SIEM][CASE] Change SIEM to Security (elastic#68365) ...
* creating overview page and menu * styling the home page * adjusting breadcrumb * renaming isnt working * renaming isnt working * renaming isnt working * fixing import * fixing scroll when resize window * fixing eslint errors * prepending links * adding target option * refactoring * adding dark mode support * fixing prettier format * fixing i18n * reverting some unnecessary changes * addressing PR comments * fixing functional tests * ordering observability menu * fixing tests * addressing PR comments * fixing test * fixing scroll * addressing pr comments * addressing pr comments Co-authored-by: Elastic Machine <[email protected]> Co-authored-by: Elastic Machine <[email protected]>
closes #66931
A new URL was created to host the observability landing page,
/app/observability
. There is also a new option in the menu calledOverview
inside the Observability section.The
Get started
,Demo playground
andAdd sample data
point to/app/home#/tutorial_directory/logging
,https://demo.elastic.co/
and/app/home#/tutorial_directory/sampleData
respectively.Dark mode:
![Screenshot 2020-06-02 at 11 17 04](https://user-images.githubusercontent.com/55978943/83505259-d0fd5f80-a4c5-11ea-88be-04d770315920.png)
FYI: I had to change some functional tests because I added a new item in the menu called
Overview
inside the Observability section. For example, previously the testshows canvas navlink
expected['Canvas', 'Stack Management']
, and I changed to expect onlyCanvas
.