1
0
mirror of https://github.com/lensapp/lens.git synced 2025-05-20 05:10:56 +00:00

Configurable columns in Apps section

Signed-off-by: Alex Andreev <alex.andreev.email@gmail.com>
This commit is contained in:
Alex Andreev 2021-01-27 10:56:27 +03:00
parent 0b356191ab
commit e55bce8d4d
2 changed files with 35 additions and 26 deletions

View File

@ -11,8 +11,11 @@ import { navigation } from "../../navigation";
import { ItemListLayout } from "../item-object-list/item-list-layout";
import { SearchInputUrl } from "../input";
enum sortBy {
enum columnId {
name = "name",
description = "description",
version = "version",
appVersion = "app-version",
repo = "repo",
}
@ -53,13 +56,15 @@ export class HelmCharts extends Component<Props> {
return (
<>
<ItemListLayout
isConfigurable
tableId="helm_charts"
className="HelmCharts"
store={helmChartStore}
isClusterScoped={true}
isSelectable={false}
sortingCallbacks={{
[sortBy.name]: (chart: HelmChart) => chart.getName(),
[sortBy.repo]: (chart: HelmChart) => chart.getRepository(),
[columnId.name]: (chart: HelmChart) => chart.getName(),
[columnId.repo]: (chart: HelmChart) => chart.getRepository(),
}}
searchFilters={[
(chart: HelmChart) => chart.getName(),
@ -74,13 +79,12 @@ export class HelmCharts extends Component<Props> {
<SearchInputUrl placeholder={`Search Helm Charts`} />
)}
renderTableHeader={[
{ className: "icon" },
{ title: "Name", className: "name", sortBy: sortBy.name },
{ title: "Description", className: "description" },
{ title: "Version", className: "version" },
{ title: "App Version", className: "app-version" },
{ title: "Repository", className: "repository", sortBy: sortBy.repo },
{ className: "icon", showWithColumn: columnId.name },
{ title: "Name", className: "name", sortBy: columnId.name, id: columnId.name },
{ title: "Description", className: "description", id: columnId.description },
{ title: "Version", className: "version", id: columnId.version },
{ title: "App Version", className: "app-version", id: columnId.appVersion },
{ title: "Repository", className: "repository", sortBy: columnId.repo, id: columnId.repo },
]}
renderTableContents={(chart: HelmChart) => [
<figure key="image">
@ -93,7 +97,8 @@ export class HelmCharts extends Component<Props> {
chart.getDescription(),
chart.getVersion(),
chart.getAppVersion(),
{ title: chart.getRepository(), className: chart.getRepository().toLowerCase() }
{ title: chart.getRepository(), className: chart.getRepository().toLowerCase() },
{ className: "menu" }
]}
detailsItem={this.selectedChart}
onDetails={this.showDetails}

View File

@ -14,11 +14,13 @@ import { ItemListLayout } from "../item-object-list/item-list-layout";
import { HelmReleaseMenu } from "./release-menu";
import { secretsStore } from "../+config-secrets/secrets.store";
enum sortBy {
enum columnId {
name = "name",
namespace = "namespace",
revision = "revision",
chart = "chart",
version = "version",
appVersion = "app-version",
status = "status",
updated = "update"
}
@ -81,16 +83,18 @@ export class HelmReleases extends Component<Props> {
return (
<>
<ItemListLayout
isConfigurable
tableId="helm_releases"
className="HelmReleases"
store={releaseStore}
dependentStores={[secretsStore]}
sortingCallbacks={{
[sortBy.name]: (release: HelmRelease) => release.getName(),
[sortBy.namespace]: (release: HelmRelease) => release.getNs(),
[sortBy.revision]: (release: HelmRelease) => release.getRevision(),
[sortBy.chart]: (release: HelmRelease) => release.getChart(),
[sortBy.status]: (release: HelmRelease) => release.getStatus(),
[sortBy.updated]: (release: HelmRelease) => release.getUpdated(false, false),
[columnId.name]: (release: HelmRelease) => release.getName(),
[columnId.namespace]: (release: HelmRelease) => release.getNs(),
[columnId.revision]: (release: HelmRelease) => release.getRevision(),
[columnId.chart]: (release: HelmRelease) => release.getChart(),
[columnId.status]: (release: HelmRelease) => release.getStatus(),
[columnId.updated]: (release: HelmRelease) => release.getUpdated(false, false),
}}
searchFilters={[
(release: HelmRelease) => release.getName(),
@ -101,14 +105,14 @@ export class HelmReleases extends Component<Props> {
]}
renderHeaderTitle="Releases"
renderTableHeader={[
{ title: "Name", className: "name", sortBy: sortBy.name },
{ title: "Namespace", className: "namespace", sortBy: sortBy.namespace },
{ title: "Chart", className: "chart", sortBy: sortBy.chart },
{ title: "Revision", className: "revision", sortBy: sortBy.revision },
{ title: "Version", className: "version" },
{ title: "App Version", className: "app-version" },
{ title: "Status", className: "status", sortBy: sortBy.status },
{ title: "Updated", className: "updated", sortBy: sortBy.updated },
{ title: "Name", className: "name", sortBy: columnId.name, id: columnId.name },
{ title: "Namespace", className: "namespace", sortBy: columnId.namespace, id: columnId.namespace },
{ title: "Chart", className: "chart", sortBy: columnId.chart, id: columnId.chart },
{ title: "Revision", className: "revision", sortBy: columnId.revision, id: columnId.revision },
{ title: "Version", className: "version", id: columnId.version },
{ title: "App Version", className: "app-version", id: columnId.appVersion },
{ title: "Status", className: "status", sortBy: columnId.status, id: columnId.status },
{ title: "Updated", className: "updated", sortBy: columnId.updated, id: columnId.updated },
]}
renderTableContents={(release: HelmRelease) => {
const version = release.getVersion();