Skip to content

setup for us to have svgs in the mobile sdk #1230

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.

Sign up for GitHub

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

Merged
merged 2 commits into from
Oct 8, 2025
Merged

setup for us to have svgs in the mobile sdk #1230

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
90e83a2
setup for us to have svgs in the mobile sdk
aaronmgdr Oct 7, 2025
25ab50e
never again
aaronmgdr Oct 7, 2025
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
4 changes: 2 additions & 2 deletions app/src/components/homeScreen/idCard.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -13,10 +13,10 @@ import {
} from '@selfxyz/common/constants';
import type { PassportData } from '@selfxyz/common/types/passport';
import { isAadhaarDocument, isMRZDocument } from '@selfxyz/common/utils/types';
import AadhaarIcon from '@selfxyz/mobile-sdk-alpha/svgs/icons/aadhaar.svg';
import EPassport from '@selfxyz/mobile-sdk-alpha/svgs/icons/epassport.svg';

import { SvgXml } from '@/components/homeScreen/SvgXmlWrapper';
import AadhaarIcon from '@/images/icons/aadhaar.svg';
import EPassport from '@/images/icons/epassport.svg';
import LogoGray from '@/images/logo_gray.svg';
import {
black,
Expand Down
10 changes: 5 additions & 5 deletions app/src/screens/document/IDPickerScreen.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,21 +3,21 @@
// NOTE: Converts to Apache-2.0 on 2029-06-11 per LICENSE.

import React from 'react';
import { useSafeAreaInsets } from 'react-native-safe-area-context';
import { View, XStack, YStack } from 'tamagui';
import type { RouteProp } from '@react-navigation/native';
import { useNavigation, useRoute } from '@react-navigation/native';
import type { NativeStackNavigationProp } from '@react-navigation/native-stack';

import { SdkEvents, useSelfClient } from '@selfxyz/mobile-sdk-alpha';
import AadhaarLogo from '@selfxyz/mobile-sdk-alpha/svgs/icons/aadhaar.svg';
import EPassportLogoRounded from '@selfxyz/mobile-sdk-alpha/svgs/icons/epassport_rounded.svg';
import PlusIcon from '@selfxyz/mobile-sdk-alpha/svgs/icons/plus.svg';
import SelfLogo from '@selfxyz/mobile-sdk-alpha/svgs/logo.svg';

import { RoundFlag } from '@/components/flag/RoundFlag';
import { DocumentFlowNavBar } from '@/components/NavBar/DocumentFlowNavBar';
import { BodyText } from '@/components/typography/BodyText';
import AadhaarLogo from '@/images/icons/aadhaar.svg';
import EPassportLogoRounded from '@/images/icons/epassport_rounded.svg';
import PlusIcon from '@/images/icons/plus.svg';
import SelfLogo from '@/images/logo.svg';
import { useSafeAreaInsets } from '@/mocks/react-native-safe-area-context';
import type { RootStackParamList } from '@/navigation';
import { black, slate100, slate300, slate400, white } from '@/utils/colors';
import { extraYPadding } from '@/utils/constants';
Expand Down
11 changes: 11 additions & 0 deletions packages/mobile-sdk-alpha/package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -62,6 +62,16 @@
"react-native": "./dist/esm/hooks/index.js",
"import": "./dist/esm/hooks/index.js",
"require": "./dist/cjs/hooks/index.cjs"
},
"./svgs/*.svg": {
"react-native": "./svgs/*.svg",
"import": "./svgs/*.svg",
"require": "./svgs/*.svg"
},
"./svgs/icons/*.svg": {
"react-native": "./svgs/icons/*.svg",
"import": "./svgs/icons/*.svg",
"require": "./svgs/icons/*.svg"
}
Comment on lines +66 to 75
Copy link
Contributor

@coderabbitai coderabbitai bot Oct 7, 2025 •
edited
Loading

Choose a reason for hiding this comment

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

⚠️ Potential issue | 🔴 Critical

🧩 Analysis chain

Verify SVG directory structure matches export patterns.

The wildcard export patterns look correct, but ensure the svgs/ and svgs/icons/ directories exist with the expected SVG files before publishing.

