From 0358c4667afc7375b87b5937340f85f0bc0a53dc Mon Sep 17 00:00:00 2001
From: Christoffer Jahren <christoffer.jahren@schibsted.com>
Date: Wed, 28 Jun 2023 09:29:44 +0200
Subject: [PATCH 1/2] feat: allow comment prop on react Trans component

---
 packages/react/src/Trans.tsx | 1 +
 1 file changed, 1 insertion(+)

diff --git a/packages/react/src/Trans.tsx b/packages/react/src/Trans.tsx
index 2a465a3c9..f9d756bcf 100644
--- a/packages/react/src/Trans.tsx
+++ b/packages/react/src/Trans.tsx
@@ -27,6 +27,7 @@ export type TransProps = {
   values?: Record<string, unknown>
   components?: { [key: string]: React.ElementType | any }
   formats?: Record<string, unknown>
+  comment?: string
   children?: React.ReactNode
 } & TransRenderCallbackOrComponent
 

From 063262aacf0ce44432bd931167982d35f5e972ca Mon Sep 17 00:00:00 2001
From: Christoffer Jahren <christoffer.jahren@schibsted.com>
Date: Wed, 28 Jun 2023 09:56:54 +0200
Subject: [PATCH 2/2] docs: update documentation for comment prop on react
 Trans component

---
 website/docs/ref/react.md | 13 ++++++++++---
 1 file changed, 10 insertions(+), 3 deletions(-)

diff --git a/website/docs/ref/react.md b/website/docs/ref/react.md
index 11d11dead..30e605fb9 100644
--- a/website/docs/ref/react.md
+++ b/website/docs/ref/react.md
@@ -18,8 +18,9 @@ Default rendering component can be set using `defaultComponent` prop in [`I18nPr
 | Prop name   | Type                                      | Description                                    |
 |-------------| ----------------------------------------- |------------------------------------------------|
 | `className` | string                                    | Class name to be added to `<span>` element     |
-| `render`    | Function(props) -> Element \| `null`   | Custom render callback to render translation        |
-| `component` | Component \| `null`                         | Custom component to render translation |
+| `render`    | Function(props) -> Element \| `null`      | Custom render callback to render translation   |
+| `component` | Component \| `null`                       | Custom component to render translation         |
+| `comment`   | string                                    | Comment picked up by extractor to provide translation context |
 
 `className` is used only for built-in components (when *render* is string).
 
@@ -153,7 +154,7 @@ import { Trans } from "@lingui/macro"
 ```
 :::
 
-It's also possible to use `Trans` component directly without macros. In that case, `id` identifies the message being translated. `values` and `components` are arguments and components used for formatting translation:
+It's also possible to use `Trans` component directly without macros. In that case, `id` identifies the message being translated. `values` and `components` are arguments and components used for formatting translation. `comment` helps add context for translators:
 
 ```jsx
 <Trans id="my.message" message="Hello World"/>
@@ -164,6 +165,12 @@ It's also possible to use `Trans` component directly without macros. In that cas
   values={{ name: 'Arthur' }}
 />
 
+<Trans
+  id="hello.world"
+  message="Hello world"
+  comment="a message that says hi to the world"
+/>
+
 // number of tag corresponds to index in `components` prop
 <Trans
   id="link"