diff --git a/querybook/server/lib/elasticsearch/search_table.py b/querybook/server/lib/elasticsearch/search_table.py index d080eb497..cc785335e 100644 --- a/querybook/server/lib/elasticsearch/search_table.py +++ b/querybook/server/lib/elasticsearch/search_table.py @@ -116,7 +116,7 @@ def construct_tables_query( } if concise: - query["_source"] = ["id", "schema", "name"] + query["_source"] = ["id", "schema", "name", "golden"] query.update(order_by_fields(sort_key, sort_order)) query.update( diff --git a/querybook/webapp/components/DataTableNavigator/DataTableNavigator.tsx b/querybook/webapp/components/DataTableNavigator/DataTableNavigator.tsx index dfe4a9039..19d088af0 100644 --- a/querybook/webapp/components/DataTableNavigator/DataTableNavigator.tsx +++ b/querybook/webapp/components/DataTableNavigator/DataTableNavigator.tsx @@ -320,6 +320,7 @@ const TableRow: React.FC<{ onClick={handleLinkClick} isRow title={table.displayName} + icon={table.golden === true ? 'Crown' : null} /> ); diff --git a/querybook/webapp/components/DataTableNavigator/DataTableNavigatorSearch.tsx b/querybook/webapp/components/DataTableNavigator/DataTableNavigatorSearch.tsx index 8e2d5ceda..b2b2e633e 100644 --- a/querybook/webapp/components/DataTableNavigator/DataTableNavigatorSearch.tsx +++ b/querybook/webapp/components/DataTableNavigator/DataTableNavigatorSearch.tsx @@ -23,6 +23,8 @@ import { Title } from 'ui/Title/Title'; import { ToggleSwitch } from 'ui/ToggleSwitch/ToggleSwitch'; import './DataTableNavigatorSearch.scss'; +import { Icon } from 'ui/Icon/Icon'; +import { TopTierCrown } from 'components/TopTierCrown/TopTierCrown'; export const DataTableNavigatorSearch: React.FC<{ queryMetastore: IQueryMetastore; @@ -95,15 +97,18 @@ export const DataTableNavigatorSearch: React.FC<{ title="Top Tier" className="toggle-padding" > - - updateSearchFilter( - 'golden', - checked ? true : null - ) - } - /> +
+ + updateSearchFilter( + 'golden', + checked ? true : null + ) + } + /> + +
= ({ onClick={updateDataTableGolden} title={table.golden ? 'Top Tier' : 'Make Top Tier'} size="small" + icon="Crown" /> ); } else if (table.golden) { - featuredBadge = Top Tier; + featuredBadge = ( + + Top Tier + + ); } const iconDOM = ( diff --git a/querybook/webapp/components/DataTableViewMini/TablePanelView.tsx b/querybook/webapp/components/DataTableViewMini/TablePanelView.tsx index f4dc5addf..991b98814 100644 --- a/querybook/webapp/components/DataTableViewMini/TablePanelView.tsx +++ b/querybook/webapp/components/DataTableViewMini/TablePanelView.tsx @@ -14,6 +14,8 @@ import { Loader } from 'ui/Loader/Loader'; import { ColumnIcon } from './ColumnIcon'; import { PanelSection, SubPanelSection } from './PanelSection'; +import { Icon } from 'ui/Icon/Icon'; +import { TopTierCrown } from 'components/TopTierCrown/TopTierCrown'; interface ITablePanelViewProps { tableId: number; @@ -38,7 +40,12 @@ export const TablePanelView: React.FunctionComponent = ({ const overviewSection = ( {schema.name} - {table.name} + + + {table.name} + {table.golden && } + + {table.description ? (table.description as ContentState).getPlainText() diff --git a/querybook/webapp/components/Search/SearchOverview.scss b/querybook/webapp/components/Search/SearchOverview.scss index 625c1fedf..0c0bb7ebd 100644 --- a/querybook/webapp/components/Search/SearchOverview.scss +++ b/querybook/webapp/components/Search/SearchOverview.scss @@ -45,12 +45,6 @@ display: flex; align-items: center; } - - .crown svg { - color: var(--color-accent); - height: 16px; - stroke-width: 2.5px; - } } .Container-content { diff --git a/querybook/webapp/components/Search/SearchOverview.tsx b/querybook/webapp/components/Search/SearchOverview.tsx index ac41e7891..7eba29db3 100644 --- a/querybook/webapp/components/Search/SearchOverview.tsx +++ b/querybook/webapp/components/Search/SearchOverview.tsx @@ -67,6 +67,7 @@ import { SearchSchemaSelect } from './SearchSchemaSelect'; import { TableSelect } from './TableSelect'; import './SearchOverview.scss'; +import { TopTierCrown } from 'components/TopTierCrown/TopTierCrown'; const AIAssistantConfig = PublicConfig.ai_assistant; @@ -752,7 +753,7 @@ export const SearchOverview: React.FC = ({
top tier only - + = ({ ); const goldenIcon = golden ? ( -
- -
+ ) : null; const highlightedDescription = (preview.highlight || {}).description; diff --git a/querybook/webapp/components/TopTierCrown/TopTierCrown.scss b/querybook/webapp/components/TopTierCrown/TopTierCrown.scss new file mode 100644 index 000000000..510c62df0 --- /dev/null +++ b/querybook/webapp/components/TopTierCrown/TopTierCrown.scss @@ -0,0 +1,7 @@ +.TopTierCrown { + svg { + color: var(--color-accent); + height: 16px; + stroke-width: 2.5px; + } +} diff --git a/querybook/webapp/components/TopTierCrown/TopTierCrown.tsx b/querybook/webapp/components/TopTierCrown/TopTierCrown.tsx new file mode 100644 index 000000000..927199145 --- /dev/null +++ b/querybook/webapp/components/TopTierCrown/TopTierCrown.tsx @@ -0,0 +1,23 @@ +import React from 'react'; + +import './TopTierCrown.scss'; +import { Icon } from 'ui/Icon/Icon'; + +export const TopTierCrown: React.FunctionComponent<{ + showTooltip?: boolean; + tooltipPos?: string; +}> = ({ showTooltip = false, tooltipPos = 'down' }) => { + if (showTooltip) { + return ( + + + + ); + } else { + return ; + } +}; diff --git a/querybook/webapp/redux/dataTableSearch/types.ts b/querybook/webapp/redux/dataTableSearch/types.ts index 524b3f903..e003d102b 100644 --- a/querybook/webapp/redux/dataTableSearch/types.ts +++ b/querybook/webapp/redux/dataTableSearch/types.ts @@ -14,6 +14,7 @@ export interface ITableSearchResult { id: number; schema: string; name: string; + golden?: boolean; } export interface ITableSearchFilters {