PkgFoundry
Catalog npm
Back to packageRELEASE DETAILS

0.0.1

npm

5paisa-tradingview-webhook

A React component for integrating TradingView webhooks with trading platforms. This component provides a user interface for generating webhook URLs and JSON payloads that can be used to connect TradingView alerts with trading accounts.

Published10 Sept 2025
Direct dependencies134
Transitive dependenciesNot calculated

README

Current package documentation

React Webhook Integration Component

A React component for integrating TradingView webhooks with trading platforms. This component provides a user interface for generating webhook URLs and JSON payloads that can be used to connect TradingView alerts with trading accounts.

Features

  • Generate and manage webhook URLs with configurable expiry periods
  • Create custom order JSON payloads
  • Support for both custom orders and basket orders
  • Real-time URL and JSON copying functionality
  • Built-in validation and error handling
  • Responsive design with mobile support
  • Integration with trading platforms

Installation

npm install trading-webhook-component

Dependencies

This component requires the following peer dependencies:

{
  "react": "^17.0.0 || ^18.0.0",
  "react-dom": "^17.0.0 || ^18.0.0",
  "moment": "^2.29.0",
  "react-outside-click-handler": "^1.3.0"
}

Usage

import { Webhook } from 'trading-webhook-component';

function App() {
  return (
    <Webhook 
      closeWebHookModal={() => {}} 
      platform="5PTRADE"
      style={{ width: '800px' }} 
    />
  );
}

Props

PropTypeRequiredDescription
closeWebHookModalfunctionNoCallback function to close the webhook modal
styleCSSPropertiesNoCustom styles to apply to the component
platform"5PTRADE" | "Derivative360"YesTrading platform identifier

Component Structure

The component consists of three main sections:

  1. URL Generation

    • Generate webhook URLs with customizable validity periods
    • Copy URL functionality
    • URL expiry tracking

  2. JSON Object Generation

    • Custom order configuration
    • Basket order selection
    • Order type selection (Market/Limit)
    • Transaction type selection (Buy/Sell)
    • Product type selection (Delivery/Intraday)

  3. Educational Resources

    • Links to documentation
    • Video tutorials
    • Quick start guides

API Integration

The component expects the following API endpoints to be available:

getWebHookDetails(clientCode: string): Promise<WebHookResponse>
getWebHookToken(validity: number, clientCode: string): Promise<TokenResponse>
getBaskets(clientCode: string): Promise<BasketResponse>

Types

type WebhookProps = {
  closeWebHookModal?: () => void;
  style?: CSSProperties;
  platform: "5PTRADE" | "Derivative360";
};

type OrderDataType = {
  RequestType: string;
  PlaceOrderReqList: SingleOrderDataType[] | BasketOrderType[];
};

type SingleOrderDataType = {
  transactionType: string;
  orderType: string;
  quantity: number;
  price: string;
  exchange: string;
  Symbol: string;
  productType: string;
};

Styling

The component uses SCSS modules for styling. You can override the default styles by providing your own style:

style={{ height: "800px" }}

Error Handling

The component includes built-in error handling for:

  • Failed API requests
  • Invalid URL generation
  • Basket loading errors
  • Invalid order parameters

Downloads & popularity

Awaiting observations

No metric observations yet

Download counts and popularity will appear here as the collector receives them.

Declared dependencies 139

