style: tag tooltip content width

src/components/status-tag/index.tsx

@@ -29,6 +29,7 @@ type StatusTagProps = {
   download?: {
     percent: number;
   };
+  maxTooltipWidth?: number;
   extra?: React.ReactNode;
   actions?: {
     label: string;
@@ -44,6 +45,7 @@ const StatusTag: React.FC<StatusTagProps> = ({
   download,
   extra,
   actions = [],
+  maxTooltipWidth = 250,
   type = 'tag'
 }) => {
   const { text, status } = statusValue;
@@ -118,7 +120,7 @@ const StatusTag: React.FC<StatusTagProps> = ({
         <div
           style={{
             width: 'max-content',
-            maxWidth: 250,
+            maxWidth: maxTooltipWidth,
             whiteSpace: 'pre-wrap',
             wordBreak: 'break-word'
           }}

src/global.less

@@ -72,7 +72,7 @@ html {
   --color-green-fill-light: rgb(243 251 248);
   --ant-rate-star-color: #fadb14;
   --color-fill-spin-bg: rgba(255, 255, 255, 15%);
-  --width-tooltip-max: 300px;
+  --width-tooltip-max: 420px;
   --color-bg-tooltip: '#fff';
   --color-modal-content-bg: rgba(255, 255, 255, 90%);
   --color-modal-box-shadow: 0 4px 16px rgba(0, 0, 0, 10%);

src/locales/en-US/resources.ts

@@ -74,7 +74,7 @@ export default {
   'resources.modelfiles.copy.tips': 'Copy Full Path',
   'resources.filter.path': 'Filter by path',
   'resources.register.worker.step1':
-    'Click the <span class="bold-text">Copy the token</span> menu.',
+    'Click the <span class="bold-text">Copy token</span> menu.',
   'resources.register.worker.step2':
     'Click the <span class="bold-text">Quick Config</span> menu.',
   'resources.register.worker.step3':
@@ -82,7 +82,7 @@ export default {
   'resources.register.worker.step4':
     'Select <span class="bold-text">Worker</span> as the service role.',
   'resources.register.worker.step5':
-    'Enter the <span="bold-text">Server URL</span>.',
+    'Enter the <span class="bold-text">Server URL</span>.',
   'resources.register.worker.step6':
     'Paste the <span class="bold-text">Token</span>.',
   'resources.register.worker.step7':

src/locales/ja-JP/resources.ts

@@ -75,7 +75,7 @@ export default {
   'resources.modelfiles.copy.tips': 'フルパスをコピー',
   'resources.filter.path': 'パスでフィルタ',
   'resources.register.worker.step1':
-    'Click the <span class="bold-text">Copy the token</span> menu.',
+    'Click the <span class="bold-text">Copy token</span> menu.',
   'resources.register.worker.step2':
     'Click the <span class="bold-text">Quick Config</span> menu.',
   'resources.register.worker.step3':
@@ -83,7 +83,7 @@ export default {
   'resources.register.worker.step4':
     'Select <span class="bold-text">Worker</span> as the service role.',
   'resources.register.worker.step5':
-    'Enter the <span="bold-text">Server URL</span>.',
+    'Enter the <span class="bold-text">Server URL</span>.',
   'resources.register.worker.step6':
     'Paste the <span class="bold-text">Token</span>.',
   'resources.register.worker.step7':
@@ -93,11 +93,11 @@ export default {
 };
 
 // ========== To-Do: Translate Keys (Remove After Translation) ==========
-// 1. 'resources.register.worker.step1': 'Click the <span class="bold-text">Copy the token</span> menu.',
+// 1. 'resources.register.worker.step1': 'Click the <span class="bold-text">Copy token</span> menu.',
 // 2. 'resources.register.worker.step2': 'Click the <span class="bold-text">Quick Config</span> menu.',
 // 3. 'resources.register.worker.step3': 'Click the <span class="bold-text">General</span> tab.',
 // 4. 'resources.register.worker.step4':  'Select <span class="bold-text">Worker</span> as the service role.',
-// 5. 'resources.register.worker.step5': 'Enter the <span="bold-text">Server URL</span>.',
+// 5. 'resources.register.worker.step5': 'Enter the <span class="bold-text">Server URL</span>.',
 // 6. 'resources.register.worker.step6': 'Paste the <span class="bold-text">Token</span>.',
 // 7. 'resources.register.worker.step7': 'Click <span class="bold-text">Restart</span> to apply the settings.',
 // 8. 'resources.register.install.title': 'Install GPUStack',

src/locales/ru-RU/resources.ts

@@ -73,7 +73,7 @@ export default {
   'resources.modelfiles.copy.tips': 'Скопировать полный путь',
   'resources.filter.path': 'Фильтрация по пути',
   'resources.register.worker.step1':
-    'Click the <span class="bold-text">Copy the token</span> menu.',
+    'Click the <span class="bold-text">Copy token</span> menu.',
   'resources.register.worker.step2':
     'Click the <span class="bold-text">Quick Config</span> menu.',
   'resources.register.worker.step3':
@@ -81,7 +81,7 @@ export default {
   'resources.register.worker.step4':
     'Select <span class="bold-text">Worker</span> as the service role.',
   'resources.register.worker.step5':
-    'Enter the <span="bold-text">Server URL</span>.',
+    'Enter the <span class="bold-text">Server URL</span>.',
   'resources.register.worker.step6':
     'Paste the <span class="bold-text">Token</span>.',
   'resources.register.worker.step7':
@@ -91,11 +91,11 @@ export default {
 };
 
 // ========== To-Do: Translate Keys (Remove After Translation) ==========
-// 1. 'resources.register.worker.step1': 'Click the <span class="bold-text">Copy the token</span> menu.',
+// 1. 'resources.register.worker.step1': 'Click the <span class="bold-text">Copy token</span> menu.',
 // 2. 'resources.register.worker.step2': 'Click the <span class="bold-text">Quick Config</span> menu.',
 // 3. 'resources.register.worker.step3': 'Click the <span class="bold-text">General</span> tab.',
 // 4. 'resources.register.worker.step4':  'Select <span class="bold-text">Worker</span> as the service role.',
-// 5. 'resources.register.worker.step5': 'Enter the <span="bold-text">Server URL</span>.',
+// 5. 'resources.register.worker.step5': 'Enter the <span class="bold-text">Server URL</span>.',
 // 6. 'resources.register.worker.step6': 'Paste the <span class="bold-text">Token</span>.',
 // 7. 'resources.register.worker.step7': 'Click <span class="bold-text">Restart</span> to apply the settings.',
 // 8. 'resources.register.install.title': 'Install GPUStack',

src/pages/resources/components/workers.tsx

@@ -283,6 +283,7 @@ const Workers: React.FC = () => {
             render={(text, record: ListItem) => {
               return (
                 <StatusTag
+                  maxTooltipWidth={400}
                   statusValue={{
                     status: status[record.state] as any,
                     text: WorkerStatusMapValue[record.state],