npm - mainstack-payments - Versions diffs - 0.0.0 - Mend

mainstack-payments 0.0.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (55) hide show

package/.env.sample +1 -0
package/.eslintignore +5 -0
package/.eslintrc.json +95 -0
package/.github/PULL_REQUEST_TEMPLATE.md +15 -0
package/.husky/commit-msg +4 -0
package/.husky/pre-commit +6 -0
package/.prettierignore +7 -0
package/.prettierrc +9 -0
package/.vscode/extensions.json +10 -0
package/README.md +113 -0
package/build/_redirects +1 -0
package/build/mainstack-payments.js +97183 -0
package/build/manifest.json +15 -0
package/build/robots.txt +3 -0
package/build/style.css +6 -0
package/build/vite.svg +1 -0
package/commitlint.config.cjs +1 -0
package/index.html +31 -0
package/package.json +86 -0
package/public/_redirects +1 -0
package/public/manifest.json +15 -0
package/public/robots.txt +3 -0
package/public/vite.svg +1 -0
package/src/api/config.ts +36 -0
package/src/api/index.ts +84 -0
package/src/app.tsx +39 -0
package/src/assets/images/tired-emoji.png +0 -0
package/src/assets/styles/index.css +26 -0
package/src/assets/themes/baseThemes.ts +30 -0
package/src/components/CheckoutForm.tsx +426 -0
package/src/components/DrawerModal.tsx +63 -0
package/src/components/Payment.tsx +772 -0
package/src/components/PaystackPaymentErrorModal.tsx +120 -0
package/src/components/PaystackPaymentModal.tsx +120 -0
package/src/components/WalletPay.tsx +160 -0
package/src/constants/index.ts +3 -0
package/src/enums/currenciesEnums.ts +7 -0
package/src/hooks/usePayment.ts +60 -0
package/src/index.ts +3 -0
package/src/pages/Home.tsx +97 -0
package/src/pages/Index.tsx +23 -0
package/src/pages/Login.tsx +13 -0
package/src/pages/Page404.tsx +13 -0
package/src/pages/PaymentRedirect.tsx +15 -0
package/src/routes/index.tsx +8 -0
package/src/types/index.ts +48 -0
package/src/utils/countries-flag.json +1752 -0
package/src/utils/countries_flag.json +1502 -0
package/src/utils/countries_with_flags_and_currencies.json +4004 -0
package/src/utils/formatUnderscoreText.ts +5 -0
package/src/utils/index.ts +4 -0
package/src/utils/stringifyPrice.ts +37 -0
package/src/utils/validations.ts +44 -0
package/tsconfig.json +35 -0
package/vite.config.ts +36 -0

package/build/vite.svg ADDED Viewed

@@ -0,0 +1 @@

+ <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="iconify iconify--logos" width="31.88" height="32" preserveAspectRatio="xMidYMid meet" viewBox="0 0 256 257"><defs><linearGradient id="IconifyId1813088fe1fbc01fb466" x1="-.828%" x2="57.636%" y1="7.652%" y2="78.411%"><stop offset="0%" stop-color="#41D1FF"></stop><stop offset="100%" stop-color="#BD34FE"></stop></linearGradient><linearGradient id="IconifyId1813088fe1fbc01fb467" x1="43.376%" x2="50.316%" y1="2.242%" y2="89.03%"><stop offset="0%" stop-color="#FFEA83"></stop><stop offset="8.333%" stop-color="#FFDD35"></stop><stop offset="100%" stop-color="#FFA800"></stop></linearGradient></defs><path fill="url(#IconifyId1813088fe1fbc01fb466)" d="M255.153 37.938L134.897 252.976c-2.483 4.44-8.862 4.466-11.382.048L.875 37.958c-2.746-4.814 1.371-10.646 6.827-9.67l120.385 21.517a6.537 6.537 0 0 0 2.322-.004l117.867-21.483c5.438-.991 9.574 4.796 6.877 9.62Z"></path><path fill="url(#IconifyId1813088fe1fbc01fb467)" d="M185.432.063L96.44 17.501a3.268 3.268 0 0 0-2.634 3.014l-5.474 92.456a3.268 3.268 0 0 0 3.997 3.378l24.777-5.718c2.318-.535 4.413 1.507 3.936 3.838l-7.361 36.047c-.495 2.426 1.782 4.5 4.151 3.78l15.304-4.649c2.372-.72 4.652 1.36 4.15 3.788l-11.698 56.621c-.732 3.542 3.979 5.473 5.943 2.437l1.313-2.028l72.516-144.72c1.215-2.423-.88-5.186-3.54-4.672l-25.505 4.922c-2.396.462-4.435-1.77-3.759-4.114l16.646-57.705c.677-2.35-1.37-4.583-3.769-4.113Z"></path></svg>

package/commitlint.config.cjs ADDED Viewed

	@@ -0,0 +1 @@
1	+ module.exports = { extends: ['@commitlint/config-conventional'] }

package/index.html ADDED Viewed

@@ -0,0 +1,31 @@
+<!-- @format -->
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <link rel="icon" type="image/svg+xml" href="/vite.svg" />
+    <meta
+      name="viewport"
+      content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0"
+    />
+    <meta
+      name="viewport"
+      content="height=device-height, initial-scale=1.0, maximum-scale=1.0, user-scalable=0"
+    />
+    <title>Mainstach template</title>
+    <script>
+      let vh = window.innerHeight * 0.01;
+      document.documentElement.style.setProperty("--vh", `${vh}px`);
+      window.addEventListener("resize", () => {
+        let vh = window.innerHeight * 0.01;
+        document.documentElement.style.setProperty("--vh", `${vh}px`);
+      });
+    </script>
+  </head>
+  <body>
+    <noscript>You need to enable JavaScript to run this app.</noscript>
+    <div id="root"></div>
+    <script type="module" src="src/app.tsx"></script>
+  </body>
+</html>

package/package.json ADDED Viewed

@@ -0,0 +1,86 @@
+{
+  "name": "mainstack-payments",
+  "type": "module",
+  "version": "0.0.0",
+  "main": "build/mainstack-payments.js",
+  "types": "build/src/index.d.ts",
+  "scripts": {
+    "dev": "vite",
+    "build": "tsc && vite build",
+    "preview": "vite preview --port 5001",
+    "format": "prettier src -c --write && pretty-quick --staged",
+    "lint": "eslint src --ext .js,.jsx,.ts,.tsx --quiet --fix",
+    "ts-error": "./node_modules/.bin/tsc",
+    "postinstall": "husky install",
+    "prepare": "husky install",
+    "scriptname": "cmd"
+  },
+  "browserslist": {
+    "production": [
+      ">0.2%",
+      "not dead",
+      "not op_mini all"
+    ],
+    "development": [
+      "last 1 chrome version",
+      "last 1 firefox version",
+      "last 1 safari version"
+    ]
+  },
+  "dependencies": {
+    "@chakra-ui/react": "^2.5.1",
+    "@stripe/react-stripe-js": "^2.7.1",
+    "@stripe/stripe-js": "^4.0.0",
+    "@tanstack/react-query": "^5.45.1",
+    "axios": "^1.7.2",
+    "eslint-config-prettier": "^8.6.0",
+    "eslint-plugin-prettier": "^4.2.1",
+    "formik": "^2.4.6",
+    "framer-motion": "^10.0.1",
+    "mainstack-design-system": "^0.4.8",
+    "postcode-validator": "^3.8.21",
+    "prettier": "^2.8.4",
+    "pretty-quick": "^3.1.3",
+    "react": "^18.2.0",
+    "react-dom": "^18.2.0",
+    "react-paystack": "^5.0.0",
+    "react-router-dom": "^6.8.1",
+    "typescript": "^4.9.5",
+    "uuid": "^10.0.0",
+    "vite-plugin-env-compatible": "^1.1.1",
+    "vite-plugin-svgr": "^2.4.0",
+    "vite-tsconfig-paths": "^4.0.5",
+    "yup": "^1.4.0"
+  },
+  "devDependencies": {
+    "@commitlint/cli": "17.1.2",
+    "@commitlint/config-conventional": "17.1.0",
+    "@types/react": "^18.0.28",
+    "@types/react-dom": "^18.0.11",
+    "@types/uuid": "^10.0.0",
+    "@typescript-eslint/eslint-plugin": "^5.53.0",
+    "@typescript-eslint/parser": "^5.53.0",
+    "@vitejs/plugin-react": "^3.1.0",
+    "eslint": "^8.35.0",
+    "eslint-config-airbnb": "^19.0.4",
+    "eslint-config-airbnb-typescript": "^17.0.0",
+    "eslint-import-resolver-typescript": "^3.5.3",
+    "eslint-plugin-import": "^2.27.5",
+    "eslint-plugin-jsx-a11y": "^6.7.1",
+    "eslint-plugin-react": "^7.32.2",
+    "eslint-plugin-react-hooks": "^4.6.0",
+    "husky": "^8.0.3",
+    "vite": "^4.1.0"
+  },
+  "description": "A React library to use Mainstack Payments",
+  "repository": {
+    "type": "git",
+    "url": "git+https://D-Ajiva@github.com/The-Mainstack/mainstack-payments.git"
+  },
+  "author": "david-aji",
+  "license": "ISC",
+  "bugs": {
+    "url": "https://github.com/The-Mainstack/mainstack-payments/issues"
+  },
+  "homepage": "https://github.com/The-Mainstack/mainstack-payments#readme"
+}

