title: typescript template literal in interface key error
body: <p>Typescript v4.4.3</p>
  <h1><a href="https://www.typescriptlang.org/play?ts=4.4.3#code/JYOwLgpgTgZghgYwgAgJIBED2CCuBbCcZAbwChlkQ4CAuZAZzClAHMBuc5AbTgBNeIvAPp0ABnwHCAJMUbMQLAL6iAunRD4ARtC4rkAH2Q4QAmKEEdFpUgkwhGySAgAWARmQBeEpwo4cwXjoAcgB2AAZNACYANkiQgFYAWniwgE5oxIAWCEzNRNTeFMSAZgR0+LKIFJDioIAaUkUOW3swZF5sOgxsfEI2rzIKKlpkACJRhooucX5BIRknNwA6PwDlNW5XVPCw112VBqbrGzsHDoRIrqxcAiIBzmGIOnHJ7hnJIThNBFU6LldIsVMvEVI0gA" rel="nofollow noreferrer">Reproducible Playground Example</a></h1>
  <p>--</p>
  <pre class="lang-js prettyprint-override"><code>interface IDocument {
    [added_: `added_${string}`]: number[] | undefined;
  }
  </code></pre>
  <pre class="lang-js prettyprint-override"><code>const id = 'id';
  const document: IDocument = {
    [`added_${id}`]: [1970]
  }
  </code></pre>
  <p>What i've tried:</p>
  <ul>
  <li>I've confirmed that <code>id</code> in my code is a <code>string</code>.</li>
  <li>This happens when running <code>tsc</code> not just in VSCode warnings</li>
  </ul>
  <pre><code>[`added_abc`]: [1] // no error
  [`added_${'abc'}`]: [1] // errors
  [`added_${stringVariable}`] // errors
  </code></pre>
  <p>Is there some restrictions of using template literals or anything else I can investigate to diagnose this?</p>
  <pre><code>'string' and '`added_${string}`' index signatures are incompatible.
      Type 'string | string[] | number[]' is not assignable to type 'number[] | undefined'.
        Type 'string' is not assignable to type 'number[] | undefined'.ts(2322)
  </code></pre>
  <p><a href="https://i.stack.imgur.com/HrEoX.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/HrEoX.png" alt="enter image description here" /></a></p>