chore: update open

Author: younes200

.github/workflows/pwa-build.yml

@@ -1,14 +1,17 @@
 name: Publish PWA to Github Pages
 
 on:
+  push:
+    branches:
+      - main
   workflow_dispatch:
 
 permissions:
   contents: write
 
 jobs:
   Build:
-    name: Publish PWA to Github Pages
+    name: Publish Web App to Github Pages
     runs-on: ubuntu-latest
     steps:
 
@@ -20,8 +23,8 @@ jobs:
       - name: 📦 Setup Bun + install deps
         uses: ./.github/actions/setup-bun-install
 
-      - name: ⚙️ Run Prebuild
-        run: bunx tailwind -o node_modules/.cache/nativewind/global.css.web.css && bun export
+      - name: ⚙️ Run build
+        run: bun build:web
         shell: bash
 
       - name: 📱 Publish web app

.npmrc

@@ -0,0 +1 @@
+legacy-peer-deps=true

README.md

@@ -1,6 +1,6 @@
 # Expo Local-first Template  [![Twitter](https://img.shields.io/twitter/url/https/twitter.com/cloudposse.svg?style=social&label=Follow%20%40expostarter)](https://twitter.com/expostarter)
 
-[Open in Bolt.new](https://bolt.new/~github.com/expo-starter/expo-local-first-template)
+[![Open in Bolt.new](https://www.expostarter.com/images/open-in-bolt-button.png)](https://bolt.new/~/github.com/expo-starter/expo-local-first-template)
 
 <p align="center">
   <a href="https://expostarter.com/"><img src="assets/github-banner.png?raw=true" alt="Expo Starter Kit"></a>

app.config.ts

@@ -35,7 +35,7 @@ export default ({ config }: ConfigContext): ExpoConfig => ({
     output: "static",
     favicon: "./assets/images/favicon.png",
   },
-  plugins: [["expo-router"], ["expo-sqlite"], ["expo-font"]],
+  plugins: ["expo-router", "expo-sqlite", "expo-font", "expo-web-browser"],
   experiments: {
     typedRoutes: true,
     baseUrl: "/expo-local-first-template",

app/_layout.tsx

@@ -12,6 +12,7 @@ import { NAV_THEME } from "@/lib/constants";
 import { useColorScheme } from "@/lib/useColorScheme";
 import { getItem, setItem } from "@/lib/storage";
 import { Platform } from "react-native";
+import { useFrameworkReady } from "@/hooks/useFrameworkReady";
 
 const NAV_FONT_FAMILY = "Inter-Black";
 const LIGHT_THEME: Theme = {
@@ -75,6 +76,8 @@ export default function RootLayout() {
   const { colorScheme, setColorScheme } = useColorScheme();
   const [isColorSchemeLoaded, setIsColorSchemeLoaded] = React.useState(false);
 
+  useFrameworkReady();
+
   React.useEffect(() => {
     (async () => {
       const theme = getItem("theme");
@@ -104,28 +107,24 @@ export default function RootLayout() {
   }
 
   return (
-    <>
-      <DatabaseProvider>
-        <ThemeProvider value={colorScheme === "dark" ? DARK_THEME : LIGHT_THEME}>
-          <StatusBar style={colorScheme === "dark" ? "light" : "dark"} />
-          <GestureHandlerRootView style={{ flex: 1 }}>
-            <BottomSheetModalProvider>
-              <Stack>
-                <Stack.Screen name="(tabs)" options={{ title: "Habits", headerShown: false }} />
-                <Stack.Screen options={{
-                  headerShadowVisible: false,
-                }} name="habits/archive" />
-                <Stack.Screen options={{
-                  headerShadowVisible: false,
-                }} name="habits/[id]" />
-              </Stack>
-            </BottomSheetModalProvider>
-          </GestureHandlerRootView>
-        </ThemeProvider>
-
-      </DatabaseProvider>
+    <DatabaseProvider>
+      <ThemeProvider value={colorScheme === "dark" ? DARK_THEME : LIGHT_THEME}>
+        <StatusBar style={colorScheme === "dark" ? "light" : "dark"} />
+        <GestureHandlerRootView style={{ flex: 1 }}>
+          <BottomSheetModalProvider>
+            <Stack>
+              <Stack.Screen name="(tabs)" options={{ title: "Habits", headerShown: false }} />
+              <Stack.Screen options={{
+                headerShadowVisible: false,
+              }} name="habits/archive" />
+              <Stack.Screen options={{
+                headerShadowVisible: false,
+              }} name="habits/[id]" />
+            </Stack>
+          </BottomSheetModalProvider>
+        </GestureHandlerRootView>
+      </ThemeProvider>
       <PortalHost />
-    </>
-
+    </DatabaseProvider>
   );
 }

hooks/useFrameworkReady.ts

@@ -0,0 +1,13 @@
+import { useEffect } from "react";
+
+declare global {
+  interface Window {
+    frameworkReady?: () => void;
+  }
+}
+
+export function useFrameworkReady() {
+  useEffect(() => {
+    window.frameworkReady?.();
+  });
+}