Barcode improvements, App AI Nutrition Label Scan

.github/workflows/android.yml

@@ -23,15 +23,22 @@ jobs:
         distribution: 'temurin'
         java-version: '17'
 
+    - name: Install pnpm
+      uses: pnpm/action-setup@v2
+      with:
+        version: 10
+
     - name: Set up Node.js
       uses: actions/setup-node@v4
       with:
         node-version: '20'
-
-    - name: Install npm dependencies
+        cache: 'pnpm'
+        cache-dependency-path: SparkyFitnessMobile/pnpm-lock.yaml
+
+    - name: Install dependencies
       run: |
         cd SparkyFitnessMobile
-        npm install
+        pnpm install --frozen-lockfile
         APP_VARIANT=production npx expo prebuild --platform android
 
     - name: Cache Gradle packages

.github/workflows/ci-tests.yml

@@ -105,21 +105,26 @@ jobs:
       - name: Checkout code
         uses: actions/checkout@v4
 
+      - name: Install pnpm
+        uses: pnpm/action-setup@v2
+        with:
+          version: 10
+
       - name: Setup Node.js
         uses: actions/setup-node@v4
         with:
           node-version: "20"
-          cache: "npm"
-          cache-dependency-path: SparkyFitnessMobile/package-lock.json
+          cache: "pnpm"
+          cache-dependency-path: SparkyFitnessMobile/pnpm-lock.yaml
 
       - name: Install dependencies
-        run: npm ci
+        run: pnpm install --frozen-lockfile
 
       - name: Run linting
-        run: npm run lint
+        run: pnpm run lint
 
       - name: Run tests with coverage
-        run: npm run test:ci
+        run: pnpm run test:ci
         env:
           NODE_ENV: test
 

SparkyFitnessFrontend/src/api/Settings/preferences.ts

