mirror of
https://github.com/grafana/grafana.git
synced 2025-09-20 14:42:53 +08:00
a1c565dec9
* feat: show data-sources under the data-connections page
* refactor: add a constant for data-sources routes
* refactor: add a context that holds the currently active data-sources routes
* refactor: use the data-sources routes constant wherever possible
* refactor: use the data-sources routes context wherever possible
* feat(data-connections): add edit and new pages
* feat(data-connections): set the the custom routes via the context provider
* fix(data-connections): set the active tab properly
We needed to update the routes to match with the ones on the backend ("data-sources" vs "datasources"),
and we also needed to check if it is the default tab, in which case we would like to highlight the Datasources tab.
* tests: fix tests for Data Connections page
* fix: address rebase issues
* tests: find button based on role and text
Co-authored-by: Jack Westbrook <jack.westbrook@gmail.com>
* fix: add missing closing ) paren in tests
* refactor: use implicit return types for components
* tests: change role from "button" to "link"
* refactor: stop using unnecessary wrapper components
Co-authored-by: Jack Westbrook <jack.westbrook@gmail.com>
31 lines
1.1 KiB
TypeScript
31 lines
1.1 KiB
TypeScript
import { useSelector } from 'react-redux';
|
|
import { useLocation } from 'react-router-dom';
|
|
|
|
import { NavModelItem } from '@grafana/data';
|
|
import { StoreState } from 'app/types/store';
|
|
|
|
import { ROUTE_BASE_ID } from '../constants';
|
|
|
|
// We need this utility logic to make sure that the tab with the current URL is marked as active.
|
|
// (In case we were using `getNavModel()` from app/core/selectors/navModel, then we would need to set
|
|
// the child nav-model-item's ID on the call-site.)
|
|
export const useNavModel = () => {
|
|
const { pathname: currentPath } = useLocation();
|
|
const navIndex = useSelector((state: StoreState) => state.navIndex);
|
|
const node = navIndex[ROUTE_BASE_ID];
|
|
const main = node;
|
|
const isDefaultRoute = (item: NavModelItem) =>
|
|
currentPath === `/${ROUTE_BASE_ID}` && item.id === 'data-connections-datasources';
|
|
const isItemActive = (item: NavModelItem) => currentPath.startsWith(item.url || '');
|
|
|
|
main.children = main.children?.map((item) => ({
|
|
...item,
|
|
active: isItemActive(item) || isDefaultRoute(item),
|
|
}));
|
|
|
|
return {
|
|
node,
|
|
main,
|
|
};
|
|
};
|