initial commit
This commit is contained in:
parent
9e8c79c046
commit
cfb7924b57
26 changed files with 19505 additions and 0 deletions
22
donutshop/.gitignore
vendored
Normal file
22
donutshop/.gitignore
vendored
Normal file
|
|
@ -0,0 +1,22 @@
|
|||
node_modules/
|
||||
.expo/
|
||||
dist/
|
||||
npm-debug.*
|
||||
*.jks
|
||||
*.p8
|
||||
*.p12
|
||||
*.key
|
||||
*.mobileprovision
|
||||
*.orig.*
|
||||
web-build/
|
||||
|
||||
# macOS
|
||||
.DS_Store
|
||||
|
||||
# @generated expo-cli sync-2b81b286409207a5da26e14c78851eb30d8ccbdb
|
||||
# The following patterns were generated by expo-cli
|
||||
|
||||
expo-env.d.ts
|
||||
# @end expo-cli
|
||||
|
||||
assets/images/*
|
||||
50
donutshop/README.md
Normal file
50
donutshop/README.md
Normal file
|
|
@ -0,0 +1,50 @@
|
|||
# Welcome to your Expo app 👋
|
||||
|
||||
This is an [Expo](https://expo.dev) project created with [`create-expo-app`](https://www.npmjs.com/package/create-expo-app).
|
||||
|
||||
## Get started
|
||||
|
||||
1. Install dependencies
|
||||
|
||||
```bash
|
||||
npm install
|
||||
```
|
||||
|
||||
2. Start the app
|
||||
|
||||
```bash
|
||||
npx expo start
|
||||
```
|
||||
|
||||
In the output, you'll find options to open the app in a
|
||||
|
||||
- [development build](https://docs.expo.dev/develop/development-builds/introduction/)
|
||||
- [Android emulator](https://docs.expo.dev/workflow/android-studio-emulator/)
|
||||
- [iOS simulator](https://docs.expo.dev/workflow/ios-simulator/)
|
||||
- [Expo Go](https://expo.dev/go), a limited sandbox for trying out app development with Expo
|
||||
|
||||
You can start developing by editing the files inside the **app** directory. This project uses [file-based routing](https://docs.expo.dev/router/introduction).
|
||||
|
||||
## Get a fresh project
|
||||
|
||||
When you're ready, run:
|
||||
|
||||
```bash
|
||||
npm run reset-project
|
||||
```
|
||||
|
||||
This command will move the starter code to the **app-example** directory and create a blank **app** directory where you can start developing.
|
||||
|
||||
## Learn more
|
||||
|
||||
To learn more about developing your project with Expo, look at the following resources:
|
||||
|
||||
- [Expo documentation](https://docs.expo.dev/): Learn fundamentals, or go into advanced topics with our [guides](https://docs.expo.dev/guides).
|
||||
- [Learn Expo tutorial](https://docs.expo.dev/tutorial/introduction/): Follow a step-by-step tutorial where you'll create a project that runs on Android, iOS, and the web.
|
||||
|
||||
## Join the community
|
||||
|
||||
Join our community of developers creating universal apps.
|
||||
|
||||
- [Expo on GitHub](https://github.com/expo/expo): View our open source platform and contribute.
|
||||
- [Discord community](https://chat.expo.dev): Chat with Expo users and ask questions.
|
||||
36
donutshop/app.json
Normal file
36
donutshop/app.json
Normal file
|
|
@ -0,0 +1,36 @@
|
|||
{
|
||||
"expo": {
|
||||
"name": "donutshop",
|
||||
"slug": "donutshop",
|
||||
"version": "1.0.0",
|
||||
"orientation": "portrait",
|
||||
"icon": "./assets/images/icon.png",
|
||||
"scheme": "myapp",
|
||||
"userInterfaceStyle": "automatic",
|
||||
"splash": {
|
||||
"image": "./assets/images/splash.png",
|
||||
"resizeMode": "contain",
|
||||
"backgroundColor": "#ffffff"
|
||||
},
|
||||
"ios": {
|
||||
"supportsTablet": true
|
||||
},
|
||||
"android": {
|
||||
"adaptiveIcon": {
|
||||
"foregroundImage": "./assets/images/adaptive-icon.png",
|
||||
"backgroundColor": "#ffffff"
|
||||
}
|
||||
},
|
||||
"web": {
|
||||
"bundler": "metro",
|
||||
"output": "static",
|
||||
"favicon": "./assets/images/favicon.png"
|
||||
},
|
||||
"plugins": [
|
||||
"expo-router"
|
||||
],
|
||||
"experiments": {
|
||||
"typedRoutes": true
|
||||
}
|
||||
}
|
||||
}
|
||||
56
donutshop/app/components/DrinkCard.tsx
Normal file
56
donutshop/app/components/DrinkCard.tsx
Normal file
|
|
@ -0,0 +1,56 @@
|
|||
import { Dimensions, ImageBackground, ImageProps, Pressable, StyleSheet, Text, View } from 'react-native'
|
||||
import { AntDesign, MaterialIcons} from '@expo/vector-icons';
|
||||
import React from 'react'
|
||||
|
||||
|
||||
const card_width = Dimensions.get('window').width * 0.3;
|
||||
|
||||
interface DrinkCardProps {
|
||||
id: string;
|
||||
index: number;
|
||||
type: string;
|
||||
name: string;
|
||||
image_item: ImageProps;
|
||||
average_rating: number;
|
||||
prices: any;
|
||||
buttonPressHandler: any;
|
||||
}
|
||||
|
||||
|
||||
const DrinkCard:React.FC<DrinkCardProps> = ({
|
||||
id,
|
||||
index,
|
||||
type,
|
||||
name,
|
||||
image_item,
|
||||
average_rating,
|
||||
prices,
|
||||
buttonPressHandler,
|
||||
}) => {
|
||||
|
||||
return (
|
||||
<View style={{justifyContent: 'space-between', borderWidth: 1, borderRightColor: '#DA7297', borderLeftColor: '#DA7297', borderTopColor: '#DA7297', borderBottomColor: '#DA7297', padding: 10, borderRadius: 10, height: 250, width: 150}}>
|
||||
<View>
|
||||
<ImageBackground source={image_item} style={{width:120, height: 120, overflow: 'hidden'}} resizeMode= "contain">
|
||||
<View style={{flexDirection: 'row', gap: 3}}>
|
||||
<AntDesign name="star" size={16} color="#DA7297"/>
|
||||
<Text style={{color: '#EF5A6F', textAlign: 'right'}}>{average_rating}</Text>
|
||||
</View>
|
||||
</ImageBackground>
|
||||
<View style={{margin: 10}}>
|
||||
<Text style={{textAlign: 'center', color: '#DA7297', fontWeight: 500}}>{name}</Text>
|
||||
</View>
|
||||
</View>
|
||||
<View style={{flexDirection: 'row', alignItems: 'center', justifyContent: 'space-between'}}>
|
||||
<Text style={{fontWeight: 600, color: '#EF5A6F'}}>$<Text>{prices.price}</Text></Text>
|
||||
<Pressable onPress={() => {}}>
|
||||
<MaterialIcons name="add-circle" size={24} color="#EF5A6F" />
|
||||
</Pressable>
|
||||
</View>
|
||||
</View>
|
||||
)
|
||||
}
|
||||
|
||||
export default DrinkCard
|
||||
|
||||
const styles = StyleSheet.create({})
|
||||
48
donutshop/app/components/HomeHeader.tsx
Normal file
48
donutshop/app/components/HomeHeader.tsx
Normal file
|
|
@ -0,0 +1,48 @@
|
|||
import { Pressable, StyleSheet, Text, View } from 'react-native'
|
||||
import React from 'react'
|
||||
import { FontAwesome, Feather } from '@expo/vector-icons';
|
||||
import { useNavigation } from '@react-navigation/native';
|
||||
|
||||
|
||||
const HomeHeader = () => {
|
||||
const navigation = useNavigation();
|
||||
|
||||
const date = new Date();
|
||||
const hours = date.getHours();
|
||||
let message;
|
||||
|
||||
if (hours < 12) {
|
||||
message = <Text>Good Morning ☀</Text>;
|
||||
} else if (hours < 18) {
|
||||
message = <Text>Good Afternoon ☀</Text>;
|
||||
} else {
|
||||
message = <Text>Good Evening </Text>;
|
||||
}
|
||||
|
||||
return (
|
||||
<>
|
||||
<View style={{marginTop: 20, paddingHorizontal: 20, paddingVertical: 10}}>
|
||||
<View>
|
||||
<Text style={{fontSize: 30, fontWeight: 600}}>{message}</Text>
|
||||
</View>
|
||||
<View style={{marginTop: 30, flexDirection: 'row', alignItems: 'center', justifyContent: 'space-between'}}>
|
||||
<Pressable onPress={() => navigation.navigate('inbox')} style={{flexDirection: 'row', gap: 5, alignItems: 'flex-end'}}>
|
||||
<Feather name="mail" size={24} color="gray" /><Text style={{fontSize: 16}}>Inbox</Text>
|
||||
</Pressable>
|
||||
<Pressable onPress={() => navigation.navigate('profile')}>
|
||||
<FontAwesome name="user-circle-o" size={24} color="gray" />
|
||||
</Pressable>
|
||||
</View>
|
||||
</View>
|
||||
<View style={{height: 1, backgroundColor: "#B4B4B8", shadowColor: '#B4B4B8', shadowOffset: { width: 0, height: 1 }, shadowOpacity: 0.5, shadowRadius: 1, }}></View>
|
||||
</>
|
||||
)
|
||||
}
|
||||
|
||||
export default HomeHeader
|
||||
|
||||
const styles = StyleSheet.create({
|
||||
Emoji:{
|
||||
padding: 20
|
||||
}
|
||||
})
|
||||
57
donutshop/app/components/MenuCard.tsx
Normal file
57
donutshop/app/components/MenuCard.tsx
Normal file
|
|
@ -0,0 +1,57 @@
|
|||
import { Dimensions, ImageBackground, ImageProps, Pressable, StyleSheet, Text, View } from 'react-native'
|
||||
import React from 'react'
|
||||
import { AntDesign, MaterialIcons} from '@expo/vector-icons';
|
||||
|
||||
|
||||
const card_width = Dimensions.get('window').width * 0.3;
|
||||
|
||||
interface donutCardProps {
|
||||
id: string;
|
||||
index: number;
|
||||
type: string;
|
||||
donutname: string;
|
||||
name: string;
|
||||
image_item: ImageProps;
|
||||
average_rating: number;
|
||||
prices: any;
|
||||
buttonPressHandler: any;
|
||||
}
|
||||
|
||||
const MenuCard:React.FC<donutCardProps> = ({
|
||||
id,
|
||||
index,
|
||||
type,
|
||||
name,
|
||||
donutname,
|
||||
image_item,
|
||||
average_rating,
|
||||
prices,
|
||||
buttonPressHandler,
|
||||
}) => {
|
||||
|
||||
return (
|
||||
<View style={{justifyContent: 'space-between', borderWidth: 1, borderRightColor: '#DA7297', borderLeftColor: '#DA7297', borderTopColor: '#DA7297', borderBottomColor: '#DA7297', padding: 10, borderRadius: 10, height: 250, width: 150}}>
|
||||
<View>
|
||||
<ImageBackground source={image_item} style={{width:card_width, height: card_width, overflow: 'hidden'}} resizeMode= "contain">
|
||||
<View style={{flexDirection: 'row', gap: 3}}>
|
||||
<AntDesign name="star" size={16} color="#DA7297"/>
|
||||
<Text style={{color: '#EF5A6F', textAlign: 'right'}}>{average_rating}</Text>
|
||||
</View>
|
||||
</ImageBackground>
|
||||
<View style={{margin: 10}}>
|
||||
<Text style={{textAlign: 'center', color: '#DA7297', fontWeight: 500}}>{donutname}</Text>
|
||||
</View>
|
||||
</View>
|
||||
<View style={{flexDirection: 'row', alignItems: 'center', justifyContent: 'space-between'}}>
|
||||
<Text style={{fontWeight: 600, color: '#EF5A6F'}}>$<Text>{prices.price}</Text></Text>
|
||||
<Pressable onPress={() => {}}>
|
||||
<MaterialIcons name="add-circle" size={24} color="#EF5A6F" />
|
||||
</Pressable>
|
||||
</View>
|
||||
</View>
|
||||
)
|
||||
}
|
||||
|
||||
export default MenuCard
|
||||
|
||||
const styles = StyleSheet.create({})
|
||||
212
donutshop/app/data/DonutData.ts
Normal file
212
donutshop/app/data/DonutData.ts
Normal file
|
|
@ -0,0 +1,212 @@
|
|||
const DonutData =[
|
||||
{
|
||||
id: 'D1',
|
||||
name: 'Classic',
|
||||
donutname: 'Chocolate Beurre noisette Walnut Cream',
|
||||
description: `A decadent treat that combines rich, velvety chocolate with the nutty flavor of beurre noisette and the crunch of walnuts. The beurre noisette adds a deep, nutty flavor and aroma to the donut, while the cream filling provides a smooth and indulgent texture.`,
|
||||
calories: '295',
|
||||
image_item: require('../../assets/images/menu/donut1.png'),
|
||||
prices: [
|
||||
{price: '4.99', currency: '$'},
|
||||
],
|
||||
average_rating: 4.7,
|
||||
ratings_count: '6,879',
|
||||
favourite: false,
|
||||
type: 'Classic Donut',
|
||||
index: 0,
|
||||
},
|
||||
{
|
||||
id: 'D2',
|
||||
name: 'Classic',
|
||||
donutname: 'Black sesame matcha',
|
||||
description: `A fusion of Asian-inspired flavors. On top or mixed into the dough, you'll find black sesame seeds, which add a nutty flavor and a contrasting texture.`,
|
||||
calories: '295',
|
||||
image_item: require('../../assets/images/menu/donut2.png'),
|
||||
prices: [
|
||||
{price: '4.99', currency: '$'},
|
||||
],
|
||||
average_rating: 4.7,
|
||||
ratings_count: '6,879',
|
||||
favourite: false,
|
||||
type: 'Classic Donut',
|
||||
index: 1,
|
||||
},
|
||||
{
|
||||
id: 'D3',
|
||||
name: 'Classic',
|
||||
donutname: 'Passionfruit Creamcheese',
|
||||
description: `A delightful combination that brings together the tangy sweetness of passionfruit with the rich creaminess of cream cheese`,
|
||||
calories: '295',
|
||||
image_item: require('../../assets/images/menu/donut3.png'),
|
||||
prices: [
|
||||
{price: '4.99', currency: '$'},
|
||||
],
|
||||
average_rating: 4.7,
|
||||
ratings_count: '6,879',
|
||||
favourite: false,
|
||||
type: 'Classic Donut',
|
||||
index: 2,
|
||||
},
|
||||
{
|
||||
id: 'D4',
|
||||
name: 'Classic',
|
||||
donutname: 'Strawberry glazed with white chocolate',
|
||||
description: `A decadent dessert that combines the fruity sweetness of strawberries with the rich creaminess of white chocolate.`,
|
||||
calories: '295',
|
||||
image_item: require('../../assets/images/menu/donut4.png'),
|
||||
prices: [
|
||||
{price: '4.99', currency: '$'},
|
||||
],
|
||||
average_rating: 4.7,
|
||||
ratings_count: '6,879',
|
||||
favourite: false,
|
||||
type: 'Classic Donut',
|
||||
index: 3,
|
||||
},
|
||||
{
|
||||
id: 'D5',
|
||||
name: 'Classic',
|
||||
donutname: 'Boston Caramel Cream',
|
||||
description: `A rich and indulgent combination of flavors vanilla and caramel.`,
|
||||
calories: '295',
|
||||
image_item: require('../../assets/images/menu/donut5.png'),
|
||||
prices: [
|
||||
{price: '4.99', currency: '$'},
|
||||
],
|
||||
average_rating: 4.7,
|
||||
ratings_count: '6,879',
|
||||
favourite: false,
|
||||
type: 'Classic Donut',
|
||||
index: 4,
|
||||
},
|
||||
{
|
||||
id: 'D6',
|
||||
name: 'Special',
|
||||
donutname: 'Oreo Cookie Crumble',
|
||||
description: `A delightful fusion of a classic American cookie and a beloved pastry.`,
|
||||
calories: '295',
|
||||
image_item: require('../../assets/images/menu/donut6.png'),
|
||||
prices: [
|
||||
{price: '5.99', currency: '$'},
|
||||
],
|
||||
average_rating: 4.7,
|
||||
ratings_count: '6,879',
|
||||
favourite: false,
|
||||
type: 'Special Donut',
|
||||
index: 5,
|
||||
},
|
||||
{
|
||||
id: 'D7',
|
||||
name: 'Special',
|
||||
donutname: 'Reeses peanut butter Cup',
|
||||
description: `A decadent treat that combines the beloved flavors of chocolate and peanut butter into a delicious pastry.`,
|
||||
calories: '295',
|
||||
image_item: require('../../assets/images/menu/donut7.png'),
|
||||
prices: [
|
||||
{price: '5.99', currency: '$'},
|
||||
],
|
||||
average_rating: 4.7,
|
||||
ratings_count: '6,879',
|
||||
favourite: false,
|
||||
type: 'Special Donut',
|
||||
index: 6,
|
||||
},
|
||||
{
|
||||
id: 'D8',
|
||||
name: 'Special',
|
||||
donutname: 'M&M Chocolate Boston Cream',
|
||||
description: `A delightful variation of the classic Boston Cream donut, incorporating colorful M&M candies for added texture and flavor.`,
|
||||
calories: '295',
|
||||
image_item: require('../../assets/images/menu/donut8.png'),
|
||||
prices: [
|
||||
{price: '5.99', currency: '$'},
|
||||
],
|
||||
average_rating: 4.7,
|
||||
ratings_count: '6,879',
|
||||
favourite: false,
|
||||
type: 'Special Donut',
|
||||
index: 7,
|
||||
},
|
||||
{
|
||||
id: 'D9',
|
||||
name: 'Special',
|
||||
donutname: 'White Chocolate & Nutella Bueno',
|
||||
description: `A flavorful and indulgent treat that combines creamy white chocolate with the beloved hazelnut flavor of Nutella. `,
|
||||
calories: '295',
|
||||
image_item: require('../../assets/images/menu/donut9.png'),
|
||||
prices: [
|
||||
{price: '6.99', currency: '$'},
|
||||
],
|
||||
average_rating: 4.7,
|
||||
ratings_count: '6,879',
|
||||
favourite: false,
|
||||
type: 'Special Donut',
|
||||
index: 8,
|
||||
},
|
||||
{
|
||||
id: 'D10',
|
||||
name: 'Special',
|
||||
donutname: 'White chocolate matcha pistachio',
|
||||
description: `Indulge in the creamy goodness of White Chocolate Matcha Donut with a delightful crunch of crushed pistachios.`,
|
||||
calories: '295',
|
||||
image_item: require('../../assets/images/menu/donut10.png'),
|
||||
prices: [
|
||||
{price: '5.99', currency: '$'},
|
||||
],
|
||||
average_rating: 4.7,
|
||||
ratings_count: '6,879',
|
||||
favourite: false,
|
||||
type: 'Special Donut',
|
||||
index: 9,
|
||||
},
|
||||
{
|
||||
id: 'D11',
|
||||
name: 'Party',
|
||||
donutname: 'Classic Half Dozen',
|
||||
description: `Staff-picked(just the classics). Please note that no modifications can be accommodated.`,
|
||||
calories: '-',
|
||||
image_item: require('../../assets/images/menu/box_half_dozen.jpg'),
|
||||
prices: [
|
||||
{price: '26.99', currency: '$'},
|
||||
],
|
||||
average_rating: 4.7,
|
||||
ratings_count: '6,879',
|
||||
favourite: false,
|
||||
type: 'Box Donut',
|
||||
index: 10,
|
||||
},
|
||||
{
|
||||
id: 'D12',
|
||||
name: 'Party',
|
||||
donutname: 'Classic Dozen',
|
||||
description: `Staff-picked(just the classics). Please note that no modifications can be accommodated.`,
|
||||
calories: '-',
|
||||
image_item: require('../../assets/images/menu/box_dozen.jpg'),
|
||||
prices: [
|
||||
{price: '52.99', currency: '$'},
|
||||
],
|
||||
average_rating: 4.7,
|
||||
ratings_count: '6,879',
|
||||
favourite: false,
|
||||
type: 'Box Donut',
|
||||
index: 11,
|
||||
},
|
||||
{
|
||||
id: 'D13',
|
||||
name: 'Party',
|
||||
donutname: 'Mothers Day Box',
|
||||
description: `Five special donuts only on mother's day.`,
|
||||
calories: '-',
|
||||
image_item: require('../../assets/images/menu/box_special.jpg'),
|
||||
prices: [
|
||||
{price: '22.99', currency: '$'},
|
||||
],
|
||||
average_rating: 4.7,
|
||||
ratings_count: '6,879',
|
||||
favourite: false,
|
||||
type: 'Box Donut',
|
||||
index: 12,
|
||||
},
|
||||
|
||||
]
|
||||
export default DonutData;
|
||||
63
donutshop/app/data/DrinkData.ts
Normal file
63
donutshop/app/data/DrinkData.ts
Normal file
|
|
@ -0,0 +1,63 @@
|
|||
const DrinkData = [
|
||||
{
|
||||
id: 'D1',
|
||||
name: 'Chocolate Milkshake',
|
||||
description: `A creamy, thick chocolate shake topped with a nice dollop of whipped cream.`,
|
||||
image_item: require('../../assets/images/menu/drink1.png'),
|
||||
prices: [
|
||||
{size: 'S', price: '6.99', currency: '$'},
|
||||
{size: 'M', price: '8.49', currency: '$'},
|
||||
{size: 'L', price: '8.99', currency: '$'},
|
||||
{toping_name: 'Mini cookies', price: '1.5', currency: '$'},
|
||||
{toping_name: 'Sprinkles', price: '0.5', currency: '$'},
|
||||
{toping_name: 'Marshmallows', price: '1.25', currency: '$'},
|
||||
{toping_name: 'Pretzels', price: '1.25', currency: '$'},
|
||||
{toping_name: 'Popcorn', price: '1.25', currency: '$'},
|
||||
{toping_name: 'Chocolate Chips', price: '1.25', currency: '$'},
|
||||
],
|
||||
average_rating: 4.7,
|
||||
ratings_count: '6,879',
|
||||
favourite: false,
|
||||
type: 'Drink',
|
||||
index: 0,
|
||||
},
|
||||
{
|
||||
id: 'D2',
|
||||
name: 'Strawberry Milkshake',
|
||||
description: `A creamy, thick strawberry shake topped with nice dollop of whipped cream and fresh strawberries.`,
|
||||
image_item: require('../../assets/images/menu/drink3.png'),
|
||||
prices: [
|
||||
{size: 'S', price: '6.99', currency: '$'},
|
||||
{size: 'M', price: '8.49', currency: '$'},
|
||||
{size: 'L', price: '8.99', currency: '$'},
|
||||
],
|
||||
average_rating: 4.7,
|
||||
ratings_count: '6,879',
|
||||
favourite: false,
|
||||
type: 'Drink',
|
||||
index: 1,
|
||||
},
|
||||
{
|
||||
id: 'D3',
|
||||
name: 'Coffee Affogato Milkshake',
|
||||
description: `A creamy, thick coffee affogato shake topped with dollop of whipped cream and caramel syrup.`,
|
||||
image_item: require('../../assets/images/menu/drink2.png'),
|
||||
prices: [
|
||||
{size: 'S', price: '7.99', currency: '$'},
|
||||
{size: 'M', price: '9.49', currency: '$'},
|
||||
{size: 'L', price: '9.99', currency: '$'},
|
||||
{toping_name: 'Mini cookies', price: '1.5', currency: '$'},
|
||||
{toping_name: 'Sprinkles', price: '0.5', currency: '$'},
|
||||
{toping_name: 'Marshmallows', price: '1.25', currency: '$'},
|
||||
{toping_name: 'Pretzels', price: '1.25', currency: '$'},
|
||||
{toping_name: 'Popcorn', price: '1.25', currency: '$'},
|
||||
{toping_name: 'Chocolate Chips', price: '1.25', currency: '$'},
|
||||
],
|
||||
average_rating: 4.7,
|
||||
ratings_count: '6,879',
|
||||
favourite: false,
|
||||
type: 'Drink',
|
||||
index: 2,
|
||||
},
|
||||
]
|
||||
export default DrinkData;
|
||||
30
donutshop/app/index.js
Normal file
30
donutshop/app/index.js
Normal file
|
|
@ -0,0 +1,30 @@
|
|||
import React from 'react';
|
||||
import { KeyboardAvoidingView, SafeAreaView, View} from "react-native";
|
||||
import { NavigationContainer } from "@react-navigation/native";
|
||||
import { createStackNavigator } from '@react-navigation/stack';
|
||||
import HomeNavigator from "./navigation/HomeNavigator";
|
||||
import Detail from "./screen/Detail";
|
||||
import Payment from "./screen/Payment";
|
||||
import Inbox from "./screen/Inbox"
|
||||
import Profile from "./screen/Profile"
|
||||
|
||||
|
||||
const Stack = createStackNavigator();
|
||||
|
||||
export default function Index() {
|
||||
return (
|
||||
<NavigationContainer independent={true}>
|
||||
<KeyboardAvoidingView>
|
||||
<View style={{height: '100%', width: '100%'}}>
|
||||
<Stack.Navigator screenOptions={{headerShown: false}}>
|
||||
<Stack.Screen name='Tab' component={HomeNavigator}/>
|
||||
<Stack.Screen name='detail' component={Detail}/>
|
||||
<Stack.Screen name='payment' component={Payment}/>
|
||||
<Stack.Screen name='inbox' component={Inbox}/>
|
||||
<Stack.Screen name='profile' component={Profile}/>
|
||||
</Stack.Navigator>
|
||||
</View>
|
||||
</KeyboardAvoidingView>
|
||||
</NavigationContainer>
|
||||
);
|
||||
}
|
||||
93
donutshop/app/navigation/HomeNavigator.tsx
Normal file
93
donutshop/app/navigation/HomeNavigator.tsx
Normal file
|
|
@ -0,0 +1,93 @@
|
|||
import React from 'react';
|
||||
import {StyleSheet} from "react-native";
|
||||
import {createBottomTabNavigator} from "@react-navigation/bottom-tabs";
|
||||
import {Entypo, MaterialCommunityIcons, Fontisto, MaterialIcons, Ionicons} from '@expo/vector-icons';
|
||||
import Home from '../screen/Home';
|
||||
import Menu from '../screen/Menu';
|
||||
import Cart from '../screen/Cart';
|
||||
import Favorite from '../screen/Favorite';
|
||||
import OrderReceipt from '../screen/OrderReceipt';
|
||||
|
||||
|
||||
const Tab = createBottomTabNavigator();
|
||||
|
||||
const HomeNavigator = () => {
|
||||
return (
|
||||
<Tab.Navigator screenOptions={{headerShown: false, tabBarHideOnKeyboard: true, tabBarStyle: styles.tabBarStyle}}>
|
||||
|
||||
<Tab.Screen name='home' component={Home}
|
||||
options={{
|
||||
tabBarLabel: "Home",
|
||||
tabBarActiveTintColor: '#DA7297',
|
||||
tabBarInactiveTintColor: 'gray',
|
||||
tabBarIcon:({focused}) =>
|
||||
focused? (
|
||||
<Entypo name="home" size={26} color="#DA7297" style={{marginTop: 5, marginBottom: 5}}/>
|
||||
) : (
|
||||
<Entypo name="home" size={26} color="gray" style={{marginTop: 5, marginBottom: 5}}/>
|
||||
)
|
||||
}}
|
||||
/>
|
||||
<Tab.Screen name='menu' component={Menu}
|
||||
options={{
|
||||
tabBarLabel: "Menu",
|
||||
tabBarActiveTintColor: '#DA7297',
|
||||
tabBarInactiveTintColor: 'gray',
|
||||
tabBarIcon:({focused}) =>
|
||||
focused? (
|
||||
<Ionicons name="fast-food-sharp" size={26} color="#DA7297" style={{marginTop: 5, marginBottom: 5}}/>
|
||||
) : (
|
||||
<Ionicons name="fast-food-sharp" size={26} color="gray" style={{marginTop: 5, marginBottom: 5}}/>
|
||||
)
|
||||
}}
|
||||
/>
|
||||
<Tab.Screen name='favorit' component={Favorite}
|
||||
options={{
|
||||
tabBarLabel: "Favorite",
|
||||
tabBarActiveTintColor: '#DA7297',
|
||||
tabBarInactiveTintColor: 'gray',
|
||||
tabBarIcon:({focused}) =>
|
||||
focused? (
|
||||
<MaterialIcons name="favorite" size={26} color="#DA7297" style={{marginTop: 5, marginBottom: 5}}/>
|
||||
) : (
|
||||
<MaterialIcons name="favorite" size={26} color="gray" style={{marginTop: 5, marginBottom: 5}}/>
|
||||
)
|
||||
}}
|
||||
/>
|
||||
<Tab.Screen name='cart' component={Cart}
|
||||
options={{
|
||||
tabBarLabel: "Your order",
|
||||
tabBarActiveTintColor: '#DA7297',
|
||||
tabBarInactiveTintColor: 'gray',
|
||||
tabBarIcon:({focused}) =>
|
||||
focused? (
|
||||
<Fontisto name="shopping-bag" size={22} color="#DA7297" style={{marginTop: 5, marginBottom: 5}}/>
|
||||
) : (
|
||||
<Fontisto name="shopping-bag" size={22} color="gray" style={{marginTop: 5, marginBottom: 5}}/>
|
||||
)
|
||||
}}
|
||||
/>
|
||||
<Tab.Screen name='receipt' component={OrderReceipt}
|
||||
options={{
|
||||
tabBarLabel: "Receipt",
|
||||
tabBarActiveTintColor: '#DA7297',
|
||||
tabBarInactiveTintColor: 'gray',
|
||||
tabBarIcon:({focused}) =>
|
||||
focused? (
|
||||
<Ionicons name="receipt" size={24} color="#DA7297" style={{marginTop: 5, marginBottom: 5}}/>
|
||||
) : (
|
||||
<Ionicons name="receipt" size={24} color="gray" style={{marginTop: 5, marginBottom: 5}}/>
|
||||
)
|
||||
}}
|
||||
/>
|
||||
</Tab.Navigator>
|
||||
)
|
||||
}
|
||||
|
||||
export default HomeNavigator
|
||||
|
||||
const styles = StyleSheet.create({
|
||||
tabBarStyle: {
|
||||
height: 80,
|
||||
}
|
||||
})
|
||||
12
donutshop/app/screen/Cart.tsx
Normal file
12
donutshop/app/screen/Cart.tsx
Normal file
|
|
@ -0,0 +1,12 @@
|
|||
import { View, Text } from 'react-native'
|
||||
import React from 'react'
|
||||
|
||||
const Cart = () => {
|
||||
return (
|
||||
<View>
|
||||
<Text>Cart</Text>
|
||||
</View>
|
||||
)
|
||||
}
|
||||
|
||||
export default Cart
|
||||
12
donutshop/app/screen/Detail.tsx
Normal file
12
donutshop/app/screen/Detail.tsx
Normal file
|
|
@ -0,0 +1,12 @@
|
|||
import { View, Text } from 'react-native'
|
||||
import React from 'react'
|
||||
|
||||
const Detail = () => {
|
||||
return (
|
||||
<View>
|
||||
<Text>Detail</Text>
|
||||
</View>
|
||||
)
|
||||
}
|
||||
|
||||
export default Detail
|
||||
12
donutshop/app/screen/Favorite.tsx
Normal file
12
donutshop/app/screen/Favorite.tsx
Normal file
|
|
@ -0,0 +1,12 @@
|
|||
import { View, Text } from 'react-native'
|
||||
import React from 'react'
|
||||
|
||||
const Favorite = () => {
|
||||
return (
|
||||
<View>
|
||||
<Text>Favorite</Text>
|
||||
</View>
|
||||
)
|
||||
}
|
||||
|
||||
export default Favorite
|
||||
24
donutshop/app/screen/Home.tsx
Normal file
24
donutshop/app/screen/Home.tsx
Normal file
|
|
@ -0,0 +1,24 @@
|
|||
import { View, Text, ScrollView, StyleSheet } from 'react-native'
|
||||
import React from 'react'
|
||||
import HomeHeader from '../components/HomeHeader'
|
||||
import { StatusBar } from 'expo-status-bar';
|
||||
|
||||
const Home = () => {
|
||||
|
||||
return (
|
||||
<View style={{flex: 1, backgroundColor: 'white'}}>
|
||||
<StatusBar style="dark"/>
|
||||
<ScrollView showsVerticalScrollIndicator={false} contentContainerStyle={styles.ScrollViewFlex}>
|
||||
<HomeHeader />
|
||||
</ScrollView>
|
||||
</View>
|
||||
)
|
||||
}
|
||||
|
||||
export default Home
|
||||
|
||||
const styles = StyleSheet.create({
|
||||
ScrollViewFlex:{
|
||||
flexGrow: 1,
|
||||
}
|
||||
})
|
||||
28
donutshop/app/screen/Inbox.tsx
Normal file
28
donutshop/app/screen/Inbox.tsx
Normal file
|
|
@ -0,0 +1,28 @@
|
|||
import { View, Text, Pressable, Image, StyleSheet } from 'react-native'
|
||||
import React from 'react'
|
||||
import { Ionicons } from '@expo/vector-icons';
|
||||
import { useNavigation } from '@react-navigation/native';
|
||||
|
||||
const Inbox = () => {
|
||||
const navigation = useNavigation();
|
||||
|
||||
return (
|
||||
<View style={{flex: 1, backgroundColor: "white"}}>
|
||||
<View style={{marginTop: 20, paddingHorizontal: 20, paddingVertical: 10}}>
|
||||
<Pressable onPress={() => navigation.goBack()} style={{flexDirection: 'row', gap: 5, alignItems: 'flex-end'}}>
|
||||
<Ionicons name="chevron-back" size={24} color="gray" />
|
||||
</Pressable>
|
||||
<Text style={{paddingHorizontal: 10, paddingTop: 10, fontSize: 30, fontWeight: 600}}>Inbox</Text>
|
||||
</View>
|
||||
|
||||
<View style={{height: 1, backgroundColor: "#B4B4B8", shadowColor: '#B4B4B8', shadowOffset: { width: 0, height: 1 }, shadowOpacity: 0.5, shadowRadius: 1, }}></View>
|
||||
|
||||
<View style={{marginVertical: 50, alignItems: 'center'}}>
|
||||
<Image source={require('../../assets/images/misc/empty-inbox.png')} style={{ width: 200, height: 200, resizeMode: "contain"}} />
|
||||
<Text style={{marginTop: 30, fontSize: 16, fontWeight: 500}}>No messages right now</Text>
|
||||
</View>
|
||||
</View>
|
||||
)
|
||||
}
|
||||
|
||||
export default Inbox
|
||||
146
donutshop/app/screen/Menu.tsx
Normal file
146
donutshop/app/screen/Menu.tsx
Normal file
|
|
@ -0,0 +1,146 @@
|
|||
import { View, Text, ScrollView, StyleSheet, Pressable } from 'react-native'
|
||||
import React, { useState } from 'react'
|
||||
import { useStore } from '../store/store';
|
||||
import { useBottomTabBarHeight } from '@react-navigation/bottom-tabs';
|
||||
import { FlatList, TextInput } from 'react-native-gesture-handler';
|
||||
import { AntDesign } from '@expo/vector-icons';
|
||||
import MenuCard from "../components/MenuCard";
|
||||
import DrinkCard from "../components/DrinkCard";
|
||||
|
||||
const getCategoriesFromData = (data: any) => {
|
||||
let temp: any = {};
|
||||
for (let i = 0; i < data.length; i++) {
|
||||
if (temp[data[i].name] == undefined) {
|
||||
temp[data[i].name] = 1;
|
||||
} else {
|
||||
temp[data[i].name]++;
|
||||
}
|
||||
}
|
||||
let categories = Object.keys(temp);
|
||||
categories.unshift('All');
|
||||
return categories;
|
||||
};
|
||||
|
||||
const getDonutList = (category: string, data: any) => {
|
||||
if (category == 'All') {
|
||||
return data;
|
||||
} else {
|
||||
let donutlist = data.filter((item: any) => item.name == category);
|
||||
return donutlist;
|
||||
}
|
||||
};
|
||||
|
||||
|
||||
const Menu = () => {
|
||||
const DonutList = useStore((state: any) => state.AllDonut);
|
||||
const DrinkList = useStore((state: any) => state.AllDrinkList);
|
||||
|
||||
const [categories, setCategories] = useState(getCategoriesFromData(DonutList));
|
||||
const [searchMenu, setSearchMenu] = useState('');
|
||||
const [categoryIndex, setCategoryIndex] = useState({index: 0, category: categories[0]});
|
||||
const [sortItem, setSortItem] = useState(getDonutList(categoryIndex.category, DonutList));
|
||||
|
||||
|
||||
const tabBar = useBottomTabBarHeight();
|
||||
//console.log(sortItem.length)
|
||||
|
||||
return (
|
||||
<View style={{flex: 1, backgroundColor: 'white'}}>
|
||||
<ScrollView showsVerticalScrollIndicator={false} contentContainerStyle={styles.ScrollViewFlex}>
|
||||
<View style={{marginTop: 20, paddingHorizontal: 20, paddingVertical: 10}}>
|
||||
<Text style={{fontSize: 30, fontWeight: 600}}>Menu</Text>
|
||||
|
||||
<View style={{marginVertical: 20, backgroundColor: '#EEEEEE', padding: 10, borderRadius: 10, flexDirection: 'row', justifyContent: 'space-between'}}>
|
||||
<TextInput value={searchMenu} onChangeText={text =>setSearchMenu(text)} placeholder='Search...' style={{fontSize: 18, flex:1}}/>
|
||||
<Pressable onPress={() => {}}>
|
||||
<AntDesign name="search1" size={24} color="gray" />
|
||||
</Pressable>
|
||||
</View>
|
||||
|
||||
<Text style={{fontSize: 26, fontWeight: 600, color: '#EF5A6F'}}>Donuts</Text>
|
||||
</View>
|
||||
{/*===== Tab category =====*/}
|
||||
<ScrollView horizontal showsHorizontalScrollIndicator={false} contentContainerStyle={styles.CategoryView}>
|
||||
{categories.map((item, index) => (
|
||||
<View key={index.toString()} style={styles.CategoryScroll}>
|
||||
<Pressable onPress={() => {setCategoryIndex({index:index, category:categories[index]}); setSortItem([...getDonutList(categories[index], DonutList)])}}>
|
||||
<Text style={[styles.catText,
|
||||
categoryIndex.index == index ? {color: '#DA7297'} : {}, ]}>
|
||||
{item}
|
||||
</Text>
|
||||
{categoryIndex.index == index ? (
|
||||
<View style={styles.activeCategory}/>
|
||||
) : (
|
||||
<></>
|
||||
)}
|
||||
</Pressable>
|
||||
</View>
|
||||
))}
|
||||
</ScrollView>
|
||||
|
||||
{/*===== donuts=====*/}
|
||||
<FlatList horizontal showsHorizontalScrollIndicator={false} data={sortItem} contentContainerStyle={styles.MenuListContainer} keyExtractor={item => item.id} renderItem={({item}) => {
|
||||
return <Pressable onPress={() => {}}>
|
||||
<MenuCard
|
||||
id={item.id}
|
||||
index={item.index}
|
||||
type={item.type}
|
||||
name={item.name}
|
||||
donutname={item.donutname}
|
||||
image_item={item.image_item}
|
||||
average_rating={item.average_rating}
|
||||
prices={item.prices[0]}
|
||||
buttonPressHandler={() => {}}
|
||||
/>
|
||||
</Pressable>
|
||||
}}/>
|
||||
{/*===== drinks =====*/}
|
||||
<View>
|
||||
<Text style={{fontSize: 26, fontWeight: 600, color: '#EF5A6F' ,marginTop: 20, paddingHorizontal: 20}}>Drinks</Text>
|
||||
<FlatList horizontal showsHorizontalScrollIndicator={false} data={DrinkList} contentContainerStyle={[styles.MenuListContainer, {marginBottom: tabBar}]} keyExtractor={item => item.id} renderItem={({item}) => {
|
||||
return <Pressable onPress={() => {}}>
|
||||
<DrinkCard
|
||||
id={item.id}
|
||||
index={item.index}
|
||||
type={item.type}
|
||||
name={item.name}
|
||||
image_item={item.image_item}
|
||||
average_rating={item.average_rating}
|
||||
prices={item.prices[0]}
|
||||
buttonPressHandler={() => {}}
|
||||
/>
|
||||
</Pressable>
|
||||
}}/>
|
||||
</View>
|
||||
</ScrollView>
|
||||
</View>
|
||||
)
|
||||
}
|
||||
|
||||
export default Menu
|
||||
|
||||
const styles = StyleSheet.create({
|
||||
ScrollViewFlex:{
|
||||
flexGrow: 1,
|
||||
},
|
||||
CategoryView:{
|
||||
paddingHorizontal: 5
|
||||
},
|
||||
CategoryScroll:{
|
||||
paddingHorizontal: 20
|
||||
},
|
||||
catText:{
|
||||
fontSize: 16,
|
||||
fontWeight: 600,
|
||||
color: 'gray'
|
||||
},
|
||||
activeCategory:{
|
||||
backgroundColor: '#DA7297',
|
||||
padding: 1
|
||||
},
|
||||
MenuListContainer:{
|
||||
gap: 20,
|
||||
paddingVertical: 20,
|
||||
paddingHorizontal: 20
|
||||
}
|
||||
})
|
||||
12
donutshop/app/screen/OrderReceipt.tsx
Normal file
12
donutshop/app/screen/OrderReceipt.tsx
Normal file
|
|
@ -0,0 +1,12 @@
|
|||
import { View, Text } from 'react-native'
|
||||
import React from 'react'
|
||||
|
||||
const OrderReceipt = () => {
|
||||
return (
|
||||
<View>
|
||||
<Text>OrderHistory</Text>
|
||||
</View>
|
||||
)
|
||||
}
|
||||
|
||||
export default OrderReceipt
|
||||
12
donutshop/app/screen/Payment.tsx
Normal file
12
donutshop/app/screen/Payment.tsx
Normal file
|
|
@ -0,0 +1,12 @@
|
|||
import { View, Text } from 'react-native'
|
||||
import React from 'react'
|
||||
|
||||
const Payment = () => {
|
||||
return (
|
||||
<View>
|
||||
<Text>Payment</Text>
|
||||
</View>
|
||||
)
|
||||
}
|
||||
|
||||
export default Payment
|
||||
29
donutshop/app/screen/Profile.tsx
Normal file
29
donutshop/app/screen/Profile.tsx
Normal file
|
|
@ -0,0 +1,29 @@
|
|||
import { View, Text, Pressable, Image, StyleSheet } from 'react-native'
|
||||
import { Ionicons } from '@expo/vector-icons';
|
||||
import React from 'react'
|
||||
import { useNavigation } from '@react-navigation/native';
|
||||
|
||||
const Profile = () => {
|
||||
const navigation = useNavigation();
|
||||
|
||||
return (
|
||||
<View style={{flex: 1, backgroundColor: "white"}}>
|
||||
<View style={{marginTop: 20, paddingHorizontal: 20, paddingVertical: 10}}>
|
||||
<Pressable onPress={() => navigation.goBack()} style={{flexDirection: 'row', gap: 5, alignItems: 'flex-end'}}>
|
||||
<Ionicons name="chevron-back" size={24} color="gray" />
|
||||
</Pressable>
|
||||
<Text style={{paddingHorizontal: 10, paddingTop: 10, fontSize: 30, fontWeight: 600}}>Account</Text>
|
||||
</View>
|
||||
|
||||
<View style={{height: 1, backgroundColor: "#B4B4B8", shadowColor: '#B4B4B8', shadowOffset: { width: 0, height: 1 }, shadowOpacity: 0.5, shadowRadius: 1, }}></View>
|
||||
|
||||
<View style={{marginVertical: 50, alignItems: 'center'}}>
|
||||
<Image source={require('../../assets/images/misc/cannot_load.png')} style={{ width: 200, height: 200, resizeMode: "contain"}} />
|
||||
<Text style={{marginTop: 30, fontSize: 22, fontWeight: 500}}>Something went wrong</Text>
|
||||
<Text style={{margin: 10, fontSize: 16, color: "gray", textAlign: 'center'}}>There was a problem and the page could not be loaded at this moment.</Text>
|
||||
</View>
|
||||
</View>
|
||||
)
|
||||
}
|
||||
|
||||
export default Profile
|
||||
22
donutshop/app/store/store.ts
Normal file
22
donutshop/app/store/store.ts
Normal file
|
|
@ -0,0 +1,22 @@
|
|||
import {create} from "zustand";
|
||||
import {produce} from "immer";
|
||||
import {persist, createJSONStorage} from "zustand/middleware";
|
||||
import AsynStorage from "@react-native-async-storage/async-storage";
|
||||
import DonutData from "../data/DonutData";
|
||||
import DrinkData from "../data/DrinkData";
|
||||
|
||||
export const useStore = create(
|
||||
persist(
|
||||
(set, get) => ({
|
||||
AllDonut: DonutData,
|
||||
AllDrinkList: DrinkData,
|
||||
CartPrice: 0,
|
||||
FavoriteList: [],
|
||||
CartList: [],
|
||||
ReceiptList: []
|
||||
}), {
|
||||
name: 'donutshop',
|
||||
storage: createJSONStorage(() => AsynStorage),
|
||||
}
|
||||
),
|
||||
)
|
||||
BIN
donutshop/assets/fonts/SpaceMono-Regular.ttf
Executable file
BIN
donutshop/assets/fonts/SpaceMono-Regular.ttf
Executable file
Binary file not shown.
6
donutshop/babel.config.js
Normal file
6
donutshop/babel.config.js
Normal file
|
|
@ -0,0 +1,6 @@
|
|||
module.exports = function (api) {
|
||||
api.cache(true);
|
||||
return {
|
||||
presets: ['babel-preset-expo'],
|
||||
};
|
||||
};
|
||||
18378
donutshop/package-lock.json
generated
Normal file
18378
donutshop/package-lock.json
generated
Normal file
File diff suppressed because it is too large
Load diff
55
donutshop/package.json
Normal file
55
donutshop/package.json
Normal file
|
|
@ -0,0 +1,55 @@
|
|||
{
|
||||
"name": "donutshop",
|
||||
"main": "expo-router/entry",
|
||||
"version": "1.0.0",
|
||||
"scripts": {
|
||||
"start": "expo start",
|
||||
"reset-project": "node ./scripts/reset-project.js",
|
||||
"android": "expo start --android",
|
||||
"ios": "expo start --ios",
|
||||
"web": "expo start --web",
|
||||
"test": "jest --watchAll",
|
||||
"lint": "expo lint"
|
||||
},
|
||||
"jest": {
|
||||
"preset": "jest-expo"
|
||||
},
|
||||
"dependencies": {
|
||||
"@expo/vector-icons": "^14.0.2",
|
||||
"@react-native-async-storage/async-storage": "^1.24.0",
|
||||
"@react-navigation/bottom-tabs": "^6.6.1",
|
||||
"@react-navigation/native": "^6.1.18",
|
||||
"@react-navigation/stack": "^6.4.1",
|
||||
"expo": "~51.0.21",
|
||||
"expo-blur": "^13.0.2",
|
||||
"expo-constants": "~16.0.2",
|
||||
"expo-font": "~12.0.9",
|
||||
"expo-linking": "~6.3.1",
|
||||
"expo-router": "~3.5.18",
|
||||
"expo-splash-screen": "~0.27.5",
|
||||
"expo-status-bar": "~1.12.1",
|
||||
"expo-system-ui": "~3.0.7",
|
||||
"expo-web-browser": "~13.0.3",
|
||||
"immer": "^10.1.1",
|
||||
"react": "18.2.0",
|
||||
"react-dom": "18.2.0",
|
||||
"react-native": "0.74.3",
|
||||
"react-native-gesture-handler": "~2.16.1",
|
||||
"react-native-reanimated": "~3.10.1",
|
||||
"react-native-safe-area-context": "4.10.5",
|
||||
"react-native-screens": "3.31.1",
|
||||
"react-native-web": "~0.19.10",
|
||||
"zustand": "^4.5.4"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@babel/core": "^7.20.0",
|
||||
"@types/jest": "^29.5.12",
|
||||
"@types/react": "~18.2.45",
|
||||
"@types/react-test-renderer": "^18.0.7",
|
||||
"jest": "^29.2.1",
|
||||
"jest-expo": "~51.0.3",
|
||||
"react-test-renderer": "18.2.0",
|
||||
"typescript": "~5.3.3"
|
||||
},
|
||||
"private": true
|
||||
}
|
||||
73
donutshop/scripts/reset-project.js
Executable file
73
donutshop/scripts/reset-project.js
Executable file
|
|
@ -0,0 +1,73 @@
|
|||
#!/usr/bin/env node
|
||||
|
||||
/**
|
||||
* This script is used to reset the project to a blank state.
|
||||
* It moves the /app directory to /app-example and creates a new /app directory with an index.tsx and _layout.tsx file.
|
||||
* You can remove the `reset-project` script from package.json and safely delete this file after running it.
|
||||
*/
|
||||
|
||||
const fs = require('fs');
|
||||
const path = require('path');
|
||||
|
||||
const root = process.cwd();
|
||||
const oldDirPath = path.join(root, 'app');
|
||||
const newDirPath = path.join(root, 'app-example');
|
||||
const newAppDirPath = path.join(root, 'app');
|
||||
|
||||
const indexContent = `import { Text, View } from "react-native";
|
||||
|
||||
export default function Index() {
|
||||
return (
|
||||
<View
|
||||
style={{
|
||||
flex: 1,
|
||||
justifyContent: "center",
|
||||
alignItems: "center",
|
||||
}}
|
||||
>
|
||||
<Text>Edit app/index.tsx to edit this screen.</Text>
|
||||
</View>
|
||||
);
|
||||
}
|
||||
`;
|
||||
|
||||
const layoutContent = `import { Stack } from "expo-router";
|
||||
|
||||
export default function RootLayout() {
|
||||
return (
|
||||
<Stack>
|
||||
<Stack.Screen name="index" />
|
||||
</Stack>
|
||||
);
|
||||
}
|
||||
`;
|
||||
|
||||
fs.rename(oldDirPath, newDirPath, (error) => {
|
||||
if (error) {
|
||||
return console.error(`Error renaming directory: ${error}`);
|
||||
}
|
||||
console.log('/app moved to /app-example.');
|
||||
|
||||
fs.mkdir(newAppDirPath, { recursive: true }, (error) => {
|
||||
if (error) {
|
||||
return console.error(`Error creating new app directory: ${error}`);
|
||||
}
|
||||
console.log('New /app directory created.');
|
||||
|
||||
const indexPath = path.join(newAppDirPath, 'index.tsx');
|
||||
fs.writeFile(indexPath, indexContent, (error) => {
|
||||
if (error) {
|
||||
return console.error(`Error creating index.tsx: ${error}`);
|
||||
}
|
||||
console.log('app/index.tsx created.');
|
||||
|
||||
const layoutPath = path.join(newAppDirPath, '_layout.tsx');
|
||||
fs.writeFile(layoutPath, layoutContent, (error) => {
|
||||
if (error) {
|
||||
return console.error(`Error creating _layout.tsx: ${error}`);
|
||||
}
|
||||
console.log('app/_layout.tsx created.');
|
||||
});
|
||||
});
|
||||
});
|
||||
});
|
||||
17
donutshop/tsconfig.json
Normal file
17
donutshop/tsconfig.json
Normal file
|
|
@ -0,0 +1,17 @@
|
|||
{
|
||||
"extends": "expo/tsconfig.base",
|
||||
"compilerOptions": {
|
||||
"strict": true,
|
||||
"paths": {
|
||||
"@/*": [
|
||||
"./*"
|
||||
]
|
||||
}
|
||||
},
|
||||
"include": [
|
||||
"**/*.ts",
|
||||
"**/*.tsx",
|
||||
".expo/types/**/*.ts",
|
||||
"expo-env.d.ts"
|
||||
, "app/index.js", "app/components/MenuDrink.js" ]
|
||||
}
|
||||
Loading…
Add table
Reference in a new issue