Added some F-Droid apps

components/AppCard.tsx

@@ -1,5 +1,8 @@
 import Image from "next/legacy/image"
-import { FormattedMessage } from "react-intl"
+import { FormattedMessage, useIntl } from "react-intl"
+
+import FDroidLogo from "../public/badges/f-droid-logo.svg"
+import GooglePlayLogo from "../public/badges/google-play-logo.svg"
 
 export type AppCardProps = {
   name: React.ReactNode
@@ -14,7 +17,12 @@ export type AppCardProps = {
  * Renders a card with app data.
  * Layout (width, height, positioning) can be set from the parent.
  */
-export const AppCard = ({ name, icon, url, paid, category, categoryLabel }) => {
+export const AppCard = ({ name, icon, url, fdroid, gplay, paid, category, categoryLabel }) => {
+  const intl = useIntl()
+  if (!url && (fdroid || gplay)) {
+    if (gplay) url = `https://play.google.com/store/apps/details?id=${gplay}`;
+    if (fdroid) url = `https://f-droid.org/${intl.locale}/packages/${fdroid}`; // default to the better one
+  }
   return (
     <a
       key={`${url} ${name}`}
@@ -39,6 +47,19 @@ export const AppCard = ({ name, icon, url, paid, category, categoryLabel }) => {
           <span dir="ltr">{name}</span>
         </h3>
       </div>
+      <div className="flex flex-col float-right">
+        {/*what about just turning the opacity down if it's no available there?*/}
+        {fdroid ?
+          <Image
+            onClick={() => window.open(`https://f-droid.org/${intl.locale}/packages/${fdroid}`)}
+            src={FDroidLogo} alt="Logo for F-Droid" width={25} height={25} />
+          : undefined}
+        {gplay ?
+          <Image
+            onClick={() => window.open(`https://play.google.com/store/apps/details?id=${gplay}`)}
+            src={GooglePlayLogo} alt="Logo for Google Play" width={25} height={25} />
+          : undefined}
+      </div>
     </a>
   )
-}
+}

components/AppsGrid.tsx

@@ -29,14 +29,12 @@ export const AppsGrid = ({ apps }: AppsGridProps) => {
   /** normalizing the apps dictionary as an array */
   const allApps = Object.entries(apps)
     .map(([category, apps]) =>
-      apps.map(({ name, icon, url, paid, released_on, hidden_from_all }) => ({
-        name,
-        icon,
-        url,
-        paid: paid ?? false,
-        hidden_from_all: hidden_from_all ?? false,
-        released_on: new Date(released_on) ?? null,
+      apps.map(x => ({
+        ...x,
         category,
+        paid: x.paid ?? false,
+        hidden_from_all: x.hidden_from_all ?? false,
+        released_on: new Date(x.released_on) ?? null,
         categoryLabel: categories.find((c) => c.key === category)["label"],
       }))
     )

data/apps.ts

@@ -55,6 +55,9 @@ import bubble from "../public/apps/bubble.png"
 import odous from "../public/apps/odous.png"
 import dowstodon from "../public/apps/dowstodon.png"
 import fread from "../public/apps/fread.png"
+import raccoon from "../public/apps/raccoonforfriendica.png"
+import husky from "../public/apps/husky.png"
+import shitter from "../public/apps/shitter.png"
 
 import type { StaticImageData } from "next/legacy/image"
 
@@ -66,7 +69,11 @@ export type appsList = {
     /** app's icon or logo */
     icon: StaticImageData
     /** link to the app on its website or respective app store */
-    url: string
+    url?: string
+    /** package name on fdroid */
+    fdroid?: string
+    /** package name on google play */
+    gplay?: string
     /** the date the app was first released on */
     released_on?: string
     /** whether the app requires a fee to access. defaults to false */
@@ -83,83 +90,102 @@ export const apps: appsList = {
       released_on: "Nov 23, 2023",
       name: "Rodent",
       icon: rodent,
-      url: "https://play.google.com/store/apps/details?id=social.rodent",
+      gplay: "social.rodent",
       paid: false,
     },
     {
       released_on: "May 21, 2023",
       name: "Focus",
       icon: focus,
-      url: "https://play.google.com/store/apps/details?id=allen.town.focus.mastodon",
+      gplay: "allen.town.focus.mastodon",
+      fdroid: "allen.town.focus.mastodon",
       paid: false,
     },
     {
       released_on: "Mar 15, 2017",
       name: "Tusky",
       icon: tusky,
-      url: "https://play.google.com/store/apps/details?id=com.keylesspalace.tusky",
+      gplay: "com.keylesspalace.tusky",
+      fdroid: "com.keylesspalace.tusky",
     },
     {
       released_on: "Apr 23, 2017",
       name: "Subway Tooter",
       icon: subwayTooter,
-      url: "https://play.google.com/store/apps/details?id=jp.juggler.subwaytooter",
+      gplay: "jp.juggler.subwaytooter",
     },
     {
       released_on: "May 18, 2019",
       name: "Fedilab",
       icon: fedilab,
-      url: "https://play.google.com/store/apps/details?id=app.fedilab.android",
+      gplay: "app.fedilab.android",
       paid: false,
     },
     {
       released_on: "Apr 16, 2021",
       name: "tooot",
       icon: tooot,
-      url: "https://play.google.com/store/apps/details?id=com.xmflsct.app.tooot",
+      gplay: "com.xmflsct.app.tooot",
+      fdroid: "fr.gouv.etalab.mastodon", // ¯\_(ツ)_/¯
       hidden_from_all: true,
     },
     {
       released_on: "Jan 26, 2023",
       name: "Trunks",
       icon: trunks,
-      url: "https://play.google.com/store/apps/details?id=com.decad3nce.trunks",
+      gplay: "com.decad3nce.trunks",
       paid: false,
       hidden_from_all: true,
     },
     {
       released_on: "Dec 6, 2022",
       name: "Moshidon",
       icon: moshidon,
-      url: "https://play.google.com/store/apps/details?id=org.joinmastodon.android.moshinda",
+      gplay: "org.joinmastodon.android.moshinda",
+      fdroid: "org.joinmastodon.android.moshinda",
       paid: false,
     },
     {
       released_on: "Jan 31, 2023",
       name: "Buffer",
       icon: buffer,
-      url: "https://play.google.com/store/apps/details?id=org.buffer.android",
+      gplay: "org.buffer.android",
       hidden_from_all: true,
     },
     {
       released_on: "Feb 21, 2023",
       name: "ZonePane",
       icon: zonepane,
-      url: "https://play.google.com/store/apps/details?id=com.zonepane",
+      gplay: "com.zonepane",
       paid: false,
     },
     {
       released_on: "Sep 6, 2023",
       name: "Pachli",
       icon: pachli,
-      url: "https://play.google.com/store/apps/details?id=app.pachli",
+      gplay: "app.pachli",
+      fdroid: "app.pachli",
       paid: false,
     },
     {
       released_on: "Aug 1, 2024",
       name: "Fread",
       icon: fread,
-      url: "https://play.google.com/store/apps/details?id=com.zhangke.fread",
+      gplay: "com.zhangke.fread",
+      paid: false,
+    },
+    {
+      released_on: "Apr 17, 2024",
+      name: "Husky",
+      icon: husky,
+      fdroid: "su.xash.husky",
+      paid: false,
+    },
+    {
+      released_on: "Nov 13, 2024",
+      name: "Raccoon",
+      icon: raccoon,
+      fdroid: "com.livefast.eattrash.raccoonforfriendica",
       paid: false,
     },
   ],