diff --git a/js_modules/dagster-ui/packages/ui-core/src/asset-graph/AssetGraphExplorer.tsx b/js_modules/dagster-ui/packages/ui-core/src/asset-graph/AssetGraphExplorer.tsx index 3447c462cf519..b9bc63da9ab82 100644 --- a/js_modules/dagster-ui/packages/ui-core/src/asset-graph/AssetGraphExplorer.tsx +++ b/js_modules/dagster-ui/packages/ui-core/src/asset-graph/AssetGraphExplorer.tsx @@ -101,25 +101,24 @@ export const AssetGraphExplorer = (props: Props) => { const {explorerPath, onChangeExplorerPath} = props; - const {button, filterBar, groupsFilter, computeKindTagsFilter, filterFn} = - useAssetGraphExplorerFilters({ - nodes: React.useMemo( - () => (fullAssetGraphData ? Object.values(fullAssetGraphData.nodes) : []), - [fullAssetGraphData], - ), - loading: fetchResult.loading, - isGlobalGraph: !!props.isGlobalGraph, - explorerPath: explorerPath.opsQuery, - clearExplorerPath: React.useCallback(() => { - onChangeExplorerPath( - { - ...explorerPath, - opsQuery: '', - }, - 'push', - ); - }, [explorerPath, onChangeExplorerPath]), - }); + const {button, filterBar, groupsFilter, kindFilter, filterFn} = useAssetGraphExplorerFilters({ + nodes: React.useMemo( + () => (fullAssetGraphData ? Object.values(fullAssetGraphData.nodes) : []), + [fullAssetGraphData], + ), + loading: fetchResult.loading, + isGlobalGraph: !!props.isGlobalGraph, + explorerPath: explorerPath.opsQuery, + clearExplorerPath: React.useCallback(() => { + onChangeExplorerPath( + { + ...explorerPath, + opsQuery: '', + }, + 'push', + ); + }, [explorerPath, onChangeExplorerPath]), + }); useEffect(() => { setHideNodesMatching(() => (node: AssetNodeForGraphQueryFragment) => !filterFn(node)); @@ -152,7 +151,7 @@ export const AssetGraphExplorer = (props: Props) => { graphQueryItems={graphQueryItems} filterBar={filterBar} filterButton={button} - computeKindTagsFilter={computeKindTagsFilter} + kindFilter={kindFilter} groupsFilter={groupsFilter} {...props} /> @@ -172,7 +171,7 @@ type WithDataProps = Props & { filterBar: React.ReactNode; isGlobalGraph?: boolean; - computeKindTagsFilter: StaticSetFilter; + kindFilter: StaticSetFilter; groupsFilter: StaticSetFilter; }; @@ -190,7 +189,7 @@ const AssetGraphExplorerWithData = ({ filterButton, filterBar, isGlobalGraph = false, - computeKindTagsFilter, + kindFilter, groupsFilter, }: WithDataProps) => { const findAssetLocation = useFindAssetLocation(); @@ -626,7 +625,7 @@ const AssetGraphExplorerWithData = ({ )} diff --git a/js_modules/dagster-ui/packages/ui-core/src/asset-graph/AssetNode.tsx b/js_modules/dagster-ui/packages/ui-core/src/asset-graph/AssetNode.tsx index 9f288d74ec8b2..8034500d2616d 100644 --- a/js_modules/dagster-ui/packages/ui-core/src/asset-graph/AssetNode.tsx +++ b/js_modules/dagster-ui/packages/ui-core/src/asset-graph/AssetNode.tsx @@ -25,7 +25,7 @@ import {markdownToPlaintext} from '../ui/markdownToPlaintext'; interface Props { definition: AssetNodeFragment; selected: boolean; - computeKindTagsFilter?: StaticSetFilter; + kindFilter?: StaticSetFilter; } export const AssetNode = React.memo(({definition, selected}: Props) => { diff --git a/js_modules/dagster-ui/packages/ui-core/src/asset-graph/useAssetGraphData.tsx b/js_modules/dagster-ui/packages/ui-core/src/asset-graph/useAssetGraphData.tsx index 36f375d397e3e..2d66aff53d55e 100644 --- a/js_modules/dagster-ui/packages/ui-core/src/asset-graph/useAssetGraphData.tsx +++ b/js_modules/dagster-ui/packages/ui-core/src/asset-graph/useAssetGraphData.tsx @@ -16,13 +16,14 @@ import {GraphQueryItem, filterByQuery} from '../app/GraphQueryImpl'; import {AssetKey} from '../assets/types'; import {AssetGroupSelector, PipelineSelector} from '../graphql/types'; import {useIndexedDBCachedQuery} from '../search/useIndexedDBCachedQuery'; +import {doesFilterArrayMatchValueArray} from '../ui/Filters/useAssetTagFilter'; export interface AssetGraphFetchScope { hideEdgesToNodesOutsideQuery?: boolean; hideNodesMatching?: (node: AssetNodeForGraphQueryFragment) => boolean; pipelineSelector?: PipelineSelector; groupSelector?: AssetGroupSelector; - computeKinds?: string[]; + kinds?: string[]; } export type AssetGraphQueryItem = GraphQueryItem & { @@ -116,10 +117,15 @@ export function useAssetGraphData(opsQuery: string, options: AssetGraphFetchScop // get to leverage the useQuery cache almost 100% of the time above, making this // super fast after the first load vs a network fetch on every page view. const {all: allFilteredByOpQuery} = filterByQuery(graphQueryItems, opsQuery); - const computeKinds = options.computeKinds?.map((c) => c.toLowerCase()); - const all = computeKinds?.length + const kinds = options.kinds?.map((c) => c.toLowerCase()); + const all = kinds?.length ? allFilteredByOpQuery.filter( - ({node}) => node.computeKind && computeKinds.includes(node.computeKind.toLowerCase()), + ({node}) => + node.kinds && + doesFilterArrayMatchValueArray( + kinds, + node.kinds.map((k) => k.toLowerCase()), + ), ) : allFilteredByOpQuery; @@ -139,7 +145,7 @@ export function useAssetGraphData(opsQuery: string, options: AssetGraphFetchScop repoFilteredNodes, graphQueryItems, opsQuery, - options.computeKinds, + options.kinds, options.hideEdgesToNodesOutsideQuery, ]); diff --git a/js_modules/dagster-ui/packages/ui-core/src/asset-graph/useAssetGraphExplorerFilters.oss.tsx b/js_modules/dagster-ui/packages/ui-core/src/asset-graph/useAssetGraphExplorerFilters.oss.tsx index dd138e5e63476..5517ddf93130f 100644 --- a/js_modules/dagster-ui/packages/ui-core/src/asset-graph/useAssetGraphExplorerFilters.oss.tsx +++ b/js_modules/dagster-ui/packages/ui-core/src/asset-graph/useAssetGraphExplorerFilters.oss.tsx @@ -18,7 +18,7 @@ export function useAssetGraphExplorerFilters({ loading, clearExplorerPath, }: Props) { - const {filterButton, computeKindFilter, groupsFilter, activeFiltersJsx, filterFn} = + const {filterButton, kindFilter, groupsFilter, activeFiltersJsx, filterFn} = useAssetCatalogFiltering({ assets: nodes, includeRepos: isGlobalGraph, @@ -26,7 +26,7 @@ export function useAssetGraphExplorerFilters({ }); return { - computeKindTagsFilter: computeKindFilter, + kindFilter, groupsFilter, button: filterButton, filterFn, diff --git a/js_modules/dagster-ui/packages/ui-core/src/assets/AssetTable.tsx b/js_modules/dagster-ui/packages/ui-core/src/assets/AssetTable.tsx index 2f46f431bc6e6..3b7d0b9c68e4c 100644 --- a/js_modules/dagster-ui/packages/ui-core/src/assets/AssetTable.tsx +++ b/js_modules/dagster-ui/packages/ui-core/src/assets/AssetTable.tsx @@ -39,7 +39,7 @@ interface Props { displayPathForAsset: (asset: Asset) => string[]; searchPath: string; isFiltered: boolean; - computeKindFilter?: StaticSetFilter; + kindFilter?: StaticSetFilter; } export const AssetTable = ({ @@ -52,7 +52,7 @@ export const AssetTable = ({ searchPath, isFiltered, view, - computeKindFilter, + kindFilter, }: Props) => { const groupedByDisplayKey = useMemo( () => groupBy(assets, (a) => JSON.stringify(displayPathForAsset(a))), @@ -137,7 +137,7 @@ export const AssetTable = ({ onRefresh={() => refreshState.refetch()} showRepoColumn view={view} - computeKindFilter={computeKindFilter} + kindFilter={kindFilter} /> ); }; diff --git a/js_modules/dagster-ui/packages/ui-core/src/assets/AssetsCatalogTable.tsx b/js_modules/dagster-ui/packages/ui-core/src/assets/AssetsCatalogTable.tsx index c3d66e27002d7..74b1a57ace8f5 100644 --- a/js_modules/dagster-ui/packages/ui-core/src/assets/AssetsCatalogTable.tsx +++ b/js_modules/dagster-ui/packages/ui-core/src/assets/AssetsCatalogTable.tsx @@ -207,7 +207,7 @@ export const AssetsCatalogTable = ({ isFiltered, filterButton, activeFiltersJsx, - computeKindFilter, + kindFilter, } = useAssetCatalogFiltering({assets}); const {searchPath, filterInput, filtered} = useBasicAssetSearchInput( @@ -284,7 +284,7 @@ export const AssetsCatalogTable = ({ prefixPath={prefixPath || emptyArray} searchPath={searchPath} displayPathForAsset={displayPathForAsset} - computeKindFilter={computeKindFilter} + kindFilter={kindFilter} /> ); }; diff --git a/js_modules/dagster-ui/packages/ui-core/src/assets/__tests__/filterAssetDefinition.test.tsx b/js_modules/dagster-ui/packages/ui-core/src/assets/__tests__/filterAssetDefinition.test.tsx index 81e4676f54f09..21672d266dd0b 100644 --- a/js_modules/dagster-ui/packages/ui-core/src/assets/__tests__/filterAssetDefinition.test.tsx +++ b/js_modules/dagster-ui/packages/ui-core/src/assets/__tests__/filterAssetDefinition.test.tsx @@ -1,6 +1,7 @@ import { AssetFilterBaseType, AssetFilterType, + FilterableAssetDefinition, filterAssetDefinition, } from 'shared/assets/useAssetDefinitionFilterState.oss'; @@ -58,12 +59,12 @@ describe('filterAssetDefinition', () => { expect(filterAssetDefinition(filters, definition)).toBe(false); }); - it('returns false when computeKindTags filter does not match the definition', () => { + it('returns false when kinds filter does not match the definition', () => { const filters = { - computeKindTags: ['computeKind2'], + kinds: ['computeKind2'], }; const definition = { - computeKind: 'computeKind1', + kinds: ['computeKind1'], }; expect(filterAssetDefinition(filters, definition)).toBe(false); }); @@ -144,7 +145,7 @@ describe('filterAssetDefinition', () => { const filters = { codeLocations: [repo], groups: [group], - computeKindTags: ['computeKind1'], + kinds: ['computeKind1'], changedInBranch: [ChangeReason.DEPENDENCIES, ChangeReason.PARTITIONS_DEFINITION], owners: [owner], tags: [tag], @@ -157,7 +158,7 @@ describe('filterAssetDefinition', () => { }), }), groupName: group.groupName, - computeKind: 'computeKind1', + kinds: ['computeKind1'], changedReasons: [ChangeReason.DEPENDENCIES, ChangeReason.PARTITIONS_DEFINITION], owners: [owner], tags: [tag], @@ -167,7 +168,7 @@ describe('filterAssetDefinition', () => { }); ( - ['changedInBranch', 'computeKindTags', 'groups', 'owners', 'codeLocations', 'tags'] as Array< + ['changedInBranch', 'kinds', 'groups', 'owners', 'codeLocations', 'tags'] as Array< keyof AssetFilterBaseType > ).forEach((filter) => { @@ -187,7 +188,7 @@ describe('filterAssetDefinition', () => { const filters: Partial = { selectAllFilters: [filter], }; - const definition = { + const definition: FilterableAssetDefinition = { repository: buildRepository({ name: group.repositoryName, location: buildRepositoryLocation({ @@ -195,7 +196,7 @@ describe('filterAssetDefinition', () => { }), }), groupName: group.groupName, - computeKind: 'computeKind1', + kinds: ['computeKind1'], changedReasons: [ChangeReason.DEPENDENCIES, ChangeReason.PARTITIONS_DEFINITION], owners: [owner], tags: [tag], diff --git a/js_modules/dagster-ui/packages/ui-core/src/assets/useAssetCatalogFiltering.oss.tsx b/js_modules/dagster-ui/packages/ui-core/src/assets/useAssetCatalogFiltering.oss.tsx index ef50a9936a71c..509f27eb72afc 100644 --- a/js_modules/dagster-ui/packages/ui-core/src/assets/useAssetCatalogFiltering.oss.tsx +++ b/js_modules/dagster-ui/packages/ui-core/src/assets/useAssetCatalogFiltering.oss.tsx @@ -15,10 +15,7 @@ import {useAssetOwnerFilter, useAssetOwnersForAssets} from '../ui/Filters/useAss import {useAssetTagFilter, useAssetTagsForAssets} from '../ui/Filters/useAssetTagFilter'; import {useChangedFilter} from '../ui/Filters/useChangedFilter'; import {useCodeLocationFilter} from '../ui/Filters/useCodeLocationFilter'; -import { - useAssetKindTagsForAssets, - useComputeKindTagFilter, -} from '../ui/Filters/useComputeKindTagFilter'; +import {useAssetKindsForAssets, useKindFilter} from '../ui/Filters/useKindFilter'; import {WorkspaceContext} from '../workspace/WorkspaceContext'; import {buildRepoAddress} from '../workspace/buildRepoAddress'; @@ -47,7 +44,7 @@ export function useAssetCatalogFiltering< filterFn, setAssetTags, setChangedInBranch, - setComputeKindTags, + setKinds, setGroups, setOwners, setCodeLocations, @@ -55,7 +52,6 @@ export function useAssetCatalogFiltering< } = useAssetDefinitionFilterState({isEnabled}); const allAssetGroupOptions = useAssetGroupSelectorsForAssets(assets); - const allComputeKindTags = useAssetKindTagsForAssets(assets); const allAssetOwners = useAssetOwnersForAssets(assets); const groupsFilter = useAssetGroupFilter({ @@ -71,19 +67,20 @@ export function useAssetCatalogFiltering< : filters.changedInBranch, setChangedInBranch, }); - const computeKindFilter = useComputeKindTagFilter({ - allComputeKindTags, - computeKindTags: filters.selectAllFilters.includes('computeKindTags') - ? allComputeKindTags - : filters.computeKindTags, - setComputeKindTags, - }); + const ownersFilter = useAssetOwnerFilter({ allAssetOwners, owners: filters.selectAllFilters.includes('owners') ? allAssetOwners : filters.owners, setOwners, }); + const allKinds = useAssetKindsForAssets(assets); + const kindFilter = useKindFilter({ + allAssetKinds: allKinds, + kinds: filters.selectAllFilters.includes('kinds') ? allKinds : filters.kinds, + setKinds, + }); + const tags = useAssetTagsForAssets(assets); const tagsFilter = useAssetTagFilter({ @@ -109,7 +106,7 @@ export function useAssetCatalogFiltering< }); const uiFilters = React.useMemo(() => { - const uiFilters: FilterObject[] = [groupsFilter, computeKindFilter, ownersFilter, tagsFilter]; + const uiFilters: FilterObject[] = [groupsFilter, kindFilter, ownersFilter, tagsFilter]; if (isBranchDeployment) { uiFilters.push(changedInBranchFilter); } @@ -120,7 +117,7 @@ export function useAssetCatalogFiltering< }, [ allRepos.length, changedInBranchFilter, - computeKindFilter, + kindFilter, groupsFilter, includeRepos, isBranchDeployment, @@ -155,7 +152,7 @@ export function useAssetCatalogFiltering< [ ['owners', filters.owners, allAssetOwners] as const, ['tags', filters.tags, tags] as const, - ['computeKindTags', filters.computeKindTags, allComputeKindTags] as const, + ['kinds', filters.kinds, allKinds] as const, ['groups', filters.groups, allAssetGroupOptions] as const, ['changedInBranch', filters.changedInBranch, Object.values(ChangeReason)] as const, ['codeLocations', filters.codeLocations, allRepos] as const, @@ -182,7 +179,7 @@ export function useAssetCatalogFiltering< }, [ allAssetGroupOptions, allAssetOwners, - allComputeKindTags, + allKinds, allRepos, didWaitAfterLoading, filters, @@ -203,7 +200,7 @@ export function useAssetCatalogFiltering< isFiltered, filterFn, filtered, - computeKindFilter, + kindFilter, groupsFilter, renderFilterButton: components.renderButton, }; diff --git a/js_modules/dagster-ui/packages/ui-core/src/assets/useAssetDefinitionFilterState.oss.tsx b/js_modules/dagster-ui/packages/ui-core/src/assets/useAssetDefinitionFilterState.oss.tsx index 2e6de5c517064..dc0dcf5ac535a 100644 --- a/js_modules/dagster-ui/packages/ui-core/src/assets/useAssetDefinitionFilterState.oss.tsx +++ b/js_modules/dagster-ui/packages/ui-core/src/assets/useAssetDefinitionFilterState.oss.tsx @@ -20,7 +20,7 @@ type Nullable = { export type FilterableAssetDefinition = Nullable< Partial< - Pick & { + Pick & { repository: Pick & { location: Pick; }; @@ -30,7 +30,7 @@ export type FilterableAssetDefinition = Nullable< export type AssetFilterBaseType = { groups: AssetGroupSelector[]; - computeKindTags: string[]; + kinds: string[]; changedInBranch: ChangeReason[]; owners: AssetOwner[]; tags: DefinitionTag[]; @@ -44,17 +44,9 @@ export type AssetFilterType = AssetFilterBaseType & { export const useAssetDefinitionFilterState = ({isEnabled = true}: {isEnabled?: boolean}) => { const [filters, setFilters] = useQueryPersistedState({ encode: isEnabled - ? ({ - groups, - computeKindTags, - changedInBranch, - owners, - tags, - codeLocations, - selectAllFilters, - }) => ({ + ? ({groups, kinds, changedInBranch, owners, tags, codeLocations, selectAllFilters}) => ({ groups: groups?.length ? JSON.stringify(groups) : undefined, - computeKindTags: computeKindTags?.length ? JSON.stringify(computeKindTags) : undefined, + kinds: kinds?.length ? JSON.stringify(kinds) : undefined, changedInBranch: changedInBranch?.length ? JSON.stringify(changedInBranch) : undefined, owners: owners?.length ? JSON.stringify(owners) : undefined, tags: tags?.length ? JSON.stringify(tags) : undefined, @@ -64,7 +56,7 @@ export const useAssetDefinitionFilterState = ({isEnabled = true}: {isEnabled?: b : () => ({}), decode: (qs) => ({ groups: qs.groups && isEnabled ? JSON.parse(qs.groups) : [], - computeKindTags: qs.computeKindTags && isEnabled ? JSON.parse(qs.computeKindTags) : [], + kinds: qs.kinds && isEnabled ? JSON.parse(qs.kinds) : [], changedInBranch: qs.changedInBranch && isEnabled ? JSON.parse(qs.changedInBranch) : [], owners: qs.owners && isEnabled ? JSON.parse(qs.owners) : [], tags: qs.tags && isEnabled ? JSON.parse(qs.tags) : [], @@ -84,7 +76,7 @@ export const useAssetDefinitionFilterState = ({isEnabled = true}: {isEnabled?: b ); const { - setComputeKindTags, + setKinds, setGroups, setChangedInBranch, setOwners, @@ -101,7 +93,7 @@ export const useAssetDefinitionFilterState = ({isEnabled = true}: {isEnabled?: b }; } return { - setComputeKindTags: makeSetter('computeKindTags'), + setKinds: makeSetter('kinds'), setGroups: makeSetter('groups'), setChangedInBranch: makeSetter('changedInBranch'), setOwners: makeSetter('owners'), @@ -115,7 +107,7 @@ export const useAssetDefinitionFilterState = ({isEnabled = true}: {isEnabled?: b filters, setFilters, filterFn, - setComputeKindTags, + setKinds, setGroups, setChangedInBranch, setOwners, @@ -176,14 +168,14 @@ export function filterAssetDefinition( } } - const isAllComputeKindTagsSelected = filters.selectAllFilters?.includes('computeKindTags'); - if (isAllComputeKindTagsSelected) { - if (!definition?.computeKind?.length) { + const isAllKindsSelected = filters.selectAllFilters?.includes('kinds'); + const kinds = definition?.kinds; + if (isAllKindsSelected) { + if (!kinds) { return false; } - } else if (filters.computeKindTags?.length) { - const lowercased = new Set(filters.computeKindTags.map((c) => c.toLowerCase())); - if (!definition?.computeKind || !lowercased.has(definition.computeKind.toLowerCase())) { + } else if (filters.kinds?.length) { + if (!kinds || !doesFilterArrayMatchValueArray(filters.kinds, kinds)) { return false; } } diff --git a/js_modules/dagster-ui/packages/ui-core/src/graph/KindTags.tsx b/js_modules/dagster-ui/packages/ui-core/src/graph/KindTags.tsx index 54bfdfee1d8b3..f88ca4854fd94 100644 --- a/js_modules/dagster-ui/packages/ui-core/src/graph/KindTags.tsx +++ b/js_modules/dagster-ui/packages/ui-core/src/graph/KindTags.tsx @@ -3,7 +3,7 @@ import * as React from 'react'; import {OpTags} from './OpTags'; import {DefinitionTag} from '../graphql/types'; -import {linkToAssetTableWithComputeKindFilter} from '../search/useGlobalSearch'; +import {linkToAssetTableWithKindFilter} from '../search/useGlobalSearch'; import {StaticSetFilter} from '../ui/BaseFilters/useStaticSetFilter'; export const LEGACY_COMPUTE_KIND_TAG = 'kind'; @@ -18,6 +18,7 @@ export const isCanonicalComputeKindTag = (tag: DefinitionTag) => export const isCanonicalStorageKindTag = (tag: DefinitionTag) => tag.key === STORAGE_KIND_TAG; export const isKindTag = (tag: DefinitionTag) => tag.key.startsWith(KIND_TAG_PREFIX); +export const getKindFromTag = (tag: DefinitionTag) => tag.key.slice(KIND_TAG_PREFIX.length); export const AssetComputeKindTag = ({ definition, @@ -37,6 +38,7 @@ export const AssetComputeKindTag = ({ if (!definition.computeKind) { return null; } + return ( currentPageFilter.setState(new Set([definition.computeKind || ''])) : shouldLink ? () => { - window.location.href = linkToAssetTableWithComputeKindFilter( + window.location.href = linkToAssetTableWithKindFilter( definition.computeKind || '', ); } diff --git a/js_modules/dagster-ui/packages/ui-core/src/search/BuildAssetSearchResults.tsx b/js_modules/dagster-ui/packages/ui-core/src/search/BuildAssetSearchResults.tsx index aba6ada2edb22..2941a8a4df96b 100644 --- a/js_modules/dagster-ui/packages/ui-core/src/search/BuildAssetSearchResults.tsx +++ b/js_modules/dagster-ui/packages/ui-core/src/search/BuildAssetSearchResults.tsx @@ -12,8 +12,8 @@ type CountByOwner = { assetCount: number; }; -type CountByComputeKind = { - computeKind: string; +type CountByKind = { + kind: string; assetCount: number; }; @@ -34,7 +34,7 @@ type CountPerCodeLocation = { type AssetCountsResult = { countsByOwner: CountByOwner[]; - countsByComputeKind: CountByComputeKind[]; + countsByKind: CountByKind[]; countPerTag: CountPerTag[]; countPerAssetGroup: CountPerGroupName[]; countPerCodeLocation: CountPerCodeLocation[]; @@ -49,7 +49,7 @@ export type GroupMetadata = { type AssetDefinitionMetadata = { definition: Pick< AssetTableDefinitionFragment, - 'owners' | 'computeKind' | 'groupName' | 'repository' | 'tags' + 'owners' | 'groupName' | 'repository' | 'tags' | 'kinds' > | null; }; @@ -74,7 +74,7 @@ class CaseInsensitiveCounters { export function buildAssetCountBySection(assets: AssetDefinitionMetadata[]): AssetCountsResult { const assetCountByOwner = new CaseInsensitiveCounters(); - const assetCountByComputeKind = new CaseInsensitiveCounters(); + const assetCountByKind = new CaseInsensitiveCounters(); const assetCountByGroup = new CaseInsensitiveCounters(); const assetCountByCodeLocation = new CaseInsensitiveCounters(); const assetCountByTag = new CaseInsensitiveCounters(); @@ -88,9 +88,11 @@ export function buildAssetCountBySection(assets: AssetDefinitionMetadata[]): Ass assetCountByOwner.increment(ownerKey); }); - const computeKind = assetDefinition.computeKind; - if (computeKind) { - assetCountByComputeKind.increment(computeKind); + const kinds = assetDefinition.kinds; + if (kinds) { + kinds.forEach((kind) => { + assetCountByKind.increment(kind); + }); } assetDefinition.tags.forEach((tag) => { @@ -123,15 +125,14 @@ export function buildAssetCountBySection(assets: AssetDefinitionMetadata[]): Ass assetCount: count, })) .sort(({owner: ownerA}, {owner: ownerB}) => COMMON_COLLATOR.compare(ownerA, ownerB)); - const countsByComputeKind = assetCountByComputeKind + + const countsByKind = assetCountByKind .entries() - .map(([computeKind, count]) => ({ - computeKind, + .map(([kind, count]) => ({ + kind, assetCount: count, })) - .sort(({computeKind: computeKindA}, {computeKind: computeKindB}) => - COMMON_COLLATOR.compare(computeKindA, computeKindB), - ); + .sort(({kind: kindA}, {kind: kindB}) => COMMON_COLLATOR.compare(kindA, kindB)); const countPerTag = assetCountByTag .entries() @@ -186,7 +187,7 @@ export function buildAssetCountBySection(assets: AssetDefinitionMetadata[]): Ass return { countsByOwner, - countsByComputeKind, + countsByKind, countPerTag, countPerAssetGroup, countPerCodeLocation, diff --git a/js_modules/dagster-ui/packages/ui-core/src/search/SearchResults.tsx b/js_modules/dagster-ui/packages/ui-core/src/search/SearchResults.tsx index 0b7f9a47263d2..7e14a3c43eec5 100644 --- a/js_modules/dagster-ui/packages/ui-core/src/search/SearchResults.tsx +++ b/js_modules/dagster-ui/packages/ui-core/src/search/SearchResults.tsx @@ -49,7 +49,7 @@ const iconForType = (type: SearchResultType | AssetFilterSearchResultType): Icon return 'account_circle'; case AssetFilterSearchResultType.AssetGroup: return 'asset_group'; - case AssetFilterSearchResultType.ComputeKind: + case AssetFilterSearchResultType.Kind: return 'compute_kind'; case AssetFilterSearchResultType.Tag: return 'tag'; @@ -66,8 +66,8 @@ const assetFilterPrefixString = (type: AssetFilterSearchResultType): string => { switch (type) { case AssetFilterSearchResultType.CodeLocation: return 'Code location'; - case AssetFilterSearchResultType.ComputeKind: - return 'Compute kind'; + case AssetFilterSearchResultType.Kind: + return 'Kind'; case AssetFilterSearchResultType.Tag: return 'Tag'; case AssetFilterSearchResultType.Owner: @@ -139,11 +139,11 @@ function buildSearchIcons(item: SearchResult, isHighlight: boolean): JSX.Element } } - if (item.type === AssetFilterSearchResultType.ComputeKind) { + if (item.type === AssetFilterSearchResultType.Kind) { if (KNOWN_TAGS[item.label]) { - const computeKindSearchIcon = ; + const kindSearchIcon = ; - icons.push(computeKindSearchIcon); + icons.push(kindSearchIcon); } } diff --git a/js_modules/dagster-ui/packages/ui-core/src/search/types.ts b/js_modules/dagster-ui/packages/ui-core/src/search/types.ts index ebbc1246ac33b..e0121b041c234 100644 --- a/js_modules/dagster-ui/packages/ui-core/src/search/types.ts +++ b/js_modules/dagster-ui/packages/ui-core/src/search/types.ts @@ -28,7 +28,7 @@ export enum SearchResultType { export enum AssetFilterSearchResultType { // Add types with corresponding strings to distinguish // between SearchResultType.AssetGroup - ComputeKind = 'AssetFilterSearchResultType.ComputeKind', + Kind = 'AssetFilterSearchResultType.Kind', Tag = 'AssetFilterSearchResultType.Tag', CodeLocation = 'AssetFilterSearchResultType.CodeLocation', Owner = 'AssetFilterSearchResultType.Owner', @@ -42,7 +42,7 @@ export function isAssetFilterSearchResultType( return ( type === AssetFilterSearchResultType.AssetGroup || type === AssetFilterSearchResultType.CodeLocation || - type === AssetFilterSearchResultType.ComputeKind || + type === AssetFilterSearchResultType.Kind || type === AssetFilterSearchResultType.Owner || type === AssetFilterSearchResultType.Tag || type === AssetFilterSearchResultType.Column @@ -55,6 +55,7 @@ export type SearchResult = { href: string; type: SearchResultType | AssetFilterSearchResultType; tags?: DefinitionTag[]; + kinds?: string[]; numResults?: number; repoPath?: string; node?: diff --git a/js_modules/dagster-ui/packages/ui-core/src/search/types/useGlobalSearch.types.ts b/js_modules/dagster-ui/packages/ui-core/src/search/types/useGlobalSearch.types.ts index 951a8549c60bb..277727fa91895 100644 --- a/js_modules/dagster-ui/packages/ui-core/src/search/types/useGlobalSearch.types.ts +++ b/js_modules/dagster-ui/packages/ui-core/src/search/types/useGlobalSearch.types.ts @@ -102,6 +102,7 @@ export type SearchSecondaryQuery = { id: string; computeKind: string | null; groupName: string; + kinds: Array; owners: Array< | {__typename: 'TeamAssetOwner'; team: string} | {__typename: 'UserAssetOwner'; email: string} @@ -128,6 +129,7 @@ export type SearchAssetFragment = { id: string; computeKind: string | null; groupName: string; + kinds: Array; owners: Array< {__typename: 'TeamAssetOwner'; team: string} | {__typename: 'UserAssetOwner'; email: string} >; diff --git a/js_modules/dagster-ui/packages/ui-core/src/search/useGlobalSearch.tsx b/js_modules/dagster-ui/packages/ui-core/src/search/useGlobalSearch.tsx index c7b7abee1fc79..85f49d12ea278 100644 --- a/js_modules/dagster-ui/packages/ui-core/src/search/useGlobalSearch.tsx +++ b/js_modules/dagster-ui/packages/ui-core/src/search/useGlobalSearch.tsx @@ -17,7 +17,7 @@ import {CloudOSSContext} from '../app/CloudOSSContext'; import {PYTHON_ERROR_FRAGMENT} from '../app/PythonErrorFragment'; import {displayNameForAssetKey, isHiddenAssetGroupJob} from '../asset-graph/Utils'; import {assetDetailsPathForKey} from '../assets/assetDetailsPathForKey'; -import {AssetOwner, DefinitionTag, buildDefinitionTag} from '../graphql/types'; +import {AssetOwner, DefinitionTag} from '../graphql/types'; import {buildTagString} from '../ui/tagAsString'; import {buildRepoPathForHuman} from '../workspace/buildRepoAddress'; import {repoAddressAsURLString} from '../workspace/repoAddressAsString'; @@ -28,9 +28,9 @@ export const linkToAssetTableWithGroupFilter = (groupMetadata: GroupMetadata) => return `/assets?${qs.stringify({groups: JSON.stringify([groupMetadata])})}`; }; -export const linkToAssetTableWithComputeKindFilter = (computeKind: string) => { +export const linkToAssetTableWithKindFilter = (kind: string) => { return `/assets?${qs.stringify({ - computeKindTags: JSON.stringify([computeKind]), + kinds: JSON.stringify([kind]), })}`; }; @@ -213,11 +213,8 @@ const secondaryDataToSearchResults = ( node, href: assetDetailsPathForKey(node.key), type: SearchResultType.Asset, - tags: node.definition!.tags.concat( - node.definition!.computeKind - ? buildDefinitionTag({key: 'dagster/compute_kind', value: node.definition!.computeKind}) - : [], - ), + tags: node.definition!.tags, + kinds: node.definition!.kinds, })); if (searchContext === 'global') { @@ -225,15 +222,13 @@ const secondaryDataToSearchResults = ( } else { const countsBySection = buildAssetCountBySection(nodes); - const computeKindResults: SearchResult[] = countsBySection.countsByComputeKind.map( - ({computeKind, assetCount}) => ({ - label: computeKind, - description: '', - type: AssetFilterSearchResultType.ComputeKind, - href: linkToAssetTableWithComputeKindFilter(computeKind), - numResults: assetCount, - }), - ); + const kindResults: SearchResult[] = countsBySection.countsByKind.map(({kind, assetCount}) => ({ + label: kind, + description: '', + type: AssetFilterSearchResultType.Kind, + href: linkToAssetTableWithKindFilter(kind), + numResults: assetCount, + })); const tagResults: SearchResult[] = countsBySection.countPerTag.map(({tag, assetCount}) => ({ label: buildTagString(tag), @@ -281,7 +276,7 @@ const secondaryDataToSearchResults = ( ); return [ ...assets, - ...computeKindResults, + ...kindResults, ...tagResults, ...codeLocationResults, ...ownerResults, @@ -604,6 +599,7 @@ export const SEARCH_SECONDARY_QUERY = gql` key value } + kinds repository { id name diff --git a/js_modules/dagster-ui/packages/ui-core/src/ui/Filters/useComputeKindTagFilter.tsx b/js_modules/dagster-ui/packages/ui-core/src/ui/Filters/useComputeKindTagFilter.tsx deleted file mode 100644 index bac2073295a3e..0000000000000 --- a/js_modules/dagster-ui/packages/ui-core/src/ui/Filters/useComputeKindTagFilter.tsx +++ /dev/null @@ -1,60 +0,0 @@ -import {Box, Icon} from '@dagster-io/ui-components'; -import uniqBy from 'lodash/uniqBy'; -import {useMemo} from 'react'; - -import {TruncatedTextWithFullTextOnHover} from '../../nav/getLeftNavItemsForOption'; -import {StaticBaseConfig, useStaticSetFilter} from '../BaseFilters/useStaticSetFilter'; - -const emptyArray: any[] = []; - -export const useComputeKindTagFilter = ({ - allComputeKindTags, - computeKindTags, - setComputeKindTags, -}: { - allComputeKindTags: string[]; - computeKindTags?: null | string[]; - setComputeKindTags?: null | ((s: string[]) => void); -}) => { - return useStaticSetFilter({ - ...BaseConfig, - allValues: useMemo( - () => - allComputeKindTags.map((value) => ({ - value, - match: [value], - })), - [allComputeKindTags], - ), - menuWidth: '300px', - state: computeKindTags ?? emptyArray, - onStateChanged: (values) => { - setComputeKindTags?.(Array.from(values)); - }, - }); -}; - -export function useAssetKindTagsForAssets( - assets: {definition?: {computeKind?: string | null} | null}[], -): string[] { - return useMemo( - () => - uniqBy( - assets.map((a) => a.definition?.computeKind).filter((x): x is string => !!x), - (c) => c.toLowerCase(), - ), - [assets], - ); -} - -export const BaseConfig: StaticBaseConfig = { - name: 'Compute kind', - icon: 'compute_kind', - renderLabel: ({value}: {value: string}) => ( - - - - - ), - getStringValue: (value: string) => value, -}; diff --git a/js_modules/dagster-ui/packages/ui-core/src/ui/Filters/useKindFilter.tsx b/js_modules/dagster-ui/packages/ui-core/src/ui/Filters/useKindFilter.tsx new file mode 100644 index 0000000000000..0cc61fae98d59 --- /dev/null +++ b/js_modules/dagster-ui/packages/ui-core/src/ui/Filters/useKindFilter.tsx @@ -0,0 +1,66 @@ +import {Box, Icon} from '@dagster-io/ui-components'; +import {useMemo} from 'react'; + +import {COMMON_COLLATOR} from '../../app/Util'; +import {TruncatedTextWithFullTextOnHover} from '../../nav/getLeftNavItemsForOption'; +import {StaticBaseConfig, useStaticSetFilter} from '../BaseFilters/useStaticSetFilter'; + +const emptyArray: any[] = []; + +export const useKindFilter = ({ + allAssetKinds, + kinds, + setKinds, +}: { + allAssetKinds: string[]; + kinds?: null | string[]; + setKinds?: null | ((s: string[]) => void); +}) => { + return useStaticSetFilter({ + ...BaseConfig, + allValues: useMemo( + () => + allAssetKinds.map((value) => ({ + value, + match: [value], + })), + [allAssetKinds], + ), + menuWidth: '300px', + state: kinds ?? emptyArray, + onStateChanged: (values) => { + setKinds?.(Array.from(values)); + }, + canSelectAll: true, + }); +}; + +export const getStringValue = (value: string) => value; + +export const BaseConfig: StaticBaseConfig = { + name: 'Kind', + icon: 'compute_kind', + renderLabel: (value) => { + return ( + + + + + ); + }, + getStringValue, + getKey: getStringValue, + matchType: 'all-of', +}; + +export function useAssetKindsForAssets( + assets: {definition?: {kinds?: string[] | null} | null}[], +): string[] { + return useMemo( + () => + Array.from(new Set(assets.map((a) => a?.definition?.kinds || []).flat())).sort((a, b) => + COMMON_COLLATOR.compare(a, b), + ), + [assets], + ); +} diff --git a/js_modules/dagster-ui/packages/ui-core/src/ui/Filters/util.ts b/js_modules/dagster-ui/packages/ui-core/src/ui/Filters/util.ts index 7d2c7aa711209..76adad19784d3 100644 --- a/js_modules/dagster-ui/packages/ui-core/src/ui/Filters/util.ts +++ b/js_modules/dagster-ui/packages/ui-core/src/ui/Filters/util.ts @@ -3,21 +3,21 @@ import {BaseConfig as AssetOwnerFilterBaseConfig} from './useAssetOwnerFilter'; import {BaseConfig as AssetTagFilterBaseConfig} from './useAssetTagFilter'; import {BaseConfig as ChangedFilterBaseConfig} from './useChangedFilter'; import {BaseConfig as CodeLocationFilterBaseConfig} from './useCodeLocationFilter'; -import {BaseConfig as ComputeKindTagFilterBaseConfig} from './useComputeKindTagFilter'; +import {BaseConfig as KindFilterBaseConfig} from './useKindFilter'; import {AssetGroupSelector, AssetOwner, ChangeReason, DefinitionTag} from '../../graphql/types'; import {RepoAddress} from '../../workspace/types'; import {StaticBaseConfig} from '../BaseFilters/useStaticSetFilter'; export const STATIC_FILTER_CONFIGS: { groups: StaticBaseConfig; - computeKindTags: StaticBaseConfig; + kinds: StaticBaseConfig; changedInBranch: StaticBaseConfig; owners: StaticBaseConfig; tags: StaticBaseConfig; codeLocations: StaticBaseConfig; } = { groups: AssetGroupsFilterBaseConfig, - computeKindTags: ComputeKindTagFilterBaseConfig, + kinds: KindFilterBaseConfig, changedInBranch: ChangedFilterBaseConfig, owners: AssetOwnerFilterBaseConfig, tags: AssetTagFilterBaseConfig, diff --git a/js_modules/dagster-ui/packages/ui-core/src/workspace/VirtualizedAssetRow.tsx b/js_modules/dagster-ui/packages/ui-core/src/workspace/VirtualizedAssetRow.tsx index 27c846747cec3..96a40b9247078 100644 --- a/js_modules/dagster-ui/packages/ui-core/src/workspace/VirtualizedAssetRow.tsx +++ b/js_modules/dagster-ui/packages/ui-core/src/workspace/VirtualizedAssetRow.tsx @@ -46,7 +46,7 @@ interface AssetRowProps { height: number; start: number; onRefresh: () => void; - computeKindFilter?: StaticSetFilter; + kindFilter?: StaticSetFilter; } export const VirtualizedAssetRow = (props: AssetRowProps) => { @@ -63,7 +63,7 @@ export const VirtualizedAssetRow = (props: AssetRowProps) => { showCheckboxColumn = false, showRepoColumn, view = 'flat', - computeKindFilter, + kindFilter, } = props; const liveData = useLiveDataOrLatestMaterializationDebounced(path, type); @@ -112,6 +112,7 @@ export const VirtualizedAssetRow = (props: AssetRowProps) => { reduceText kind={kind} style={{position: 'relative'}} + currentPageFilter={kindFilter} /> ))} diff --git a/js_modules/dagster-ui/packages/ui-core/src/workspace/VirtualizedAssetTable.tsx b/js_modules/dagster-ui/packages/ui-core/src/workspace/VirtualizedAssetTable.tsx index 25e96e10cef9c..e176dbac63353 100644 --- a/js_modules/dagster-ui/packages/ui-core/src/workspace/VirtualizedAssetTable.tsx +++ b/js_modules/dagster-ui/packages/ui-core/src/workspace/VirtualizedAssetTable.tsx @@ -21,7 +21,7 @@ interface Props { onRefresh: () => void; showRepoColumn: boolean; view?: AssetViewType; - computeKindFilter?: StaticSetFilter; + kindFilter?: StaticSetFilter; } export const VirtualizedAssetTable = (props: Props) => { @@ -34,7 +34,7 @@ export const VirtualizedAssetTable = (props: Props) => { onRefresh, showRepoColumn, view = 'flat', - computeKindFilter, + kindFilter, } = props; const parentRef = React.useRef(null); const count = Object.keys(groups).length; @@ -96,7 +96,7 @@ export const VirtualizedAssetTable = (props: Props) => { checked={checkedDisplayKeys.has(row.displayKey)} onToggleChecked={onToggleFactory(row.displayKey)} onRefresh={onRefresh} - computeKindFilter={computeKindFilter} + kindFilter={kindFilter} /> ); })}