import { createColumnHelper } from '@tanstack/react-table'; import _ from 'lodash'; import { useMemo } from 'react'; import { humanize, truncate } from '@/portainer/filters/filters'; import { usePublicSettings } from '@/react/portainer/settings/queries'; import { Link } from '@@/Link'; import { ExternalBadge } from '@@/Badge/ExternalBadge'; import { isExternalApplication } from '../../applications/utils'; import { cpuHumanValue } from '../../applications/utils/cpuHumanValue'; import { NamespaceApp } from './types'; const columnHelper = createColumnHelper(); export function useColumns() { const hideStacksQuery = usePublicSettings({ select: (settings) => settings.GlobalDeploymentOptions.hideStacksFunctionality, }); return useMemo( () => _.compact([ columnHelper.accessor('Name', { header: 'Name', cell: ({ row: { original: item } }) => ( <> {item.Name} {isExternalApplication({ metadata: item.Metadata }) && (
)} ), }), !hideStacksQuery.data && columnHelper.accessor('StackName', { header: 'Stack', cell: ({ getValue }) => getValue() || '-', }), columnHelper.accessor('Image', { header: 'Image', cell: ({ row: { original: item } }) => ( <> {truncate(item.Image, 64)} {item.Containers?.length > 1 && ( <>+ {item.Containers.length - 1} )} ), }), columnHelper.accessor('CPU', { header: 'CPU', cell: ({ getValue }) => cpuHumanValue(getValue()), }), columnHelper.accessor('Memory', { header: 'Memory', cell: ({ getValue }) => humanize(getValue()), }), ]), [hideStacksQuery.data] ); }