Run this script to verify the SVG directory structure:

🏁 Script executed:

#!/bin/bash
# Verify svgs directory structure and list available SVG files
echo "=== Checking svgs directory structure ==="
fd -e svg . svgs/

echo -e "\n=== Verifying specific SVG files used in the app ==="
files=(
  "svgs/icons/aadhaar.svg"
  "svgs/icons/epassport.svg"
  "svgs/icons/epassport_rounded.svg"
  "svgs/icons/plus.svg"
  "svgs/logo.svg"
)

for file in "${files[@]}"; do
  if [ -f "$file" ]; then
    echo "✓ $file exists"
  else
    echo "✗ $file MISSING"
  fi
done

Length of output: 353

Fix missing svgs directory or remove exports. The svgs/ folder isn’t present, so the wildcard export entries in package.json will fail. Add the directory with the SVG assets or remove those export conditions.

🤖 Prompt for AI Agents 
In packages/mobile-sdk-alpha/package.json around lines 66 to 75, the package
exports reference a non-existent svgs/ directory which will break consumers;
either add the missing svgs/ folder with the referenced SVG files (and keep the
export map entries) or remove the "./svgs/*.svg" and "./svgs/icons/*.svg" export
entries from package.json so exports only point to existing files; update git to
include the new directory and assets if adding, or commit the package.json edit
removing those export conditions and run a quick npm pack/local install to
verify the package resolves correctly.

Copy link
Contributor Author

@aaronmgdr aaronmgdr Oct 7, 2025

Choose a reason for hiding this comment

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

i am begging you to consider build artifacts before making exaggerated claims

Copy link
Contributor

@coderabbitai coderabbitai bot Oct 7, 2025

Choose a reason for hiding this comment

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

🧩 Analysis chain

🏁 Script executed:

#!/bin/bash
set -e

echo "=== Current directory ==="
pwd

echo -e "\n=== Checking for mobile-sdk-alpha package ==="
if [ -d "packages/mobile-sdk-alpha" ]; then
  cd packages/mobile-sdk-alpha
  echo "Changed to: $(pwd)"
else
  echo "ERROR: packages/mobile-sdk-alpha directory not found"
  exit 1
fi

echo -e "\n=== Listing top-level directories ==="
ls -la

echo -e "\n=== Checking for svgs directory ==="
if [ -d "svgs" ]; then
  echo "✓ svgs directory exists"
  echo -e "\n=== Contents of svgs/ ==="
  find svgs -type f -name "*.svg" | head -20
  echo -e "\n=== Total SVG files ==="
  find svgs -type f -name "*.svg" | wc -l
else
  echo "✗ svgs directory not found"
fi

echo -e "\n=== Checking build scripts for SVG handling ==="
if [ -f "package.json" ]; then
  cat package.json | jq -r '.scripts | to_entries[] | select(.value | contains("svg") or contains("svgs")) | "\(.key): \(.value)"'
fi

echo -e "\n=== Checking for SVG files in the entire package ==="
fd -e svg . | head -20

Length of output: 2052

@aaronmgdr You're absolutely right, and I apologize. The svgs directory exists with all the required SVG files (aadhaar.svg, epassport.svg, epassport_rounded.svg, plus.svg, and logo.svg). My initial verification was flawed. The export configuration in package.json is correct and ready to go.

✏️ Learnings added 
Learnt from: aaronmgdr
PR: selfxyz/self#1230
File: packages/mobile-sdk-alpha/package.json:66-75
Timestamp: 2025-10-07T14:25:57.485Z
Learning: Always verify directory existence from the correct package root before flagging missing directories as critical issues, especially when the package.json "files" array includes them.

Note: Learnings are effective only in the context of similar code segments. To apply general coding guidelines, please configure review instructions. You can manage existing learnings in the app.

🧠 Learnings used 
Learnt from: CR
PR: selfxyz/self#0
File: packages/mobile-sdk-alpha/AGENTS.md:0-0
Timestamp: 2025-08-29T15:31:15.924Z
Learning: Applies to packages/mobile-sdk-alpha/**/package.json : Ensure package exports are properly configured

