terriajs
Version:
Geospatial data visualization platform.
30 lines • 2.25 kB
JavaScript
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import { runInAction } from "mobx";
import { observer } from "mobx-react";
import { useTranslation } from "react-i18next";
import Box from "../../../Styled/Box";
import { useViewState } from "../../Context";
import DataCatalog from "../../DataCatalog/DataCatalog";
import DataPreview from "../../Preview/DataPreview";
import Breadcrumbs from "../../Search/Breadcrumbs";
import SearchBox, { DEBOUNCE_INTERVAL } from "../../Search/SearchBox";
import Styles from "./data-catalog-tab.scss";
const DataCatalogTab = observer(function DataCatalogTab(props) {
const viewState = useViewState();
const { t } = useTranslation();
const { searchState, previewedItem: previewed, breadcrumbsShown: showBreadcrumbs, terria } = viewState;
const searchPlaceholder = props.searchPlaceholder || t("addData.searchPlaceholder");
const changeSearchText = (newText) => {
runInAction(() => {
viewState.searchState.catalogSearchText = newText;
});
};
const search = () => {
viewState.searchState.searchCatalog();
};
return (_jsx("div", { className: Styles.root, children: _jsxs(Box, { fullHeight: true, column: true, children: [_jsxs(Box, { fullHeight: true, overflow: "hidden", children: [_jsxs(Box, { className: Styles.dataExplorer, styledWidth: "40%", children: [searchState.catalogSearchProvider && (_jsx(SearchBox, { searchText: searchState.catalogSearchText, onSearchTextChanged: changeSearchText, onDoSearch: () => search(), placeholder: searchPlaceholder, debounceDuration: terria.catalogReferencesLoaded
? searchState.catalogSearchProvider.debounceDurationOnceLoaded
: DEBOUNCE_INTERVAL })), _jsx(DataCatalog, { terria: terria, viewState: viewState, onActionButtonClicked: props.onActionButtonClicked, items: props.items })] }), _jsx(Box, { styledWidth: "60%", children: _jsx(DataPreview, { terria: terria, viewState: viewState, previewed: previewed }) })] }), showBreadcrumbs && (_jsx(Breadcrumbs, { terria: terria, viewState: viewState, previewed: previewed }))] }) }));
});
export default DataCatalogTab;
//# sourceMappingURL=DataCatalogTab.js.map