Add Fire OS compatibility

README.md

@@ -51,6 +51,7 @@
   "expoGo": false,
   "windows": false,
   "macos": false,
+  "fireos": false,
   "tvos": false,
   "visionos": false,
   "unmaintained": false,
@@ -98,6 +99,8 @@
   **(boolean)** - works on Android device.
 - #### `ios`
   **(boolean)** - works on iOS device.
+- #### `fireos`
+  **(boolean)** - works on Amazon Fire device.
 - #### `web`
   **(boolean)** - can be used with [`react-native-web`](https://github.com/necolas/react-native-web).
 - #### `expoGo`

components/CompatibilityTags.tsx

@@ -18,6 +18,7 @@ export function CompatibilityTags({ library }: Props) {
     library.expoGo ? 'Expo Go' : null,
     library.ios ? 'iOS' : null,
     library.macos ? 'macOS' : null,
+    library.fireos ? 'Fire OS' : null,
     library.tvos ? 'tvOS' : null,
     library.visionos ? 'visionOS' : null,
     library.web ? 'Web' : null,

components/Filters/helpers.ts

@@ -15,6 +15,10 @@ export const FILTER_PLATFORMS = [
     param: 'macos',
     title: 'macOS',
   },
+  {
+    param: 'fireos',
+    title: 'Fire OS',
+  },
   {
     param: 'tvos',
     title: 'tvOS',

components/Footer.tsx

@@ -7,6 +7,7 @@ import {
   PlatformAndroid,
   PlatformIOS,
   PlatformMacOS,
+  PlatformFireOS,
   PlatformTvOS,
   PlatformVisionOS,
   PlatformWeb,
@@ -80,6 +81,12 @@ const Footer = () => {
             Icon={PlatformMacOS}
             url="https://github.com/microsoft/react-native-macos#readme"
           />
+          <Platform
+            name="Fire OS"
+            pkgName="react-native"
+            Icon={PlatformFireOS}
+            url="https://github.com/facebook/react-native#readme"
+          />
           <Platform
             name="tvOS"
             pkgName="react-native-tvos"

components/Icons/index.tsx

@@ -420,6 +420,23 @@ export function PlatformVisionOS({ width = 18, height = 18, fill = colors.black
   );
 }
 
+export function PlatformFireOS({ width = 18, height = 18, fill = colors.black }: Props) {
+  return (
+    <Svg width={width} height={height} viewBox="80 120 350 50" fill="none">
+      <Path
+        d="m 374.00642,142.18404 c -34.99948,25.79739 -85.72909,39.56123 -129.40634,39.56123 -61.24255,0 -116.37656,-22.65135 -158.08757,-60.32496 -3.2771,-2.96252 -0.34083,-6.9999 3.59171,-4.69283 45.01431,26.19064 100.67269,41.94697 158.16623,41.94697 38.774689,0 81.4295,-8.02237 120.6499,-24.67006 5.92501,-2.51683 10.87999,3.88009 5.08607,8.17965"
+        fill={fill}
+        strokeWidth="12"
+      />
+      <Path
+        d="m 388.55678,125.53635 c -4.45688,-5.71527 -29.57261,-2.70033 -40.84585,-1.36327 -3.43442,0.41947 -3.95874,-2.56925 -0.86517,-4.71905 20.00346,-14.07844 52.82696,-10.01483 56.65462,-5.2958 3.82764,4.74526 -0.99624,37.64741 -19.79373,53.35128 -2.88385,2.41195 -5.63662,1.12734 -4.35198,-2.07113 4.2209,-10.53917 13.68519,-34.16054 9.20211,-39.90203"
+        fill={fill}
+        strokeWidth="12"
+      />
+    </Svg>
+  );
+}
+
 export function ReactLogo({ width = 18, height = 18, fill = colors.black }: Props) {
   return (
     <Svg width={width} height={height} viewBox="0 0 512 512" fill="none">

pages/api/libraries/index.ts

@@ -63,6 +63,7 @@ export default function handler(req: NextApiRequest, res: NextApiResponse) {
       web: req.query.web,
       windows: req.query.windows,
       macos: req.query.macos,
+      fireos: req.query.fireos,
       expoGo: req.query.expoGo,
       tvos: req.query.tvos,
       visionos: req.query.visionos,

pages/popular.tsx

@@ -9,6 +9,7 @@ import {
   PlatformExpo,
   PlatformIOS,
   PlatformMacOS,
+  PlatformFireOS,
   PlatformTvOS,
   PlatformVisionOS,
   PlatformWeb,
@@ -65,6 +66,12 @@ const Popular = ({ data }) => {
           data={data}
           filter={lib => lib.macos === true}
         />
+        <ExploreSection
+          title="Fire OS"
+          icon={PlatformFireOS}
+          data={data}
+          filter={lib => lib.fireos === true}
+        />
         <ExploreSection
           title="tvOS"
           icon={PlatformTvOS}