diff --git a/react/src/components/ImageList.tsx b/react/src/components/ImageList.tsx index 9286a56583..9ad821a7bb 100644 --- a/react/src/components/ImageList.tsx +++ b/react/src/components/ImageList.tsx @@ -425,8 +425,10 @@ const ImageList: React.FC<{ style?: React.CSSProperties }> = ({ style }) => { const imageFilterValues = useMemo(() => { return defaultSortedImages?.map((image) => { return { - installed: image?.installed ? t('environment.Installed') : '', - namespace: getNamespace(getImageFullName(image) || ''), + namespace: supportExtendedImageInfo ? image?.namespace : image?.name, + fullName: getImageFullName(image) || '', + digest: image?.digest || '', + // ------------ need only before 24.09.1 ------------ lang: image?.name ? getLang(image.name) : '', baseversion: getBaseVersion(getImageFullName(image) || ''), baseimage: @@ -441,7 +443,12 @@ const ImageList: React.FC<{ style?: React.CSSProperties }> = ({ style }) => { isCustomized: image?.tag ? image.tag.indexOf('customized') !== -1 : false, - fullName: getImageFullName(image) || '', + // ------------------------------------------------- + // ------------ need only after 24.09.1 ------------ + baseImageName: supportExtendedImageInfo ? image?.base_image_name : '', + tags: supportExtendedImageInfo ? image?.tags : [], + version: supportExtendedImageInfo ? image?.version : '', + // ------------------------------------------------- }; }); // eslint-disable-next-line react-hooks/exhaustive-deps @@ -456,7 +463,6 @@ const ImageList: React.FC<{ style?: React.CSSProperties }> = ({ style }) => { if (['digest', 'architecture', 'registry'].includes(key)) return regExp.test(_.toString(value)); const curFilterValues = imageFilterValues[idx] || {}; - if (key === 'installed') return regExp.test(curFilterValues.installed); const baseVersionMatch = regExp.test(curFilterValues.baseversion); const baseImagesMatch = _.some(curFilterValues.baseimage, (value) => regExp.test(value), @@ -469,8 +475,15 @@ const ImageList: React.FC<{ style?: React.CSSProperties }> = ({ style }) => { ? regExp.test('customized') : false; const langMatch = regExp.test(curFilterValues.lang); - const namespaceMatch = regExp.test(curFilterValues.namespace); + const namespaceMatch = regExp.test(curFilterValues.namespace || ''); const fullNameMatch = regExp.test(curFilterValues.fullName); + const tagsMatch = _.some( + curFilterValues.tags, + (tag: { key: string; value: string }) => + regExp.test(tag.key) || regExp.test(tag.value), + ); + const versionMatch = regExp.test(curFilterValues.version || ''); + const digestMatch = regExp.test(curFilterValues.digest); return ( baseVersionMatch || baseImagesMatch || @@ -478,7 +491,10 @@ const ImageList: React.FC<{ style?: React.CSSProperties }> = ({ style }) => { langMatch || namespaceMatch || customizedMatch || - fullNameMatch + fullNameMatch || + tagsMatch || + versionMatch || + digestMatch ); }); });