Fix jwt-token

management/src/pages/Login.jsx

@@ -1,6 +1,7 @@
 import React, { useState } from 'react'
 import { Navigate } from 'react-router-dom'
 import { useAuth } from '../contexts/AuthContext'
+import { t } from '../utils/tempTranslations' // Temporary translation system
 import { EyeIcon, EyeSlashIcon } from '@heroicons/react/24/outline'
 
 const Login = () => {
@@ -40,10 +41,10 @@ const Login = () => {
       <div className="max-w-md w-full space-y-8">
         <div>
           <h2 className="mt-6 text-center text-3xl font-extrabold text-gray-900">
-            UAMILS Management Portal
+            {t('auth.portalTitle')}
           </h2>
           <p className="mt-2 text-center text-sm text-gray-600">
-            Sign in to manage tenants and system configuration
+            {t('auth.loginDescription')}
           </p>
         </div>
         
@@ -51,7 +52,7 @@ const Login = () => {
           <div className="rounded-md shadow-sm -space-y-px">
             <div>
               <label htmlFor="username" className="sr-only">
-                Username
+                {t('auth.username')}
               </label>
               <input
                 id="username"
@@ -59,7 +60,7 @@ const Login = () => {
                 type="text"
                 required
                 className="appearance-none rounded-none relative block w-full px-3 py-2 border border-gray-300 placeholder-gray-500 text-gray-900 rounded-t-md focus:outline-none focus:ring-blue-500 focus:border-blue-500 focus:z-10 sm:text-sm"
-                placeholder="Username"
+                placeholder={t('auth.username')}
                 value={formData.username}
                 onChange={handleInputChange}
                 disabled={loading}
@@ -67,7 +68,7 @@ const Login = () => {
             </div>
             <div className="relative">
               <label htmlFor="password" className="sr-only">
-                Password
+                {t('auth.password')}
               </label>
               <input
                 id="password"
@@ -75,7 +76,7 @@ const Login = () => {
                 type={showPassword ? 'text' : 'password'}
                 required
                 className="appearance-none rounded-none relative block w-full px-3 py-2 pr-10 border border-gray-300 placeholder-gray-500 text-gray-900 rounded-b-md focus:outline-none focus:ring-blue-500 focus:border-blue-500 focus:z-10 sm:text-sm"
-                placeholder="Password"
+                placeholder={t('auth.password')}
                 value={formData.password}
                 onChange={handleInputChange}
                 disabled={loading}
@@ -103,17 +104,17 @@ const Login = () => {
               {loading ? (
                 <div className="flex items-center">
                   <div className="animate-spin rounded-full h-4 w-4 border-b-2 border-white mr-2"></div>
-                  Signing in...
+                  {t('auth.signingIn')}
                 </div>
               ) : (
-                'Sign in'
+                t('auth.signIn')
               )}
             </button>
           </div>
 
           <div className="text-center">
             <p className="text-xs text-gray-500">
-              Admin access required. Default: admin / admin123
+              {t('auth.adminAccess')}
             </p>
           </div>
         </form>

management/src/pages/System.jsx

@@ -34,7 +34,7 @@ const System = () => {
       setLastUpdate(new Date())
     } catch (error) {
       console.error('Failed to load system info:', error)
-      toast.error('Failed to load system information')
+      toast.error(t('system.loadError'))
     } finally {
       setLoading(false)
     }
@@ -291,14 +291,14 @@ const System = () => {
     return (
       <div className="text-center py-12">
         <XCircleIcon className="mx-auto h-12 w-12 text-red-400" />
-        <h3 className="mt-2 text-sm font-medium text-gray-900">No system information available</h3>
-        <p className="mt-1 text-sm text-gray-500">Unable to load system metrics.</p>
+        <h3 className="mt-2 text-sm font-medium text-gray-900">{t('system.noInformation')}</h3>
+        <p className="mt-1 text-sm text-gray-500">{t('system.noInformationDescription')}</p>
         <div className="mt-6">
           <button
             onClick={loadSystemInfo}
             className="inline-flex items-center px-4 py-2 border border-transparent shadow-sm text-sm font-medium rounded-md text-white bg-blue-600 hover:bg-blue-700"
           >
-            Retry
+            {t('system.retry')}
           </button>
         </div>
       </div>
@@ -309,11 +309,11 @@ const System = () => {
     <div>
       <div className="mb-8 flex justify-between items-center">
         <div>
-          <h1 className="text-2xl font-bold text-gray-900">System Monitor</h1>
-          <p className="text-gray-600">Real-time system health and configuration monitoring</p>
+          <h1 className="text-2xl font-bold text-gray-900">{t('system.title')}</h1>
+          <p className="text-gray-600">{t('system.description')}</p>
           {lastUpdate && (
             <p className="text-xs text-gray-400 mt-1">
-              Last updated: {lastUpdate.toLocaleTimeString()}
+              {t('system.lastUpdated')}: {lastUpdate.toLocaleTimeString()}
             </p>
           )}
         </div>
@@ -322,20 +322,20 @@ const System = () => {
           className="inline-flex items-center px-3 py-2 border border-gray-300 shadow-sm text-sm leading-4 font-medium rounded-md text-gray-700 bg-white hover:bg-gray-50"
         >
           <CogIcon className="h-4 w-4 mr-2" />
-          Refresh
+          {t('common.refresh')}
         </button>
       </div>
 
       {/* Platform Overview */}
       <div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-6 mb-8">
-        <StatusCard title="Platform Status" icon={ServerIcon}>
+        <StatusCard title={t('system.platformStatus')} icon={ServerIcon}>
           <div className="space-y-3">
             <div className="flex justify-between">
-              <span className="text-sm text-gray-500">Version</span>
+              <span className="text-sm text-gray-500">{t('system.version')}</span>
               <span className="text-sm font-medium">{systemInfo.platform.version}</span>
             </div>
             <div className="flex justify-between">
-              <span className="text-sm text-gray-500">Environment</span>
+              <span className="text-sm text-gray-500">{t('system.environment')}</span>
               <span className="text-sm font-medium capitalize">{systemInfo.platform.environment}</span>
             </div>
             <div className="flex justify-between">