import parentConfig from "../../eslint.config.mjs"
import pluginVue from "eslint-plugin-vue"
import betterTailwind from "eslint-plugin-better-tailwindcss"
import globals from "globals"

export default [
  ...parentConfig,

  {
    files: ["**/*.{ts,tsx}"],
    languageOptions: {
      parserOptions: {
        project: "./tsconfig.app.json",
      },
    },
  },

  // Vue config
  ...pluginVue.configs["flat/recommended"],

  // Better-Tailwindcss: Tailwind v4 + `tw:` prefix is auto-detected from the
  // CSS entryPoint. Scope to files that may contain class strings.
  {
    ...betterTailwind.configs.recommended,
    files: ["**/*.{vue,ts,tsx,js,jsx,cjs,mjs}"],
  },
  {
    files: ["**/*.{vue,ts,tsx,js,jsx,cjs,mjs}"],
    settings: {
      "better-tailwindcss": {
        entryPoint: "src/orchestrator/assets/styles/tailwindStyles.css",
      },
    },
    rules: {
      // Tailwind v4 + `@source inline(...)` generates utilities dynamically,
      // so unknown-class reports are noisy - downgrade to a warning.
      "better-tailwindcss/no-unknown-classes": "warn",
    },
  },
  {
    files: ["**/*.vue"],
    languageOptions: {
      sourceType: "module",
      globals: {
        ...globals.browser,
      },
    },
    rules: {
      // Essential Vue rules (from ESLint plugin Vue)
      "vue/multi-word-component-names": "off",
      "vue/no-mutating-props": "error",
      "vue/no-reserved-component-names": "error",
      "vue/no-use-v-if-with-v-for": "error",
      "vue/require-v-for-key": "error",
      "vue/valid-template-root": "error",
      "vue/valid-v-bind": "error",
      "vue/valid-v-cloak": "error",
      "vue/valid-v-else-if": "error",
      "vue/valid-v-else": "error",
      "vue/valid-v-for": "error",
      "vue/valid-v-html": "error",
      "vue/valid-v-if": "error",
      "vue/valid-v-model": "error",
      "vue/valid-v-on": "error",
      "vue/valid-v-once": "error",
      "vue/valid-v-pre": "error",
      "vue/valid-v-show": "error",
      "vue/valid-v-slot": "error",
      "vue/valid-v-text": "error",
    },
  },

  // Vue recommended config
  {
    files: ["**/*.vue"],
    rules: {
      // Recommended Vue rules
      "vue/component-name-in-template-casing": ["error", "PascalCase"],
      "vue/match-component-file-name": [
        "error",
        {
          extensions: ["vue"],
          shouldMatchCase: true,
        },
      ],
      "vue/match-component-import-name": "error",
      "vue/attribute-hyphenation": "error",
      "vue/component-definition-name-casing": ["error", "PascalCase"],
      "vue/html-closing-bracket-newline": "error",
      "vue/html-closing-bracket-spacing": "error",
      "vue/html-end-tags": "error",
      "vue/html-indent": ["error", 2],
      "vue/html-quotes": "error",
      "vue/html-self-closing": [
        "error",
        {
          html: {
            void: "any",
            normal: "any",
            component: "always",
          },
        },
      ],
      "vue/max-attributes-per-line": [
        "error",
        {
          singleline: 3,
          multiline: 1,
        },
      ],
      "vue/no-multi-spaces": "error",
      "vue/no-spaces-around-equal-signs-in-attribute": "error",
      "vue/no-template-shadow": "error",
      "vue/one-component-per-file": "error",
      "vue/prop-name-casing": ["error", "camelCase"],
      "vue/require-default-prop": "error",
      "vue/require-prop-types": "error",
      "vue/v-bind-style": "error",
      "vue/v-on-style": "error",
      "vue/v-slot-style": "error",
    },
  },
]
