diff --git a/ui/src/app/applications/components/application-details/application-details.tsx b/ui/src/app/applications/components/application-details/application-details.tsx index 85103c08c4834..8cc4df3ca977f 100644 --- a/ui/src/app/applications/components/application-details/application-details.tsx +++ b/ui/src/app/applications/components/application-details/application-details.tsx @@ -24,7 +24,7 @@ import { ResourceDetails } from '../resource-details/resource-details'; import * as AppUtils from '../utils'; import { ApplicationResourceList } from './application-resource-list'; import { AbstractFiltersProps, Filters } from './application-resource-filter'; -import { getAppDefaultSource, urlPattern, helpTip, isApp, isFromAppComponents } from '../utils'; +import { getAppDefaultSource, urlPattern, helpTip, isApp, isInvokedFromApps } from '../utils'; import { ChartDetails, ResourceStatus } from '../../../shared/models'; import { ApplicationsDetailsAppDropdown } from './application-details-app-dropdown'; import { useSidebarTarget } from '../../../sidebar/sidebar'; @@ -152,7 +152,7 @@ export class ApplicationDetails extends React.Component {q => ( {error}} - loadingRenderer={() => Loading...} + errorRenderer={error => {error}} + loadingRenderer={() => Loading...} input={this.props.match.params.name} load={name => combineLatest([this.loadAppInfo(name, this.appNamespace), services.viewPreferences.getPreferences(), q]).pipe( diff --git a/ui/src/app/applications/components/applications-list/applications-list.tsx b/ui/src/app/applications/components/applications-list/applications-list.tsx index b6ce859f9ade5..185c1aba1de58 100644 --- a/ui/src/app/applications/components/applications-list/applications-list.tsx +++ b/ui/src/app/applications/components/applications-list/applications-list.tsx @@ -24,7 +24,7 @@ import { useSidebarTarget } from '../../../sidebar/sidebar'; import './applications-list.scss'; import './flex-top-bar.scss'; -import { isApp, isFromAppComponents } from '../utils'; +import { isApp, isInvokedFromApps } from '../utils'; import { AbstractApplication, Application, ApplicationSet } from '../../../shared/models'; const EVENTS_BUFFER_TIMEOUT = 500; @@ -61,8 +61,8 @@ const APPSET_FIELDS = [ 'spec', ]; -const APP_LIST_FIELDS = AppUtils.isFromAppComponents() ? ['metadata.resourceVersion', ...APP_FIELDS.map(field => `items.${field}`)] : ['metadata.resourceVersion', ...APPSET_FIELDS.map(field => `items.${field}`)]; -const APP_WATCH_FIELDS = AppUtils.isFromAppComponents() ? ['result.type', ...APP_FIELDS.map(field => `result.application.${field}`)] : ['result.type', ...APPSET_FIELDS.map(field => `result.application.${field}`)]; +const APP_LIST_FIELDS = AppUtils.isInvokedFromApps() ? ['metadata.resourceVersion', ...APP_FIELDS.map(field => `items.${field}`)] : ['metadata.resourceVersion', ...APPSET_FIELDS.map(field => `items.${field}`)]; +const APP_WATCH_FIELDS = AppUtils.isInvokedFromApps() ? ['result.type', ...APP_FIELDS.map(field => `result.application.${field}`)] : ['result.type', ...APPSET_FIELDS.map(field => `result.application.${field}`)]; function loadApplications(projects: string[], appNamespace: string): Observable { return from(services.applications.list(projects, { appNamespace, fields: APP_LIST_FIELDS })).pipe( @@ -100,7 +100,7 @@ function loadApplications(projects: string[], appNamespace: string): Observable< }) ) .pipe(filter(item => item.updated)) - .pipe(map(item => isFromAppComponents() ? item.applications as models.Application[] : item.applications as models.ApplicationSet[])) + .pipe(map(item => isInvokedFromApps() ? item.applications as models.Application[] : item.applications as models.ApplicationSet[])) ); }) ); @@ -115,7 +115,7 @@ const ViewPref = ({ children }: { children: (pref: AbstractAppsListPreferences & map(items => { const params = items[1]; const viewPref: AbstractAppsListPreferences = { ...items[0] }; - if (isFromAppComponents()) { + if (isInvokedFromApps()) { // App specific filters // TODO: the knowledge about what is relevant for Apps and what for AppSets should be elsewhere and not here if (params.get('proj') != null) { @@ -183,7 +183,7 @@ const ViewPref = ({ children }: { children: (pref: AbstractAppsListPreferences & function filterApps(applications: AbstractApplication[], pref: AbstractAppsListPreferences, search: string): { filteredApps: AbstractApplication[]; filterResults: AbstractFilteredApp[] } { applications = applications.map(app => { let isAppOfAppsPattern = false; - if (!isFromAppComponents()) { // AppSet behaves like an app of apps + if (!isInvokedFromApps()) { // AppSet behaves like an app of apps isAppOfAppsPattern = true; } else { // It is an App and may or may not be app-of-apps pattern @@ -196,7 +196,7 @@ function filterApps(applications: AbstractApplication[], pref: AbstractAppsListP } return { ...app, isAppOfAppsPattern }; }); - const filterResults = isFromAppComponents() ? getFilterResults(applications as Application[], pref as AppsListPreferences) : getFilterResults(applications as ApplicationSet[], pref as AppSetsListPreferences); + const filterResults = isInvokedFromApps() ? getFilterResults(applications as Application[], pref as AppsListPreferences) : getFilterResults(applications as ApplicationSet[], pref as AppSetsListPreferences); return { filterResults, filteredApps: filterResults.filter( @@ -225,7 +225,7 @@ const SearchBar = (props: { content: string; ctx: ContextApis; apps: models.Abst const [isFocused, setFocus] = React.useState(false); const useAuthSettingsCtx = React.useContext(AuthSettingsCtx); - const placeholderText = isFromAppComponents() ? 'Search applications...' : 'Search application sets...' + const placeholderText = isInvokedFromApps() ? 'Search applications...' : 'Search application sets...' useKeybinding({ keys: Key.SLASH, @@ -367,12 +367,12 @@ export const ApplicationsList = (props: RouteComponentProps<{}>) => { '.', { - proj: isFromAppComponents() ? (newPref as AppsListPreferences).projectsFilter.join(',') : '', - sync: isFromAppComponents() ? (newPref as AppsListPreferences).syncFilter.join(',') : '', - autoSync: isFromAppComponents() ? (newPref as AppsListPreferences).autoSyncFilter.join(',') : '', + proj: isInvokedFromApps() ? (newPref as AppsListPreferences).projectsFilter.join(',') : '', + sync: isInvokedFromApps() ? (newPref as AppsListPreferences).syncFilter.join(',') : '', + autoSync: isInvokedFromApps() ? (newPref as AppsListPreferences).autoSyncFilter.join(',') : '', health: newPref.healthFilter.join(','), - namespace: isFromAppComponents() ? (newPref as AppsListPreferences).namespacesFilter.join(',') : '', - cluster: isFromAppComponents() ? (newPref as AppsListPreferences).clustersFilter.join(',') : '', + namespace: isInvokedFromApps() ? (newPref as AppsListPreferences).namespacesFilter.join(',') : '', + cluster: isInvokedFromApps() ? (newPref as AppsListPreferences).clustersFilter.join(',') : '', labels: newPref.labelsFilter.map(encodeURIComponent).join(',') }, { replace: true } @@ -380,7 +380,7 @@ export const ApplicationsList = (props: RouteComponentProps<{}>) => { ); } - const pageTitlePrefix = isFromAppComponents() ? "Applications " : "ApplicationSets " + const pageTitlePrefix = isInvokedFromApps() ? "Applications " : "ApplicationSets " function getPageTitle(view: string) { switch (view) { @@ -397,7 +397,7 @@ export const ApplicationsList = (props: RouteComponentProps<{}>) => { const sidebarTarget = useSidebarTarget(); - const getEmptyStateText = isFromAppComponents() ? 'No matching applications found' : 'No matching application sets found' + const getEmptyStateText = isInvokedFromApps() ? 'No matching applications found' : 'No matching application sets found' const applicationTilesProps = (ctx: ContextApis, data: models.Application[]): ApplicationTilesProps => { return { @@ -429,7 +429,7 @@ export const ApplicationsList = (props: RouteComponentProps<{}>) => { } function getProjectsFilter(pref: AbstractAppsListPreferences): string[] { - return isFromAppComponents() ? (pref as AppsListPreferences & { page: number, search: string }).projectsFilter : [] + return isInvokedFromApps() ? (pref as AppsListPreferences & { page: number, search: string }).projectsFilter : [] } return ( @@ -443,12 +443,12 @@ export const ApplicationsList = (props: RouteComponentProps<{}>) => { key={pref.view} title={getPageTitle(pref.view)} useTitleOnly={true} - toolbar={isFromAppComponents() ? { breadcrumbs: [{ title: 'Applications', path: '/applications' }] } : { breadcrumbs: [{ title: 'Settings', path: '/settings' }, { title: 'ApplicationSets' }] }} + toolbar={isInvokedFromApps() ? { breadcrumbs: [{ title: 'Applications', path: '/applications' }] } : { breadcrumbs: [{ title: 'Settings', path: '/settings' }, { title: 'ApplicationSets' }] }} hideAuth={true}> AppUtils.handlePageVisibility(() => loadApplications(isFromAppComponents() ? (pref as AppsListPreferences & { page: number, search: string }).projectsFilter : [], query.get('appNamespace')))} + load={() => AppUtils.handlePageVisibility(() => loadApplications(isInvokedFromApps() ? (pref as AppsListPreferences & { page: number, search: string }).projectsFilter : [], query.get('appNamespace')))} loadingRenderer={() => (
@@ -456,7 +456,7 @@ export const ApplicationsList = (props: RouteComponentProps<{}>) => { )}> {(applications: models.AbstractApplication[]) => { const healthBarPrefs = pref.statusBarView || ({} as HealthStatusBarPreferences); - const { filteredApps, filterResults } = filterApps(isFromAppComponents() ? applications as Application[] : applications as ApplicationSet[], isFromAppComponents() ? (pref as AppsListPreferences & { page: number, search: string }) : (pref as AppSetsListPreferences & { page: number, search: string }), pref.search); + const { filteredApps, filterResults } = filterApps(isInvokedFromApps() ? applications as Application[] : applications as ApplicationSet[], isInvokedFromApps() ? (pref as AppsListPreferences & { page: number, search: string }) : (pref as AppSetsListPreferences & { page: number, search: string }), pref.search); return ( ) => { onFilterPrefChanged(ctx, newPrefs)} - pref={isFromAppComponents() ? pref as AppsListPreferences & { page: number; search: string; } : pref as AppSetsListPreferences} + pref={isInvokedFromApps() ? pref as AppsListPreferences & { page: number; search: string; } : pref as AppSetsListPreferences} collapsed={allpref.hideSidebar} /> )} @@ -579,7 +579,7 @@ export const ApplicationsList = (props: RouteComponentProps<{}>) => { Change filter criteria or  { - if (isFromAppComponents()) { + if (isInvokedFromApps()) { AppsListPreferences.clearFilters(pref as AppsListPreferences & { page: number; search: string; }); } else { diff --git a/ui/src/app/applications/components/applications-list/applications-status-bar.tsx b/ui/src/app/applications/components/applications-list/applications-status-bar.tsx index 2b0d591b5e427..d998998909466 100644 --- a/ui/src/app/applications/components/applications-list/applications-status-bar.tsx +++ b/ui/src/app/applications/components/applications-list/applications-status-bar.tsx @@ -5,7 +5,7 @@ import { Consumer } from '../../../shared/context'; import * as models from '../../../shared/models'; import './applications-status-bar.scss'; -import { getAppSetHealthStatus, isFromAppComponents } from '../utils'; +import { getAppSetHealthStatus, isInvokedFromApps } from '../utils'; import { Application, ApplicationSet } from '../../../shared/models'; export interface ApplicationsStatusBarProps { @@ -14,7 +14,7 @@ export interface ApplicationsStatusBarProps { export const ApplicationsStatusBar = ({ applications }: ApplicationsStatusBarProps) => { const readings: any[] = []; - if (isFromAppComponents()) { + if (isInvokedFromApps()) { readings.push({ name: 'Healthy', value: applications.filter(app => (app as Application).status.health.status === 'Healthy').length, diff --git a/ui/src/app/applications/components/applications-list/applications-summary.tsx b/ui/src/app/applications/components/applications-list/applications-summary.tsx index 6c61b67241a8a..1ceb0750286fe 100644 --- a/ui/src/app/applications/components/applications-list/applications-summary.tsx +++ b/ui/src/app/applications/components/applications-list/applications-summary.tsx @@ -4,7 +4,7 @@ const PieChart = require('react-svg-piechart').default; import { COLORS } from '../../../shared/components'; import * as models from '../../../shared/models'; import { Application, ApplicationSet, HealthStatusCode, SyncStatusCode } from '../../../shared/models'; -import { ComparisonStatusIcon, HealthStatusIcon, getAppSetHealthStatus, isFromAppComponents } from '../utils'; +import { ComparisonStatusIcon, HealthStatusIcon, getAppSetHealthStatus, isInvokedFromApps } from '../utils'; const healthColors = new Map(); healthColors.set('Unknown', COLORS.health.unknown); @@ -29,7 +29,7 @@ export const ApplicationsSummary = ({ applications }: { applications: models.Abs const health = new Map(); // if (isApp(applications[0])) { - if (isFromAppComponents()) { + if (isInvokedFromApps()) { applications.forEach(app => sync.set((app as Application).status.sync.status, (sync.get((app as Application).status.sync.status) || 0) + 1)); applications.forEach(app => health.set((app as Application).status.health.status, (health.get((app as Application).status.health.status) || 0) + 1)); } @@ -37,7 +37,7 @@ export const ApplicationsSummary = ({ applications }: { applications: models.Abs applications.forEach(app => health.set(getAppSetHealthStatus((app as ApplicationSet).status), (health.get(getAppSetHealthStatus((app as ApplicationSet).status)) || 0) + 1)); } - const attributes = isFromAppComponents() ? ([{ + const attributes = isInvokedFromApps() ? ([{ title: 'APPLICATIONS', value: applications.length }, @@ -69,7 +69,7 @@ export const ApplicationsSummary = ({ applications }: { applications: models.Abs - const charts = isFromAppComponents() ? ([ + const charts = isInvokedFromApps() ? ([ { title: 'Sync', data: Array.from(sync.keys()).map(key => ({ title: key, value: sync.get(key), color: syncColors.get(key as models.SyncStatusCode) })), @@ -123,7 +123,7 @@ export const ApplicationsSummary = ({ applications }: { applications: models.Abs
    {Array.from(chart.legend.keys()).map(key => (
  • - {isFromAppComponents() && chart.title === 'Health' && } + {isInvokedFromApps() && chart.title === 'Health' && } {/* {chart.title === 'Health' && } */} {chart.title === 'Sync' && } {` ${key} (${getLegendValue(key)})`} diff --git a/ui/src/app/applications/components/utils.tsx b/ui/src/app/applications/components/utils.tsx index fb311129288f4..7330312c571b6 100644 --- a/ui/src/app/applications/components/utils.tsx +++ b/ui/src/app/applications/components/utils.tsx @@ -1287,7 +1287,7 @@ export function isApp(abstractApp: appModels.AbstractApplication): abstractApp i return abstractApp.kind === "Application"; } -export function isFromAppComponents(): boolean { +export function isInvokedFromApps(): boolean { // console.log("*** ctx.history.location.pathname *** " + ctx.history.location.pathname) const isInvokedFromApp = false //ctx.history.location.pathname.includes("applicationsets") ? true : false return isInvokedFromApp @@ -1307,7 +1307,7 @@ ctxh: ContextApis & { */ export function getRootPath(): string { - return isFromAppComponents() ? '/applications' : '/applicationsets' + return isInvokedFromApps() ? '/applications' : '/applicationsets' } diff --git a/ui/src/app/shared/services/applications-service.ts b/ui/src/app/shared/services/applications-service.ts index 323932eaddb08..0b2e5c4f24b10 100644 --- a/ui/src/app/shared/services/applications-service.ts +++ b/ui/src/app/shared/services/applications-service.ts @@ -5,7 +5,7 @@ import { map, repeat, retry } from 'rxjs/operators'; import * as models from '../models'; import { isValidURL } from '../utils'; import requests from './requests'; -import { getRootPath, isFromAppComponents } from '../../applications/components/utils'; +import { getRootPath, isInvokedFromApps } from '../../applications/components/utils'; interface QueryOptions { fields: string[]; @@ -23,7 +23,7 @@ function optionsToSearch(options?: QueryOptions) { // const rootPath = !isFromAppSetComponents ? "/applications" : "/applicationsets" function getQuery(projects: string[], options?: QueryOptions): any { - if (isFromAppComponents()) { + if (isInvokedFromApps()) { return { projects, ...optionsToSearch(options) } } else { @@ -37,7 +37,7 @@ export class ApplicationsService { .get(getRootPath()) .query(getQuery(projects, options)) .then(res => { - if (isFromAppComponents()) { + if (isInvokedFromApps()) { return res.body as models.ApplicationList } else { @@ -144,7 +144,7 @@ export class ApplicationsService { return requests .put(`${getRootPath()}/${app.metadata.name}`) .query(query) - .send(isFromAppComponents() ? app as models.Application : app as models.ApplicationSet) + .send(isInvokedFromApps() ? app as models.Application : app as models.ApplicationSet) .then(res => this.parseAppFields(res.body)); } @@ -158,7 +158,7 @@ export class ApplicationsService { } return requests .post(getRootPath()) - .send(isFromAppComponents() ? app as models.Application : app as models.ApplicationSet) + .send(isInvokedFromApps() ? app as models.Application : app as models.ApplicationSet) .then(res => this.parseAppFields(res.body)); } @@ -197,7 +197,7 @@ export class ApplicationsService { search.set('fields', searchOptions.fields); search.set('selector', searchOptions.selector); search.set('appNamespace', searchOptions.appNamespace); - if (isFromAppComponents()) { + if (isInvokedFromApps()) { query?.projects?.forEach(project => search.append('projects', project)); } } @@ -512,7 +512,7 @@ export class ApplicationsService { } private parseAppFields(data: any): models.AbstractApplication { - if (isFromAppComponents()) { + if (isInvokedFromApps()) { data = deepMerge( { apiVersion: 'argoproj.io/v1alpha1', diff --git a/ui/src/app/shared/services/view-preferences-service.ts b/ui/src/app/shared/services/view-preferences-service.ts index ae7f97ece90ae..5ecb7af18e9a3 100644 --- a/ui/src/app/shared/services/view-preferences-service.ts +++ b/ui/src/app/shared/services/view-preferences-service.ts @@ -2,7 +2,7 @@ import * as deepMerge from 'deepmerge'; import {BehaviorSubject, Observable} from 'rxjs'; import {PodGroupType} from '../../applications/components/application-pod-view/pod-view'; -import {isFromAppComponents} from '../../applications/components/utils'; +import {isInvokedFromApps} from '../../applications/components/utils'; export type AppsDetailsViewType = 'tree' | 'network' | 'list' | 'pods'; @@ -173,7 +173,7 @@ const VIEW_PREFERENCES_KEY = 'view_preferences'; const minVer = 5; -const DEFAULT_PREFERENCES: ViewPreferences | AppSetViewPreferences = isFromAppComponents ? { +const DEFAULT_PREFERENCES: ViewPreferences | AppSetViewPreferences = isInvokedFromApps ? { version: 1, appDetails: { view: 'tree',