Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Add Expo demo app to CI workflow #3985

Merged
merged 8 commits into from
Dec 19, 2023
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
9 changes: 8 additions & 1 deletion .github/workflows/tests.yml
Original file line number Diff line number Diff line change
Expand Up @@ -149,7 +149,7 @@ jobs:
fail-fast: false
matrix:
node: ['18.x']
example: ['cra4', 'cra5', 'next', 'vite', 'node-standard', 'node-esm']
example: ['cra4', 'cra5', 'next', 'vite', 'node-standard', 'node-esm', 'expo']
defaults:
run:
working-directory: ./examples/publish-ci/${{ matrix.example }}
Expand Down Expand Up @@ -183,6 +183,13 @@ jobs:
- name: Show installed RTK versions
run: yarn info @reduxjs/toolkit && yarn why @reduxjs/toolkit

- name: Set up JDK 17 for React Native build
if: matrix.example == 'react-native' || matrix.example == 'expo'
uses: actions/setup-java@v2
with:
java-version: '17.x'
distribution: 'temurin'

- name: Build example
run: NODE_OPTIONS=--openssl-legacy-provider yarn build

Expand Down
41 changes: 41 additions & 0 deletions examples/publish-ci/expo/.eslintrc.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,41 @@
{
"extends": [
"eslint:recommended",
"@react-native",
"plugin:@typescript-eslint/eslint-recommended",
"plugin:@typescript-eslint/strict-type-checked",
"plugin:@typescript-eslint/stylistic-type-checked",
"plugin:react/jsx-runtime"
],
"ignorePatterns": [
"node_modules",
".vscode",
"dist",
"metro.config.js",
"assets",
".expo",
".expo-shared",
"webpack.config.ts"
],
"parser": "@typescript-eslint/parser",
"parserOptions": {
"project": true,
"tsconfigRootDir": "./"
},
"plugins": ["@typescript-eslint"],
"root": true,
"rules": {
"@typescript-eslint/consistent-type-imports": [
2,
{
"fixStyle": "separate-type-imports"
}
]
},
"overrides": [
{
"files": ["./__tests__/**/*.ts", "./__tests__/**/*.tsx"],
"env": { "jest": true }
}
]
}
38 changes: 38 additions & 0 deletions examples/publish-ci/expo/.gitignore
Original file line number Diff line number Diff line change
@@ -0,0 +1,38 @@
# Learn more https://docs.github.com/en/get-started/getting-started-with-git/ignoring-files

# dependencies
node_modules/
.yarn/

# Expo
.expo/
dist/
web-build/

# Native
*.orig.*
*.jks
*.p8
*.p12
*.key
*.mobileprovision
android
ios

# Metro
.metro-health-check*

# debug
npm-debug.*
yarn-debug.*
yarn-error.*

# macOS
.DS_Store
*.pem

# local env files
.env*.local

# typescript
*.tsbuildinfo
6 changes: 6 additions & 0 deletions examples/publish-ci/expo/.prettierrc.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,6 @@
{
"arrowParens": "avoid",
"bracketSameLine": true,
"singleQuote": true,
"trailingComma": "all"
}
83 changes: 83 additions & 0 deletions examples/publish-ci/expo/App.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,83 @@
import type { FC } from 'react';
import {
SafeAreaView,
ScrollView,
StatusBar,
StyleSheet,
Text,
View,
useColorScheme,
} from 'react-native';
import { Provider } from 'react-redux';
import { store } from './src/app/store';
import { Counter } from './src/features/counter/Counter';

import {
DebugInstructions,
HermesBadge,
LearnMoreLinks,
ReloadInstructions,
} from 'react-native/Libraries/NewAppScreen';
import { Header } from './src/components/Header';
import { LearnReduxLinks } from './src/components/LearnReduxLinks';
import { Section } from './src/components/Section';
import { TypedColors } from './src/constants/TypedColors';

export const App: FC = () => {
const isDarkMode = useColorScheme() === 'dark';

const backgroundStyle = {
backgroundColor: isDarkMode ? TypedColors.darker : TypedColors.lighter,
};

return (
<Provider store={store}>
<SafeAreaView style={backgroundStyle}>
<StatusBar
barStyle={isDarkMode ? 'light-content' : 'dark-content'}
backgroundColor={backgroundStyle.backgroundColor}
/>
<ScrollView
contentInsetAdjustmentBehavior="automatic"
style={backgroundStyle}>
<Header />
<HermesBadge />
<View
style={{
backgroundColor: isDarkMode
? TypedColors.black
: TypedColors.white,
}}>
<Counter />
<Section title="Step One">
Edit <Text style={styles.highlight}>App.tsx</Text> to change this
screen and then come back to see your edits.
</Section>
<Section title="See Your Changes">
<ReloadInstructions />
</Section>
<Section title="Debug">
<DebugInstructions />
</Section>
<Section title="Learn More Redux">
Discover what to do next with Redux:
</Section>
<LearnReduxLinks />
<Section title="Learn More React Native">
Read the docs to discover what to do next:
</Section>
<LearnMoreLinks />
</View>
</ScrollView>
</SafeAreaView>
</Provider>
);
};

const styles = StyleSheet.create({
highlight: {
fontWeight: '700',
},
});

