[SIEM] Sets page titles to the current page you are on #42157
Conversation
angorayc
added
Team:SIEM
v8.0.0
release_note:skip
|
Pinging @elastic/secops |
💔 Build Failed |
💚 Build Succeeded |
| const { title, ...rest } = props; | ||
| useEffect(() => { | ||
| document.title = `${title} - Kibana`; | ||
| }); |
There was a problem hiding this comment.
Nice effect!
You're going to want to avoid multiple re-rendering whenever you do things such as resize the window. With this current implementation it will call useEffect and set the title ~7 times on an initial page load and it will do it multiple times when you resize your window if you put a console.log statement to test it:
The fix is simple, which is to pass an empty array to the useEffect as a second argument. That will cause the hook to operate like a componenetDidMount
useEffect(() => {
document.title = `${title} - Kibana`;
}, []);
There was a problem hiding this comment.
Good catch @FrankHassanabad 👍 , I passed title as the second param, so it should do the effect only when title changed. I think it does the same thing as passing [] as the second paraam, it just I think put title here would be clearer to express the idea that this effect acts when title changed.
useEffect(() => {
document.title = `${title} - Kibana`;
}, [title]);
There was a problem hiding this comment.
That works as well and adds a better degree of safety! I like it much more. 👍
| <PageRoute | ||
| {...props} | ||
| component={Hosts} | ||
| title={i18n.translate('xpack.siem.pages.Hosts.HostsTitle', { |
There was a problem hiding this comment.
For the most part our translation keys have been lower case separated by dots:
Examples:
xpack.siem.hosts.kqlPlaceholder
xpack.siem.navigation.overviewShould these just be xpack.siem.pages.hosts.hostsTitle with camel case?
There was a problem hiding this comment.
Yes, thanks for pointing this out.
| <PageRoute | ||
| {...props} | ||
| component={Network} | ||
| title={i18n.translate('xpack.siem.pages.Network.NetworkTitle', { |
There was a problem hiding this comment.
For the most part our translation keys have been lower case separated by dots:
Examples:
xpack.siem.hosts.kqlPlaceholder
xpack.siem.navigation.overviewShould these just be xpack.siem.pages.network.networkTitle with camel case?
💚 Build Succeeded |
💚 Build Succeeded |
FrankHassanabad
added
release_note:enhancement
and removed
release_note:skip
FrankHassanabad
changed the title
FrankHassanabad
changed the title
* add page route * add unit test * rename file path * set document title only when document changed * update i18n keys * update i18n keys
…-or-edit-existing-rollup-job * 'master' of github.com:elastic/kibana: (114 commits) [ML] Fixing empty index pattern list (elastic#42299) [Markdown] Shim new platform - cleanup plugin (elastic#41760) [Code] Enable hierarchicalDocumentSymbolSupport for java language server (elastic#42233) Add New Platform mocks for data plugin (elastic#42261) Http server route handler implementation (elastic#41894) [SR] Allow custom index pattern to be used instead of selectable list when choosing indices to restore (elastic#41534) [Code] distributed Code abstraction (elastic#41374) [SIEM] Sets page titles to the current page you are on (elastic#42157) Saved Objects export API stable type order (elastic#42310) cancellation of interpreter execution (elastic#40238) [SIEM] Fixes a crash when Machine Learning influencers is an undefined value (elastic#42198) Changed the job to work with a dedicated index (elastic#42297) FTR: fix testSubjects.missingOrFail (elastic#42290) Increase retry timeout to prevent flaky tests (elastic#42291) Spaces - make space a hidden saved object type (elastic#41688) Allow applications to register feature privileges which are excluded from the base privileges (elastic#41300) Disable flaky log column reorder test (elastic#42285) Fixing add element in element reducer (elastic#42276) Fix infinite loop (elastic#42228) [Maps][File upload] Remove geojson deep clone logic, handle on maps side (elastic#41835) ...
Summary
This PR is to fix https://github.com/elastic/ingest-dev/issues/610,
setting titles for each page.
Checklist
Use
strikethroughsto remove checklist items you don't feel are applicable to this PR.[ ] Any text added follows EUI's writing guidelines, uses sentence case text and includes i18n support[ ] Documentation was added for features that require explanation or tutorials[ ] This was checked for keyboard-only and screenreader accessibilityFor maintainers
[ ] This was checked for breaking API changes and was labeled appropriately[ ] This includes a feature addition or change that requires a release note and was labeled appropriately