@@ -25,6 +25,7 @@ interface UserPreferences {
   auto_clear_history: string;
   logging_level: 'DEBUG' | 'INFO' | 'WARN' | 'ERROR' | 'SILENT';
   default_food_data_provider_id: string | null;
+  default_barcode_provider_id: string | null;
   timezone: string;
   item_display_limit: number;
   food_display_limit: number;

SparkyFitnessFrontend/src/components/AboutDialog.tsx

@@ -138,6 +138,9 @@ const AboutDialog: React.FC<AboutDialogProps> = ({
                           'Open Food Facts API'
                         )}
                       </li>
+                      <li>
+                        {t('aboutDialog.usdaApi', 'USDA Food Database API')}
+                      </li>
                     </ul>
                   </li>
                 </ul>

SparkyFitnessFrontend/src/components/FoodSearch/FoodSearch.tsx

@@ -67,7 +67,7 @@ export interface OpenFoodFactsProduct {
   product_name: string;
   brands?: string;
   serving_quantity?: number;
-  nutriments: {
+  nutriments?: {
     'energy-kcal_100g'?: number;
     proteins_100g?: number;
     carbohydrates_100g?: number;

SparkyFitnessFrontend/src/contexts/PreferencesContext.tsx

@@ -53,6 +53,7 @@ interface PreferencesContextType {
   autoClearHistory: string;
   loggingLevel: LoggingLevel;
   defaultFoodDataProviderId: string | null;
+  defaultBarcodeProviderId: string | null;
   timezone: string;
   foodDisplayLimit: number;
   itemDisplayLimit: number;
@@ -87,6 +88,7 @@ interface PreferencesContextType {
     level: 'DEBUG' | 'INFO' | 'WARN' | 'ERROR' | 'SILENT'
   ) => void;
   setDefaultFoodDataProviderId: (id: string | null) => void;
+  setDefaultBarcodeProviderId: (id: string | null) => void;
   setTimezone: (timezone: string) => void;
   setItemDisplayLimit: (limit: number) => void;
   setCalorieGoalAdjustmentMode: (
@@ -178,6 +180,9 @@ export const PreferencesProvider: React.FC<{ children: React.ReactNode }> = ({
   >('ERROR');
   const [defaultFoodDataProviderId, setDefaultFoodDataProviderIdState] =
     useState<string | null>(null);
+  const [defaultBarcodeProviderId, setDefaultBarcodeProviderIdState] = useState<
+    string | null
+  >(null);
   const [timezone, setTimezoneState] = useState<string>(
     Intl.DateTimeFormat().resolvedOptions().timeZone
   );
@@ -429,6 +434,9 @@ export const PreferencesProvider: React.FC<{ children: React.ReactNode }> = ({
         setDefaultFoodDataProviderIdState(
           data.default_food_data_provider_id || null
         );
+        setDefaultBarcodeProviderIdState(
+          data.default_barcode_provider_id || null
+        );
         setTimezoneState(
           data.timezone || Intl.DateTimeFormat().resolvedOptions().timeZone
         );
@@ -519,6 +527,7 @@ export const PreferencesProvider: React.FC<{ children: React.ReactNode }> = ({
         auto_clear_history: string;
         logging_level: 'DEBUG' | 'INFO' | 'WARN' | 'ERROR' | 'SILENT';
         default_food_data_provider_id: string | null;
+        default_barcode_provider_id: string | null;
         timezone: string;
         item_display_limit: number;
         food_display_limit: number;
@@ -619,6 +628,8 @@ export const PreferencesProvider: React.FC<{ children: React.ReactNode }> = ({
         logging_level: newPrefs?.loggingLevel ?? loggingLevel,
         default_food_data_provider_id:
           newPrefs?.defaultFoodDataProviderId ?? defaultFoodDataProviderId,
+        default_barcode_provider_id:
+          newPrefs?.defaultBarcodeProviderId ?? defaultBarcodeProviderId,
         timezone: newPrefs?.timezone ?? timezone,
         item_display_limit: newPrefs?.itemDisplayLimit ?? itemDisplayLimit,
         food_display_limit: foodDisplayLimit,
@@ -674,6 +685,7 @@ export const PreferencesProvider: React.FC<{ children: React.ReactNode }> = ({
       dateFormat,
       autoClearHistory,
       defaultFoodDataProviderId,
+      defaultBarcodeProviderId,
       timezone,
       itemDisplayLimit,
       foodDisplayLimit,
@@ -759,6 +771,10 @@ export const PreferencesProvider: React.FC<{ children: React.ReactNode }> = ({
     setDefaultFoodDataProviderIdState(id);
   }, []);
 
+  const setDefaultBarcodeProviderId = useCallback((id: string | null) => {
+    setDefaultBarcodeProviderIdState(id);
+  }, []);
+
   const setTimezone = useCallback((newTimezone: string) => {
     setTimezoneState(newTimezone);
   }, []);
@@ -846,6 +862,7 @@ export const PreferencesProvider: React.FC<{ children: React.ReactNode }> = ({
       autoClearHistory,
       loggingLevel,
       defaultFoodDataProviderId,
+      defaultBarcodeProviderId,
       timezone,
       itemDisplayLimit,
       foodDisplayLimit,
@@ -873,6 +890,7 @@ export const PreferencesProvider: React.FC<{ children: React.ReactNode }> = ({
       setAutoClearHistory,
       setLoggingLevel,
       setDefaultFoodDataProviderId,
+      setDefaultBarcodeProviderId,
       setTimezone,
       setItemDisplayLimit,
       setCalorieGoalAdjustmentMode,
@@ -911,6 +929,7 @@ export const PreferencesProvider: React.FC<{ children: React.ReactNode }> = ({
       autoClearHistory,
       loggingLevel,
       defaultFoodDataProviderId,
+      defaultBarcodeProviderId,
       timezone,
       itemDisplayLimit,
       foodDisplayLimit,
@@ -938,6 +957,7 @@ export const PreferencesProvider: React.FC<{ children: React.ReactNode }> = ({
       setAutoClearHistory,
       setLoggingLevel,
       setDefaultFoodDataProviderId,
+      setDefaultBarcodeProviderId,
       setTimezone,
       setItemDisplayLimit,
       setCalorieGoalAdjustmentMode,

SparkyFitnessFrontend/src/pages/Settings/ExternalProviderList.tsx

@@ -18,8 +18,13 @@ const ExternalProviderList = ({ showAddForm }: ExternalProviderListProps) => {
   const [editingProvider, setEditingProvider] = useState<string | null>(null);
   const [editData, setEditData] = useState<Partial<ExternalDataProvider>>({});
   const { user } = useAuth();
-  const { defaultFoodDataProviderId, setDefaultFoodDataProviderId } =
-    usePreferences();
+  const {
+    defaultFoodDataProviderId,
+    setDefaultFoodDataProviderId,
+    defaultBarcodeProviderId,
+    setDefaultBarcodeProviderId,
+    saveAllPreferences,
+  } = usePreferences();
   const { data: providers = [], isLoading: providersLoading } =
     useExternalProviders(user.activeUserId);
 
@@ -101,12 +106,17 @@ const ExternalProviderList = ({ showAddForm }: ExternalProviderListProps) => {
           data.provider_type === 'nutritionix' ||
           data.provider_type === 'fatsecret' ||
           data.provider_type === 'mealie' ||
-          data.provider_type === 'tandoor')
+          data.provider_type === 'tandoor' ||
+          data.provider_type === 'usda')
       ) {
         setDefaultFoodDataProviderId(data.id);
       } else if (data && defaultFoodDataProviderId === data.id) {
         setDefaultFoodDataProviderId(null);
       }
+      if (data && !data.is_active && defaultBarcodeProviderId === data.id) {
+        setDefaultBarcodeProviderId(null);
+        saveAllPreferences({ defaultBarcodeProviderId: null });
+      }
     } catch (error: unknown) {
       console.error('Error updating external data provider:', error);
     }

SparkyFitnessFrontend/src/pages/Settings/ExternalProviderSettings.tsx

@@ -1,10 +1,22 @@
 import { useState } from 'react';
 import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card';
+import { Label } from '@/components/ui/label';
+import {
+  Select,
+  SelectContent,
+  SelectItem,
+  SelectTrigger,
+  SelectValue,
+} from '@/components/ui/select';
 import { Separator } from '@/components/ui/separator';
+
 import { Database } from 'lucide-react';
 import AddExternalProviderForm from './AddExternalProviderForm';
 import ExternalProviderList from './ExternalProviderList';
 import GarminConnectSettings from './GarminConnectSettings';
+import { usePreferences } from '@/contexts/PreferencesContext';
+import { useExternalProviders } from '@/hooks/Settings/useExternalProviderSettings';
+import { useAuth } from '@/hooks/useAuth';
 
 export interface ExternalDataProvider {
   id: string;
@@ -50,12 +62,25 @@ export interface ExternalDataProvider {
   is_strictly_private?: boolean;
 }
 
+const BARCODE_PROVIDER_TYPES = ['openfoodfacts', 'usda'];
+
 const ExternalProviderSettings = () => {
   const [showAddForm, setShowAddForm] = useState(false);
   const [showGarminMfaInputFromAddForm, setShowGarminMfaInputFromAddForm] =
     useState(false);
   const [garminClientStateFromAddForm, setGarminClientStateFromAddForm] =
     useState<string | null>(null);
+  const { user } = useAuth();
+  const {
+    defaultBarcodeProviderId,
+    setDefaultBarcodeProviderId,
+    saveAllPreferences,
+  } = usePreferences();
+  const { data: providers = [] } = useExternalProviders(user.activeUserId);
+
+  const barcodeProviders = providers.filter(
+    (p) => p.is_active && BARCODE_PROVIDER_TYPES.includes(p.provider_type)
+  );
 
   const handleAddProviderSuccess = () => {
     setShowAddForm(false);
@@ -100,6 +125,35 @@ const ExternalProviderSettings = () => {
             )}
 
             <ExternalProviderList showAddForm={showAddForm} />
+
+            {barcodeProviders.length > 0 && (
+              <>
+                <Separator />
+
+                <div className="space-y-2">
+                  <Label htmlFor="barcode-provider">Barcode (mobile app)</Label>
+                  <Select
+                    value={defaultBarcodeProviderId ?? ''}
+                    onValueChange={(value) => {
+                      const id = value || null;
+                      setDefaultBarcodeProviderId(id);
+                      saveAllPreferences({ defaultBarcodeProviderId: id });
+                    }}
+                  >
+                    <SelectTrigger id="barcode-provider">
+                      <SelectValue placeholder="Select a barcode provider" />
+                    </SelectTrigger>
+                    <SelectContent>
+                      {barcodeProviders.map((p) => (
+                        <SelectItem key={p.id} value={p.id}>
+                          {p.provider_name}
+                        </SelectItem>
+                      ))}
+                    </SelectContent>
+                  </Select>
+                </div>
+              </>
+            )}
           </CardContent>
         </Card>
       </div>

SparkyFitnessFrontend/src/pages/Settings/ProviderCard.tsx

@@ -47,8 +47,13 @@ export const ProviderCard = ({
   startEditing,
 }: ProviderCardProps) => {
   const { user } = useAuth();
-  const { defaultFoodDataProviderId, setDefaultFoodDataProviderId } =
-    usePreferences();
+  const {
+    defaultFoodDataProviderId,
+    setDefaultFoodDataProviderId,
+    defaultBarcodeProviderId,
+    setDefaultBarcodeProviderId,
+    saveAllPreferences,
+  } = usePreferences();
 
   const { mutate: handleConnectFitbit, isPending: isConnectFitbitPending } =
     useConnectFitbitMutation();
@@ -134,12 +139,17 @@ export const ProviderCard = ({
           data.provider_type === 'nutritionix' ||
           data.provider_type === 'fatsecret' ||
           data.provider_type === 'mealie' ||
-          data.provider_type === 'tandoor')
+          data.provider_type === 'tandoor' ||
+          data.provider_type === 'usda')
       ) {
         setDefaultFoodDataProviderId(data.id);
       } else if (data && defaultFoodDataProviderId === data.id) {
         setDefaultFoodDataProviderId(null);
       }
+      if (data && !data.is_active && defaultBarcodeProviderId === data.id) {
+        setDefaultBarcodeProviderId(null);
+        saveAllPreferences({ defaultBarcodeProviderId: null });
+      }
     } catch (error: unknown) {
       console.error(error);
     }
@@ -155,6 +165,11 @@ export const ProviderCard = ({
       await deleteExternalProvider(providerId);
       if (defaultFoodDataProviderId === providerId) {
         setDefaultFoodDataProviderId(null);
+        saveAllPreferences({ defaultFoodDataProviderId: null });
+      }
+      if (defaultBarcodeProviderId === providerId) {
+        setDefaultBarcodeProviderId(null);
+        saveAllPreferences({ defaultBarcodeProviderId: null });
       }
     } catch (error: unknown) {
       console.error(error);

SparkyFitnessFrontend/src/services/preferenceService.ts

@@ -41,6 +41,7 @@ export interface UserPreferences {
   system_prompt: string;
   item_display_limit: number;
   default_food_data_provider_id: string | null;
+  default_barcode_provider_id: string | null;
 }
 
 export const updateUserPreferences = async (