add less aggressive license messages

Author: iamfaran

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

@@ -205,9 +205,9 @@ const EnvironmentDetail: React.FC = () => {
                 case 'licensed':
                   return <Tag icon={<CheckCircleOutlined />} color="green" style={{ borderRadius: '4px' }}>Licensed</Tag>;
                 case 'unlicensed':
-                  return <Tag icon={<CloseCircleOutlined />} color="red" style={{ borderRadius: '4px' }}>Not Licensed</Tag>;
+                  return <Tag icon={<CloseCircleOutlined />} color="orange" style={{ borderRadius: '4px' }}>License Needed</Tag>;
                 case 'error':
-                  return <Tag icon={<ExclamationCircleOutlined />} color="orange" style={{ borderRadius: '4px' }}>License Error</Tag>;
+                  return <Tag icon={<ExclamationCircleOutlined />} color="orange" style={{ borderRadius: '4px' }}>Setup Required</Tag>;
                 default:
                   return <Tag color="default" style={{ borderRadius: '4px' }}>Unknown</Tag>;
               }

client/packages/lowcoder/src/pages/setting/environments/components/EnvironmentsTable.tsx

@@ -55,29 +55,29 @@ const EnvironmentsTable: React.FC<EnvironmentsTableProps> = ({
       case 'checking':
         return {
           icon: <SyncOutlined spin />,
-          color: '#1890ff',
+          color: '#40a9ff',
           text: 'Checking...',
           status: 'processing' as const
         };
       case 'licensed':
         return {
           icon: <CheckCircleOutlined />,
-          color: '#52c41a',
+          color: '#73d13d',
           text: 'Licensed',
           status: 'success' as const
         };
       case 'unlicensed':
         return {
           icon: <CloseCircleOutlined />,
-          color: '#ff4d4f',
-          text: 'Not Licensed',
-          status: 'error' as const
+          color: '#ff7875',
+          text: 'License Required',
+          status: 'warning' as const
         };
       case 'error':
         return {
           icon: <ExclamationCircleOutlined />,
-          color: '#faad14',
-          text: 'License Error',
+          color: '#ffc53d',
+          text: 'Setup Required',
           status: 'warning' as const
         };
       default:
@@ -180,8 +180,8 @@ const EnvironmentsTable: React.FC<EnvironmentsTableProps> = ({
                         <Tag 
                           icon={licenseDisplay.icon}
                           color={licenseDisplay.status === 'success' ? 'green' : 
-                                 licenseDisplay.status === 'error' ? 'red' : 
-                                 licenseDisplay.status === 'warning' ? 'orange' : 'blue'}
+                                 licenseDisplay.status === 'warning' ? 'orange' : 
+                                 licenseDisplay.status === 'processing' ? 'blue' : 'default'}
                           style={{ fontSize: '11px', borderRadius: '4px' }}
                         >
                           {licenseDisplay.text}

client/packages/lowcoder/src/pages/setting/environments/components/UnlicensedEnvironmentView.tsx

@@ -31,37 +31,29 @@ const UnlicensedEnvironmentView: React.FC<UnlicensedEnvironmentViewProps> = ({
   const getLicenseIcon = () => {
     switch (environment.licenseStatus) {
       case 'unlicensed':
-        return <CloseCircleOutlined style={{ fontSize: '48px', color: '#ff4d4f' }} />;
+        return <CloseCircleOutlined style={{ fontSize: '48px', color: '#ff7875' }} />;
       case 'error':
-        return <ExclamationCircleOutlined style={{ fontSize: '48px', color: '#faad14' }} />;
+        return <ExclamationCircleOutlined style={{ fontSize: '48px', color: '#ffc53d' }} />;
       default:
-        return <WarningOutlined style={{ fontSize: '48px', color: '#ff4d4f' }} />;
+        return <WarningOutlined style={{ fontSize: '48px', color: '#ff7875' }} />;
     }
   };
 
   const getLicenseTitle = () => {
-    switch (environment.licenseStatus) {
-      case 'unlicensed':
-        return 'Environment Not Licensed';
-      case 'error':
-        return 'License Configuration Error';
-      default:
-        return 'License Issue';
-    }
-  };
+   return environment.licenseError;
+ }
+
+
 
   const getLicenseDescription = () => {
-    if (environment.licenseError) {
-      return environment.licenseError;
-    }
 
     switch (environment.licenseStatus) {
       case 'unlicensed':
-        return 'This environment requires a valid license to access its features and functionality.';
+        return 'This environment needs a valid license to unlock its full capabilities and features. Please make sure your API Service URL is correctly configured and Plugin is installed.';
       case 'error':
-        return 'There was an error validating the license for this environment. Please check the configuration.';
+        return 'We encountered an issue while checking the license. Please review the configuration settings.';
       default:
-        return 'This environment has license-related issues that need to be resolved.';
+        return 'This environment requires license configuration to proceed.';
     }
   };
 

client/packages/lowcoder/src/pages/setting/environments/services/license.service.ts

@@ -65,17 +65,17 @@ export async function checkEnvironmentLicense(
 
   } catch (error) {
     // Determine the specific error type
-    let errorMessage = 'License not available';
+    let errorMessage = 'License information unavailable';
 
     if (axios.isAxiosError(error)) {
       if (error.code === 'ECONNABORTED') {
-        errorMessage = 'License check timed out';
+        errorMessage = 'License check took too long';
       } else if (error.response?.status === 404) {
-        errorMessage = 'License endpoint not found';
+        errorMessage = 'License service not available';
       } else if (error.response?.status === 401) {
-        errorMessage = 'Unauthorized - check API key';
+        errorMessage = 'Authentication required - please check API key';
       } else if (error.response && error.response.status >= 500) {
-        errorMessage = 'License server error';
+        errorMessage = 'License service temporarily unavailable';
       }
     }
 
@@ -100,7 +100,7 @@ export function formatAPICalls(remaining: number, total: number): string {
 }
 
 /**
- * Get API calls status color based on usage percentage
+ * Get API calls status color based on usage percentage - using softer, less aggressive colors
  * @param remainingCalls - Remaining API calls
  * @param totalCalls - Total API calls limit
  * @returns Color string for UI components
@@ -110,8 +110,8 @@ export function getAPICallsStatusColor(remainingCalls: number, totalCalls: numbe
 
   const usagePercentage = ((totalCalls - remainingCalls) / totalCalls) * 100;
 
-  if (usagePercentage >= 90) return '#ff4d4f'; // Red - Critical
-  if (usagePercentage >= 75) return '#faad14'; // Orange - Warning  
-  if (usagePercentage >= 50) return '#1890ff'; // Blue - Moderate
-  return '#52c41a'; // Green - Good
+  if (usagePercentage >= 90) return '#ff7875'; // Soft red - High usage
+  if (usagePercentage >= 75) return '#ffc53d'; // Soft orange - Moderate usage  
+  if (usagePercentage >= 50) return '#40a9ff'; // Soft blue - Normal usage
+  return '#73d13d'; // Soft green - Low usage
 }