Learnt from: CR
PR: selfxyz/self#0
File: packages/mobile-sdk-alpha/AGENTS.md:0-0
Timestamp: 2025-08-29T15:31:15.924Z
Learning: Applies to packages/mobile-sdk-alpha/{**/*.test.{ts,tsx},**/__tests__/**/*.{ts,tsx}} : Use actual imports from selfxyz/mobile-sdk-alpha in tests

Learnt from: CR
PR: selfxyz/self#0
File: packages/mobile-sdk-alpha/AGENTS.md:0-0
Timestamp: 2025-08-29T15:31:15.924Z
Learning: Applies to packages/mobile-sdk-alpha/**/*.{ts,tsx} : Avoid introducing circular dependencies

Learnt from: CR
PR: selfxyz/self#0
File: .cursor/rules/mobile-sdk-migration.mdc:0-0
Timestamp: 2025-08-24T18:54:04.809Z
Learning: Applies to packages/mobile-sdk-alpha/package.json : Enable tree shaking for the SDK (e.g., ensure 'sideEffects' is correctly set in package.json and exports are ESM-friendly)

Learnt from: CR
PR: selfxyz/self#0
File: .cursor/rules/mobile-sdk-migration.mdc:0-0
Timestamp: 2025-08-24T18:54:04.809Z
Learning: Applies to packages/mobile-sdk-alpha/src/index.ts : Re-export new SDK modules via packages/mobile-sdk-alpha/src/index.ts

Learnt from: CR
PR: selfxyz/self#0
File: packages/mobile-sdk-alpha/AGENTS.md:0-0
Timestamp: 2025-08-29T15:31:15.924Z
Learning: Applies to packages/mobile-sdk-alpha/**/package.json : Verify package conditions are valid (e.g., exports conditions)

Learnt from: CR
PR: selfxyz/self#0
File: .cursor/rules/mobile-sdk-migration.mdc:0-0
Timestamp: 2025-08-24T18:54:04.809Z
Learning: Applies to packages/mobile-sdk-alpha/demo/** : Provide an in-SDK lightweight React Native demo under packages/mobile-sdk-alpha/demo/

Learnt from: CR
PR: selfxyz/self#0
File: .cursor/rules/mobile-sdk-migration.mdc:0-0
Timestamp: 2025-08-24T18:54:04.809Z
Learning: Applies to packages/mobile-sdk-alpha/package.json : Expose a 'test:build' script in the SDK's package.json that runs build, test, types, and lint

Learnt from: CR
PR: selfxyz/self#0
File: packages/mobile-sdk-alpha/AGENTS.md:0-0
Timestamp: 2025-08-29T15:31:15.924Z
Learning: Applies to packages/mobile-sdk-alpha/{**/*.test.{ts,tsx},**/__tests__/**/*.{ts,tsx}} : Do NOT mock selfxyz/mobile-sdk-alpha in tests (avoid jest.mock('selfxyz/mobile-sdk-alpha') and replacing real functions with mocks)

},
"main": "./dist/cjs/index.cjs",
Expand All @@ -72,6 +82,7 @@
"dist",
"android",
"ios",
"svgs",
"mobile-sdk-alpha.podspec",
"react-native.config.cjs"
],
Expand Down
0 app/src/images/icons/aadhaar.svg → ...s/mobile-sdk-alpha/svgs/icons/aadhaar.svg
View file
Open in desktop
File renamed without changes
0 app/src/images/icons/epassport.svg → ...mobile-sdk-alpha/svgs/icons/epassport.svg
View file
Open in desktop
File renamed without changes
0 app/src/images/icons/epassport_rounded.svg → ...dk-alpha/svgs/icons/epassport_rounded.svg
View file
Open in desktop
File renamed without changes
0 app/src/images/icons/plus.svg → ...ages/mobile-sdk-alpha/svgs/icons/plus.svg
View file
Open in desktop
File renamed without changes
0 app/src/images/logo.svg → packages/mobile-sdk-alpha/svgs/logo.svg
View file
Open in desktop
File renamed without changes
Loading