export default App;
9 changes: 9 additions & 0 deletions examples/publish-ci/expo/__tests__/App.test.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,9 @@
import { render } from '@testing-library/react-native';
import renderer from 'react-test-renderer';
import { App } from '../App';

test('renders correctly', () => {
renderer.create(<App />);
const element = render(<App />);
expect(element).toBeDefined();
});
37 changes: 37 additions & 0 deletions examples/publish-ci/expo/__tests__/counterSlice.test.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,37 @@
import type { CounterState } from '../src/features/counter/counterSlice';
import {
counterSlice,
decrement,
increment,
incrementByAmount,
} from '../src/features/counter/counterSlice';

describe('counter reducer', () => {
const { reducer: counterReducer } = counterSlice;
const initialState: CounterState = {
value: 3,
status: 'idle',
};

test('should handle initial state', () => {
expect(counterReducer(undefined, { type: 'unknown' })).toStrictEqual({
value: 0,
status: 'idle',
});
});

test('should handle increment', () => {
const actual = counterReducer(initialState, increment());
expect(actual.value).toBe(4);
});

test('should handle decrement', () => {
const actual = counterReducer(initialState, decrement());
expect(actual.value).toBe(2);
});

test('should handle incrementByAmount', () => {
const actual = counterReducer(initialState, incrementByAmount(2));
expect(actual.value).toBe(5);
});
});
31 changes: 31 additions & 0 deletions examples/publish-ci/expo/app.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,31 @@
{
"expo": {
"name": "expo-template-redux-typescript",
"slug": "expo-template-redux-typescript",
"version": "1.0.0",
"orientation": "portrait",
"icon": "./assets/icon.png",
"userInterfaceStyle": "light",
"splash": {
"image": "./assets/splash.png",
"resizeMode": "contain",
"backgroundColor": "#ffffff"
},
"assetBundlePatterns": [
"**/*"
],
"ios": {
"supportsTablet": true
},
"android": {
"adaptiveIcon": {
"foregroundImage": "./assets/adaptive-icon.png",
"backgroundColor": "#ffffff"
},
"package": "com.anonymous.expotemplatereduxtypescript"
},
"web": {
"favicon": "./assets/favicon.png"
}
}
}
Binary file added examples/publish-ci/expo/assets/adaptive-icon.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added examples/publish-ci/expo/assets/favicon.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added examples/publish-ci/expo/assets/icon.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added examples/publish-ci/expo/assets/splash.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
7 changes: 7 additions & 0 deletions examples/publish-ci/expo/babel.config.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,7 @@
/** @type {import('@babel/core').ConfigFunction} */
module.exports = api => {
api.cache.forever();
return {
presets: ['babel-preset-expo'],
};
};
13 changes: 13 additions & 0 deletions examples/publish-ci/expo/globals.d.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,13 @@
declare module '*.gif' {
const logo: number;
export default logo;
}

declare module 'react-native/Libraries/NewAppScreen' {
import type { FC } from 'react';
export const HermesBadge: FC;
}

declare module 'react-native/Libraries/Core/Devtools/openURLInBrowser' {
export default function openURLInBrowser(url: string): void;
}
1 change: 1 addition & 0 deletions examples/publish-ci/expo/jest-setup.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1 @@
import '@testing-library/react-native/extend-expect';
10 changes: 10 additions & 0 deletions examples/publish-ci/expo/jest.config.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,10 @@
import type { Config } from 'jest';

const config: Config = {
preset: 'jest-expo',
testEnvironment: 'node',
setupFilesAfterEnv: ['./jest-setup.ts'],
fakeTimers: { enableGlobally: true },
};

export default config;
45 changes: 45 additions & 0 deletions examples/publish-ci/expo/package.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,45 @@
{
"name": "expo-template-redux-typescript",
"version": "1.0.0",
"main": "node_modules/expo/AppEntry.js",
"scripts": {
"build": "expo prebuild --clean -p android && cd android && chmod +x ./gradlew && ./gradlew bundleRelease --no-daemon && cd .. && react-native build-android",
"start": "expo start",
"android": "expo run:android",
"ios": "expo run:ios",
"web": "expo start --web",
"lint": "eslint .",
"lint:fix": "eslint --fix .",
"format": "prettier --write \"./**/*.{js,ts,tsx}\"",
"test": "jest",
"type-check": "tsc --noEmit"
},
"dependencies": {
"@reduxjs/toolkit": "^2.0.1",
"expo": "~49.0.15",
"expo-splash-screen": "~0.20.5",
"expo-status-bar": "~1.6.0",
"react": "18.2.0",
"react-native": "0.72.6",
"react-redux": "^9.0.4"
},
"devDependencies": {
"@babel/core": "^7.20.0",
"@react-native/eslint-config": "^0.74.0",
"@testing-library/react-native": "^12.4.1",
"@types/babel__core": "^7.20.5",
"@types/jest": "^29.5.11",
"@types/react": "~18.2.14",
"@types/react-test-renderer": "^18.0.7",
"@typescript-eslint/eslint-plugin": "^6.14.0",
"@typescript-eslint/parser": "^6.14.0",
"eslint": "^8.56.0",
"eslint-plugin-prettier": "^5.0.1",
"jest": "^29.7.0",
"jest-expo": "^49.0.0",
"prettier": "^3.1.1",
"ts-node": "^10.9.2",
"typescript": "^5.1.3"
},
"private": true
}
Loading
Loading