WIP: [ML] NavMenu conversion to React #39325
Conversation
alvarezmelissa87
added
:ml
v8.0.0
release_note:skip
|
Pinging @elastic/ml-ui |
💔 Build Failed |
| timefilterDep.setTime(time); | ||
| } | ||
| // consumer must call unsubscribe on return value | ||
| subscribeToUpdates(callback: () => void) { |
There was a problem hiding this comment.
The name of this function and subscribeToRefreshIntervalUpdate are inconsistent. Maybe just drop the s to give subscribeToUpdate or maybe subscribeToTimeFilterUpdate?
There was a problem hiding this comment.
subscribeToUpdates listens for fetch being emitted by the timefilter dependency - this happens both on time update and on refreshInterval update while the subscribeToRefreshIntervalUpdate only listens for the refreshInterval update event. That's why I had the naming that way.
Maybe I can be more explicit? subscribeToTimeAndRefreshIntervalUpdates, subscribeToRefreshIntervalUpdate, maybe if we need to only listen for the time update add a subscribeToTimeUpdate? That way it will be very clear which events are being listened to? Open to ideas on this.
There was a problem hiding this comment.
Ah ok, in that case I think subscribeToUpdates is fine as it is. Just add a comment clarifying that it happens for both types of update event. Adding a subscribeToTimeUpdate probably worth adding for completeness.
| const [selectedTabId, setSelectedTabId] = useState(tabId); | ||
|
|
||
| function onSelectedTabChanged(id: string) { | ||
| // TODO: change href but keep what's saved in url |
There was a problem hiding this comment.
Is this comment still needed?
| restrict: 'E', | ||
| transclude: true, | ||
| link: function (scope, element, attrs) { | ||
| // TODO: does scope.name need to be set? |
There was a problem hiding this comment.
Are these TODOs still needed?
| }; | ||
| }); | ||
| } | ||
| // TODO: fix types |
There was a problem hiding this comment.
Has this TODO been done?
| onRefresh={updateFilter} | ||
| onRefreshChange={updateInterval} | ||
| recentlyUsedRanges={recentlyUsedRanges} | ||
| // date-format="dateFormat" |
x-pack/plugins/ml/public/components/navigation_menu/_navigation_menu.scss
Outdated
Show resolved
Hide resolved
x-pack/plugins/ml/public/components/navigation_menu/_navigation_menu.scss
Outdated
Show resolved
Hide resolved
alvarezmelissa87
force-pushed
the
ml-nav-menu-to-react
branch
from
06fad6e
to
fb462ee
Compare
💔 Build Failed |
💔 Build Failed |
💔 Build Failed |
💔 Build Failed |
|
While in most apps I think these should be two different components ( The component I'm working on is used to display options menus (should be ready within a week or so). I would love to use the work you're doing on displaying tabbed content to create a component that will be offered as part of the arch team react helper components. I'd love to hear your thoughts on this. |
|
Closing in lieu of #40830 |
Summary
NavMenu rewrite to React/eui.
Along with the navigation tabs, this PR replaces the
kbn_top_navangular dependency (datepicker and refresh button) with a reactTopNavcomponent consisting of the same EuiSuperDatePicker component.This PR wraps the legacy
timefilterin a local class and only pulls the legacytimfilterin that file. All the files that used to pull in the oldtimefilternow import the new timefilter. This will allow us to easily replace the legacytimefilterwhen it is replaced in the new platform.Checklist
Use
strikethroughsto remove checklist items you don't feel are applicable to this PR.For maintainers