Create Demo Store

.github/workflows/jekyll-gh-pages.yml

@@ -0,0 +1,51 @@
+# Simple workflow for deploying static content to GitHub Pages
+name: Deploy static content to Pages
+
+on:
+  # Runs on pushes targeting the default branch
+  push:
+    branches: ['main']
+
+  # Allows you to run this workflow manually from the Actions tab
+  workflow_dispatch:
+
+# Sets the GITHUB_TOKEN permissions to allow deployment to GitHub Pages
+permissions:
+  contents: read
+  pages: write
+  id-token: write
+
+# Allow one concurrent deployment
+concurrency:
+  group: 'pages'
+  cancel-in-progress: true
+
+jobs:
+  # Single deploy job since we're just deploying
+  deploy:
+    environment:
+      name: github-pages
+      url: ${{ steps.deployment.outputs.page_url }}
+    runs-on: ubuntu-latest
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v4
+      - name: Set up Node
+        uses: actions/setup-node@v4
+        with:
+          node-version: 20
+          cache: 'npm'
+      - name: Install dependencies
+        run: npm ci
+      - name: Build
+        run: npm run build
+      - name: Setup Pages
+        uses: actions/configure-pages@v4
+      - name: Upload artifact
+        uses: actions/upload-pages-artifact@v3
+        with:
+          # Upload dist folder
+          path: './dist'
+      - name: Deploy to GitHub Pages
+        id: deployment
+        uses: actions/deploy-pages@v4

.gitignore

@@ -0,0 +1,24 @@
+# Logs
+logs
+*.log
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+pnpm-debug.log*
+lerna-debug.log*
+
+node_modules
+dist
+dist-ssr
+*.local
+
+# Editor directories and files
+.vscode/*
+!.vscode/extensions.json
+.idea
+.DS_Store
+*.suo
+*.ntvs*
+*.njsproj
+*.sln
+*.sw?

CODEOWNERS

@@ -0,0 +1 @@
+*  @optile/dev-px

README.md

@@ -0,0 +1,65 @@
+
+
+# Checkout Web SDK Code Demo
+
+## Overview
+
+Welcome to the Checkout Web SDK Code Demo! This repository contains a demo application showcasing the Checkout Web SDK, along with its documentation.
+-   **Checkout Web Documentation**: [Read the Docs](https://checkoutdocs.payoneer.com/docs/getting-started-checkout-web-sdk)
+-   **Live Demo**: [View the Demo](https://optile.github.io/checkout-web-sdk-code-demo/)
+
+## Local Development Guide
+
+To set up and run the project locally, follow these steps:
+
+### 1. Clone the Repository
+
+Clone this repository to your local machine:
+
+    git clone https://github.com/optile/checkout-web-sdk-code-demo.git
+
+### 2. Install Dependencies
+
+Navigate to the project directory and install the necessary dependencies:
+
+    npm install
+
+### 3. Run the Development Server
+
+Start the development server to view the project locally:
+
+    npm run dev
+***Note: It's important to note the project runs on port 3000***
+
+### 4. Build the Project
+
+To create a production build of the project, run:
+
+    npm run build
+
+### 5. Preview the Build
+
+To preview the production build locally:
+
+    npm run preview
+
+## Configuration
+
+By default, this demo application uses an internal integration environment to generate list session. You can change the environment by passing `longId` and `env` as URL query parameters.
+
+*Note: More info about generating backend payment session* [here](https://checkoutdocs.payoneer.com/docs/basic-integration-checkout-web-sdk)
+
+**Example Usage:**
+
+    {BASE_URL}/?longId=longId&env=test
+
+### Available Environments
+
+Specify the environment using the `env` parameter. Available options include:
+
+-   `test` - Sandbox environment
+-   `live` - Production environment
+
+## Deployment
+
+This project is automatically deployed to GitHub Pages via GitHub Actions. Any push to the `main` branch triggers the deployment process.

eslint.config.js

@@ -0,0 +1,38 @@
+import js from '@eslint/js'
+import globals from 'globals'
+import react from 'eslint-plugin-react'
+import reactHooks from 'eslint-plugin-react-hooks'
+import reactRefresh from 'eslint-plugin-react-refresh'
+
+export default [
+  {
+    files: ['**/*.{js,jsx}'],
+    ignores: ['dist'],
+    languageOptions: {
+      ecmaVersion: 2020,
+      globals: globals.browser,
+      parserOptions: {
+        ecmaVersion: 'latest',
+        ecmaFeatures: { jsx: true },
+        sourceType: 'module',
+      },
+    },
+    settings: { react: { version: '18.3' } },
+    plugins: {
+      react,
+      'react-hooks': reactHooks,
+      'react-refresh': reactRefresh,
+    },
+    rules: {
+      ...js.configs.recommended.rules,
+      ...react.configs.recommended.rules,
+      ...react.configs['jsx-runtime'].rules,
+      ...reactHooks.configs.recommended.rules,
+      'react/jsx-no-target-blank': 'off',
+      'react-refresh/only-export-components': [
+        'warn',
+        { allowConstantExport: true },
+      ],
+    },
+  },
+]

index.html

@@ -0,0 +1,13 @@
+<!doctype html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <link rel="icon" type="image/svg+xml" href="/favicon.ico" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>Payoneer Checkout Demo</title>
+  </head>
+  <body>
+    <div id="root"></div>
+    <script type="module" src="/src/main.jsx"></script>
+  </body>
+</html>