Update dependencies

.changeset/config.json

@@ -7,5 +7,5 @@
   "access": "public",
   "baseBranch": "main",
   "updateInternalDependencies": "patch",
-  "ignore": ["@quiltt/examples-nextjs"]
+  "ignore": ["@quiltt/examples-nextjs", "@quiltt/examples-react-native-expo"]
 }

.changeset/orange-gifts-refuse.md

@@ -0,0 +1,10 @@
+---
+"@quiltt/react-native": minor
+"@quiltt/react": minor
+"@quiltt/core": minor
+---
+
+- Update dependencies
+- Update expo-react-native implementation
+- Reorganize test files
+- Fix security vulnerabilities

.github/workflows/ci.yml

@@ -2,7 +2,6 @@ name: CI
 
 on:
   push:
-  pull_request:
   workflow_dispatch:
 
 permissions:
@@ -19,7 +18,7 @@ jobs:
     strategy:
       fail-fast: false
       matrix:
-        node-version: ['current', '18']
+        node-version: ['22', '20', '18'] # We only support LTS versions of Node.js that are still maintained
     steps:
       - name: Checkout branch
         uses: actions/checkout@v4

.github/workflows/tests-e2e.yml

@@ -2,7 +2,6 @@ name: E2E Tests
 
 on:
   push:
-  pull_request:
   workflow_dispatch:
 
 permissions:
@@ -20,10 +19,8 @@ jobs:
         include:
           - name: 'Test Next App'
             directory: './examples/react-nextjs'
-            package_manager: 'pnpm'
-          # - name: 'Test Expo App'
+          # - name: 'Test Expo App' # Weird issue with dependencies in CI. Test locally to validate.
           #   directory: './examples/react-native-expo'
-          #   package_manager: 'yarn'
 
     steps:
       - name: Checkout branch
@@ -50,19 +47,19 @@ jobs:
         run: pnpm run build:packages
 
       - name: Install Package Manager Version
-        run: corepack prepare ${{ matrix.package_manager }} --activate
+        run: corepack prepare pnpm --activate
         working-directory: ${{ matrix.directory }}
 
       - name: Install dependencies
-        run: ${{ matrix.package_manager }} install --frozen-lockfile
+        run: pnpm install --frozen-lockfile
         working-directory: ${{ matrix.directory }}
 
       - name: Build app
-        run: ${{ matrix.package_manager }} run build
+        run: pnpm run build
         working-directory: ${{ matrix.directory }}
 
       - name: Run tests
-        run: ${{ matrix.package_manager }} run test
+        run: pnpm run test
         working-directory: ${{ matrix.directory }}
 
       - if: ${{ failure() }} && ${{ matrix.name == 'Test Next App' }}

.github/workflows/tests-unit.yml

@@ -2,7 +2,6 @@ name: Unit Tests
 
 on:
   push:
-  pull_request:
   workflow_dispatch:
 
 permissions:

.nvmrc

@@ -1 +1 @@
-v20.16.0
+v22.11.0

biome.json