Native requirements
134 direct targetsNot calculated transitive count
Package / targetRequirementRelationship
md5
Environment
{
  "local_name": "md5",
  "alias": false,
  "peer_metadata": null
}
^2.3.0runtime
npm
Environment
{
  "local_name": "npm",
  "alias": false,
  "peer_metadata": null
}
^10.7.0runtime
mqtt
Environment
{
  "local_name": "mqtt",
  "alias": false,
  "peer_metadata": null
}
^5.3.0runtime
rxjs
Environment
{
  "local_name": "rxjs",
  "alias": false,
  "peer_metadata": null
}
^7.5.6runtime
apxor
Environment
{
  "local_name": "apxor",
  "alias": false,
  "peer_metadata": null
}
^2.5.0runtime
axios
Environment
{
  "local_name": "axios",
  "alias": false,
  "peer_metadata": null
}
1.4.0runtime
react
Environment
{
  "local_name": "react",
  "alias": false,
  "peer_metadata": null
}
^18.2.0runtime
lodash
Environment
{
  "local_name": "lodash",
  "alias": false,
  "peer_metadata": null
}
^4.17.21runtime
moment
Environment
{
  "local_name": "moment",
  "alias": false,
  "peer_metadata": null
}
^2.29.3runtime
comlink
Environment
{
  "local_name": "comlink",
  "alias": false,
  "peer_metadata": null
}
^4.4.1runtime
install
Environment
{
  "local_name": "install",
  "alias": false,
  "peer_metadata": null
}
^0.13.0runtime
@mui/lab
Environment
{
  "local_name": "@mui/lab",
  "alias": false,
  "peer_metadata": null
}
^5.0.0-alpha.170runtime
apxor-qe
Environment
{
  "local_name": "apxor-qe",
  "alias": false,
  "peer_metadata": null
}
^1.6.0runtime
chart.js
Environment
{
  "local_name": "chart.js",
  "alias": false,
  "peer_metadata": null
}
^3.7.1runtime
firebase
Environment
{
  "local_name": "firebase",
  "alias": false,
  "peer_metadata": null
}
^9.22.0runtime
react-ga
Environment
{
  "local_name": "react-ga",
  "alias": false,
  "peer_metadata": null
}
^3.3.1runtime
apxor-rtm
Environment
{
  "local_name": "apxor-rtm",
  "alias": false,
  "peer_metadata": null
}
^1.11.0runtime
bootstrap
Environment
{
  "local_name": "bootstrap",
  "alias": false,
  "peer_metadata": null
}
^5.1.3runtime
crypto-js
Environment
{
  "local_name": "crypto-js",
  "alias": false,
  "peer_metadata": null
}
^4.1.1runtime
react-dom
Environment
{
  "local_name": "react-dom",
  "alias": false,
  "peer_metadata": null
}
^18.2.0runtime
react-svg
Environment
{
  "local_name": "react-svg",
  "alias": false,
  "peer_metadata": null
}
^14.1.17runtime
ts-loader
Environment
{
  "local_name": "ts-loader",
  "alias": false,
  "peer_metadata": null
}
^9.5.1runtime
react-tabs
Environment
{
  "local_name": "react-tabs",
  "alias": false,
  "peer_metadata": null
}
^4.2.0runtime
typescript
Environment
{
  "local_name": "typescript",
  "alias": false,
  "peer_metadata": null
}
^4.9.5runtime
pretty-time
Environment
{
  "local_name": "pretty-time",
  "alias": false,
  "peer_metadata": null
}
^1.1.0runtime
react-icons
Environment
{
  "local_name": "react-icons",
  "alias": false,
  "peer_metadata": null
}
^4.3.1runtime
react-modal
Environment
{
  "local_name": "react-modal",
  "alias": false,
  "peer_metadata": null
}
^3.15.1runtime
react-query
Environment
{
  "local_name": "react-query",
  "alias": false,
  "peer_metadata": null
}
^3.34.16runtime
@types/react
Environment
{
  "local_name": "@types/react",
  "alias": false,
  "peer_metadata": null
}
^18.2.0runtime
lottie-react
Environment
{
  "local_name": "lottie-react",
  "alias": false,
  "peer_metadata": null
}
^2.4.0runtime
react-router
Environment
{
  "local_name": "react-router",
  "alias": false,
  "peer_metadata": null
}
^6.13.0runtime
react-switch
Environment
{
  "local_name": "react-switch",
  "alias": false,
  "peer_metadata": null
}
^6.0.0runtime
@mui/material
Environment
{
  "local_name": "@mui/material",
  "alias": false,
  "peer_metadata": null
}
^5.15.21runtime
@sentry/react
Environment
{
  "local_name": "@sentry/react",
  "alias": false,
  "peer_metadata": null
}
^7.53.0runtime
@types/lodash
Environment
{
  "local_name": "@types/lodash",
  "alias": false,
  "peer_metadata": null
}
^4.14.181runtime
ag-grid-react
Environment
{
  "local_name": "ag-grid-react",
  "alias": false,
  "peer_metadata": null
}
29.3.5runtime
react-scripts
Environment
{
  "local_name": "react-scripts",
  "alias": false,
  "peer_metadata": null
}
5.0.0runtime
@emotion/react
Environment
{
  "local_name": "@emotion/react",
  "alias": false,
  "peer_metadata": null
}
^11.11.4runtime
react-toastify
Environment
{
  "local_name": "react-toastify",
  "alias": false,
  "peer_metadata": null
}
^9.0.4runtime
@emotion/styled
Environment
{
  "local_name": "@emotion/styled",
  "alias": false,
  "peer_metadata": null
}
^11.11.5runtime
@sentry/tracing
Environment
{
  "local_name": "@sentry/tracing",
  "alias": false,
  "peer_metadata": null
}
^7.53.0runtime
react-bootstrap
Environment
{
  "local_name": "react-bootstrap",
  "alias": false,
  "peer_metadata": null
}
^2.4.0runtime
@types/react-dom
Environment
{
  "local_name": "@types/react-dom",
  "alias": false,
  "peer_metadata": null
}
^18.2.0runtime
react-datepicker
Environment
{
  "local_name": "react-datepicker",
  "alias": false,
  "peer_metadata": null
}
^6.9.0runtime
react-router-dom
Environment
{
  "local_name": "react-router-dom",
  "alias": false,
  "peer_metadata": null
}
^6.13.0runtime
ag-grid-community
Environment
{
  "local_name": "ag-grid-community",
  "alias": false,
  "peer_metadata": null
}
29.3.5runtime
react-grid-layout
Environment
{
  "local_name": "react-grid-layout",
  "alias": false,
  "peer_metadata": null
}
^1.3.4runtime
react-virtualized
Environment
{
  "local_name": "react-virtualized",
  "alias": false,
  "peer_metadata": null
}
^9.22.3runtime
svg-inline-loader
Environment
{
  "local_name": "svg-inline-loader",
  "alias": false,
  "peer_metadata": null
}
^0.8.2runtime
ag-grid-enterprise
Environment
{
  "local_name": "ag-grid-enterprise",
  "alias": false,
  "peer_metadata": null
}
29.3.5runtime
react-easy-marquee
Environment
{
  "local_name": "react-easy-marquee",
  "alias": false,
  "peer_metadata": null
}
^1.2.4runtime
@mui/x-date-pickers
Environment
{
  "local_name": "@mui/x-date-pickers",
  "alias": false,
  "peer_metadata": null
}
^7.8.0runtime
copy-webpack-plugin
Environment
{
  "local_name": "copy-webpack-plugin",
  "alias": false,
  "peer_metadata": null
}
^12.0.2runtime
react-alice-carousel
Environment
{
  "local_name": "react-alice-carousel",
  "alias": false,
  "peer_metadata": null
}
^2.6.4runtime
react-error-boundary
Environment
{
  "local_name": "react-error-boundary",
  "alias": false,
  "peer_metadata": null
}
^4.0.13runtime
@builder.io/partytown
Environment
{
  "local_name": "@builder.io/partytown",
  "alias": false,
  "peer_metadata": null
}
^0.6.4runtime
react-datetime-picker
Environment
{
  "local_name": "react-datetime-picker",
  "alias": false,
  "peer_metadata": null
}
^6.0.1runtime
@types/react-bootstrap
Environment
{
  "local_name": "@types/react-bootstrap",
  "alias": false,
  "peer_metadata": null
}
^0.32.29runtime
react-tradingview-embed
Environment
{
  "local_name": "react-tradingview-embed",
  "alias": false,
  "peer_metadata": null
}
^3.0.4runtime
@types/react-grid-layout
Environment
{
  "local_name": "@types/react-grid-layout",
  "alias": false,
  "peer_metadata": null
}
^1.3.2runtime
highcharts-react-official
Environment
{
  "local_name": "highcharts-react-official",
  "alias": false,
  "peer_metadata": null
}
^3.1.0runtime
react-intersection-observer
Environment
{
  "local_name": "react-intersection-observer",
  "alias": false,
  "peer_metadata": null
}
^9.3.5runtime
react-outside-click-handler
Environment
{
  "local_name": "react-outside-click-handler",
  "alias": false,
  "peer_metadata": null
}
^1.3.0runtime
css-minimizer-webpack-plugin
Environment
{
  "local_name": "css-minimizer-webpack-plugin",
  "alias": false,
  "peer_metadata": null
}
^7.0.0runtime
react-virtualized-auto-sizer
Environment
{
  "local_name": "react-virtualized-auto-sizer",
  "alias": false,
  "peer_metadata": null
}
^1.0.6runtime
react-infinite-scroll-component
Environment
{
  "local_name": "react-infinite-scroll-component",
  "alias": false,
  "peer_metadata": null
}
^6.1.0runtime
@microsoft/applicationinsights-web
Environment
{
  "local_name": "@microsoft/applicationinsights-web",
  "alias": false,
  "peer_metadata": null
}
^3.3.1runtime
jest
Environment
{
  "local_name": "jest",
  "alias": false,
  "peer_metadata": null
}
^29.7.0development
sass
Environment
{
  "local_name": "sass",
  "alias": false,
  "peer_metadata": null
}
^1.60.0development
husky
Environment
{
  "local_name": "husky",
  "alias": false,
  "peer_metadata": null
}
^4.3.8development
dotenv
Environment
{
  "local_name": "dotenv",
  "alias": false,
  "peer_metadata": null
}
^16.4.7development
eslint
Environment
{
  "local_name": "eslint",
  "alias": false,
  "peer_metadata": null
}
^8.32.0development
rollup
Environment
{
  "local_name": "rollup",
  "alias": false,
  "peer_metadata": null
}
^2.70.0development
uuidv4
Environment
{
  "local_name": "uuidv4",
  "alias": false,
  "peer_metadata": null
}
^6.2.13development
postcss
Environment
{
  "local_name": "postcss",
  "alias": false,
  "peer_metadata": null
}
^8.5.1development
ts-jest
Environment
{
  "local_name": "ts-jest",
  "alias": false,
  "peer_metadata": null
}
^29.1.2development
webpack
Environment
{
  "local_name": "webpack",
  "alias": false,
  "peer_metadata": null
}
^5.77.0development
firebase
Environment
{
  "local_name": "firebase",
  "alias": false,
  "peer_metadata": null
}
^10.6.0development
prettier
Environment
{
  "local_name": "prettier",
  "alias": false,
  "peer_metadata": null
}
^2.5.1development
tsc-files
Environment
{
  "local_name": "tsc-files",
  "alias": false,
  "peer_metadata": null
}
^1.1.3development
css-loader
Environment
{
  "local_name": "css-loader",
  "alias": false,
  "peer_metadata": null
}
^6.10.0development
dotenv-cli
Environment
{
  "local_name": "dotenv-cli",
  "alias": false,
  "peer_metadata": null
}
^5.0.0development
url-loader
Environment
{
  "local_name": "url-loader",
  "alias": false,
  "peer_metadata": null
}
^4.1.1development
@babel/core
Environment
{
  "local_name": "@babel/core",
  "alias": false,
  "peer_metadata": null
}
^7.21.4development
@types/jest
Environment
{
  "local_name": "@types/jest",
  "alias": false,
  "peer_metadata": null
}
^29.5.12development
@types/node
Environment
{
  "local_name": "@types/node",
  "alias": false,
  "peer_metadata": null
}
^16.18.125development
file-loader
Environment
{
  "local_name": "file-loader",
  "alias": false,
  "peer_metadata": null
}
^6.2.0development
lint-staged
Environment
{
  "local_name": "lint-staged",
  "alias": false,
  "peer_metadata": null
}
^12.5.0development
sass-loader
Environment
{
  "local_name": "sass-loader",
  "alias": false,
  "peer_metadata": null
}
^16.0.4development
webpack-cli
Environment
{
  "local_name": "webpack-cli",
  "alias": false,
  "peer_metadata": null
}
^4.10.0development
@svgr/rollup
Environment
{
  "local_name": "@svgr/rollup",
  "alias": false,
  "peer_metadata": null
}
^8.1.0development
@types/react
Environment
{
  "local_name": "@types/react",
  "alias": false,
  "peer_metadata": null
}
^18.2.8development
autoprefixer
Environment
{
  "local_name": "autoprefixer",
  "alias": false,
  "peer_metadata": null
}
^10.4.8development
babel-loader
Environment
{
  "local_name": "babel-loader",
  "alias": false,
  "peer_metadata": null
}
^8.3.0development
style-loader
Environment
{
  "local_name": "style-loader",
  "alias": false,
  "peer_metadata": null
}
^3.3.4development
@svgr/webpack
Environment
{
  "local_name": "@svgr/webpack",
  "alias": false,
  "peer_metadata": null
}
^8.1.0development
@types/crypto-js
Environment
{
  "local_name": "@types/crypto-js",
  "alias": false,
  "peer_metadata": null
}
^4.1.1development
@types/react-dom
Environment
{
  "local_name": "@types/react-dom",
  "alias": false,
  "peer_metadata": null
}
^18.2.4development
jest-canvas-mock
Environment
{
  "local_name": "jest-canvas-mock",
  "alias": false,
  "peer_metadata": null
}
^2.5.2development
@babel/preset-env
Environment
{
  "local_name": "@babel/preset-env",
  "alias": false,
  "peer_metadata": null
}
^7.21.4development

