Deploy website based on bbcea46

docs/next/custom-decorators.html

@@ -116,12 +116,12 @@ <h2><a class="anchor" aria-hidden="true" id="parameter-decorators"></a><a href="
 <p>Parameter decorators are just like the custom method decorators or middlewares but with an ability to return some value that will be injected to the method as a parameter. Thanks to this, it reduces the pollution in <code>context</code> which was used as a workaround for the communication between reusable middlewares and resolvers.</p>
 <p>They might be just a simple data extractor function, that makes our resolver more unit test friendly:</p>
 <pre><code class="hljs css language-ts"><span class="token keyword">function</span> <span class="token function">CurrentUser</span><span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token punctuation">{</span>
-  <span class="token keyword">return</span> <span class="token generic-function"><span class="token function">createParamDecorator</span><span class="token generic class-name"><span class="token operator">&lt;</span>MyContextType<span class="token operator">></span></span></span><span class="token punctuation">(</span><span class="token punctuation">(</span><span class="token punctuation">{</span> context <span class="token punctuation">}</span><span class="token punctuation">)</span> <span class="token operator">=></span> context<span class="token punctuation">.</span>currentUser<span class="token punctuation">)</span><span class="token punctuation">;</span>
+  <span class="token keyword">return</span> <span class="token generic-function"><span class="token function">createParameterDecorator</span><span class="token generic class-name"><span class="token operator">&lt;</span>MyContextType<span class="token operator">></span></span></span><span class="token punctuation">(</span><span class="token punctuation">(</span><span class="token punctuation">{</span> context <span class="token punctuation">}</span><span class="token punctuation">)</span> <span class="token operator">=></span> context<span class="token punctuation">.</span>currentUser<span class="token punctuation">)</span><span class="token punctuation">;</span>
 <span class="token punctuation">}</span>
 </code></pre>
 <p>Or might be a more advanced one that performs some calculations and encapsulates some logic. Compared to middlewares, they allow for a more granular control on executing the code, like calculating fields map based on GraphQL info only when it's really needed (requested by using the <code>@Fields()</code> decorator):</p>
 <pre><code class="hljs css language-ts"><span class="token keyword">function</span> <span class="token function">Fields</span><span class="token punctuation">(</span>level <span class="token operator">=</span> <span class="token number">1</span><span class="token punctuation">)</span><span class="token operator">:</span> ParameterDecorator <span class="token punctuation">{</span>
-  <span class="token keyword">return</span> <span class="token function">createParamDecorator</span><span class="token punctuation">(</span><span class="token keyword">async</span> <span class="token punctuation">(</span><span class="token punctuation">{</span> info <span class="token punctuation">}</span><span class="token punctuation">)</span> <span class="token operator">=></span> <span class="token punctuation">{</span>
+  <span class="token keyword">return</span> <span class="token function">createParameterDecorator</span><span class="token punctuation">(</span><span class="token keyword">async</span> <span class="token punctuation">(</span><span class="token punctuation">{</span> info <span class="token punctuation">}</span><span class="token punctuation">)</span> <span class="token operator">=></span> <span class="token punctuation">{</span>
     <span class="token keyword">const</span> fieldsMap<span class="token operator">:</span> FieldsMap <span class="token operator">=</span> <span class="token punctuation">{</span><span class="token punctuation">}</span><span class="token punctuation">;</span>
     <span class="token comment">// Calculate an object with info about requested fields</span>
     <span class="token comment">// based on GraphQL 'info' parameter of the resolver and the level parameter</span>
@@ -168,9 +168,45 @@ <h2><a class="anchor" aria-hidden="true" id="parameter-decorators"></a><a href="
   <span class="token punctuation">}</span>
 <span class="token punctuation">}</span>
 </code></pre>
+<h3><a class="anchor" aria-hidden="true" id="custom-arg-decorator"></a><a href="#custom-arg-decorator" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Custom <code>@Arg</code> decorator</h3>
+<p>In some cases we might want to create a custom decorator that will also register/expose an argument in the GraphQL schema.
+Calling both <code>Arg()</code> and <code>createParameterDecorator()</code> inside a custom decorator does not play well with the internals of TypeGraphQL.</p>
+<p>Hence, the <code>createParameterDecorator()</code> function supports second argument, <code>CustomParameterOptions</code> which allows to set decorator metadata for <code>@Arg</code> under the <code>arg</code> key:</p>
+<pre><code class="hljs css language-ts"><span class="token keyword">function</span> <span class="token function">RandomIdArg</span><span class="token punctuation">(</span>argName <span class="token operator">=</span> <span class="token string">"id"</span><span class="token punctuation">)</span> <span class="token punctuation">{</span>
+  <span class="token keyword">return</span> <span class="token function">createParameterDecorator</span><span class="token punctuation">(</span>
+    <span class="token comment">// here we do the logic of getting provided argument or generating a random one</span>
+    <span class="token punctuation">(</span><span class="token punctuation">{</span> args <span class="token punctuation">}</span><span class="token punctuation">)</span> <span class="token operator">=></span> args<span class="token punctuation">[</span>argName<span class="token punctuation">]</span> <span class="token operator">??</span> Math<span class="token punctuation">.</span><span class="token function">round</span><span class="token punctuation">(</span>Math<span class="token punctuation">.</span><span class="token function">random</span><span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token operator">*</span> <span class="token constant">MAX_ID_VALUE</span><span class="token punctuation">)</span><span class="token punctuation">,</span>
+    <span class="token punctuation">{</span>
+      <span class="token comment">// here we provide the metadata to register the parameter as a GraphQL argument</span>
+      arg<span class="token operator">:</span> <span class="token punctuation">{</span>
+        name<span class="token operator">:</span> argName<span class="token punctuation">,</span>
+        <span class="token function-variable function">typeFunc</span><span class="token operator">:</span> <span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token operator">=></span> Int<span class="token punctuation">,</span>
+        options<span class="token operator">:</span> <span class="token punctuation">{</span>
+          nullable<span class="token operator">:</span> <span class="token boolean">true</span><span class="token punctuation">,</span>
+          description<span class="token operator">:</span> <span class="token string">"Accepts provided id or generates a random one."</span><span class="token punctuation">,</span>
+        <span class="token punctuation">}</span><span class="token punctuation">,</span>
+      <span class="token punctuation">}</span><span class="token punctuation">,</span>
+    <span class="token punctuation">}</span><span class="token punctuation">,</span>
+  <span class="token punctuation">)</span><span class="token punctuation">;</span>
+<span class="token punctuation">}</span>
+</code></pre>
+<p>The usage of that custom decorator is very similar to the previous one and <code>@Arg</code> decorator itself:</p>
+<pre><code class="hljs css language-ts"><span class="token decorator"><span class="token at operator">@</span><span class="token function">Resolver</span></span><span class="token punctuation">(</span><span class="token punctuation">)</span>
+<span class="token keyword">export</span> <span class="token keyword">class</span> <span class="token class-name">RecipeResolver</span> <span class="token punctuation">{</span>
+  <span class="token function">constructor</span><span class="token punctuation">(</span><span class="token keyword">private</span> <span class="token keyword">readonly</span> recipesRepository<span class="token operator">:</span> Repository<span class="token operator">&lt;</span>Recipe<span class="token operator">></span><span class="token punctuation">)</span> <span class="token punctuation">{</span><span class="token punctuation">}</span>
+
+  <span class="token decorator"><span class="token at operator">@</span><span class="token function">Query</span></span><span class="token punctuation">(</span>returns <span class="token operator">=></span> Recipe<span class="token punctuation">,</span> <span class="token punctuation">{</span> nullable<span class="token operator">:</span> <span class="token boolean">true</span> <span class="token punctuation">}</span><span class="token punctuation">)</span>
+  <span class="token keyword">async</span> <span class="token function">recipe</span><span class="token punctuation">(</span>
+    <span class="token comment">// custom decorator that will expose an arg in the schema</span>
+    <span class="token decorator"><span class="token at operator">@</span><span class="token function">RandomIdArg</span></span><span class="token punctuation">(</span><span class="token string">"id"</span><span class="token punctuation">)</span> id<span class="token operator">:</span> <span class="token builtin">number</span><span class="token punctuation">,</span>
+  <span class="token punctuation">)</span> <span class="token punctuation">{</span>
+    <span class="token keyword">return</span> <span class="token keyword">await</span> <span class="token keyword">this</span><span class="token punctuation">.</span>recipesRepository<span class="token punctuation">.</span><span class="token function">findById</span><span class="token punctuation">(</span>id<span class="token punctuation">)</span><span class="token punctuation">;</span>
+  <span class="token punctuation">}</span>
+<span class="token punctuation">}</span>
+</code></pre>
 <h2><a class="anchor" aria-hidden="true" id="example"></a><a href="#example" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Example</h2>
 <p>See how different kinds of custom decorators work in the <a href="https://github.com/MichalLytek/type-graphql/tree/master/examples/middlewares-custom-decorators">custom decorators and middlewares example</a>.</p>
-</span></div></article></div><div class="docs-prevnext"><a class="docs-prev button" href="/docs/next/middlewares.html"><span class="arrow-prev">← </span><span>Middleware and guards</span></a><a class="docs-next button" href="/docs/next/complexity.html"><span>Query complexity</span><span class="arrow-next"> →</span></a></div></div></div><nav class="onPageNav"><ul class="toc-headings"><li><a href="#method-decorators">Method decorators</a></li><li><a href="#resolver-class-decorators">Resolver class decorators</a></li><li><a href="#parameter-decorators">Parameter decorators</a></li><li><a href="#example">Example</a></li></ul></nav></div><footer class="nav-footer" id="footer"><script>
+</span></div></article></div><div class="docs-prevnext"><a class="docs-prev button" href="/docs/next/middlewares.html"><span class="arrow-prev">← </span><span>Middleware and guards</span></a><a class="docs-next button" href="/docs/next/complexity.html"><span>Query complexity</span><span class="arrow-next"> →</span></a></div></div></div><nav class="onPageNav"><ul class="toc-headings"><li><a href="#method-decorators">Method decorators</a></li><li><a href="#resolver-class-decorators">Resolver class decorators</a></li><li><a href="#parameter-decorators">Parameter decorators</a><ul class="toc-headings"><li><a href="#custom-arg-decorator">Custom <code>@Arg</code> decorator</a></li></ul></li><li><a href="#example">Example</a></li></ul></nav></div><footer class="nav-footer" id="footer"><script>
             const html = document.querySelector("html");
 
             function appendButtonToDOM() {