Files
InvoiceShelf/resources/scripts/components/base/BaseSanitizedHtml.vue
Darko Gjorgjijoski f3ab0f22fc chore(frontend): fix ESLint, add Pint+ESLint pre-commit hook, centralize v-html
Fix the broken ESLint setup: add vue-eslint-parser and @typescript-eslint/parser
and wire the TS parser into eslint.config.mjs so .ts and <script lang=ts> parse
(was failing outright). Clear the resulting backlog to a clean 0/0 baseline —
fix genuine issues, relax two intentional-pattern rules (multi-word-component-names,
no-required-prop-with-default).

Add a committed .githooks/pre-commit (enabled via core.hooksPath, auto-set by the
prepare script) that runs Pint on staged PHP and ESLint --max-warnings 0 on staged
resources/scripts JS/TS/Vue, blocking on failure. Add composer/npm lint scripts and
document the gate in CLAUDE.md.

Replace every scattered v-html with a single audited BaseSanitizedHtml component
that DOMPurify-sanitizes its input (new utils/markdown.ts sanitizeHtml), so
server/registry-provided HTML is actually sanitized and vue/no-v-html stays enabled
everywhere but one reviewed sink.
2026-06-11 11:11:12 +02:00

26 lines
771 B
Vue

<script setup lang="ts">
import { computed } from 'vue'
import { sanitizeHtml } from '@/scripts/utils/markdown'
const props = withDefaults(
defineProps<{
/** Raw HTML to render. Always DOMPurify-sanitized before it is bound. */
html?: string | null
}>(),
{ html: '' }
)
const clean = computed(() => sanitizeHtml(props.html))
</script>
<template>
<!--
The single, audited v-html sink in the app. `clean` is DOMPurify-sanitized
above, so any HTML (server-, registry-, or update-server-provided) rendered
through this component is safe. Do NOT use v-html anywhere else route it
here instead. This is the only place vue/no-v-html is disabled.
-->
<!-- eslint-disable-next-line vue/no-v-html -->
<div v-html="clean" />
</template>