Add tab view and drawer to the docs

Author: satya164

Diff for: blog/2018-04-06-react-navigation-2.0-rc.md

@@ -11,7 +11,7 @@ Exactly two months after the release of React Navigation 1.0, we are close to an
 
 <!--truncate-->
 
-```sh
+```bash
 yarn add react-navigation@^2.0.0-rc.1
 ```
 

Diff for: blog/2021-03-12-react-navigation-6.0-next.md

@@ -29,7 +29,7 @@ We'll share few highlights of the release in this blog post. If you're looking f
 
 If you'd like to try it out, add `@^6.x` to the package, you're installing. For example:
 
-```sh npm2yarn
+```bash npm2yarn
 npm install @react-navigation/native@^6.x @react-navigation/stack@^6.x
 ```
 

Diff for: static/assets/libraries/tab-view.gif

@@ -120,7 +120,7 @@ In Xcode, open the project at `SimpleApp/ios/SimpleApp.xcodeproj`. Select the pr
 
 Now you can press play in Xcode, or re-build on the command line:
 
-```sh
+```bash
 react-native run-ios
 ```
 
@@ -160,7 +160,7 @@ In `SimpleApp/android/app/src/main/AndroidManifest.xml`, do these followings adj
 
 Now, re-install the app:
 
-```sh
+```bash
 react-native run-android
 ```
 

Diff for: versioned_docs/version-1.x/deep-linking.md

@@ -120,7 +120,7 @@ In Xcode, open the project at `SimpleApp/ios/SimpleApp.xcodeproj`. Select the pr
 
 Now you can press play in Xcode, or re-build on the command line:
 
-```sh
+```bash
 react-native run-ios
 ```
 
@@ -160,7 +160,7 @@ In `SimpleApp/android/app/src/main/AndroidManifest.xml`, do these followings adj
 
 Now, re-install the app:
 
-```sh
+```bash
 react-native run-android
 ```
 

Diff for: versioned_docs/version-2.x/deep-linking.md

@@ -155,7 +155,7 @@ In Xcode, open the project at `SimpleApp/ios/SimpleApp.xcodeproj`. Select the pr
 
 Now you can press play in Xcode, or re-build on the command line:
 
-```sh
+```bash
 react-native run-ios
 ```
 
@@ -195,7 +195,7 @@ In `SimpleApp/android/app/src/main/AndroidManifest.xml`, do these followings adj
 
 Now, re-install the app:
 
-```sh
+```bash
 react-native run-android
 ```
 

Diff for: versioned_docs/version-3.x/deep-linking.md

