Skip to content

Commit 7747a39

Browse files
benjaspetbenjaspet
committed
chore: CI/CD, prettier formatting
1 parent 8737f68 commit 7747a39

26 files changed

+433
-403
lines changed

‎.github/workflows/frontend.yml‎

Lines changed: 51 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,51 @@
1+
name: frontend
2+
3+
permissions:
4+
contents:
5+
read: all
6+
write: all
7+
8+
on:
9+
push:
10+
branches:
11+
- "**"
12+
paths:
13+
- "frontend/**"
14+
15+
jobs:
16+
format:
17+
name: format
18+
runs-on: ubuntu-latest
19+
steps:
20+
- name: Checkout Code
21+
uses: actions/checkout@v4
22+
- name: Setup Bun
23+
uses: oven-sh/setup-bun@v2
24+
- name: Install Dependencies
25+
run: cd frontend && bun install
26+
- name: Format Code
27+
run: cd frontend && bun run format
28+
lint:
29+
name: lint
30+
runs-on: ubuntu-latest
31+
steps:
32+
- name: Checkout Code
33+
uses: actions/checkout@v4
34+
- name: Setup Bun
35+
uses: oven-sh/setup-bun@v2
36+
- name: Install Dependencies
37+
run: cd frontend && bun install
38+
- name: Lint Code
39+
run: cd frontend && bun run lint
40+
test:
41+
name: test
42+
runs-on: ubuntu-latest
43+
steps:
44+
- name: Checkout Code
45+
uses: actions/checkout@v4
46+
- name: Setup Bun
47+
uses: oven-sh/setup-bun@v2
48+
- name: Install Dependencies
49+
run: cd frontend && bun install
50+
- name: Test Code
51+
run: cd frontend && bun run test

‎frontend/.eslintrc.js‎

Lines changed: 5 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,8 @@
11
// https://docs.expo.dev/guides/using-eslint/
22
module.exports = {
3-
extends: 'expo',
4-
ignorePatterns: ['/dist/*'],
3+
extends: ["expo", "prettier"],
4+
ignorePatterns: ["/dist/*"],
5+
rules: {
6+
"prettier/prettier": "error",
7+
},
58
};

‎frontend/.prettierrc‎

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
{
2+
"printWidth": 120,
3+
"tabWidth": 4,
4+
"singleQuote": false,
5+
"bracketSameLine": true,
6+
"trailingComma": "es5"
7+
}

