vscode and typescript template literal types

I'm having some problem trying to use the literal types in vsCcode. Using the example from the docs,

you can see that eslint is complaining about the code. (Parsing error: Type expected.eslint)

I have typescript 4.3.5 installed (using the vscode typescript version) , with version 1.52 of vsCode.

I also have tried adding a .eslintrc.json file with the contents

{
    "parserOptions": {
        "ecmaVersion": "latest",
        "sourceType": "module",
        "ecmaFeatures": {
            "jsx": true
        }
    },
    "rules": {
        "semi": "error"
    }
}

but nothing seems to remove the linting error

I have restarted vsCode, removed and reinstalled the eslint plugin

what else do I need to change / try ?