From d3b19adbedef950efaf70c6d80f7019b77cde01b Mon Sep 17 00:00:00 2001
From: Andrej Ocenas <mr.ocenas@gmail.com>
Date: Tue, 5 May 2020 17:36:28 +0200
Subject: [PATCH] Docs: Update style guide with explicit return types (#23918)

---
 contribute/style-guides/frontend.md | 38 +++++++++++++++++++++++++++++
 1 file changed, 38 insertions(+)

diff --git a/contribute/style-guides/frontend.md b/contribute/style-guides/frontend.md
index d4628eda1c7..d8ff7b574e9 100644
--- a/contribute/style-guides/frontend.md
+++ b/contribute/style-guides/frontend.md
@@ -172,6 +172,44 @@ const CONSTANT_VALUE = "This string won't change";
 
 _SASS styles are deprecated. Please migrate to Emotion whenever you need to modify SASS styles._
 
+### Typing
+
+In general, you should let Typescript infer the types so that there's no need to explicitly define type for each variable. 
+
+There are some exceptions to this:
+
+```typescript
+// Typescript needs to know type of arrays or objects otherwise it would infer it as array of any 
+
+// bad
+const stringArray = [];
+
+// good
+const stringArray: string[] = [];
+```
+
+Specify function return types explicitly in new code. This improves readability by being able to tell what a function returns just by looking at the signature. It also prevents errors when a function's return type is broader than expected by the author. 
+
+> Note: We don't have linting for this enabled because of lots of old code that needs to be fixed first.
+
+```typescript
+// bad
+function transform(value?: string) {
+  if (!value) {
+    return undefined
+  }
+  return applyTransform(value)
+};
+
+// good
+function transform(value?: string): TransformedValue | undefined {
+  if (!value) {
+    return undefined
+  }
+  return applyTransform(value)
+};
+```
+
 ### File and directory naming conventions
 
 Name files according to the primary export: