feat(PAYMENTS-18857): add start page

xsolla · Apr 17, 2024 · ce6df80 · ce6df80
1 parent 65aa15f
commit ce6df80
Show file tree

Hide file tree

Showing 74 changed files with 5,666 additions and 989 deletions.
diff --git a/.env.development b/.env.development
@@ -0,0 +1 @@
+VITE_CDN_URL=https://cdn.xsolla.net/headless-checkout-prod/assets
diff --git a/.env.production b/.env.production
@@ -0,0 +1 @@
+VITE_CDN_URL=https://cdn.xsolla.net/headless-checkout-prod/assets
diff --git a/firebase.json b/firebase.json
@@ -3,7 +3,8 @@
     {
       "target": "react-demo",
       "public": "dist",
-      "ignore": ["firebase.json", "**/.*", "**/node_modules/**"]
+      "ignore": ["firebase.json", "**/.*", "**/node_modules/**"],
+      "rewrites": [{ "source": "**", "destination": "/index.html" }]
     }
   ]
 }
diff --git a/index.html b/index.html
@@ -4,7 +4,7 @@
     <meta charset="UTF-8" />
     <link rel="icon" type="image/svg+xml" href="/brand-logo_xsolla.png" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-    <title>%VITE_APP_TITLE%</title>
+    <title>Headless Checkout</title>
   </head>
   <body>
     <div id="root"></div>

diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -17,19 +17,29 @@
     "**/*": "prettier --write --ignore-unknown"
   },
   "dependencies": {
+    "@reduxjs/toolkit": "^2.2.3",
+    "axios": "^1.6.8",
+    "install": "^0.13.0",
+    "npm": "^10.5.1",
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
     "react-intl": "^6.6.5",
+    "react-lazy-load-image-component": "^1.6.0",
+    "react-redux": "^9.1.0",
     "react-router-dom": "^6.20.0",
-    "styled-components": "^5.2.0",
+    "react-select": "^5.8.0",
+    "sass": "^1.74.1",
+    "styled-components": "^6.1.8",
     "zod": "^3.22.4"
   },
   "devDependencies": {
     "@commitlint/cli": "^19.2.1",
     "@commitlint/config-conventional": "^19.1.0",
     "@rollup/plugin-replace": "^5.0.5",
+    "@types/axios": "^0.14.0",
     "@types/react": "^18.2.37",
     "@types/react-dom": "^18.2.15",
+    "@types/react-lazy-load-image-component": "^1.6.3",
     "@typescript-eslint/eslint-plugin": "^7.5.0",
     "@typescript-eslint/parser": "^7.5.0",
     "@vitejs/plugin-react": "^4.2.0",

diff --git a/public/brand-logo_xsolla.png b/public/brand-logo_xsolla.png
diff --git a/src/App.tsx b/src/App.tsx
@@ -1,30 +1,17 @@
-import { createBrowserRouter, RouterProvider } from 'react-router-dom';
-import Layout from './layout.tsx';
-import { NoMatch } from './routes/not-found';
-import { Home } from './routes/home';
-import { LocalizationContextProvider } from './app/contexts/localization-context/localization-context-provider.tsx';
+import React from 'react';
+import { RouterProvider } from 'react-router-dom';
 
-const router = createBrowserRouter([
-  {
-    path: '/',
-    element: <Layout />,
-    children: [
-      {
-        index: true,
-        element: <Home />,
-      },
-      {
-        path: '*',
-        element: <NoMatch />,
-      },
-    ],
-  },
-]);
+import { router } from './routes';
+import { Provider } from 'react-redux';
+import { store } from './redux/store.ts';
+import { LocalizationContextProvider } from './app/contexts/localization-context/localization-context-provider.tsx';
 
 export default function App() {
   return (
-    <LocalizationContextProvider>
-      <RouterProvider router={router} />
-    </LocalizationContextProvider>
+    <Provider store={store}>
+      <LocalizationContextProvider>
+        <RouterProvider router={router} />
+      </LocalizationContextProvider>
+    </Provider>
   );
 }
diff --git a/src/api/client.ts b/src/api/client.ts
@@ -0,0 +1,6 @@
+import axios from 'axios';
+
+const tokenUrl = 'https://us-central1-headless-checkout-app.cloudfunctions.net/generateToken';
+export const tokenApiClient = axios.create({
+  baseURL: tokenUrl,
+});
diff --git a/src/api/token/index.ts b/src/api/token/index.ts
@@ -0,0 +1,13 @@
+import { tokenApiClient } from '../client';
+
+export const getToken = async (parameters: { sandbox: boolean }): Promise<string> => {
+  const { sandbox } = parameters;
+  const response = await tokenApiClient.get('', {
+    params: { ...(sandbox ? { sandbox: '1' } : {}) },
+  });
+  if (response.data.error) {
+    throw new Error(response.data.error.message);
+  }
+
+  return response.data.result;
+};
diff --git a/src/assets/arrow-down.svg b/src/assets/arrow-down.svg
diff --git a/src/assets/coin.svg b/src/assets/coin.svg
diff --git a/src/assets/fonts/SharpGroteskBold20.woff2 b/src/assets/fonts/SharpGroteskBold20.woff2
diff --git a/src/assets/fonts/SharpGroteskBook20.woff b/src/assets/fonts/SharpGroteskBook20.woff
diff --git a/src/assets/fonts/SharpGroteskMediumItalic20.woff2 b/src/assets/fonts/SharpGroteskMediumItalic20.woff2
diff --git a/src/assets/fonts/SharpGroteskSmBold15.woff b/src/assets/fonts/SharpGroteskSmBold15.woff
diff --git a/src/assets/fonts/SharpGroteskSmBold20.woff2 b/src/assets/fonts/SharpGroteskSmBold20.woff2
diff --git a/src/assets/headless-checkout.png b/src/assets/headless-checkout.png
diff --git a/src/assets/location--line.svg b/src/assets/location--line.svg
diff --git a/src/assets/logo.svg b/src/assets/logo.svg
diff --git a/src/assets/react.svg b/src/assets/react.svg
Original file line number	Diff line number	Diff line change
		@@ -0,0 +1 @@
		VITE_CDN_URL=https://cdn.xsolla.net/headless-checkout-prod/assets