Skip to content
Closed
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
15 changes: 15 additions & 0 deletions react-native/.editorconfig
Original file line number Diff line number Diff line change
@@ -0,0 +1,15 @@
# EditorConfig helps developers define and maintain consistent
# coding styles between different editors and IDEs
# editorconfig.org

root = true

[*]

indent_style = space
indent_size = 2

end_of_line = lf
charset = utf-8
trim_trailing_whitespace = true
insert_final_newline = true
105 changes: 105 additions & 0 deletions react-native/.gitignore
Original file line number Diff line number Diff line change
@@ -0,0 +1,105 @@
# OSX
#
.DS_Store

# VSCode
.vscode/settings.json

# Xcode
#
build/
*.pbxuser
!default.pbxuser
*.mode1v3
!default.mode1v3
*.mode2v3
!default.mode2v3
*.perspectivev3
!default.perspectivev3
xcuserdata
*.xccheckout
*.moved-aside
DerivedData
*.hmap
*.ipa
*.xcuserstate
ios/.xcode.env.local

# Android/IntelliJ
#
build/
.idea
.gradle
local.properties
*.iml
*.hprof
.cxx/
*.keystore
!debug.keystore
upload-keystore.jks
.kotlin/

# node.js
#
node_modules/
.yarn/
npm-debug.log
yarn-error.log
pnpm-debug.log

# fastlane
#
# It is recommended to not store the screenshots in the git repo. Instead, use fastlane to re-generate the
# screenshots whenever they are needed.
# For more information about the recommended setup visit:
# https://docs.fastlane.tools/best-practices/source-control/

**/fastlane/report.xml
**/fastlane/Preview.html
**/fastlane/screenshots
**/fastlane/test_output

# Bundle artifact
*.jsbundle

# Ruby / CocoaPods
/**/Pods/
/vendor/bundle/

# Temporary files created by Metro to check the health of the file watcher
.metro-health-check*

# testing
/coverage

# Env
.env
.env.local
.env.development.local
.env.test.local
.env.production.local
**/.xcode.env.local

# Build
.build
lib
dist
.turbo

# Module
modules/@shopify/checkout-sheet-kit/android/gradle/wrapper/gradle-wrapper.jar
modules/@shopify/checkout-sheet-kit/android/gradle/wrapper/gradle-wrapper.properties
modules/@shopify/checkout-sheet-kit/android/gradlew
modules/@shopify/checkout-sheet-kit/android/gradlew.bat

# Sample bundle
**/index.android.bundle

# Local gems
sample/vendor

# Sample app
sample/**/AndroidManifest.xml

.claude/
CLAUDE.md
2 changes: 2 additions & 0 deletions react-native/.npmrc
Original file line number Diff line number Diff line change
@@ -0,0 +1,2 @@
node-linker=hoisted
frozen-lockfile=true
1 change: 1 addition & 0 deletions react-native/.ruby-version
Original file line number Diff line number Diff line change
@@ -0,0 +1 @@
3.3.6
11 changes: 11 additions & 0 deletions react-native/.swiftformat
Original file line number Diff line number Diff line change
@@ -0,0 +1,11 @@
--indent 4
--linebreaks lf
--wraparguments before-first
--wrapcollections before-first
--commas inline
--allman false
--semicolons inline
--trimwhitespace always
--disable redundantReturn,hoistAwait,preferKeyPath,redundantInternal,redundantPublic
--swiftversion 5.7.1
--extensionacl on-declarations
39 changes: 39 additions & 0 deletions react-native/.swiftlint.yml
Original file line number Diff line number Diff line change
@@ -0,0 +1,39 @@
disabled_rules:
- line_length
- file_length
- non_optional_string_data_conversion
- type_body_length
- type_name
- identifier_name
- opening_brace
- function_body_length
- trailing_comma
- function_parameter_count

opt_in_rules:
- array_init
- collection_alignment
- comma_inheritance
- convenience_type
- closure_spacing
- direct_return
- empty_count
- empty_string
- fatal_error_message
- first_where
- identical_operands
- indentation_width
- joined_default_parameter
- modifier_order
- overridden_super_call
- toggle_bool
- switch_case_alignment:
indented_cases: false
- fallthrough
- explicit_acl

nesting:
type_level:
warning: 2

