+ {Object.keys(KEY_LABELS).map(key => {
+ const status = settings[key]
+ return (
+
+
+
+
+ {status?.set ? 'Configured' : 'Not set'}
+
+
+ {status?.set && status.updated_at && (
+
+ Last updated {new Date(status.updated_at).toLocaleDateString('en-MY')}
+
+ )}
+
+ setValues(v => ({ ...v, [key]: e.target.value }))}
+ placeholder={status?.set ? 'Enter new key to replace…' : 'Enter API key…'}
+ className="flex-1 border border-gray-300 rounded-lg px-3 py-2 text-sm focus:ring-2 focus:ring-blue-500 focus:border-transparent font-mono"
+ />
+
+
+ {results[key] === 'ok' && (
+
Saved. Reload the page to confirm.
+ )}
+ {results[key] === 'error' && (
+
Save failed. Check your permissions.
+ )}
+