Skip to content

Commit de01cd8

Browse files
iamfaraniamfaran
committed
move all columns to config
1 parent 29c2ae2 commit de01cd8

File tree

4 files changed

+273
-103
lines changed

4 files changed

+273
-103
lines changed

‎client/packages/lowcoder/src/pages/setting/environments/components/DeployableItemsList.tsx

Lines changed: 92 additions & 82 deletions
Original file line numberDiff line numberDiff line change
@@ -40,83 +40,91 @@ function DeployableItemsList<T extends DeployableItem, S extends BaseStats>({
4040
}
4141
};
4242

43-
4443
// Handle row click for navigation
45-
// Handle row click for navigation
46-
const handleRowClick = (item: T) => {
47-
// Skip navigation if the route is just '#' (for non-navigable items)
48-
if (config.buildDetailRoute({}) === '#') return;
49-
50-
// Build the route using the config and navigate
51-
const route = config.buildDetailRoute({
52-
environmentId: environment.environmentId,
53-
itemId: item[config.idField] as string,
54-
...additionalParams
55-
});
56-
57-
history.push(route);
58-
};
59-
60-
// Generate columns based on config
61-
let columns = [...config.columns];
62-
63-
// Add managed column if enabled
64-
if (config.enableManaged) {
65-
columns.push({
66-
title: 'Managed',
67-
key: 'managed',
68-
render: (_, record: T) => (
69-
<Space>
70-
<Tag color={record.managed ? 'green' : 'default'}>
71-
{record.managed ? 'Managed' : 'Unmanaged'}
72-
</Tag>
73-
{onToggleManaged && (
74-
<Switch
75-
size="small"
76-
checked={!!record.managed}
77-
loading={refreshing}
78-
onClick={(checked, e) => {
79-
e.stopPropagation(); // Stop row click event
80-
onToggleManaged(record, checked);
81-
}}
82-
onChange={() => {}}
83-
/>
84-
)}
85-
</Space>
86-
),
44+
const handleRowClick = (item: T) => {
45+
// Skip navigation if the route is just '#' (for non-navigable items)
46+
if (config.buildDetailRoute({}) === '#') return;
47+
48+
// Build the route using the config and navigate
49+
const route = config.buildDetailRoute({
50+
environmentId: environment.environmentId,
51+
itemId: item[config.idField] as string,
52+
...additionalParams
8753
});
88-
}
54+
55+
history.push(route);
56+
};
8957

90-
// Add deploy action column if enabled
91-
if (config.deploy?.enabled) {
92-
columns.push({
93-
title: 'Actions',
94-
key: 'actions',
95-
render: (_, record: T) => (
96-
<Space>
97-
<Tooltip title={`Deploy this ${config.singularLabel.toLowerCase()} to another environment`}>
98-
<Button
99-
icon={<CloudUploadOutlined />}
100-
onClick={(e) => {
101-
e.stopPropagation(); // Prevent row click navigation
102-
openDeployModal(record, config, environment);
103-
}}
104-
type="primary"
105-
ghost
106-
>
107-
Deploy
108-
</Button>
109-
</Tooltip>
110-
</Space>
111-
),
112-
});
113-
}
58+
// Determine columns - Use new getColumns method if available, fall back to old approach
59+
const columns = config.getColumns ?
60+
config.getColumns({
61+
environment,
62+
refreshing,
63+
onToggleManaged,
64+
openDeployModal,
65+
additionalParams
66+
}) :
67+
generateLegacyColumns();
68+
69+
// Legacy column generation for backward compatibility
70+
function generateLegacyColumns() {
71+
let legacyColumns = [...config.columns];
72+
73+
// Add managed column if enabled
74+
if (config.enableManaged) {
75+
legacyColumns.push({
76+
title: 'Managed',
77+
key: 'managed',
78+
render: (_, record: T) => (
79+
<Space>
80+
<Tag color={record.managed ? 'green' : 'default'}>
81+
{record.managed ? 'Managed' : 'Unmanaged'}
82+
</Tag>
83+
{onToggleManaged && (
84+
<Switch
85+
size="small"
86+
checked={!!record.managed}
87+
loading={refreshing}
88+
onClick={(checked, e) => {
89+
e.stopPropagation(); // Stop row click event
90+
onToggleManaged(record, checked);
91+
}}
92+
onChange={() => {}}
93+
/>
94+
)}
95+
</Space>
96+
),
97+
});
98+
}
11499

115-
const hasAudit = config.audit?.enabled;
100+
// Add deploy action column if enabled
101+
if (config.deploy?.enabled) {
102+
legacyColumns.push({
103+
title: 'Actions',
104+
key: 'actions',
105+
render: (_, record: T) => (
106+
<Space>
107+
<Tooltip title={`Deploy this ${config.singularLabel.toLowerCase()} to another environment`}>
108+
<Button
109+
icon={<CloudUploadOutlined />}
110+
onClick={(e) => {
111+
e.stopPropagation(); // Prevent row click navigation
112+
openDeployModal(record, config, environment);
113+
}}
114+
type="primary"
115+
ghost
116+
>
117+
Deploy
118+
</Button>
119+
</Tooltip>
120+
</Space>
121+
),
122+
});
123+
}
116124

117-
// Add audit column if enabled - SEPARATE CONDITION
125+
// Add audit column if enabled
118126
if (config.audit?.enabled) {
119-
columns.push({
127+
legacyColumns.push({
120128
title: 'Audit',
121129
key: 'audit',
122130
render: (_, record: T) => (
@@ -131,6 +139,9 @@ const handleRowClick = (item: T) => {
131139
),
132140
});
133141
}
142+
143+
return legacyColumns;
144+
}
134145

135146
if (loading) {
136147
return (
@@ -151,19 +162,18 @@ const handleRowClick = (item: T) => {
151162

152163
const hasNavigation = config.buildDetailRoute({}) !== '#';
153164

154-
155165
return (
156166
<Table
157-
columns={columns}
158-
dataSource={items}
159-
rowKey={config.idField}
160-
pagination={{ pageSize: 10 }}
161-
size="middle"
162-
onRow={(record) => ({
163-
onClick: hasNavigation ? () => handleRowClick(record) : undefined,
164-
style: hasNavigation ? { cursor: 'pointer' } : undefined,
165-
})}
166-
/>
167+
columns={columns}
168+
dataSource={items}
169+
rowKey={config.idField}
170+
pagination={{ pageSize: 10 }}
171+
size="middle"
172+
onRow={(record) => ({
173+
onClick: hasNavigation ? () => handleRowClick(record) : undefined,
174+
style: hasNavigation ? { cursor: 'pointer' } : undefined,
175+
})}
176+
/>
167177
);
168178
}
169179

‎client/packages/lowcoder/src/pages/setting/environments/config/workspace.config.tsx

Lines changed: 42 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -6,6 +6,15 @@ import { Workspace, WorkspaceStats, DeployableItemConfig } from '../types/deploy
66
import { buildEnvironmentWorkspaceId } from '@lowcoder-ee/constants/routesURL';
77
import { getMergedEnvironmentWorkspaces } from '../services/workspace.service';
88
import { connectManagedWorkspace, unconnectManagedWorkspace } from '../services/enterprise.service';
9+
import {
10+
createNameColumn,
11+
createIdColumn,
12+
createRoleColumn,
13+
createDateColumn,
14+
createStatusColumn,
15+
createManagedColumn,
16+
createAuditColumn
17+
} from '../utils/columnFactories';
918

1019
export const workspaceConfig: DeployableItemConfig<Workspace, WorkspaceStats> = {
1120
// Basic info
@@ -47,7 +56,7 @@ export const workspaceConfig: DeployableItemConfig<Workspace, WorkspaceStats> =
4756
};
4857
},
4958

50-
// Table configuration
59+
// Original columns for backward compatibility
5160
columns: [
5261
{
5362
title: 'Name',
@@ -87,10 +96,29 @@ export const workspaceConfig: DeployableItemConfig<Workspace, WorkspaceStats> =
8796
}
8897
],
8998

90-
// Deployment options
99+
// New getColumns method
100+
getColumns: ({ environment, refreshing, onToggleManaged, additionalParams }) => {
101+
const columns = [
102+
createNameColumn<Workspace>(),
103+
createIdColumn<Workspace>(),
104+
createRoleColumn<Workspace>(),
105+
createDateColumn<Workspace>('creationDate', 'Creation Date'),
106+
createStatusColumn<Workspace>()
107+
];
108+
109+
110+
// Add audit column if enabled
111+
if (workspaceConfig.audit?.enabled) {
112+
columns.push(createAuditColumn(workspaceConfig, environment, additionalParams));
113+
}
114+
115+
return columns;
116+
},
117+
118+
// Enable managed functionality
91119
enableManaged: true,
92120

93-
// Service functions
121+
// Fetch function
94122
fetchItems: async ({ environment }) => {
95123
const result = await getMergedEnvironmentWorkspaces(
96124
environment.environmentId,
@@ -99,16 +127,8 @@ export const workspaceConfig: DeployableItemConfig<Workspace, WorkspaceStats> =
99127
);
100128
return result.workspaces;
101129
},
102-
103-
audit: {
104-
enabled: true,
105-
icon: <AuditOutlined />,
106-
label: 'Audit',
107-
tooltip: 'View audit logs for this workspace',
108-
getAuditUrl: (item, environment) =>
109-
`/setting/audit?environmentId=${environment.environmentId}&orgId=${item.id}&pageSize=100&pageNum=1`
110-
},
111130

131+
// Toggle managed status
112132
toggleManaged: async ({ item, checked, environment }) => {
113133
try {
114134
if (checked) {
@@ -121,5 +141,15 @@ export const workspaceConfig: DeployableItemConfig<Workspace, WorkspaceStats> =
121141
console.error('Error toggling managed status:', error);
122142
return false;
123143
}
144+
},
145+
146+
// Audit configuration
147+
audit: {
148+
enabled: true,
149+
icon: <AuditOutlined />,
150+
label: 'Audit',
151+
tooltip: 'View audit logs for this workspace',
152+
getAuditUrl: (item, environment) =>
153+
`/setting/audit?environmentId=${environment.environmentId}&orgId=${item.id}&pageSize=100&pageNum=1`
124154
}
125155
};

‎client/packages/lowcoder/src/pages/setting/environments/types/deployable-item.types.ts

Lines changed: 16 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,8 @@
11
// types/deployable-item.types.ts
22
import { ReactNode } from 'react';
33
import { Environment } from './environment.types';
4+
import { ColumnType } from 'antd/lib/table';
5+
46

57
// Base interface for all deployable items
68
export interface AuditConfig {
@@ -29,12 +31,13 @@ export interface Workspace extends DeployableItem {
2931
}
3032

3133
// Stats interface that can be extended for specific item types
34+
// Base interface for stats
3235
export interface BaseStats {
3336
total: number;
3437
managed: number;
3538
unmanaged: number;
39+
[key: string]: any;
3640
}
37-
3841
export interface WorkspaceStats extends BaseStats {}
3942

4043

@@ -69,18 +72,22 @@ export interface DeployableItemConfig<T extends DeployableItem, S extends BaseSt
6972
renderStats: (stats: S) => ReactNode;
7073
calculateStats: (items: T[]) => S;
7174

75+
// Original columns (will be deprecated)
76+
columns: ColumnType<T>[];
77+
78+
// New method to generate columns
79+
getColumns?: (params: {
80+
environment: Environment;
81+
refreshing: boolean;
82+
onToggleManaged?: (item: T, checked: boolean) => Promise<boolean>;
83+
openDeployModal?: (item: T, config: DeployableItemConfig<T, S>, environment: Environment) => void;
84+
additionalParams?: Record<string, any>;
85+
}) => ColumnType<T>[];
86+
7287
// Add audit configuration
7388
audit?: AuditConfig;
7489

7590

76-
// Table configuration
77-
columns: Array<{
78-
title: string;
79-
dataIndex?: string;
80-
key: string;
81-
render?: (value: any, record: T) => ReactNode;
82-
ellipsis?: boolean;
83-
}>;
8491

8592
// Deployable configuration
8693
enableManaged: boolean;

0 commit comments

Comments
 (0)