package/public/_redirects ADDED Viewed

	@@ -0,0 +1 @@
1	+ /* /index.html 200

package/public/manifest.json ADDED Viewed

@@ -0,0 +1,15 @@
+{
+  "short_name": "Mainstack Template",
+  "name": "This is a template to build mainstack app going forward",
+  "icons": [
+    {
+      "src": "vite.svg",
+      "sizes": "64x64 32x32 24x24 16x16",
+      "type": "image/x-icon"
+    }
+  ],
+  "start_url": ".",
+  "display": "standalone",
+  "theme_color": "#000000",
+  "background_color": "#ffffff"
+}

package/public/robots.txt ADDED Viewed

@@ -0,0 +1,3 @@
+# https://www.robotstxt.org/robotstxt.html
+User-agent: *
+Disallow:

package/public/vite.svg ADDED Viewed

@@ -0,0 +1 @@

package/src/api/config.ts ADDED Viewed

@@ -0,0 +1,36 @@
+/** @format */
+import axios, { AxiosHeaders, AxiosRequestConfig } from "axios";
+const InitializeAPIConfig = (baseUrl: string, authMSUrl: string) => {
+  const Request = axios.create({
+    baseURL: baseUrl,
+    timeout: 30000,
+  });
+  const AuthMSRequest = axios.create({
+    baseURL: authMSUrl,
+    timeout: 30000,
+  });
+  const requestConfiguration = (config: AxiosRequestConfig) => {
+    return {
+      ...config,
+      headers: {
+        Authorization: `Basic dXNlcm5hbWU6cGFzc3dvcmQ=`,
+        ...config.headers,
+      } as unknown as AxiosHeaders,
+    };
+  };
+  Request.interceptors.request.use(requestConfiguration, (error) => {
+    return Promise.reject(error);
+  });
+  AuthMSRequest.interceptors.request.use(requestConfiguration, (error) => {
+    return Promise.reject(error);
+  });
+  return { Request, AuthMSRequest };
+};
+export default InitializeAPIConfig;

package/src/api/index.ts ADDED Viewed

