Skip to content

Commit 9f2c181

Browse files
committed
Add useWorkspace hook
1 parent 46911b0 commit 9f2c181

File tree

2 files changed

+107
-50
lines changed

2 files changed

+107
-50
lines changed

client/packages/lowcoder/src/pages/setting/environments/WorkspaceDetail.tsx

Lines changed: 42 additions & 50 deletions
Original file line numberDiff line numberDiff line change
@@ -29,71 +29,63 @@ import {
2929
SyncOutlined,
3030
ArrowLeftOutlined
3131
} from "@ant-design/icons";
32-
import { getEnvironmentById } from './services/environments.service';
3332
import AppsList from './components/AppsList';
34-
import { Workspace } from './types/workspace.types';
35-
import { Environment } from './types/environment.types';
36-
import { App } from './types/app.types';
33+
import { useEnvironmentContext } from "./context/EnvironmentContext";
34+
import { useWorkspace } from "./hooks/useWorkspace";
35+
36+
3737

3838
const { Title, Text } = Typography;
3939
const { TabPane } = Tabs;
4040

4141

4242
const WorkspaceDetail: React.FC = () => {
43+
4344
// Get parameters from URL
44-
const { environmentId, workspaceId } = useParams<{
45-
environmentId: string;
45+
const { environmentId,workspaceId } = useParams<{
4646
workspaceId: string;
47+
environmentId: string;
4748
}>();
48-
4949
const {
5050
environment,
51+
loading: envLoading,
52+
error: envError,
53+
refresh: refreshEnvironment,
54+
} = useEnvironmentContext();
55+
56+
const {
5157
workspace,
52-
apps,
53-
appsLoading,
54-
appsError,
55-
refreshApps,
56-
appStats,
57-
dataSources,
58-
dataSourcesLoading,
59-
dataSourcesError,
60-
refreshDataSources,
61-
dataSourceStats,
62-
isLoading,
63-
hasError
64-
} = useWorkspaceDetail(environmentId, workspaceId);
58+
loading: workspaceLoading,
59+
error: workspaceError,
60+
refresh: refreshWorkspace
61+
} = useWorkspace(environment, workspaceId);
62+
63+
6564

66-
// Handle loading/error states
67-
if (isLoading) {
68-
return <Spin />;
65+
if (envLoading || workspaceLoading) {
66+
return (
67+
<div style={{ display: 'flex', justifyContent: 'center', alignItems: 'center', height: '100%', padding: '50px' }}>
68+
<Spin size="large" tip="Loading workspace details..." />
69+
</div>
70+
);
71+
}
72+
73+
if (envError || workspaceError || !environment || !workspace) {
74+
return (
75+
<Alert
76+
message="Error loading workspace details"
77+
description={envError || workspaceError || "Workspace not found."}
78+
type="error"
79+
showIcon
80+
style={{ margin: '24px' }}
81+
action={
82+
<Button type="primary" onClick={() => history.push(`/home/settings/environments/${environmentId}`)}>
83+
Back to Environment
84+
</Button>
85+
}
86+
/>
87+
);
6988
}
70-
71-
// Handle loading/error states
72-
if (isLoading) {
73-
return (
74-
<div style={{ display: 'flex', justifyContent: 'center', alignItems: 'center', height: '100%', padding: '50px' }}>
75-
<Spin size="large" tip="Loading workspace details..." />
76-
</div>
77-
);
78-
}
79-
80-
// Handle error state
81-
if (hasError || !environment || !workspace) {
82-
return (
83-
<Alert
84-
message="Error loading workspace details"
85-
description="Could not load the workspace or environment data. Please try again."
86-
type="error"
87-
showIcon
88-
style={{ margin: '24px' }}
89-
action={
90-
<Button type="primary" onClick={() => history.push(`/home/settings/environments/${environmentId}`)}>
91-
Back to Environment
92-
</Button>
93-
}
94-
/>
95-
);
96-
}
9789

9890
return (
9991
<div className="workspace-detail-container" style={{ padding: '24px' }}>
Lines changed: 65 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,65 @@
1+
import { useState, useEffect, useCallback } from "react";
2+
import { useHistory } from "react-router-dom";
3+
import { fetchWorkspaceById } from "../services/environments.service";
4+
import { Environment } from "../types/environment.types";
5+
import { Workspace } from "../types/workspace.types";
6+
7+
export const useWorkspace = (
8+
environment: Environment | null,
9+
workspaceId: string
10+
) => {
11+
const [workspace, setWorkspace] = useState<Workspace | null>(null);
12+
const [loading, setLoading] = useState<boolean>(true);
13+
const [error, setError] = useState<string | null>(null);
14+
const history = useHistory();
15+
16+
const fetchWorkspace = useCallback(async () => {
17+
if (!environment) return;
18+
19+
setLoading(true);
20+
setError(null);
21+
22+
try {
23+
const { environmentId, environmentApikey, environmentApiServiceUrl } = environment;
24+
25+
if (!environmentApikey || !environmentApiServiceUrl) {
26+
setError("Missing API key or service URL for this environment.");
27+
setLoading(false);
28+
return;
29+
}
30+
31+
const data = await fetchWorkspaceById(
32+
environmentId,
33+
workspaceId,
34+
environmentApikey,
35+
environmentApiServiceUrl
36+
);
37+
38+
setWorkspace(data);
39+
} catch (err) {
40+
setError(
41+
err instanceof Error
42+
? err.message
43+
: "Failed to fetch workspace details"
44+
);
45+
46+
// Optional: redirect to environment detail if workspace fetch fails
47+
// history.push(`/home/settings/environments/${environment.environmentId}`);
48+
} finally {
49+
setLoading(false);
50+
}
51+
}, [environment, workspaceId, history]);
52+
53+
useEffect(() => {
54+
if (environment) {
55+
fetchWorkspace();
56+
}
57+
}, [environment, fetchWorkspace]);
58+
59+
return {
60+
workspace,
61+
loading,
62+
error,
63+
refresh: fetchWorkspace,
64+
};
65+
};

0 commit comments

Comments
 (0)