import assert from 'node:assert/strict'
import { readFileSync } from 'node:fs'
import test from 'node:test'
import { fileURLToPath } from 'node:url'

const auditAssetList = readFileSync(
  fileURLToPath(new URL('../src/components/audit/AuditAssetList.vue', import.meta.url)),
  'utf8'
)
const auditViewStyles = readFileSync(
  fileURLToPath(new URL('../src/assets/styles/views/audit-view.css', import.meta.url)),
  'utf8'
)
const digitalEmployeeList = readFileSync(
  fileURLToPath(new URL('../src/components/audit/DigitalEmployeeListPanel.vue', import.meta.url)),
  'utf8'
)
const digitalEmployeeStyles = readFileSync(
  fileURLToPath(new URL('../src/assets/styles/views/digital-employees-view.css', import.meta.url)),
  'utf8'
)

test('audit rule name column stays left aligned', () => {
  assert.match(auditAssetList, /<table class="audit-asset-table">/)
  assert.match(auditViewStyles, /\.audit-asset-table th:first-child,[\s\S]*?text-align: left;/)
  assert.match(auditViewStyles, /\.skill-name-cell \{[\s\S]*?text-align: left;/)
})

test('digital employee skill name keeps text avatar prefix', () => {
  assert.match(digitalEmployeeList, /class="digital-skill-cell"/)
  assert.match(digitalEmployeeList, /class="digital-skill-avatar"/)
  assert.match(digitalEmployeeStyles, /\.digital-skill-cell \{[\s\S]*?text-align: left;/)
  assert.match(digitalEmployeeStyles, /\.digital-skill-cell \{[\s\S]*?grid-template-columns: 38px minmax\(0, 1fr\);/)
  assert.match(digitalEmployeeStyles, /\.digital-skill-avatar \{[\s\S]*?width: 38px;[\s\S]*?border-radius: 11px;/)
  assert.match(digitalEmployeeStyles, /\.digital-skill-avatar\.blue \{[\s\S]*?linear-gradient\(135deg, #3b82f6, #2563eb\);/)
})