@@ -0,0 +1,84 @@
+/** @format */
+import { useQuery, useMutation } from "@tanstack/react-query";
+import axios from "axios";
+import { TMetadata } from "types";
+export const useGetTransactionFees = (
+  {
+    account_id,
+    currency,
+    amount,
+    slug,
+  }: {
+    account_id: string;
+    currency: string;
+    amount: number;
+    slug?: string;
+  },
+  AuthMSRequest: any
+) =>
+  useQuery({
+    queryKey: ["getTransactionFees", account_id, currency, amount, slug],
+    queryFn: () =>
+      AuthMSRequest.get(
+        `/payments/fees?account_id=${account_id}&currency=${currency}&amount=${amount}${
+          slug ? `&slug=${slug}` : ""
+        }`
+      )
+        .then((res: any) => res.data)
+        .catch((err: any) => {
+          throw err.response.data;
+        }),
+    enabled: !!(amount && amount > 0),
+  });
+interface IInitPayment {
+  amount: number;
+  reference: string;
+  currency: string;
+  metadata: TMetadata;
+}
+export const useInitPayment = (Request: any) =>
+  useMutation({
+    mutationFn: async (data: IInitPayment) => {
+      try {
+        const res = await Request.post(`payments/init`, data);
+        return res.data;
+      } catch (error: any) {
+        throw error?.response?.data;
+      }
+    },
+  });
+interface IChargePayment {
+  amount: number;
+  currency: string;
+  callback_url?: string;
+  metadata: TMetadata;
+}
+export const useChargePayment = (Request: any) =>
+  useMutation({
+    mutationFn: async (data: IChargePayment) => {
+      try {
+        const res = await Request.post("/payments/charge", data);
+        return res.data;
+      } catch (error: any) {
+        throw error?.response?.data;
+      }
+    },
+  });
+export const useVerifyPayment = (reference: string, Request: any) =>
+  useQuery({
+    queryKey: ["verifyPayment", reference],
+    queryFn: () =>
+      Request.get(`payments/verify/${reference}`)
+        .then((res: any) => res?.data)
+        .catch((err: any) => {
+          throw err?.response?.data;
+        }),
+    enabled: false,
+    refetchOnWindowFocus: false,
+  });

package/src/app.tsx ADDED Viewed

@@ -0,0 +1,39 @@
+/** @format */
+import { StrictMode } from "react";
+import { createRoot } from "react-dom/client";
+import Index from "pages/Index";
+import "assets/styles/index.css";
+import { ChakraProvider } from "@chakra-ui/react";
+import { theme } from "assets/themes/baseThemes";
+import { QueryClient, QueryClientProvider } from "@tanstack/react-query";
+import {
+  CustomSnackbarContainer,
+  MainstackProvider,
+} from "mainstack-design-system";
+const AppToRender = () => {
+  const queryClient = new QueryClient({
+    defaultOptions: {
+      queries: {
+        retry: 1,
+      },
+    },
+  });
+  return (
+    <StrictMode>
+      <QueryClientProvider client={queryClient}>
+        <ChakraProvider theme={theme}>
+          <MainstackProvider>
+            <CustomSnackbarContainer />
+            <Index />
+          </MainstackProvider>
+        </ChakraProvider>
+      </QueryClientProvider>
+    </StrictMode>
+  );
+};
+const root = createRoot(document.getElementById("root") as Element);
+root.render(<AppToRender />);

package/src/assets/images/tired-emoji.png ADDED Viewed

Binary file

package/src/assets/styles/index.css ADDED Viewed

@@ -0,0 +1,26 @@
+/** @format */
+@import url("https://fonts.googleapis.com/css2?family=Open+Sans:wght@400;500;600;700&display=swap");
+:root {
+  line-height: 1.5;
+  font-weight: 400;
+  font-synthesis: none;
+  text-rendering: optimizeLegibility;
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+  -webkit-text-size-adjust: 100%;
+}
+#root {
+  width: 100%;
+  min-height: 100vh;
+}
+body {
+  margin: 0;
+  font-family: "Open Sans";
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+  overscroll-behavior: none;
+}

package/src/assets/themes/baseThemes.ts ADDED Viewed

@@ -0,0 +1,30 @@
+/** @format */
+import { extendTheme } from "@chakra-ui/react";
+// baseTheme.fonts?.heading
+const config = {
+  initialColorMode: "light",
+  useSystemColorMode: false,
+};
+export const theme = extendTheme({
+  config,
+  colors: {
+    //
+  },
+  fonts: {
+    //
+  },
+  fontSizes: {
+    h1: "40px",
+    h2: "24px",
+    h3: "24px",
+    p: "20px",
+    body: "16px",
+    button: "18px",
+    mini: "16px",
+    small: "14px",
+  },
+});