feat: test capacitorjs

.gitignore

@@ -23,3 +23,6 @@ vite.config.*.mjs
 
 apps/renderer/dev-dist
 tsconfig.tsbuildinfo
+
+ios
+android

apps/renderer/src/App.tsx

@@ -1,8 +1,13 @@
+import type { URLOpenListenerEvent } from "@capacitor/app"
+import { App as CapacitorApp } from "@capacitor/app"
+import { CapacitorHttp } from "@capacitor/core"
 import { isMobile } from "@follow/components/hooks/useMobile.js"
 import { IN_ELECTRON } from "@follow/shared/constants"
+import { env } from "@follow/shared/env"
 import { cn, getOS } from "@follow/utils/utils"
 import { useEffect } from "react"
 import { Outlet } from "react-router"
+import { toast } from "sonner"
 
 import { queryClient } from "~/lib/query-client"
 
@@ -32,6 +37,29 @@ function App() {
     return cleanup
   }, [])
 
+  useEffect(() => {
+    CapacitorApp.addListener("appUrlOpen", async (event: URLOpenListenerEvent) => {
+      const authUrl = new URL(event.url)
+      const token = authUrl.searchParams.get("token")
+      if (token) {
+        try {
+          await CapacitorHttp.get({
+            url: `${env.VITE_API_URL}/auth/session`,
+            headers: {
+              Cookie: `authjs.session-token=${token}`,
+            },
+          })
+        } catch (e) {
+          toast.error(`Login failed ${e}`)
+        }
+      }
+    })
+
+    return () => {
+      CapacitorApp.removeAllListeners()
+    }
+  }, [])
+
   const windowsElectron = IN_ELECTRON && getOS() === "Windows"
   return (
     <RootProviders>

apps/renderer/src/modules/user/LoginButton.tsx

@@ -1,5 +1,7 @@
+import { Capacitor } from "@capacitor/core"
 import { UserArrowLeftIcon } from "@follow/components/icons/user.jsx"
 import { ActionButton } from "@follow/components/ui/button/index.js"
+import { env } from "@follow/shared/env"
 import type { FC } from "react"
 import { useTranslation } from "react-i18next"
 
@@ -36,5 +38,9 @@ export const LoginButton: FC<LoginProps> = (props) => {
       <UserArrowLeftIcon className="size-4" />
     </ActionButton>
   )
-  return method === "modal" ? Content : <a href="/login">{Content}</a>
+  return method === "modal" ? (
+    Content
+  ) : (
+    <a href={Capacitor.isNativePlatform() ? `${env.VITE_WEB_URL}/login` : "/login"}>{Content}</a>
+  )
 }

capacitor.config.ts

@@ -0,0 +1,31 @@
+import type { CapacitorConfig } from "@capacitor/cli"
+
+// <key>CFBundleURLTypes</key>
+// <array>
+//   <dict>
+//     <key>CFBundleURLName</key>
+//     <string>com.example.app</string>
+//     <key>CFBundleURLSchemes</key>
+//     <array>
+//       <string>follow</string>
+//     </array>
+//   </dict>
+// </array>
+// <key>WKAppBoundDomains</key>
+// <array>
+//   <string>app.follow.is</string>
+//   <string>api.follow.is</string>
+// </array>
+
+const config: CapacitorConfig = {
+  appId: "com.example.app",
+  appName: "Follow",
+  webDir: "out/web",
+  plugins: {
+    CapacitorHttp: {
+      enabled: true,
+    },
+  },
+}
+
+export default config

package.json

@@ -42,8 +42,15 @@
     "typecheck": "turbo typecheck",
     "update:main-hash": "tsx plugins/vite/generate-main-hash.ts"
   },
+  "dependencies": {
+    "@capacitor/android": "^6.2.0",
+    "@capacitor/app": "^6.0.2",
+    "@capacitor/core": "^6.2.0",
+    "@capacitor/ios": "^6.2.0"
+  },
   "devDependencies": {
     "@babel/generator": "7.26.2",
+    "@capacitor/cli": "^6.2.0",
     "@clack/prompts": "0.8.2",
     "@egoist/tailwindcss-icons": "1.8.1",
     "@electron-forge/cli": "7.6.0",