Troubleshooting

Author: m-bert

…e-handler/docs/guides/troubleshooting.md …-handler/docs/guides/troubleshooting.mdxpackages/docs-gesture-handler/docs/guides/troubleshooting.md renamed to packages/docs-gesture-handler/docs/guides/troubleshooting.mdx packages/docs-gesture-handler/docs/guides/troubleshooting.md renamed to packages/docs-gesture-handler/docs/guides/troubleshooting.mdx

@@ -4,22 +4,22 @@ title: Troubleshooting
 sidebar_position: 3
 ---
 
+import Tabs from '@theme/Tabs';
+import TabItem from '@theme/TabItem';
+
 ## Troubleshooting
 
 Thanks for giving this library a try! We are sorry that you might have encountered issues though. Here is how you can seek help:
 
 1. Search over the [issues on Github](https://github.com/software-mansion/react-native-gesture-handler/issues). There is a chance someone had this problem in the past and it has been resolved!
 2. When sure your problem hasn't been reported or was reported but the proposed solution doesn't work for you please follow [our issue reporting guidelines](#reporting-issues).
 3. You can try seeking help on [Software Mansion Discord](https://discord.com/invite/VemJ4df8Yr).
-4. If you feel like reading the source code I highly recommend it, as this is by far the best resource and gives you the most up to date insights into how the library works and what might be causing the bug.
+4. If you feel like reading the source code we highly recommend it, as this is by far the best resource and gives you the most up to date insights into how the library works and what might be causing the bug.
 5. If you managed to find the solution consider [contributing](/docs/#contributing) a fix or update our documentation to make this information easier to find for the others in the future.
 
 ## Reporting issues
 
-This library is maintained by a very small team.
-Please be mindful of that when reporting issue and when it happens that we can't get back to you as soon as you might expect.
-We would love to fix all the problems as soon as possible, but often our time is constraint with other issues/features or projects.
-To make it easier for us to understand your issue and to be able to approach it sooner you can help by:
+This library is maintained by a very small team. Please keep this in mind when reporting issues, as we may not be able to respond as quickly as you might expect. We strive to address all problems as soon as possible, but our time is often constrained by other issues, features, or projects. To help us understand and address your issue more promptly, you can assist by:
 
 - Making sure the issue description is complete. Please include all the details about your environment (library version, RN version, device OS etc).
 - It is the best to provide an example app that reproduces the issue you are having. Put it up on [gist](https://gist.github.com/), [snack](https://snack.expo.io) or create a repo on Github – it doesn't matter as long as we can easily pull it in, run and see the issue.
@@ -32,44 +32,57 @@ To make it easier for us to understand your issue and to be able to approach it
 
 - Changing `enabled` prop during a gesture has no effect, only when a gesture starts (that is a finger touches the screen) the `enabled` prop is taken into consideration to decide whether to extract (or not) the gesture and provide it with stream of events to analyze.
 - `Native` gesture may not conform to the standard state flow due to platform specific workarounds to incorporate native views into RNGH.
-- Keep in mind that `Touchables` from RNGH are rendering two additional views that may need to be styled separately to achieve desired effect (`style` and `containerStyle` props).
-- In order for the gesture composition to work, all composed gestures must be attached to the same `GestureHandlerRootView`.
+- Keep in mind that [`Touchables`](/docs/components/touchables) from RNGH are rendering two additional views that may need to be styled separately to achieve desired effect (`style` and `containerStyle` props).
+- In order for the [gesture composition](/docs/fundamentals/gesture-composition) to work, all composed gestures must be attached to the same `GestureHandlerRootView`.
+
+## Multiple instances of Gesture Handler were detected
+
+This error usually happens when in your project there exists more than one instance of Gesture Handler. It can occur when some of your dependencies have installed Gesture Handler inside their own `node_modules` instead of using it as a peer dependency. In this case two different versions of Gesture Handler JS module try to install the same Native Module.
 
-### Multiple instances of Gesture Handler were detected
+You can resolve this problem manually by modifying your `package.json` file. This will depend on the package manager you are using.
 
-This error usually happens when in your project there exists more than one instance of Gesture Handler. It can occur when some of your dependencies have installed Gesture Handler inside their own `node_modules` instead of using it as a peer dependency. In this case two different versions of Gesture Handler JS module try to install the same Native Module. You can resolve this problem manually by modifying your `package.json` file.
 
-You can check which libraries are using Gesture Handler, for example, with the command:
+<Tabs groupId="package-managers">
+  <TabItem value="npm" label="NPM">
+    You can check which libraries are using Gesture Handler with the command:
+    
+    ```bash
+    npm ls react-native-gesture-handler
+    ```
 
-```bash
-npm ls react-native-gesture-handler
-yarn why react-native-gesture-handler
-```
+    Add [`overrides`](https://docs.npmjs.com/cli/v8/configuring-npm/package-json#overrides) property.
 
-If you use `yarn` you should add [`resolution` property](https://classic.yarnpkg.com/lang/en/docs/selective-version-resolutions/).
+    ```json
+    "overrides": {
+      "react-native-gesture-handler": <Gesture Handler version>
+    }
+    ```
 
-```json
-"resolutions": {
-  "react-native-gesture-handler": <Gesture Handler version>
-}
-```
+    After that you need to run your package manager again:
 
-If you use `npm` you should add [`overrides` property](https://docs.npmjs.com/cli/v8/configuring-npm/package-json#overrides).
+      ```bash
+    npm install
+    ```
+  </TabItem>
+  <TabItem value="yarn" label="YARN">
+    You can check which libraries are using Gesture Handler with the command:
 
-```json
-"overrides": {
-  "react-native-gesture-handler": <Gesture Handler version>
-}
-```
+    ```bash
+    yarn why react-native-gesture-handler
+    ```
 
-After that you need to run your package manager again
+    Add [`resolutions`](https://classic.yarnpkg.com/lang/en/docs/selective-version-resolutions/) property.
 
-```bash
-yarn
-```
+    ```json
+    "resolutions": {
+      "react-native-gesture-handler": <Gesture Handler version>
+    }
+    ```
 
-or
+    After that you need to run your package manager again:
 
-```bash
-npm install
-```
+    ```bash
+    yarn
+    ```
+  </TabItem>
+</Tabs>