chore: add eas build workflow 2

.eas/workflows/build-eas.yml

@@ -0,0 +1,70 @@
+name: build
+
+on:
+  push:
+    branches: ['*']
+
+jobs:
+  create-expo-app:
+    steps:
+      - uses: eas/checkout # to access the test-screen.tsx file later. This also changes cwd
+      - name: create a fresh app
+        run: |
+          cd ..
+          echo 'pwd:'
+          pwd
+          yarn create expo-app theme-expo-example --no-install --yes --template expo-template-default@sdk-53
+          touch theme-expo-example/yarn.lock # make yarn treat theme-expo-example as a completely separate project
+
+      - name: Insert our test screen into the app
+        run: |
+          cd ..
+          echo 'pwd:'
+          pwd
+          cp example/src/test-screen.tsx "theme-expo-example/app/(tabs)/index.tsx"
+          cat "theme-expo-example/app/(tabs)/index.tsx"
+
+      - name: Merge app.json with the tested package's app.json
+        run: |
+          pwd
+          cd ../theme-expo-example
+          jq '.expo.plugins += ["@vonovak/react-native-theme-control"]' app.json > app.json.tmp && mv app.json.tmp app.json
+          jq -s '.[0] * .[1]' app.json ../example/test-app.json > app.json.tmp && mv app.json.tmp app.json
+          cat app.json
+
+      - name: Put eas.json into the test app to allow building with EAS
+        run: |
+          cp test-eas.json ../theme-expo-example/eas.json
+          cat ../theme-expo-example/eas.json
+
+      - name: Install app dependencies and the tested package
+        run: |
+          cd ../theme-expo-example
+          yarn add @vonovak/react-native-theme-control
+          yarn remove expo-system-ui
+
+      - name: Create default metro config to avoid bundling issues (may not be needed for all projects)
+        run: |
+          cd ../theme-expo-example
+          npx expo customize metro.config.js
+
+      - name: Run expo prebuild
+        run: |
+          cd ../theme-expo-example
+          EXPO_DEBUG=1 npx expo prebuild
+
+      - name: Bundle JS code to verify it builds
+        run: |
+          cd ../theme-expo-example
+          pwd
+          npx expo export
+
+  # this is wrong
+  build_app_android:
+    needs: [create-expo-app]
+    defaults:
+      run:
+        working_directory: ../theme-expo-example
+    type: build
+    params:
+      platform: android

example/app.json

@@ -17,6 +17,13 @@
     },
     "android": {
       "package": "com.vonovak.themeexpoexample"
-    }
+    },
+    "//comment": "this is here so eas workflow:run can be executed locally",
+    "extra": {
+      "eas": {
+        "projectId": "348a68a7-b896-4172-ae18-64e4afc32413"
+      }
+    },
+    "owner": "expo-ci"
   }
 }

example/src/test-screen.tsx

@@ -0,0 +1,107 @@
+import * as React from 'react';
+
+import {
+  StyleSheet,
+  Text,
+  Button,
+  useColorScheme,
+  View,
+  Switch,
+  ColorValue,
+} from 'react-native';
+import {
+  setThemePreference,
+  SystemBars,
+  useThemePreference,
+} from '@vonovak/react-native-theme-control';
+
+type Props = {
+  barsBackground: ColorValue;
+  textColor: ColorValue;
+  dividerColor?: ColorValue;
+  bgColor: ColorValue;
+};
+
+export default function Screen({
+  barsBackground,
+  textColor,
+  bgColor,
+  dividerColor,
+}: Props) {
+  const colorScheme = useColorScheme();
+  const [persistTheme, togglePersistTheme] = React.useReducer(
+    (state: boolean) => !state,
+    true,
+  );
+  const themePreference = useThemePreference();
+
+  const textColorStyle = { color: textColor };
+
+  return (
+    <View
+      style={[
+        {
+          backgroundColor: bgColor,
+        },
+        styles.container,
+      ]}
+    >
+      <SystemBars
+        backgroundColor={barsBackground}
+        dividerColor={dividerColor}
+        barStyle={'default'}
+      />
+      <Button
+        title={`set theme to light`}
+        onPress={() => {
+          setThemePreference('light');
+        }}
+      />
+      <Button
+        title={`set theme to dark`}
+        onPress={() => {
+          setThemePreference('dark');
+        }}
+      />
+      <Button
+        title={`set theme to system`}
+        onPress={() => {
+          setThemePreference('system');
+        }}
+      />
+
+      <Text style={textColorStyle}>useColorScheme(): {colorScheme}</Text>
+      <Text style={textColorStyle}>
+        useThemePreference(): {themePreference}
+      </Text>
+
+      <View
+        style={{
+          flexDirection: 'row',
+          alignItems: 'center',
+          justifyContent: 'space-around',
+          width: '100%',
+        }}
+      >
+        <Switch
+          thumbColor={persistTheme ? 'green' : 'grey'}
+          onValueChange={togglePersistTheme}
+          value={persistTheme}
+        />
+        <Text style={textColorStyle}>
+          Persist theme across restarts: {String(persistTheme)}
+        </Text>
+      </View>
+    </View>
+  );
+}
+
+const styles = StyleSheet.create({
+  container: {
+    rowGap: 20,
+    flexGrow: 1,
+    alignItems: 'center',
+    justifyContent: 'space-evenly',
+  },
+  label: { padding: 10, textAlign: 'center' },
+});

example/test-app.json

@@ -0,0 +1,10 @@
+{
+  "expo": {
+    "extra": {
+      "eas": {
+        "projectId": "348a68a7-b896-4172-ae18-64e4afc32413"
+      }
+    },
+    "owner": "expo-ci"
+  }
+}

example/test-eas.json

@@ -0,0 +1,21 @@
+{
+  "cli": {
+    "version": ">= 16.17.3",
+    "appVersionSource": "remote"
+  },
+  "build": {
+    "development": {
+      "developmentClient": true,
+      "distribution": "internal"
+    },
+    "preview": {
+      "distribution": "internal"
+    },
+    "production": {
+      "autoIncrement": true
+    }
+  },
+  "submit": {
+    "production": {}
+  }
+}