Showing the first 100 declarations.

Distribution files

1 collected
Distribution 1

Source distribution

Source file
Checksums from source
{
  "shasum": "9e959f38411951a0642775b719028d0d7e2a38b9",
  "tarball": "https://registry.npmjs.org/5paisa-tradingview-webhook/-/5paisa-tradingview-webhook-0.0.1.tgz",
  "fileCount": 22,
  "integrity": "sha512-I8mfGOb/IoUm+mU+cellaMBvfxJo+CRG+b7o0LjZO0yhYmuuxmfar4zpZ1KTCp3iRYu53hqa2vz8/HqBkGfWGA==",
  "signatures": [
    {
      "sig": "MEYCIQDf+oqDCnJUV1H/GFiFqVsNeQ84og0InSyzbp9iD6lhpAIhAMyJrmVmZJu9F+oZo6jWSf+qmoyUPtM1cAoTXggs0Rvi",
      "keyid": "SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"
    }
  ],
  "unpackedSize": 2729571
}

Metadata history

Meaningful changes
Current collected state Current

Observed since 20 Oct, 20:38 UTC

No superseded metadata states collected. Unchanged observations do not create new revisions.

Record identity

package_version:790da566399b0137edf7ae8bbee6b01a29c3ecf2f102d47515b37c2c1ef8e7ef

Other collected versions

0.0.2011 Sept0.0.1911 Sept0.0.1811 Sept0.0.1711 Sept0.0.1611 Sept0.0.1511 SeptView all collected versions →