reporter: "xcode"
8 changes: 8 additions & 0 deletions react-native/.vscode/extensions.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,8 @@
{
"recommendations": [
"esbenp.prettier-vscode",
"editorconfig.editorconfig",
"msjsdiag.vscode-react-native",
"yzhang.markdown-all-in-one"
]
}
1 change: 1 addition & 0 deletions react-native/.watchmanconfig
Original file line number Diff line number Diff line change
@@ -0,0 +1 @@
{}
170 changes: 170 additions & 0 deletions react-native/CONTRIBUTING.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,170 @@
# Contributing

We welcome code contributions, feature requests, and reporting of issues. Please
see [guidelines and instructions](.github/CONTRIBUTING.md).

---

This repo is subdivided into 3 parts using pnpm workspaces:

- The base repo (workspace name = `checkout-sheet-kit-react-native`)
- The `@shopify/checkout-sheet-kit` Native Module (workspace name = `module`)
- The sample application (workspace name = `sample`)

Each of the workspaces contains a separate `package.json` to manage tasks
specific to each workspace.

## Getting started

If you've cloned the repo and want to run the sample app, you will first need to:

1. Install the NPM dependencies

```sh
pnpm install
```

2. Install iOS dependencies. (N.b. Android dependencies are automatically installed by Gradle)

```sh
pnpm pod-install sample/ios
```

3. Build the Native Module

```sh
pnpm module build
```

4. Start the Metro server

```sh
pnpm sample start
```

5. Run the sample application (in a new terminal / tab)

```sh
pnpm sample ios
# or
pnpm sample android
```

## Optional: Speed up builds with sccache

For faster native compilation (especially on incremental builds), you can install [sccache](https://github.com/mozilla/sccache), a shared compilation cache:

```sh
# macOS (using Homebrew)
brew install sccache

# Ubuntu/Debian
cargo install sccache

# Other systems: see https://github.com/mozilla/sccache#installation
```

The build scripts will automatically detect and use sccache if available. On Android, React Native's CMake files look for a command named `ccache`, so the sample Android scripts put an sccache-backed compatibility command first on `PATH`. If you encounter any build issues, you can temporarily disable it:

```sh
# Disable sccache for a single build
SCCACHE=false pnpm sample ios
SCCACHE=false pnpm sample android
```

## Making changes to the Native Module

If your intentions are to modify the TS code for the Native Module under
`modules/@shopify/checkout-sheet-kit`, note that you will not need to rebuild to
observe your changes in the sample app. This is because the sample app is
importing the TS files directly from the module directory (through symlinking).

However, if you're running the iOS/Android tests against the module, you will
first need to run `pnpm module build` each time you change the TS code.

## Cleaning the workspaces

There are a handful of commands to clean the individual workspaces.

```sh
# Clear the current directory from watchman
pnpm clean

# Removes the "sample/node_modules" directory
# Removes "ios/pods" directory
# Removes "ios/build" directory
pnpm sample clean

# Removes the "lib" directory for the Native Module
pnpm module clean
```

## Linting the code

Linting the codespaces will (1) compile the code with TypeScript and (2) run
eslint over the source code.

```sh
# Lint the Native Module TS code
pnpm module lint

# Lint the Sample App TS code
pnpm sample lint
```

## Testing

There are 3 types of tests in this repo: Typescript, Swift and Java - each for
testing the Native Module.

```sh
# Run Jest tests for "modules/@shopify/checkout-sheet-kit/src/**/*.tsx"
pnpm test

# Run swift tests for the Native Module
pnpm sample test:ios

# Run Java tests for the Native Module
pnpm sample test:android
```

## Running the sample app

To run the sample app in this repo, first clone the repo and run the following
commands at the root of the project directory.

### Install NPM dependencies

```sh
pnpm install
```

### Install Cocoapods

```sh
pnpm pod-install sample/ios
```

### Build the local module

```sh
pnpm module build
```

### Update the dotenv file

Replace the details in the `sample/.env.example` file and rename it to
`sample/.env`

```
# Storefront Details
STOREFRONT_DOMAIN="YOUR_STORE.myshopify.com"
STOREFRONT_ACCESS_TOKEN="YOUR_PUBLIC_STOREFRONT_ACCESS_TOKEN"
STOREFRONT_VERSION="2025-07"
```

### Start the sample app

```sh
pnpm sample start
```
20 changes: 20 additions & 0 deletions react-native/LICENSE
Original file line number Diff line number Diff line change
@@ -0,0 +1,20 @@
MIT License

Copyright 2023 - Present, Shopify Inc.

Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal
in the Software without restriction, including without limitation the rights
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
copies of the Software, and to permit persons to whom the Software is
furnished to do so, subject to the following conditions:

The above copyright notice and this permission notice shall be included in all
copies or substantial portions of the Software.

THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
Loading
Loading