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

Chore/update deps #143

Merged
merged 3 commits into from
Nov 25, 2024
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
3 changes: 3 additions & 0 deletions examples/react-native/native-form-signals/.gitignore
Original file line number Diff line number Diff line change
Expand Up @@ -7,6 +7,7 @@ node_modules/
.expo/
dist/
web-build/
expo-env.d.ts

# Native
*.orig.*
Expand All @@ -33,3 +34,5 @@ yarn-error.*

# typescript
*.tsbuildinfo

app-example
29 changes: 0 additions & 29 deletions examples/react-native/native-form-signals/App.tsx

This file was deleted.

36 changes: 25 additions & 11 deletions examples/react-native/native-form-signals/app.json
Original file line number Diff line number Diff line change
@@ -1,27 +1,41 @@
{
"expo": {
"name": "native-form-signals",
"slug": "native-form-signals",
"name": "simple-form-signals",
"slug": "simple-form-signals",
"version": "1.0.0",
"orientation": "portrait",
"icon": "./assets/icon.png",
"userInterfaceStyle": "light",
"splash": {
"image": "./assets/splash.png",
"resizeMode": "contain",
"backgroundColor": "#ffffff"
},
"icon": "./assets/images/icon.png",
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

💡 Codebase verification

Asset paths are valid, but web bundler configuration needs attention

All referenced image assets (icon.png, adaptive-icon.png, favicon.png) exist in the correct location. However, the web bundler configuration shows potential issues:

  • Metro bundler is configured in app.json but @expo/metro-runtime is missing from dependencies
  • @expo/webpack-config is null in package.json which may cause web bundling issues

Required actions:

  • Add @expo/metro-runtime to dependencies
  • Ensure @expo/webpack-config is properly versioned to match Expo SDK 52
🔗 Analysis chain

Verify asset paths and web bundler configuration

The reorganization of assets and web bundler changes require verification:

  1. Ensure all referenced image assets exist in the new ./assets/images/ directory
  2. Confirm metro bundler web support with the current dependency versions

Also applies to: 16-16, 21-24


Let me verify the metro bundler configuration with additional checks.

🏁 Scripts executed

The following scripts were executed for the analysis:

Script:

#!/bin/bash
# Verify existence of all referenced assets
for asset in "icon.png" "adaptive-icon.png" "favicon.png"; do
  if [ -f "examples/react-native/native-form-signals/assets/images/$asset" ]; then
    echo "✓ Found $asset"
  else
    echo "✗ Missing $asset"
  fi
done

# Check metro web support in package.json
jq '.dependencies["@expo/metro-runtime"]' examples/react-native/native-form-signals/package.json

Length of output: 682


Script:

#!/bin/bash
# Check package.json for web-related dependencies and configurations
cat examples/react-native/native-form-signals/package.json | jq '{
  "expo": .dependencies.expo,
  "react-native-web": .dependencies["react-native-web"],
  "react-dom": .dependencies["react-dom"],
  "@expo/webpack-config": .dependencies["@expo/webpack-config"]
}'

# Check expo config for web platform settings
grep -A 10 '"web":' examples/react-native/native-form-signals/app.json

Length of output: 713

"scheme": "myapp",
"userInterfaceStyle": "automatic",
"newArchEnabled": true,
"ios": {
"supportsTablet": true
},
"android": {
"adaptiveIcon": {
"foregroundImage": "./assets/adaptive-icon.png",
"foregroundImage": "./assets/images/adaptive-icon.png",
"backgroundColor": "#ffffff"
}
},
"web": {
"favicon": "./assets/favicon.png"
"bundler": "metro",
"output": "static",
"favicon": "./assets/images/favicon.png"
},
"plugins": [
"expo-router",
[
"expo-splash-screen",
{
"image": "./assets/images/splash-icon.png",
"imageWidth": 200,
"resizeMode": "contain",
"backgroundColor": "#ffffff"
}
]
],
"experiments": {
"typedRoutes": true
}
}
}
5 changes: 5 additions & 0 deletions examples/react-native/native-form-signals/app/_layout.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,5 @@
import { Stack } from 'expo-router'

export default function RootLayout() {
return <Stack />
}
16 changes: 16 additions & 0 deletions examples/react-native/native-form-signals/app/index.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,16 @@
import { UserForm } from '@/components/UserForm'
import { View } from 'react-native'
Comment on lines +1 to +2
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

💡 Codebase verification

Path alias configuration needs adjustment

The @/ path alias is configured to point to ./src/* in the TypeScript config, but the UserForm component is actually located at ./components/UserForm.tsx relative to the example directory. This mismatch will cause import resolution issues.

  • Update the path alias configuration to match the actual project structure or move the components to the correct location under a src directory
  • Current import: import { UserForm } from '@/components/UserForm'
  • Actual path: ./components/UserForm.tsx
🔗 Analysis chain

Verify path alias configuration

The @/ path alias is used for importing UserForm. Ensure the path alias is properly configured in your TypeScript/Metro config for the dependency update.


Let me verify the actual location of the UserForm component to ensure the path alias is correctly resolving.

🏁 Scripts executed

The following scripts were executed for the analysis:

Script:

#!/bin/bash
# Check for path alias configuration in common config files
echo "Checking for path alias configuration..."
fd -e json -e js "tsconfig|babel\.config|metro\.config" -x cat {} \; | grep -A 5 "paths\|moduleNameMapper\|extraNodeModules"

Length of output: 1865


Script:

#!/bin/bash
# Check the actual location of UserForm component
fd -t f "UserForm" -x echo "Found: {}"

# Also check if the file is actually in the src directory
fd -t f "UserForm" -p "src/"

Length of output: 315


export default function Index() {
return (
<View
style={{
flex: 1,
paddingHorizontal: 16,
paddingVertical: 16,
}}
>
<UserForm />
</View>
)
}
Binary file not shown.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file not shown.
Original file line number Diff line number Diff line change
Expand Up @@ -52,7 +52,11 @@ export function UserForm() {
<FormInput secureTextEntry />
</form.FieldProvider>

<Button title="Submit" onPress={() => form.handleSubmit()} />
<Button
title="Submit"
onPress={() => form.handleSubmit()}
disabled={!form.canSubmit.value}
/>
</form.FormProvider>
)
}
Expand Down
Loading
Loading