title: TS : How to create a type factory using a string to generate the keys
body: <p>I am trying to create a way to easily generate a type that defines a multitude of key values association with a specific name pattern in the keys.</p>
  <p>I have a specific type that is very repetitive, as for any metrics (working on analytics), I have a 4 keys associated.</p>
  <p>For example, for the <code>firstPageVisible</code> metric, I will have <code>firstPageVisibleMetrics</code>, <code>firstPageVisibleCount</code>, <code>firstPageVisibleMetricsPerDevices</code>, <code>firstPageVisibleCountPerDevices</code>.</p>
  <p>But as I have many metrics, I would like to have some sort of factory to make is easier to read.</p>
  <p>I was imagining something like :</p>
  <pre class="lang-js prettyprint-override"><code>type DetailedMetric&lt;Type&gt; = (
      name: string,
  ) =&gt; {
      [`${name}Metrics`]?: Type;
      [`${name}Count`]?: number;
      [`${name}MetricsPerDevices`]?: PerDeviceData&lt;Type&gt;;
      [`${name}CountPerDevices`]?: PerDeviceData&lt;number&gt;;
  };
  </code></pre>
  <p>But I am having the error : <code>A computed property name in a type literal must refer to an expression whose type is a literal type or a 'unique symbol' type.</code>.</p>
  <p>And I cannot find a satisfying way to resolve this.</p>
  <p>In the end, I would like to have something that looks like this (or similar) :</p>
  <pre class="lang-js prettyprint-override"><code>
  type StoryDataType = {
      _id: string;
      ...;
  } &amp; DetailedMetric(&quot;firstPageVisible&quot;)&lt;number&gt; &amp;
      DetailedMetric(&quot;metric2&quot;)&lt;number&gt; &amp;
      DetailedMetric(&quot;metric3&quot;)&lt;number&gt; &amp;
      DetailedMetric(&quot;metric4&quot;)&lt;number&gt; &amp;
      ...;
  </code></pre>