[Tech Debt] Audit and fix usage of useOpenSearchDashboards().services

[joshuarrrr]

There seems to be quite a bit of the antipattern where a component calls useOpenSearchDashboards() as a convenience hook to fetch any core service it may want to use. But the problem is that not all the services are necessarily defined. This leads to bugs like #3327, where the entire component rendering crashes in cases where the linkService is not yet defined.

There are also other antipatterns such as

OpenSearch-Dashboards/src/plugins/vis_type_vega/public/components/vega_help_menu.tsx

Line 43 in 5b8a378

const vegaHelpDoc = useOpenSearchDashboards().services.docLinks?.links.noDocumentation.vega;

(the optional chaining prevents unhandled exceptions, but it means the link href will be undefined if the service isn't found)

Or

OpenSearch-Dashboards/examples/bfetch_explorer/public/hooks/use_deps.ts

Line 34 in 5b8a378

export const useDeps = () => useOpenSearchDashboards().services as BfetchDeps;

(the type casting assures the typescript compiler that the explorer service will be defined, while the hook makes no such guarantees

Or

OpenSearch-Dashboards/src/plugins/data/public/ui/filter_bar/filter_editor/range_value_input.tsx

Line 57 in 5b8a378

const tzConfig = opensearchDashboards.services.uiSettings!.get('dateFormat:tz');

(which incorrectly uses the non-null assertion operator)

From my quick glance, it does appear to be handled correctly in other components, such as

OpenSearch-Dashboards/src/plugins/opensearch_dashboards_react/public/ui_settings/use_ui_setting.ts

Lines 70 to 74 in 5b8a378

	const { services } = useOpenSearchDashboards();
	if (typeof services.uiSettings !== 'object') {
	throw new TypeError('uiSettings service not available in opensearch-dashboards-react context.');
	}

The goals of this issue are to:

• comprehensively survey usage of the hook
• fix incorrect usage or type casting
• recommend improvements to the hook itself or typing to better prevent these types of mistakes.

[ashwin-pc]

I agree. We should migrate all such instances to use this pattern:

https://github.com/opensearch-project/OpenSearch-Dashboards/blob/main/src/plugins/vis_builder/public/application/components/data_tab/use/use_dropbox.tsx#L35-L41

[Aigerim-ai]

Hello @joshuarrrr , @ashwin-pc I would like to work on this issue, please assign it to me

[joshuarrrr]

OK, @Aigerim-ai, you've got it! As you investigate usage, let us know if there are other considerations or issues you discover.