master->v10 merge up (#2760)

* docs: Add a contributing home page (#2718 by @lindboe)

[skip ci]

* Add a contributing home page

This entry point is intended for quick instruction on how to accomplish
development tasks, and then links out to deeper guides on contributing
from there.

Not sure why I had to add that full path to _category_.json when that wasn't
there before, but this was the only way to make it work locally with ir-docs

* Link to contributing docs from README

* Shorter path

Earlier test failed because IDs are case-sensitive and the casing on the
article didn't match Tour-of-Ignite

---------

Co-authored-by: Frank Calise <[email protected]>

* feat(doc): add repo URL for ir-docs (#2734)

* chore(release): 9.8.0 [skip ci]

# [9.8.0](v9.7.2...v9.8.0) (2024-08-09)

### Features

* **doc:** add repo URL for ir-docs ([#2734](#2734)) ([4f59af8](4f59af8))

* Remove demo patches along with dependencies (#2736)

* Add logic to remove patches for any demo dependencies that are also removed

* Add lint improvement

---------

Co-authored-by: Felipe Peña <[email protected]>

* docs: add component screenshots (#2739 by @jmejiamu)

Co-authored-by: Frank Calise <[email protected]>

* fix(boilerplate): remove GestureHandlerRootView (#2738 by @frankcalise)

[skip ci]

* fix: support component testing (#2740 by @lindboe)

There were some issues with out-of-date config when setting up component
testing for the first time.

This PR removes old configuration that's no longer necessary, and adds
tests to ensure component testing continues to work.

* chore(release): 9.8.1 [skip ci]

## [9.8.1](v9.8.0...v9.8.1) (2024-08-13)

### Bug Fixes

* support component testing ([#2740](#2740) by [@lindboe](https://github.com/lindboe)) ([c7edf45](c7edf45))
* **boilerplate:** remove GestureHandlerRootView ([#2738](#2738) by [@frankcalise](https://github.com/frankcalise)) ([437e755](437e755))

* docs: add Robin's CR 2024 talk link (#2741 by @frankcalise)

Co-authored-by: Jamon Holmgren <[email protected]>
[skip ci]

* fix(cli): address outdated pkg vulnerabilities (#2733 by @frankcalise)

[skip ci]

* fix(cli): address outdated pkg vulnerabilities

* fix(cli): fix sharp

* fix(boilerplate): upgrade i18n-js (#2735 by @lindboe and @frankcalise)

* fix(boilerplate): upgrade i18n-js

* fix(boilerplate): i18n jest mock

* docs(intl): update adding languages with doc link

* docs(fix): RTL removal steps

* chore(release): 9.8.2 [skip ci]

## [9.8.2](v9.8.1...v9.8.2) (2024-08-13)

### Bug Fixes

* **boilerplate:** upgrade i18n-js ([#2735](#2735) by [@lindboe](https://github.com/lindboe) and [@frankcalise](https://github.com/frankcalise)) ([a171eae](a171eae))
* **cli:** address outdated pkg vulnerabilities ([#2733](#2733) by [@frankcalise](https://github.com/frankcalise)) ([c06d493](c06d493))

* feat(boilerplate): Make texts on demo components based on i18n (#2721 by @kei95)

* chore(release): 9.9.0 [skip ci]

# [9.9.0](v9.8.2...v9.9.0) (2024-08-20)

### Features

* **boilerplate:** Make texts on demo components based on i18n ([#2721](#2721) by [@kei95](https://github.com/kei95)) ([9695670](9695670))

* docs(boilerplate): Punjabi is not RTL 😅 (#2751 by @jamonholmgren)

Via: https://twitter.com/IndicGames/status/1825949273147716072

* docs: Fixed documentation link in Button (#2755 by @softwarebyze)

* Missed merge conflict

* Update snapshot for v10 format

* Remove vim swap file

* Some prettier fixes

---------

Co-authored-by: Frank Calise <[email protected]>
Co-authored-by: Leon Kim <[email protected]>
Co-authored-by: semantic-release-bot <[email protected]>
Co-authored-by: Felipe Peña <[email protected]>
Co-authored-by: Jose Mejia Munoz <[email protected]>
Co-authored-by: Kei Yamashita <[email protected]>
Co-authored-by: Jamon Holmgren <[email protected]>
Co-authored-by: Zachary Ebenfeld <[email protected]>

README.md

@@ -15,9 +15,46 @@ This is the React Native boilerplate that the [Infinite Red](https://infinite.re
 
 ## Intro Videos
 
-- Check out the [Getting Started with Ignite](https://www.youtube.com/watch?v=KOSvDlFyg20) video for a 13 minute overview!
-- Jamon's Code Quest on [Ignite 9](https://www.youtube.com/watch?v=QmkMsUYrTlk)
-- Jamon's Code Quest on [MobX-State-Tree](https://www.youtube.com/watch?v=n_VjjJxyd8Q)
+Here are a few videos / talks that introduce Ignite and show off some of its features. Check them out!
+
+<table>
+  <tr>
+    <td width="50%">
+      <figure>
+        <a href="https://www.youtube.com/watch?v=KOSvDlFyg20">
+          <img src="https://img.youtube.com/vi/KOSvDlFyg20/sddefault.jpg" alt="Getting Started with Ignite"  width="100%" /><br />
+        <figcaption><strong>Getting Started with Ignite</strong></figcaption>
+        </a>
+      </figure>
+    </td>
+    <td>
+      <figure>
+        <a href="https://www.youtube.com/watch?v=dNWkJOpD6YE&list=PLFHvL21g9bk0XOO9XK6d6S9w1jBU6Dz_U&index=16">
+          <img src="https://img.youtube.com/vi/dNWkJOpD6YE/sddefault.jpg" alt="Sweetening React Native Development With Ignite" width="100%" /><br />
+        <figcaption><strong>Ignite talk at Chain React 2024 - Robin Heinze</strong></figcaption>
+        </a>
+      </figure>
+    </td>
+  </tr>
+  <tr>
+    <td>
+      <figure>
+        <a href="https://www.youtube.com/watch?v=QmkMsUYrTlk">
+          <img src="https://img.youtube.com/vi/QmkMsUYrTlk/sddefault.jpg" alt="Jamon's Code Quest on Ignite 9" width="100%" /><br />
+        <figcaption><strong>What's new in Ignite 9</strong></figcaption>
+        </a>
+      </figure>
+    </td>
+    <td>
+      <figure>
+        <a href="https://www.youtube.com/watch?v=n_VjjJxyd8Q">
+          <img src="https://img.youtube.com/vi/n_VjjJxyd8Q/sddefault.jpg" alt="Jamon's Code Quest on MobX-State-Tree" width="100%" /><br />
+        <figcaption><strong>Intro to MobX-State-Tree</strong></figcaption>
+        </a>
+      </figure>
+    </td>
+  </tr>
+</table>
 
 ## [Full Documentation](https://github.com/infinitered/ignite/blob/master/docs/README.md)
 
@@ -89,6 +126,10 @@ If you run into problems, first search the issues and discussions in this reposi
 
 If you still need help after reaching out to the proper channels, feel free to open a new GitHub issue via `npx ignite-cli issue "Unable to Ignite new app"` (as an example). This will help start writing your issue with the correct diagnostic information included.
 
+## Contributing to Ignite
+
+Want to contribute to Ignite? Check out [the contributing guide](./docs/contributing/Contributing-To-Ignite.md) for more info on how to work with the codebase.
+
 ## Need Inspiration?
 
 If you need battle-tested solutions from Infinite Red experts on everything from Accessibility, to CI/CD configuration, head to [Ignite Cookbook](https://ignitecookbook.com) for code snippets from our team and the community!

boilerplate/app/app.tsx

@@ -16,6 +16,7 @@ if (__DEV__) {
   // If you turn it off in metro.config.js, you'll have to manually import it.
   require("./devtools/ReactotronConfig.ts")
 }
+import "./utils/gestureHandler"
 import "./i18n"
 import "./utils/ignoreWarnings"
 import { useFonts } from "expo-font"
@@ -26,9 +27,8 @@ import { useInitialRootStore } from "./models" // @mst remove-current-line
 import { AppNavigator, useNavigationPersistence } from "./navigators"
 import { ErrorBoundary } from "./screens/ErrorScreen/ErrorBoundary"
 import * as storage from "./utils/storage"
-import { $styles, customFontsToLoad } from "./theme"
+import { customFontsToLoad } from "./theme"
 import Config from "./config"
-import { GestureHandlerRootView } from "react-native-gesture-handler"
 
 export const NAVIGATION_PERSISTENCE_KEY = "NAVIGATION_STATE"
 
@@ -106,13 +106,11 @@ function App(props: AppProps) {
   return (
     <SafeAreaProvider initialMetrics={initialWindowMetrics}>
       <ErrorBoundary catchErrors={Config.catchErrors}>
-        <GestureHandlerRootView style={$styles.flex1}>
-          <AppNavigator
-            linking={linking}
-            initialState={initialNavigationState}
-            onStateChange={onNavigationStateChange}
-          />
-        </GestureHandlerRootView>
+        <AppNavigator
+          linking={linking}
+          initialState={initialNavigationState}
+          onStateChange={onNavigationStateChange}
+        />
       </ErrorBoundary>
     </SafeAreaProvider>
   )

boilerplate/app/components/Button.tsx

@@ -86,7 +86,7 @@ export interface ButtonProps extends PressableProps {
 /**
  * A component that allows users to take actions and make choices.
  * Wraps the Text component with a Pressable component.
- * @see [Documentation and Examples]{@link https://docs.infinite.red/ignite-cli/boilerplate/components/Button/}
+ * @see [Documentation and Examples]{@link https://docs.infinite.red/ignite-cli/boilerplate/app/components/Button/}
  * @param {ButtonProps} props - The props for the `Button` component.
  * @returns {JSX.Element} The rendered `Button` component.
  * @example

boilerplate/app/components/ListView.tsx

@@ -10,7 +10,7 @@ export type ListViewProps<T> = PropsWithoutRef<FlashListProps<T>>
 /**
  * This is a Higher Order Component meant to ease the pain of using @shopify/flash-list
  * when there is a chance that a user would have their device language set to an
- * RTL language like Arabic or Punjabi. This component will use react-native's
+ * RTL language like Arabic or Persian. This component will use react-native's
  * FlatList if the user's language is RTL or FlashList if the user's language is LTR.
  *
  * Because FlashList's props are a superset of FlatList's, you must pass estimatedItemSize

boilerplate/app/components/Text.test.tsx

@@ -0,0 +1,16 @@
+import { render } from "@testing-library/react-native"
+import React from "react"
+
+import { Text } from "./Text"
+
+/* This is an example component test using react-native-testing-library. For more
+ * information on how to write your own, see the documentation here:
+ * https://callstack.github.io/react-native-testing-library/ */
+const testText = "Test string"
+
+describe("Text", () => {
+  it("should render the component", () => {
+    const { getByText } = render(<Text text={testText} />)
+    expect(getByText(testText)).toBeDefined()
+  })
+})

boilerplate/app/i18n/ar.ts

@@ -1,3 +1,4 @@
+import demoAr from "./demo-ar"
 import { Translations } from "./en"
 
 const ar: Translations = {
@@ -117,6 +118,8 @@ const ar: Translations = {
         "لم تتم اضافة اي مفضلات حتى الان. اضغط على القلب في إحدى الحلقات لإضافته الى المفضلة.",
     },
   },
+  // @demo remove-block-start
+  ...demoAr,
   // @demo remove-block-end
 }