1- import React , { useState } from "react" ;
1+ import React , { useState , useEffect } from "react" ;
22import {
33Spin ,
44Typography ,
@@ -9,17 +9,23 @@ import {
99Menu ,
1010Button ,
1111Tag ,
12+ Result ,
1213} from "antd" ;
1314import {
1415LinkOutlined ,
1516HomeOutlined ,
1617AppstoreOutlined ,
1718UsergroupAddOutlined ,
1819EditOutlined ,
20+ CheckCircleOutlined ,
21+ CloseCircleOutlined ,
22+ ExclamationCircleOutlined ,
23+ SyncOutlined ,
1924} from "@ant-design/icons" ;
2025
2126import { useSingleEnvironmentContext } from "./context/SingleEnvironmentContext" ;
2227import EditEnvironmentModal from "./components/EditEnvironmentModal" ;
28+ import UnlicensedEnvironmentView from "./components/UnlicensedEnvironmentView" ;
2329import { Environment } from "./types/environment.types" ;
2430import history from "@lowcoder-ee/util/history" ;
2531import WorkspacesTab from "./components/WorkspacesTab" ;
@@ -95,6 +101,29 @@ const EnvironmentDetail: React.FC = () => {
95101) ;
96102}
97103
104+ // Check if environment is not licensed and show modern UI
105+ if ( environment . isLicensed === false ) {
106+ return (
107+ < >
108+ < UnlicensedEnvironmentView
109+ environment = { environment }
110+ onEditClick = { handleEditClick }
111+ />
112+
113+ { /* Edit Environment Modal */ }
114+ { environment && (
115+ < EditEnvironmentModal
116+ visible = { isEditModalVisible }
117+ environment = { environment }
118+ onClose = { handleCloseModal }
119+ onSave = { handleSaveEnvironment }
120+ loading = { isUpdating }
121+ />
122+ ) }
123+ </ >
124+ ) ;
125+ }
126+
98127const breadcrumbItems = [
99128{
100129key :'environments' ,
@@ -114,7 +143,7 @@ const EnvironmentDetail: React.FC = () => {
114143return (
115144< div
116145className = "environment-detail-container"
117- style = { { padding :"24px" , flex :1 } }
146+ style = { { padding :"24px" , flex :1 , minWidth : "1000px" } }
118147>
119148{ /* Environment Header Component */ }
120149< EnvironmentHeader
@@ -157,6 +186,22 @@ const EnvironmentDetail: React.FC = () => {
157186{ environment . environmentType }
158187</ Tag >
159188</ Descriptions . Item >
189+ < Descriptions . Item label = "License Status" >
190+ { ( ( ) => {
191+ switch ( environment . licenseStatus ) {
192+ case 'checking' :
193+ return < Tag icon = { < SyncOutlined spin /> } color = "blue" style = { { borderRadius :'12px' } } > Checking...</ Tag > ;
194+ case 'licensed' :
195+ return < Tag icon = { < CheckCircleOutlined /> } color = "green" style = { { borderRadius :'12px' } } > Licensed</ Tag > ;
196+ case 'unlicensed' :
197+ return < Tag icon = { < CloseCircleOutlined /> } color = "red" style = { { borderRadius :'12px' } } > Not Licensed</ Tag > ;
198+ case 'error' :
199+ return < Tag icon = { < ExclamationCircleOutlined /> } color = "orange" style = { { borderRadius :'12px' } } > License Error</ Tag > ;
200+ default :
201+ return < Tag color = "default" style = { { borderRadius :'12px' } } > Unknown</ Tag > ;
202+ }
203+ } ) ( ) }
204+ </ Descriptions . Item >
160205< Descriptions . Item label = "API Key Status" >
161206{ environment . environmentApikey ?(
162207< Tag color = "green" style = { { borderRadius :'12px' } } > Configured</ Tag >