Skip to content

Commit 3716760

Browse files
committed
flux: Use resource classes and their useGet and useList methods
1 parent 6b85e1e commit 3716760

File tree

14 files changed

+209
-458
lines changed

14 files changed

+209
-458
lines changed

flux/src/actions/index.tsx

Lines changed: 7 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,7 @@ import { ActionButton, ConfirmDialog } from '@kinvolk/headlamp-plugin/lib/compon
22
import { KubeObject } from '@kinvolk/headlamp-plugin/lib/lib/k8s/cluster';
33
import { useSnackbar } from 'notistack';
44
import React from 'react';
5+
import { useSource } from '../sources/Source';
56

67
function ForceReconciliationAction(props) {
78
const { enqueueSnackbar } = useSnackbar();
@@ -215,16 +216,20 @@ function SyncAction(props) {
215216
}
216217

217218
function SyncWithSourceAction(props) {
218-
const { resource, source } = props;
219+
const { resource } = props;
219220
const { enqueueSnackbar } = useSnackbar();
221+
const source = useSource(resource);
222+
223+
if (!source) return null;
224+
220225
return (
221226
<ActionButton
222227
description="Sync with source"
223228
onClick={() => {
224229
enqueueSnackbar(`Starting sync for source ${source.metadata.name}`, { variant: 'info' });
225230
const date = new Date().toISOString();
226231
syncRequest(source, enqueueSnackbar, date).then(() => {
227-
const get = source.constructor.apiEndpoint.get;
232+
const get = (source.constructor as any).apiEndpoint.get;
228233
let isSourceSynced = false;
229234
get(source.metadata.namespace, source.metadata.name, newSource => {
230235
if (newSource.status.lastHandledReconcileAt === date && !isSourceSynced) {

flux/src/helm-releases/HelmReleaseList.tsx

Lines changed: 3 additions & 25 deletions
Original file line numberDiff line numberDiff line change
@@ -1,36 +1,14 @@
11
import { SectionBox, SectionFilterHeader } from '@kinvolk/headlamp-plugin/lib/components/common';
2-
import { makeCustomResourceClass } from '@kinvolk/headlamp-plugin/lib/lib/k8s/crd';
32
import { useFilterFunc } from '@kinvolk/headlamp-plugin/lib/Utils';
43
import React from 'react';
54
import { NotSupported } from '../checkflux';
5+
import { HelmRelease } from '../common/Resources';
66
import Table from '../common/Table';
77
import { NameLink } from '../helpers';
88

99
export function HelmReleases() {
10-
return <HelmReleasesList />;
11-
}
12-
13-
export function helmReleaseClass() {
14-
const helmreleaseGroup = 'helm.toolkit.fluxcd.io';
15-
const helmreleaseVersion = 'v2';
16-
17-
return makeCustomResourceClass({
18-
apiInfo: [
19-
{ group: helmreleaseGroup, version: helmreleaseVersion },
20-
{ group: helmreleaseGroup, version: 'v2beta1' },
21-
],
22-
isNamespaced: true,
23-
singularName: 'HelmRelease',
24-
pluralName: 'helmreleases',
25-
});
26-
}
27-
28-
function HelmReleasesList() {
2910
const filterFunction = useFilterFunc();
30-
const [resources, setResources] = React.useState(null);
31-
const [error, setError] = React.useState(null);
32-
33-
helmReleaseClass().useApiList(setResources, setError);
11+
const [resources, error] = HelmRelease.useList();
3412

3513
if (error?.status === 404) {
3614
return <NotSupported typeName="Helm Releases" />;
@@ -43,7 +21,7 @@ function HelmReleasesList() {
4321
// @ts-ignore -- TODO Update the sorting param
4422
defaultSortingColumn={2}
4523
columns={[
46-
NameLink(helmReleaseClass()),
24+
NameLink(HelmRelease),
4725
'namespace',
4826
'status',
4927
'source',

flux/src/helm-releases/HelmReleaseSingle.tsx

Lines changed: 4 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -17,10 +17,9 @@ import {
1717
SyncWithSourceAction,
1818
} from '../actions/index';
1919
import RemainingTimeDisplay from '../common/RemainingTimeDisplay';
20+
import { HelmRelease } from '../common/Resources';
2021
import StatusLabel from '../common/StatusLabel';
2122
import { getSourceNameAndPluralKind, ObjectEvents } from '../helpers/index';
22-
import { GetSource } from '../sources/Source';
23-
import { helmReleaseClass } from './HelmReleaseList';
2423
import { HelmInventory } from './Inventory';
2524

2625
export function FluxHelmReleaseDetailView(props: { name?: string; namespace?: string }) {
@@ -30,17 +29,14 @@ export function FluxHelmReleaseDetailView(props: { name?: string; namespace?: st
3029
return (
3130
<>
3231
<CustomResourceDetails name={name} namespace={namespace} />
33-
<ObjectEvents name={name} namespace={namespace} resourceClass={helmReleaseClass()} />
32+
<ObjectEvents name={name} namespace={namespace} resourceClass={HelmRelease} />
3433
</>
3534
);
3635
}
3736

3837
function CustomResourceDetails(props) {
3938
const { name, namespace } = props;
40-
const [cr, setCr] = React.useState(null);
41-
const [source, setSource] = React.useState(null);
42-
43-
helmReleaseClass().useApiGet(setCr, name, namespace);
39+
const [cr] = HelmRelease.useGet(name, namespace);
4440

4541
function prepareExtraInfo(cr) {
4642
if (!cr) {
@@ -131,7 +127,7 @@ function CustomResourceDetails(props) {
131127
}
132128

133129
const actions = [];
134-
actions.push(<SyncWithSourceAction resource={cr} source={source} />);
130+
actions.push(<SyncWithSourceAction resource={cr} />);
135131
actions.push(<SyncWithoutSourceAction resource={cr} />);
136132
actions.push(<SuspendAction resource={cr} />);
137133
actions.push(<ResumeAction resource={cr} />);
@@ -143,7 +139,6 @@ function CustomResourceDetails(props) {
143139

144140
return (
145141
<>
146-
{cr && <GetSource item={cr} setSource={setSource} />}
147142
{cr && (
148143
<MainInfoSection
149144
resource={cr}

flux/src/helpers/index.tsx

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -75,18 +75,21 @@ export function ObjectEventsRenderer(props: { events?: Event[] }) {
7575
columns={[
7676
{
7777
header: 'Type',
78+
gridTemplate: 'min-content',
7879
accessorFn: item => {
7980
return item.type;
8081
},
8182
},
8283
{
8384
header: 'Reason',
85+
gridTemplate: 'min-content',
8486
accessorFn: item => {
8587
return item.reason;
8688
},
8789
},
8890
{
8991
header: 'From',
92+
gridTemplate: 'min-content',
9093
accessorFn: item => {
9194
return item.source.component;
9295
},

flux/src/image-automation/ImageAutomationList.tsx

Lines changed: 13 additions & 60 deletions
Original file line numberDiff line numberDiff line change
@@ -4,67 +4,28 @@ import {
44
SectionFilterHeader,
55
ShowHideLabel,
66
} from '@kinvolk/headlamp-plugin/lib/components/common';
7-
import { KubeObjectClass } from '@kinvolk/headlamp-plugin/lib/lib/k8s/cluster';
8-
import { makeCustomResourceClass } from '@kinvolk/headlamp-plugin/lib/lib/k8s/crd';
97
import { useFilterFunc } from '@kinvolk/headlamp-plugin/lib/Utils';
108
import React from 'react';
119
import YAML from 'yaml';
1210
import { NotSupported } from '../checkflux';
1311
import SourceLink from '../common/Link';
12+
import { ImagePolicy, ImageRepository, ImageUpdateAutomation } from '../common/Resources';
1413
import Table from '../common/Table';
1514
import { NameLink } from '../helpers';
1615

17-
const imageGroup = 'image.toolkit.fluxcd.io';
18-
const imageVersion = 'v1beta2';
19-
export const IMAGE_AUTOMATION_BETA_VERSION = 'v1beta2';
20-
21-
export function imageRepositoriesClass() {
22-
return makeCustomResourceClass({
23-
apiInfo: [{ group: imageGroup, version: imageVersion }],
24-
isNamespaced: true,
25-
singularName: 'ImageRepository',
26-
pluralName: 'imagerepositories',
27-
});
28-
}
29-
30-
export function imagePolicyClass() {
31-
return makeCustomResourceClass({
32-
apiInfo: [{ group: imageGroup, version: imageVersion }],
33-
isNamespaced: true,
34-
singularName: 'ImagePolicy',
35-
pluralName: 'imagepolicies',
36-
});
37-
}
38-
39-
export function imageUpdateAutomationClass(): KubeObjectClass {
40-
return makeCustomResourceClass({
41-
apiInfo: [
42-
{ group: imageGroup, version: imageVersion },
43-
{ group: imageGroup, version: 'v1beta1' },
44-
],
45-
isNamespaced: true,
46-
singularName: 'ImageUpdateAutomation',
47-
pluralName: 'imageupdateautomations',
48-
});
49-
}
50-
5116
export function ImageAutomation() {
5217
return (
5318
<>
54-
<ImageRepositoryList resourceClass={imageRepositoriesClass()} />
55-
<ImagePolicyList resourceClass={imagePolicyClass()} />
56-
<ImageUpdateAutomationList resourceClass={imageUpdateAutomationClass()} />
19+
<ImageRepositoryList />
20+
<ImagePolicyList />
21+
<ImageUpdateAutomationList />
5722
</>
5823
);
5924
}
6025

61-
function ImageUpdateAutomationList(props: { resourceClass: KubeObjectClass }) {
62-
const { resourceClass } = props;
26+
function ImageUpdateAutomationList() {
6327
const filterFunction = useFilterFunc();
64-
const [resources, setResources] = React.useState(null);
65-
const [error, setError] = React.useState(null);
66-
67-
resourceClass.useApiList(setResources, setError);
28+
const [resources, error] = ImageUpdateAutomation.useList();
6829

6930
if (error?.status === 404) {
7031
return <NotSupported typeName="Image Update Automations" />;
@@ -75,7 +36,7 @@ function ImageUpdateAutomationList(props: { resourceClass: KubeObjectClass }) {
7536
<Table
7637
data={resources}
7738
columns={[
78-
NameLink(resourceClass),
39+
NameLink(ImageUpdateAutomation),
7940
'namespace',
8041
'status',
8142
{
@@ -111,13 +72,9 @@ function ImageUpdateAutomationList(props: { resourceClass: KubeObjectClass }) {
11172
);
11273
}
11374

114-
function ImagePolicyList(props: { resourceClass: KubeObjectClass }) {
115-
const { resourceClass } = props;
75+
function ImagePolicyList() {
11676
const filterFunction = useFilterFunc();
117-
const [resources, setResources] = React.useState(null);
118-
const [error, setError] = React.useState(null);
119-
120-
resourceClass.useApiList(setResources, setError);
77+
const [resources, error] = ImagePolicy.useList();
12178

12279
if (error?.status === 404) {
12380
return <NotSupported typeName="Image Update Policies" />;
@@ -128,7 +85,7 @@ function ImagePolicyList(props: { resourceClass: KubeObjectClass }) {
12885
<Table
12986
data={resources}
13087
columns={[
131-
NameLink(resourceClass),
88+
NameLink(ImagePolicy),
13289
'namespace',
13390
'status',
13491
{
@@ -148,13 +105,9 @@ function ImagePolicyList(props: { resourceClass: KubeObjectClass }) {
148105
);
149106
}
150107

151-
function ImageRepositoryList(props: { resourceClass: KubeObjectClass }) {
152-
const { resourceClass } = props;
108+
function ImageRepositoryList() {
153109
const filterFunction = useFilterFunc();
154-
const [resources, setResources] = React.useState(null);
155-
const [error, setError] = React.useState(null);
156-
157-
resourceClass.useApiList(setResources, setError);
110+
const [resources, error] = ImageRepository.useList();
158111

159112
if (error?.status === 404) {
160113
return <NotSupported typeName="Image Repositories" />;
@@ -165,7 +118,7 @@ function ImageRepositoryList(props: { resourceClass: KubeObjectClass }) {
165118
<Table
166119
data={resources}
167120
columns={[
168-
NameLink(resourceClass),
121+
NameLink(ImageRepository),
169122
'namespace',
170123
'status',
171124
{

flux/src/image-automation/ImageAutomationSingle.tsx

Lines changed: 7 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -13,13 +13,9 @@ import { ResumeAction, SuspendAction, SyncAction } from '../actions/index';
1313
import Flux404 from '../checkflux';
1414
import Link from '../common/Link';
1515
import RemainingTimeDisplay from '../common/RemainingTimeDisplay';
16+
import { ImagePolicy, ImageRepository, ImageUpdateAutomation } from '../common/Resources';
1617
import StatusLabel from '../common/StatusLabel';
1718
import { ObjectEvents } from '../helpers/index';
18-
import {
19-
imagePolicyClass,
20-
imageRepositoriesClass,
21-
imageUpdateAutomationClass,
22-
} from './ImageAutomationList';
2319

2420
export function FluxImageAutomationDetailView() {
2521
const { pluralName, namespace, name } = useParams<{
@@ -31,11 +27,11 @@ export function FluxImageAutomationDetailView() {
3127
const resourceClass = (() => {
3228
switch (pluralName) {
3329
case 'imagerepositories':
34-
return imageRepositoriesClass();
30+
return ImageRepository;
3531
case 'imagepolicies':
36-
return imagePolicyClass();
32+
return ImagePolicy;
3733
case 'imageupdateautomations':
38-
return imageUpdateAutomationClass();
34+
return ImageUpdateAutomation;
3935
default:
4036
return null;
4137
}
@@ -173,7 +169,7 @@ function CustomResourceDetails(props) {
173169
resource={resource}
174170
extraInfo={prepareExtraInfo()}
175171
actions={
176-
resourceClass.pluralName === imagePolicyClass().pluralName
172+
resourceClass.pluralName === ImagePolicy.pluralName
177173
? []
178174
: [
179175
<SyncAction resource={resource} />,
@@ -182,10 +178,10 @@ function CustomResourceDetails(props) {
182178
]
183179
}
184180
/>
185-
{resourceClass.pluralName === imageRepositoriesClass().pluralName && (
181+
{resourceClass.pluralName === ImageRepository.pluralName && (
186182
<TagList resource={resource?.jsonData} />
187183
)}
188-
{resourceClass.pluralName === imageUpdateAutomationClass().pluralName && (
184+
{resourceClass.pluralName === ImageUpdateAutomation.pluralName && (
189185
<Policies resource={resource?.jsonData} />
190186
)}
191187
<SectionBox title="Conditions">

flux/src/kustomizations/KustomizationList.tsx

Lines changed: 3 additions & 26 deletions
Original file line numberDiff line numberDiff line change
@@ -1,37 +1,14 @@
11
import { SectionBox, SectionFilterHeader } from '@kinvolk/headlamp-plugin/lib/components/common';
2-
import { makeCustomResourceClass } from '@kinvolk/headlamp-plugin/lib/lib/k8s/crd';
32
import { useFilterFunc } from '@kinvolk/headlamp-plugin/lib/Utils';
43
import React from 'react';
54
import { NotSupported } from '../checkflux';
5+
import { Kustomization } from '../common/Resources';
66
import Table from '../common/Table';
77
import { NameLink } from '../helpers';
88

99
export function Kustomizations() {
10-
return (
11-
<div>
12-
<KustomizationList />
13-
</div>
14-
);
15-
}
16-
17-
export function kustomizationClass() {
18-
const kustomizationGroup = 'kustomize.toolkit.fluxcd.io';
19-
const kustomizationVersion = 'v1';
20-
21-
return makeCustomResourceClass({
22-
apiInfo: [{ group: kustomizationGroup, version: kustomizationVersion }],
23-
isNamespaced: true,
24-
singularName: 'Kustomization',
25-
pluralName: 'kustomizations',
26-
});
27-
}
28-
29-
function KustomizationList() {
3010
const filterFunction = useFilterFunc();
31-
const [resources, setResources] = React.useState(null);
32-
const [error, setError] = React.useState(null);
33-
34-
kustomizationClass().useApiList(setResources, setError);
11+
const [resources, error] = Kustomization.useList();
3512

3613
if (error?.status === 404) {
3714
return <NotSupported typeName="Kustomizations" />;
@@ -44,7 +21,7 @@ function KustomizationList() {
4421
// @ts-ignore -- TODO Update the sorting param
4522
defaultSortingColumn={2}
4623
columns={[
47-
NameLink(kustomizationClass()),
24+
NameLink(Kustomization),
4825
'namespace',
4926
'status',
5027
'source',

0 commit comments

Comments
 (0)