@@ -44,7 +44,7 @@ Next, if you are not using the Expo managed workflow then you need to link these
 
   On iOS, to complete the linking, make sure you have [Cocoapods](https://cocoapods.org/) installed. Then run:
 
-  ```sh
+  ```bash
   cd ios
   pod install
   cd ..
@@ -56,7 +56,7 @@ Next, if you are not using the Expo managed workflow then you need to link these
 
   If you're on an older React Native version, you need to manually link the dependencies. To do that, run:
 
-  ```sh
+  ```bash
   react-native link react-native-reanimated
   react-native link react-native-gesture-handler
   ```

Diff for: versioned_docs/version-3.x/getting-started.md

@@ -101,7 +101,7 @@ The reason that is necessary to use `Linking.createURL` is that the scheme will
 
 To test the URI on the simulator in the Expo client app, run the following:
 
-```sh
+```bash
 xcrun simctl openurl booted [ put your URI prefix in here ]
 
 // for example
@@ -113,7 +113,7 @@ xcrun simctl openurl booted exp://127.0.0.1:19000/--/chat/Eric
 
 To test the intent handling in the Expo client app on Android, run the following:
 
-```sh
+```bash
 adb shell am start -W -a android.intent.action.VIEW -d "[ put your URI prefix in here ]" host.exp.exponent
 
 # for example
@@ -145,7 +145,7 @@ Let's configure the native iOS app to open based on the `mychat://` URI scheme.
 
 In `SimpleApp/ios/SimpleApp/AppDelegate.m`:
 
-```sh
+```bash
 // Add the header at the top of the file:
 #import <React/RCTLinkingManager.h>
 
@@ -163,13 +163,13 @@ In Xcode, open the project at `SimpleApp/ios/SimpleApp.xcodeproj`. Select the pr
 
 Now you can press play in Xcode, or re-build on the command line:
 
-```sh
+```bash
 react-native run-ios
 ```
 
 To test the URI on the simulator, run the following:
 
-```sh
+```bash
 xcrun simctl openurl booted mychat://chat/Eric
 ```
 
@@ -184,7 +184,7 @@ In `SimpleApp/android/app/src/main/AndroidManifest.xml`, do these followings adj
 1. Set `launchMode` of `MainActivity` to `singleTask` in order to receive intent on existing `MainActivity`. It is useful if you want to perform navigation using deep link you have been registered - [details](http://developer.android.com/training/app-indexing/deep-linking.html#adding-filters)
 2. Add the new `intent-filter` inside the `MainActivity` entry with a `VIEW` type action:
 
-```sh
+```bash
 <activity
     android:name=".MainActivity"
     android:launchMode="singleTask">
@@ -203,13 +203,13 @@ In `SimpleApp/android/app/src/main/AndroidManifest.xml`, do these followings adj
 
 Now, re-install the app:
 
-```sh
+```bash
 react-native run-android
 ```
 
 To test the intent handling in Android, run the following:
 
-```sh
+```bash
 adb shell am start -W -a android.intent.action.VIEW -d "mychat://chat/Eric" com.simpleapp
 ```
 

Diff for: versioned_docs/version-4.x/deep-linking.md

@@ -40,7 +40,7 @@ The libraries we will install now are [`react-native-gesture-handler`](https://g
 
 In your project directory, run:
 
-```sh
+```bash
 npx expo install react-native-gesture-handler react-native-reanimated react-native-screens react-native-safe-area-context @react-native-community/masked-view
 ```
 
@@ -66,15 +66,15 @@ Next, we need to link these libraries. The steps depends on your React Native ve
 
   If you're on a Mac and developing for iOS, you need to install pods to complete the linking. Make sure you have [Cocoapods](https://cocoapods.org/) installed. Then run:
 
-  ```sh
+  ```bash
   cd ios; pod install; cd ..
   ```
 
 - **React Native 0.59 and lower**
 
   If you're on an older React Native version, you need to manually link the dependencies. To do that, run:
 
-  ```sh
+  ```bash
   react-native link react-native-reanimated
   react-native link react-native-gesture-handler
   react-native link react-native-screens
@@ -99,7 +99,7 @@ Next, we need to link these libraries. The steps depends on your React Native ve
 
   Now, run the `postinstall` script manually:
 
-  ```sh
+  ```bash
   npm run postinstall
   ```
 

Diff for: versioned_docs/version-4.x/getting-started.md

@@ -19,13 +19,13 @@ If the module points to a local file (i.e. the name of the module starts with `.
 
 If you're using Expo, run:
 
-```sh
+```bash
 expo start -c
 ```
 
 If you're not using Expo, run:
 
-```sh
+```bash
 npx react-native start --reset-cache
 ```
 
@@ -43,21 +43,21 @@ This and some similar errors might occur if you didn't link the [`react-native-g
 
   On newer versions of React Native, [linking is automatic](https://github.com/react-native-community/cli/blob/master/docs/autolinking.md), so if you have linked the library manually, first unlink it:
 
-  ```sh
+  ```bash
   react-native unlink react-native-gesture-handler
   ```
 
   If you're testing on iOS and use Mac, make sure you have run `pod install` in the `ios/` folder:
 
-  ```sh
+  ```bash
   cd ios; pod install; cd ..
   ```
 
 - **React Native 0.59 and lower**
 
   If you're on an older React Native version, you need to manually link the library. To do that, run:
 
-  ```sh
+  ```bash
   react-native link react-native-gesture-handler
   ```
 
@@ -67,7 +67,7 @@ Now rebuild the app and test on your device or simulator.
 
 This error can often happen if you have a Babel plugin that compiles the code in a non-spec compliant way. For example:
 
-```sh
+```bash
 ["@babel/plugin-proposal-class-properties", { "loose": true}]
 ```
 
@@ -91,13 +91,13 @@ If you have additional options configured here, try removing them to see if it f
 
 If you're using Expo, run:
 
-```sh
+```bash
 expo start -c
 ```
 
 If you're not using Expo, run:
 
-```sh
+```bash
 npx react-native start --reset-cache
 ```
 

Diff for: versioned_docs/version-4.x/troubleshooting.md

@@ -76,7 +76,7 @@ The latest drawer and tabs depend on [`react-native-gesture-handler`](https://gi
 
 In your project directory, run the following:
 
-```sh
+```bash
 npx expo install react-native-gesture-handler react-native-reanimated
 ```
 
@@ -94,7 +94,7 @@ Next, we need to link these libraries. The steps depends on your React Native ve
 
   To complete the linking on iOS, make sure you have [Cocoapods](https://cocoapods.org/) installed. Then run:
 
-  ```sh
+  ```bash
   cd ios
   pod install
   cd ..
@@ -104,7 +104,7 @@ Next, we need to link these libraries. The steps depends on your React Native ve
 
   If you're on an older React Native version, you need to manually link the dependencies. To do that, run:
 
-  ```sh
+  ```bash
   react-native link react-native-reanimated
   react-native link react-native-gesture-handler
   ```

Diff for: versioned_docs/version-4.x/upgrading-from-3.x.md

@@ -688,7 +688,7 @@ In the example app, you will use the Expo managed workflow. The guide will focus
 
 First, you need to decide the navigation structure of your app. To keep it simple, the main navigator will be bottom-tabs navigator with two screens. Its first screen will be a simple stack navigator, called `HomeStack`, with two screens: `Home` and `Profile`, and the second tabs screen will be just a simple one without any nested navigators, called `Settings`:
 
-```sh
+```bash
 BottomTabs
 ├── Stack (HomeStack)
 │   ├── Home

Diff for: versioned_docs/version-5.x/configuring-links.md

@@ -111,7 +111,7 @@ Much like the issue template, the [pull request template](https://github.com/rea
 - Fork the [`repo`](https://github.com/react-navigation/react-navigation) on GitHub
 - Run these commands in the terminal to download locally and install it:
 
-```sh
+```bash
 git clone https://github.com/<USERNAME>/navigation-ex.git
 cd navigation-ex
 git remote add upstream https://github.com/react-navigation/react-navigation.git
@@ -124,25 +124,25 @@ The project uses a monorepo structure for the packages managed by [yarn workspac
 
 Look around. Match the style of the rest of the codebase. This project uses ESLint to ensure consistency throughout the project. You can check your project by running:
 
-```sh
+```bash
 yarn lint
 ```
 
 If any errors occur you'll either have to manually fix them or you can attempt to automatically fix them by running:
 
-```sh
+```bash
 yarn lint --fix
 ```
 
 The codebase is written in TypeScript, and must pass typecheck. To typecheck files, run:
 
-```sh
+```bash
 yarn typescript
 ```
 
 It's useful to run typechecking in watch mode when working on the project. To do it, run:
 
-```sh
+```bash
 yarn typescript --watch
 ```
 
@@ -152,21 +152,21 @@ The [example app](https://github.com/react-navigation/react-navigation/tree/main
 
 While developing, you can run the [example app](https://github.com/react-navigation/react-navigation/tree/main/example) with [Expo](https://expo.io/) to test your changes:
 
-```sh
+```bash
 yarn example start
 ```
 
 ### Run Tests
 
 React Navigation has tests implemented in [Jest](https://facebook.github.io/jest/). To run either of these, from the React Navigation directory, run either of the following commands (after installing the `node_modules`) to run tests or type-checking.
 
-```sh
+```bash
 yarn test
 ```
 
 It's useful to run tests in watch mode when working on the project. To do it, run:
 
-```sh
+```bash
 yarn test --watch
 ```