Docusaurus v3 upgrade

CONTRIBUTING.md

@@ -76,3 +76,9 @@ export default ExampleCodeBlock = () => (
   </View>
 ```
 ````
+
+## Swizzled components and upgrades
+
+To allow customization of pre-built theme components, Docusaurus has a feature called [swizzling](https://docusaurus.io/docs/swizzling), which either allows creating a wrapper around the existing component, or creating a copy of it that can be modified.
+
+It's totally fine to swizzle components, even "unsafe" ones, but take care to minimize changes so that it's easy to upgrade components to their latest versions later on.

docs/archive/PristineExpoProject.md

@@ -28,14 +28,14 @@ Keep in mind you may have to adopt the following steps for a different package m
 
 ### Project Initialization
 
-```terminal
+```bash
 npx ignite-cli new PizzaApp --yes
 cd PizzaApp
 ```
 
 ### Filesystem Changes
 
-```terminal
+```bash
 rm -rf android
 rm -rf ios
 rm index.js          # Expo's entry point is App.js
@@ -44,13 +44,13 @@ rm metro.config.js   # Expo will use the default
 
 ### Package Changes
 
-```terminal
+```bash
 yarn remove react-native-bootsplash
 ```
 
 Removes a native library pertaining to the splash screen (this will be handled via `expo-splash-screen`)
 
-```terminal
+```bash
 yarn remove expo-modules-core
 ```
 

docs/recipes/EASUpdate.md

@@ -18,7 +18,7 @@ This guide will teach you how to set up over-the-air (OTA) updates with Expo and
 
 You'll also need `eas-cli` globally installed and and an [Expo account](https://expo.dev/signup) if you don't already have one.
 
-```console
+```bash
 npm install -g eas-cli
 ```
 

docs/recipes/ExpoRouter.md

@@ -24,14 +24,14 @@ Ignite v9 is fully equipped to utilize `expo-router` after dependency installati
 
 Bootstrap a new Ignite project:
 
-```terminal
+```bash
 npx ignite-cli@next new pizza-router --yes
 cd pizza-router
 ```
 
 Add the missing dependencies `expo-router` needs:
 
-```terminal
+```bash
 npx expo install expo-router expo-constants
 ```
 
@@ -73,7 +73,7 @@ Change the entry point that `expo-router` expects in `package.json`:
 
 Expo Router requires route files to live in either `app` or `src/app` directories. But since our Ignite project is already using `app`, we'll need to rename it to `src`. We'll create `src/app` to contain all the file-base routing files from here on out, and models, components and other shared files will be located in the `src` directory now. We'll also remove `App.tsx` as this is no longer the entry point of the application.
 
-```terminal
+```bash
 rm App.tsx
 mv app src
 mkdir src/app
@@ -254,7 +254,7 @@ export default function Root() {
 
 Move `ErrorBoundary` out of `screens/ErrorScreen` and into `src/components/ErrorBoundary`:
 
-```terminal
+```bash
 mkdir src/components/ErrorBoundary
 mv src/screens/ErrorScreen/* src/components/ErrorBoundary
 ```
@@ -1311,7 +1311,7 @@ The Showroom screen has some supporting components it needs that only applies to
 
 To adhere to this, we'll move the supporting components to `src/components/Showroom` and import them from their in our `src/app/(app)/(tabs)/showroom.tsx`.
 
-```terminal
+```bash
 mv src/screens/DemoShowroomScreen src/components/Showroom
 rm src/components/Showroom/DemoShowroomScreen.tsx
 ```
@@ -1653,7 +1653,7 @@ If you head on over to the web app at `http://localhost:8081/showroom?itemSlug=v
 
 We can emulate [deep links in Expo Go](https://docs.expo.dev/guides/linking/#testing-urls) with the command:
 
-```terminal
+```bash
 npx uri-scheme open exp://localhost:8081/--/showroom --ios
 ```
 
@@ -1665,7 +1665,7 @@ We get that universal linking for free with `expo-router`!
 
 Now that we have the boilerplate up and running again, let's clean some of the screen and navigation files that are no longer needed.
 
-```terminal
+```bash
 rm src/app.tsx
 rm -rf src/screens
 rm -rf src/navigators

docs/recipes/MigratingToMMKV.md

@@ -19,7 +19,7 @@ In this recipe, we'll convert our the Ignite demo project from using `AsyncStora
 
 We'll get started by igniting a new application with the `cng` workflow. We must do this since `react-native-mmkv` contains native dependencies not included in the Expo SDK. Luckily with Ignite CLI, it's easy to jump into this workflow:
 
-```nodejs
+```bash
 npx ignite-cli new PizzaApp --workflow=cng --yes
 cd PizzaApp
 ```
@@ -28,7 +28,7 @@ cd PizzaApp
 
 Install the `react-native-mmkv` dependency into the project and run prebuild again to let Expo take care of the necessary adjustments to the native template.
 
-```nodejs
+```bash
 yarn add react-native-mmkv
 yarn prebuild
 ```

docs/recipes/PatchingBuildingAndroid.md

@@ -90,6 +90,6 @@ In your `.gitignore`, remove the line which ignores the `/android/` directory. W
 _10 - Update Project's React-Native_
 
 Now that you have build and pushed your changes, you can reference that in your application's `package.json`.
-![package json](<../../static//img/PatchingBuildingAndroid
+![package json](<../../static//img/PatchingBuildingAndroid(4).jpg>)
 
 > Note: You'll most likely need to delete/re-install your node_modules as well as run `./android/gradlew clean`.

docs/recipes/PrepForEASBuild.md

@@ -18,13 +18,13 @@ This guide will teach you how to set up an [Expo development build](https://docs
 
 Start with a fresh Ignite app, but choose the `prebuild` workflow:
 
-```console
+```bash
 npx ignite-cli@latest new PizzaApp --workflow=prebuild --yes
 ```
 
 You'll also need `eas-cli` globally installed and and an [Expo account](https://expo.dev/signup) if you don't already have one.
 
-```console
+```bash
 npm install -g eas-cli
 ```
 
@@ -33,7 +33,7 @@ _Optional_: You can use EAS builds for free, however there is a queue time to wa
 <details>
 <summary><strong>iOS</strong></summary>
 
-```console
+```bash
 brew install cocoapods fastlane
 ```
 
@@ -52,19 +52,19 @@ SDK and NDK
 
 From within your project directory, run the following:
 
-```console
+```bash
 yarn add expo-dev-client
 ```
 
 Create or link an EAS project.
 
-```console
+```bash
 eas init
 ```
 
 You'll be asked to select your EAS account if you're linked to multiple and if you'd like to create a new project. Afterwards, you'll see a warning like this:
 
-```console
+```bash
 Warning: Your project uses dynamic app configuration, and the EAS project ID can't automatically be added to it.
 https://docs.expo.dev/workflow/configuration/#dynamic-configuration-with-appconfigjs
 
@@ -85,7 +85,7 @@ Simply open `app.json` and add the `extra` key somewhere under the `expo` key in
 
 Configure the project to support EAS Build.
 
-```console
+```bash
 eas build:configure
 ```
 
@@ -121,21 +121,21 @@ Ignite 9 comes with some build profiles already set up for you. You can view the
 
 **Using EAS build servers**
 
-```console
+```bash
 eas build --profile preview
 ```
 
 Once complete, you can download the Android `apk` or iOS `tar` file.
 
 **Build Locally**
 
-```console
+```bash
 eas build --profile preview --local
 ```
 
 Your app will be saved in the root directory unless you specify the desired directory with the environment variable `EAS_LOCAL_BUILD_ARTIFACTS_DIR`, for example:
 
-```console
+```bash
 EAS_LOCAL_BUILD_ARTIFACTS_DIR=build eas build --profile preview --local
 ```
 

docs/recipes/ReactNativeVisionCamera.md

@@ -22,14 +22,14 @@ In this example, we'll take a look at wiring up a barcode scanner. This tutorial
 
 If you haven't already, spin up a new Ignite application:
 
-```terminal
+```bash
 npx ignite-cli@latest new PizzaApp --remove-demo --workflow=prebuild --yes
 cd PizzaApp
 ```
 
 Next, let's install the necessary dependencies. You can see complete installation instructions for `react-native-vision-camera` [here](https://react-native-vision-camera.com/docs/guides).
 
-```terminal
+```bash
 npx expo install react-native-vision-camera
 ```
 
@@ -63,7 +63,7 @@ Add the plugin to `app.json` as per the documentation. It'll look like the follo
 
 To get this native dependency working in our project, we'll need to run prebuild so Expo can execute the proper native code changes for us. Then we can boot up the app on a device.
 
-```terminal
+```bash
 npx expo prebuild
 yarn android
 ```
@@ -142,7 +142,7 @@ const $container: ViewStyle = {
 
 Before we get to displaying the camera for scanning, let's quickly set up a new store in MST for keeping our list of codes and a screen to view them. Generate the commands using the Ignite CLI:
 
-```terminal
+```bash
 npx ignite-cli@next g model CodeStore
 npx ignite-cli@next g screen Codes
 ```

docs/recipes/Redux.md

@@ -14,7 +14,7 @@ publish_date: 2024-01-16
 
 This guide will show you how to migrate a MobX-State-Tree project (Ignite's default) to Redux, using a newly created Ignite project as our example:
 
-```terminal
+```bash
 npx ignite-cli new ReduxApp --yes --removeDemo
 ```
 

docs/recipes/RemoveMobxStateTree.md

@@ -25,7 +25,7 @@ yarn remove mobx mobx-react-lite mobx-state-tree reactotron-mst
 
 2. Ignite places all MobX-State-Tree models in the `models/`. Remove this entire directory and all files within it, these are not needed anymore.
 
-```terminal
+```bash
 rm -rf ./app/models
 ```
 

docs/recipes/UpdatingDependencies.md

@@ -15,7 +15,7 @@ If you get a bunch of warnings in the git command output about vulnerabilities,
 
 Usage:
 
-```console
+```bash
 yarn audit
 ```
 
@@ -25,7 +25,7 @@ yarn audit
 
 Usage:
 
-```console
+```bash
 yarn outdated
 ```
 
@@ -35,7 +35,7 @@ yarn outdated
 
 Usage:
 
-```console
+```bash
 yarn upgrade-interactive
 yarn upgrade-interactive --latest
 ```

docs/recipes/Zustand.md

@@ -17,7 +17,7 @@ Its a relatively simple and unopinionated option to manage application state, wi
 
 This guide will show you how to migrate a MobX-State-Tree project (Ignite's default) to Zustand, using a new Ignite project as an example:
 
-```terminal
+```bash
 npx ignite-cli new ZustandApp --yes
 ```
 
@@ -31,13 +31,13 @@ Our Ignite Demo App includes a few MobX-State-Tree models inside `app/models`. B
 
 First, add `zustand`:
 
-```terminal
+```bash
 yarn add zustand
 ```
 
 Create a directory for our new Zustand store files:
 
-```terminal
+```bash
 mkdir app/store
 ```