‎frontend/README.md‎

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -6,15 +6,15 @@ This is an [Expo](https://expo.dev) project created with [`create-expo-app`](htt
66

77
1. Install dependencies
88

9-
```bash
10-
npm install
11-
```
9+
```bash
10+
npm install
11+
```
1212

1313
2. Start the app
1414

15-
```bash
16-
npx expo start
17-
```
15+
```bash
16+
npx expo start
17+
```
1818

1919
In the output, you'll find options to open the app in a
2020

‎frontend/__tests__/AboutScreen.test.tsx‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,10 @@
1-
import { render } from '@testing-library/react-native';
1+
import { render } from "@testing-library/react-native";
22

33
import AboutScreen from "@/app/about";
44

55
describe("home screen", () => {
6-
test('text renders correctly', () => {
6+
test("text renders correctly", () => {
77
const { getByText } = render(<AboutScreen />);
8-
getByText("Lorem ipsum dolor sit amet.");
8+
getByText("This text serves as the body content of the example stack.");
99
});
1010
});

‎frontend/app.json‎

Lines changed: 38 additions & 41 deletions
Original file line numberDiff line numberDiff line change
@@ -1,45 +1,42 @@
11
{
2-
"expo": {
3-
"name": "PlateMate",
4-
"slug": "platemate",
5-
"version": "0.0.1",
6-
"orientation": "portrait",
7-
"icon": "./assets/images/icon.png",
8-
"scheme": "myapp",
9-
"userInterfaceStyle": "automatic",
10-
"newArchEnabled": true,
11-
"platforms": [
12-
"ios",
13-
"android"
14-
],
15-
"ios": {
16-
"supportsTablet": true
17-
},
18-
"android": {
19-
"adaptiveIcon": {
20-
"foregroundImage": "./assets/images/icon.png",
21-
"backgroundColor": "#ffffff"
22-
}
23-
},
24-
"web": {
25-
"bundler": "metro",
26-
"output": "static",
27-
"favicon": "./assets/images/favicon.png"
28-
},
29-
"plugins": [
30-
"expo-router",
31-
[
32-
"expo-splash-screen",
33-
{
34-
"image": "./assets/images/splash-icon.png",
35-
"imageWidth": 200,
36-
"resizeMode": "contain",
37-
"backgroundColor": "#ffffff"
2+
"expo": {
3+
"name": "PlateMate",
4+
"slug": "platemate",
5+
"version": "0.0.1",
6+
"orientation": "portrait",
7+
"icon": "./assets/images/icon.png",
8+
"scheme": "myapp",
9+
"userInterfaceStyle": "automatic",
10+
"newArchEnabled": true,
11+
"platforms": ["ios", "android"],
12+
"ios": {
13+
"supportsTablet": true
14+
},
15+
"android": {
16+
"adaptiveIcon": {
17+
"foregroundImage": "./assets/images/icon.png",
18+
"backgroundColor": "#ffffff"
19+
}
20+
},
21+
"web": {
22+
"bundler": "metro",
23+
"output": "static",
24+
"favicon": "./assets/images/favicon.png"
25+
},
26+
"plugins": [
27+
"expo-router",
28+
[
29+
"expo-splash-screen",
30+
{
31+
"image": "./assets/images/splash-icon.png",
32+
"imageWidth": 200,
33+
"resizeMode": "contain",
34+
"backgroundColor": "#ffffff"
35+
}
36+
]
37+
],
38+
"experiments": {
39+
"typedRoutes": true
3840
}
39-
]
40-
],
41-
"experiments": {
42-
"typedRoutes": true
4341
}
44-
}
4542
}

‎frontend/app/(tabs)/_layout.tsx‎

Lines changed: 15 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -1,45 +1,45 @@
1-
import {Tabs} from 'expo-router';
2-
import React from 'react';
3-
import {Platform} from 'react-native';
1+
import { Tabs } from "expo-router";
2+
import React from "react";
3+
import { Platform } from "react-native";
44

5-
import {HapticTab} from '@/components/HapticTab';
6-
import {IconSymbol} from '@/components/ui/IconSymbol';
7-
import TabBarBackground from '@/components/ui/TabBarBackground';
8-
import {Colors} from '@/constants/Colors';
9-
import {useColorScheme} from "react-native";
5+
import { HapticTab } from "@/components/HapticTab";
6+
import { IconSymbol } from "@/components/ui/IconSymbol";
7+
import TabBarBackground from "@/components/ui/TabBarBackground";
8+
import { Colors } from "@/constants/Colors";
9+
import { useColorScheme } from "react-native";
1010

1111
export default function TabLayout() {
1212
const colorScheme = useColorScheme();
1313

1414
return (
1515
<Tabs
1616
screenOptions={{
17-
tabBarActiveTintColor: Colors[colorScheme ?? 'light'].tint,
17+
tabBarActiveTintColor: Colors[colorScheme ?? "light"].tint,
1818
headerShown: true,
1919
headerTitleStyle: {
20-
fontFamily: "Outfit"
20+
fontFamily: "Outfit",
2121
},
2222
tabBarButton: HapticTab,
2323
tabBarBackground: TabBarBackground,
2424
tabBarStyle: Platform.select({
2525
ios: {
26-
position: 'absolute',
26+
position: "absolute",
2727
},
2828
default: {},
2929
}),
3030
}}>
3131
<Tabs.Screen
3232
name="index"
3333
options={{
34-
title: 'Home',
35-
tabBarIcon: ({color}) => <IconSymbol size={28} name="house.lodge" color={color}/>,
34+
title: "Home",
35+
tabBarIcon: ({ color }) => <IconSymbol size={28} name="house.lodge" color={color} />,
3636
}}
3737
/>
3838
<Tabs.Screen
3939
name="explore"
4040
options={{
41-
title: 'Explore',
42-
tabBarIcon: ({color}) => <IconSymbol size={28} name="chevron.compact.down" color={color}/>,
41+
title: "Explore",
42+
tabBarIcon: ({ color }) => <IconSymbol size={28} name="chevron.compact.down" color={color} />,
4343
}}
4444
/>
4545
</Tabs>

‎frontend/app/(tabs)/explore.tsx‎

Lines changed: 9 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -1,13 +1,13 @@
1-
import {StyleSheet} from 'react-native';
1+
import { StyleSheet } from "react-native";
22

3-
import ParallaxScrollView from '@/components/ParallaxScrollView';
4-
import {ThemedText} from '@/components/ThemedText';
5-
import {IconSymbol} from '@/components/ui/IconSymbol';
3+
import ParallaxScrollView from "@/components/ParallaxScrollView";
4+
import { ThemedText } from "@/components/ThemedText";
5+
import { IconSymbol } from "@/components/ui/IconSymbol";
66

77
export default function TabTwoScreen() {
88
return (
99
<ParallaxScrollView
10-
headerBackgroundColor={{light: '#D0D0D0', dark: '#353636'}}
10+
headerBackgroundColor={{ light: "#D0D0D0", dark: "#353636" }}
1111
headerImage={
1212
<IconSymbol
1313
size={310}
@@ -16,20 +16,20 @@ export default function TabTwoScreen() {
1616
style={styles.headerImage}
1717
/>
1818
}>
19-
<ThemedText style={{fontFamily: "Outfit"}}>This is the content of the explore page.</ThemedText>
19+
<ThemedText style={{ fontFamily: "Outfit" }}>This is the content of the explore page.</ThemedText>
2020
</ParallaxScrollView>
2121
);
2222
}
2323

2424
const styles = StyleSheet.create({
2525
headerImage: {
26-
color: '#808080',
26+
color: "#808080",
2727
bottom: -90,
2828
left: -35,
29-
position: 'absolute',
29+
position: "absolute",
3030
},
3131
titleContainer: {
32-
flexDirection: 'row',
32+
flexDirection: "row",
3333
gap: 8,
3434
},
3535
});

‎frontend/app/(tabs)/index.tsx‎

Lines changed: 15 additions & 20 deletions
Original file line numberDiff line numberDiff line change
@@ -1,34 +1,29 @@
1-
import {Image, StyleSheet} from 'react-native';
1+
import { Image, StyleSheet } from "react-native";
22

3-
import ParallaxScrollView from '@/components/ParallaxScrollView';
4-
import {ThemedText} from '@/components/ThemedText';
5-
import {ThemedView} from '@/components/ThemedView';
6-
import {Link} from "expo-router";
3+
import ParallaxScrollView from "@/components/ParallaxScrollView";
4+
import { ThemedText } from "@/components/ThemedText";
5+
import { ThemedView } from "@/components/ThemedView";
6+
import { Link } from "expo-router";
77

88
export default function HomeScreen() {
99
return (
1010
<ParallaxScrollView
11-
headerBackgroundColor={{light: '#A1CEDC', dark: '#1D3D47'}}
12-
headerImage={
13-
<Image
14-
source={require('@/assets/images/partial-react-logo.png')}
15-
style={styles.reactLogo}
16-
/>
17-
}>
11+
headerBackgroundColor={{ light: "#A1CEDC", dark: "#1D3D47" }}
12+
headerImage={<Image source={require("@/assets/images/partial-react-logo.png")} style={styles.reactLogo} />}>
1813
<ThemedView style={styles.titleContainer}>
19-
<ThemedText type={"title"} style={{fontFamily: "Outfit"}}>
14+
<ThemedText type={"title"} style={{ fontFamily: "Outfit" }}>
2015
PlatMate - React Native Boilerplate
2116
</ThemedText>
2217
</ThemedView>
2318
<ThemedView>
24-
<ThemedText type={"default"} style={{fontFamily: "Outfit"}}>
25-
This page serves as the landing page of the app. This code is boilerplate code made
26-
to give you a brief overview of best practices for React Native development.
19+
<ThemedText type={"default"} style={{ fontFamily: "Outfit" }}>
20+
This page serves as the landing page of the app. This code is boilerplate code made to give you a
21+
brief overview of best practices for React Native development.
2722
</ThemedText>
2823
</ThemedView>
2924
<ThemedView>
3025
<Link href={"/about"}>
31-
<ThemedText type={"default"} lightColor={"#20c1e6"} style={{fontFamily: "Outfit"}}>
26+
<ThemedText type={"default"} lightColor={"#20c1e6"} style={{ fontFamily: "Outfit" }}>
3227
Click here to view an example stack.
3328
</ThemedText>
3429
</Link>
@@ -39,15 +34,15 @@ export default function HomeScreen() {
3934

4035
const styles = StyleSheet.create({
4136
titleContainer: {
42-
flexDirection: 'row',
43-
alignItems: 'center',
37+
flexDirection: "row",
38+
alignItems: "center",
4439
gap: 8,
4540
},
4641
reactLogo: {
4742
height: 178,
4843
width: 290,
4944
bottom: 0,
5045
left: 0,
51-
position: 'absolute',
46+
position: "absolute",
5247
},
5348
});

‎frontend/app/+not-found.tsx‎

Lines changed: 8 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -1,14 +1,14 @@
1-
import {Link, Stack} from 'expo-router';
2-
import {StyleSheet} from 'react-native';
1+
import { Link, Stack } from "expo-router";
2+
import { StyleSheet } from "react-native";
33

4-
import {ThemedText} from '@/components/ThemedText';
5-
import {ThemedView} from '@/components/ThemedView';
6-
import React from 'react';
4+
import { ThemedText } from "@/components/ThemedText";
5+
import { ThemedView } from "@/components/ThemedView";
6+
import React from "react";
77

88
export default function NotFoundScreen() {
99
return (
1010
<>
11-
<Stack.Screen options={{title: 'Oops!'}}/>
11+
<Stack.Screen options={{ title: "Oops!" }} />
1212
<ThemedView style={styles.container}>
1313
<ThemedText type="title">This screen doesn't exist.</ThemedText>
1414
<Link href="/" style={styles.link}>
@@ -22,8 +22,8 @@ export default function NotFoundScreen() {
2222
const styles = StyleSheet.create({
2323
container: {
2424
flex: 1,
25-
alignItems: 'center',
26-
justifyContent: 'center',
25+
alignItems: "center",
26+
justifyContent: "center",
2727
padding: 20,
2828
},
2929
link: {

0 commit comments

Comments
 (0)