@@ -1,7 +1,7 @@
 {
   "$schema": "./node_modules/@biomejs/biome/configuration_schema.json",
   "files": {
-    "ignore": ["**/*.gen.ts", "**/generated/**"]
+    "ignore": ["**/*.gen.ts", "**/generated/**", "**/dist/**", "**/node_modules/**", "**/.next/**"]
   },
   "organizeImports": {
     "enabled": true
@@ -18,19 +18,23 @@
       "recommended": true,
       "a11y": {
         "noSvgWithoutTitle": "off",
-        "useAriaPropsForRole": "off"
+        "useAriaPropsForRole": "off",
+        "useSemanticElements": "off",
+        "useGenericFontNames": "off"
       },
       "complexity": {
         "noForEach": "off"
       },
       "correctness": {
-        "noUnusedImports": "warn"
+        "noUnusedImports": "warn",
+        "noUnknownFunction": "off"
       },
       "nursery": {
         "useSortedClasses": "warn"
       },
       "performance": {
-        "noAccumulatingSpread": "warn"
+        "noAccumulatingSpread": "warn",
+        "noDelete": "off"
       },
       "security": {
         "noDangerouslySetInnerHtml": "off"
@@ -41,6 +45,7 @@
         "noParameterAssign": "warn"
       },
       "suspicious": {
+        "noArrayIndexKey": "off",
         "noExplicitAny": "off",
         "noImplicitAnyLet": "warn"
       }

examples/react-native-expo/.env.example

@@ -2,4 +2,4 @@ EXPO_PUBLIC_QUILTT_CLIENT_ID="GET_THIS_ID_FROM_YOUR_DASHBOARD"
 EXPO_PUBLIC_QUILTT_AUTH_TOKEN="GET_THIS_TOKEN_FROM_YOUR_SERVER"
 EXPO_PUBLIC_CONNECTOR_ID="GET_THIS_ID_FROM_YOUR_DASHBOARD"
 EXPO_PUBLIC_HTTPS_APP_LINK="YOUR_APP_LINK"
-EXPO_PUBLIC_INSTITUION_SEARCH_TERM="OPTIONAL_INSTITUTION_SEARCH_TERM"
+EXPO_PUBLIC_INSTITUTION_SEARCH_TERM="OPTIONAL_INSTITUTION_SEARCH_TERM"

examples/react-native-expo/.gitignore

@@ -1,26 +1,42 @@
+# Learn more https://docs.github.com/en/get-started/getting-started-with-git/ignoring-files
+
+# dependencies
 node_modules/
+
+# Expo
 .expo/
 dist/
-npm-debug.*
+web-build/
+expo-env.d.ts
+
+# Native
+*.orig.*
 *.jks
 *.p8
 *.p12
 *.key
 *.mobileprovision
-*.orig.*
-web-build/
+
+# Metro
+.metro-health-check*
+
+# debug
+npm-debug.*
+yarn-debug.*
+yarn-error.*
 
 # macOS
 .DS_Store
+*.pem
 
-.env*
-!.env.example
+# local env files
+.env
+.env*.local
 
-# @generated expo-cli sync-2b81b286409207a5da26e14c78851eb30d8ccbdb
-# The following patterns were generated by expo-cli
+# typescript
+*.tsbuildinfo
 
-expo-env.d.ts
-# @end expo-cli
+app-example
 
 # App builds
 android/

examples/react-native-expo/README.md

@@ -1,33 +1,19 @@
 # Welcome to Quiltt's example Expo app 👋
 
-This is an [Expo](https://expo.dev) project created with [`create-expo-app`](https://www.npmjs.com/package/create-expo-app).
+This is an [Expo](https://expo.dev) project created with [`create-expo-app`](https://www.pnpmjs.com/package/create-expo-app).
 
-## Development
-
-### Prerequisites
-
-Make sure you have [Yarn](https://yarnpkg.com/) installed. If you don't have it installed, you can follow the instructions [here](https://yarnpkg.com/getting-started/install).
-
-### Get started
+## Get started
 
 1. Install dependencies
 
    ```bash
-   yarn install
-   ```
-
-2. Set up environment variables
-
-   Create a new `.env` file at the root of the project, then copy the contents of `.env.example` into it. Replace the placeholder values with the proper values you can get from the Quiltt Dashboard.
-
-   ```bash
-   cp .env.example .env
+   pnpm install
    ```
 
-3. Start the app
+2. Start the app
 
    ```bash
-    yarn start
+    npx expo start
    ```
 
 In the output, you'll find options to open the app in a

examples/react-native-expo/app.json

@@ -7,12 +7,7 @@
     "icon": "./assets/images/icon.png",
     "scheme": "myapp",
     "userInterfaceStyle": "automatic",
-    "splash": {
-      "image": "./assets/images/splash.png",
-      "resizeMode": "contain",
-      "backgroundColor": "#ffffff"
-    },
-    "assetBundlePatterns": ["**/*"],
+    "newArchEnabled": true,
     "ios": {
       "bundleIdentifier": "com.example",
       "supportsTablet": true
@@ -29,7 +24,18 @@
       "output": "static",
       "favicon": "./assets/images/favicon.png"
     },
-    "plugins": ["expo-router", "expo-font"],
+    "plugins": [
+      "expo-router",
+      [
+        "expo-splash-screen",
+        {
+          "image": "./assets/images/splash-icon.png",
+          "imageWidth": 200,
+          "resizeMode": "contain",
+          "backgroundColor": "#ffffff"
+        }
+      ]
+    ],
     "experiments": {
       "typedRoutes": true
     }

examples/react-native-expo/app/(tabs)/_layout.tsx

@@ -1,7 +1,10 @@
+import { Platform } from 'react-native'
+
 import { Tabs } from 'expo-router'
-import React from 'react'
 
-import { TabBarIcon } from '@/components/navigation/TabBarIcon'
+import { HapticTab } from '@/components/HapticTab'
+import { IconSymbol } from '@/components/ui/IconSymbol'
+import TabBarBackground from '@/components/ui/TabBarBackground'
 import { Colors } from '@/constants/Colors'
 import { useColorScheme } from '@/hooks/useColorScheme'
 
@@ -11,38 +14,46 @@ export default function TabLayout() {
   return (
     <Tabs
       screenOptions={{
-        tabBarStyle: {
-          borderTopColor: Colors[colorScheme ?? 'light'].muted,
-          backgroundColor: Colors[colorScheme ?? 'light'].muted,
-        },
         tabBarActiveTintColor: Colors[colorScheme ?? 'light'].tint,
         headerShown: false,
+        tabBarButton: HapticTab,
+        tabBarBackground: TabBarBackground,
+        tabBarStyle: Platform.select({
+          ios: {
+            // Use a transparent background on iOS to show the blur effect
+            position: 'absolute',
+          },
+          default: {},
+        }),
       }}
     >
       <Tabs.Screen
         name="index"
         options={{
           title: 'Home',
-          tabBarIcon: ({ color, focused }) => (
-            <TabBarIcon name={focused ? 'home' : 'home-outline'} color={color} />
-          ),
+          tabBarIcon: ({ color }) => <IconSymbol size={28} name="house.fill" color={color} />,
         }}
       />
+      {/* <Tabs.Screen
+        name="explore"
+        options={{
+          title: 'Explore',
+          tabBarIcon: ({ color }) => <IconSymbol size={28} name="paperplane.fill" color={color} />,
+        }}
+      /> */}
       <Tabs.Screen
         name="connector"
         options={{
           title: 'Connector',
-          tabBarIcon: ({ color, focused }) => (
-            <TabBarIcon name={focused ? 'link' : 'link-outline'} color={color} />
-          ),
+          tabBarIcon: ({ color }) => <IconSymbol size={28} name="link" color={color} />,
         }}
       />
       <Tabs.Screen
         name="data"
         options={{
           title: 'Data',
-          tabBarIcon: ({ color, focused }) => (
-            <TabBarIcon name={focused ? 'server' : 'server-outline'} color={color} />
+          tabBarIcon: ({ color }) => (
+            <IconSymbol size={28} name="list.bullet.rectangle.fill" color={color} />
           ),
         }}
       />